CORD GUI -- User page has new layout, icons for bundle functions added, randomly generated session activity displayed.
Change-Id: I09fa44f2919df1c9b5e308efb2c0a9a47cbb626f
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/bundle/bundle.html b/apps/demo/cord-gui/src/main/webapp/app/view/bundle/bundle.html
index fb4211f..9eeb8dc 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/bundle/bundle.html
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/bundle/bundle.html
@@ -6,7 +6,9 @@
<p>{{desc}}</p>
<table>
<tr ng-repeat="func in funcs" class="fadein">
- <td class="icon">icon of function</td>
+ <td class="icon">
+ <img ng-src="{{'/imgs/' + func.id + '.png'}}">
+ </td>
<td class="name">{{func.name}}</td>
<td class="desc">{{func.desc}}</td>
</tr>
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/common/common.css b/apps/demo/cord-gui/src/main/webapp/app/view/common/common.css
index 759c32d..a99a70e 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/common/common.css
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/common/common.css
@@ -67,6 +67,12 @@
text-indent: 20px;
text-align: justify;
}
+th {
+ background-color: #7AB6EA;
+ color: white;
+ letter-spacing: 0.05em;
+ font-weight: lighter;
+}
button,
input[type="button"],
@@ -88,11 +94,17 @@
background-color: rgb(122, 188, 229);
}
+button[disabled],
+input[type="button"][disabled],
+input[type="reset"][disabled] {
+ background-color: lightgray;
+ color: graytext;
+}
+
+
button[disabled]:hover,
input[type="button"][disabled]:hover,
input[type="reset"][disabled]:hover {
- background-color: lightgray;
- color: graytext;
cursor: default;
}
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/home/home.css b/apps/demo/cord-gui/src/main/webapp/app/view/home/home.css
index 1f44657..8f5002c 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/home/home.css
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/home/home.css
@@ -23,7 +23,7 @@
width: 42%;
}
#home div.move-down {
- margin-top: 19%;
+ margin-top: 10%;
}
#home div.image-holder {
@@ -60,12 +60,6 @@
#home table.users td {
font-size: 90%;
}
-#home table.users th {
- background-color: #7AB6EA;
- color: white;
- letter-spacing: 0.05em;
- font-weight: lighter;
-}
#home td, #home th {
text-align: left;
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/home/home.html b/apps/demo/cord-gui/src/main/webapp/app/view/home/home.html
index 2c634ee..a51ab18 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/home/home.html
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/home/home.html
@@ -37,7 +37,7 @@
<img ng-src="{{'/imgs/' + user.icon_id + '.png'}}">
</td>
<td>{{user.name}}</td>
- <td>Session Activity</td>
+ <td>{{shared.userActivity[user.id]}}</td>
</tr>
</tbody>
</table>
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/home/home.js b/apps/demo/cord-gui/src/main/webapp/app/view/home/home.js
index 4460f14..dc027e6 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/home/home.js
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/home/home.js
@@ -19,9 +19,13 @@
var urlSuffix = '/rs/dashboard';
+ function randomDate(start, end) {
+ return new Date(start.getTime() + Math.random() * (end.getTime() - start.getTime()));
+ }
+
angular.module('cordHome', [])
- .controller('CordHomeCtrl', ['$log', '$scope', '$resource',
- function ($log, $scope, $resource) {
+ .controller('CordHomeCtrl', ['$log', '$scope', '$resource', '$filter',
+ function ($log, $scope, $resource, $filter) {
var DashboardData, resource;
$scope.page.curr = 'dashboard';
@@ -31,6 +35,15 @@
function () {
$scope.bundle = resource.bundle;
$scope.users = resource.users;
+
+ if ($.isEmptyObject($scope.shared.userActivity)) {
+ $scope.users.forEach(function (user) {
+ var date = randomDate(new Date(2015, 0, 1), new Date());
+
+ $scope.shared.userActivity[user.id] = $filter('date')(date, 'mediumTime');
+ });
+ }
+
},
// error
function () {
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/login/login.js b/apps/demo/cord-gui/src/main/webapp/app/view/login/login.js
index 279ab4f..fb54f0a 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/login/login.js
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/login/login.js
@@ -29,7 +29,7 @@
if (!$scope.email) {
email = 'mom@user.org';
} else {
- email = $scope.email
+ email = $scope.email;
}
LoginData = $resource($scope.shared.url + urlSuffix + '/' + email);
resource = LoginData.get();
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/user/user.css b/apps/demo/cord-gui/src/main/webapp/app/view/user/user.css
index 6a8f4b3..eab26d3 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/user/user.css
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/user/user.css
@@ -14,12 +14,16 @@
* limitations under the License.
*/
+#user div {
+ padding-top: 2%;
+}
+
#user div.main-left {
width: 98%;
padding-left: 1%;
}
#user div.main-left.family {
- width: 61%;
+ width: 62%;
padding-left: 1%;
}
@@ -36,17 +40,10 @@
width: 100%;
}
-#user th.topLeft {
- border-top-left-radius: 3px;
-}
-#user th.topRight {
- border-top-right-radius: 3px;
-}
-
#user table.user-info th,
#user table.user-form th {
text-align: left;
- background-color: rgba(173, 216, 230, 0.75);
+ background-color: #7AB6EA;
padding: 2% 1%;
}
@@ -63,19 +60,14 @@
#user table.user-info td {
padding: 1%;
}
-#user table.user-form td.buttons {
- text-align: right;
- border-bottom-left-radius: 3px;
- border-bottom-right-radius: 3px;
+
+#user table.user-form td {
+ border-left: 1px solid #CE5650;
}
-#user table.user-info tr:nth-of-type(odd),
-#user table.user-form tr:nth-of-type(odd) {
- background-color: rgba(173, 216, 230, 0.5);
-}
-#user table.user-info tr:nth-of-type(even),
-#user table.user-form tr:nth-of-type(even) {
- background-color: rgba(173, 216, 230, 0.25);
+#user table.user-form td.buttons {
+ text-align: right;
+ border: none;
}
#user table.user-form tr.options td {
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/user/user.html b/apps/demo/cord-gui/src/main/webapp/app/view/user/user.html
index 38aae59..ee942b2 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/user/user.html
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/user/user.html
@@ -4,22 +4,22 @@
<div class="main-left" ng-class="{family: isFamily}">
<table class="user-info">
<tr>
- <th class="topLeft">Name</th>
- <th ng-class="{topRight: !isFamily}">Mac</th>
+ <th>Name</th>
+ <th>Last Login</th>
</tr>
<tr ng-repeat="user in users" class="fadein">
<td>{{user.name}}</td>
- <td>{{user.mac}}</td>
+ <td>{{shared.userActivity[user.id]}}</td>
</tr>
</table>
</div>
<div class="main-right" ng-class="{family: isFamily}">
<form ng-if="isFamily"
- name="changeLevels">
+ name="changeLevels">
<table class="user-form">
<tr>
- <th class="topRight">Select Site Rating</th>
+ <th>Select Site Rating</th>
</tr>
<tr ng-repeat="user in users" class="options">
<td>
diff --git a/apps/demo/cord-gui/src/main/webapp/cord.js b/apps/demo/cord-gui/src/main/webapp/cord.js
index be81978..16bf3cd 100644
--- a/apps/demo/cord-gui/src/main/webapp/cord.js
+++ b/apps/demo/cord-gui/src/main/webapp/cord.js
@@ -74,7 +74,8 @@
.controller('CordCtrl', ['$scope', '$location',
function ($scope, $location) {
$scope.shared = {
- url: 'http://' + $location.host() + ':' + $location.port()
+ url: 'http://' + $location.host() + ':' + $location.port(),
+ userActivity: {}
};
$scope.page = {};
}]);