Bri Prebilic Cole

CORD GUI -- User page has new layout, icons for bundle functions added, randomly…

… generated session activity displayed.

Change-Id: I09fa44f2919df1c9b5e308efb2c0a9a47cbb626f
......@@ -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>
......
......@@ -67,6 +67,12 @@ p {
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 @@ input[type="reset"]:hover {
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;
}
......
......@@ -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;
......
......@@ -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>
......
......@@ -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 () {
......
......@@ -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();
......
......@@ -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-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-form td {
border-left: 1px solid #CE5650;
}
#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 {
......
......@@ -4,12 +4,12 @@
<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>
......@@ -19,7 +19,7 @@
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>
......
......@@ -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 = {};
}]);
......