From c1257afc4c40a623246ffd0528088674bcd641fd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ga=C3=ABl=20M=C3=A9tais?= Date: Sun, 21 Dec 2014 14:19:56 +0100 Subject: [PATCH] Add onclick property on the rules on dashboard --- front/src/css/dashboard.css | 59 ++++++++++++++--------- front/src/js/app.js | 8 +++ front/src/js/controllers/dashboardCtrl.js | 6 ++- front/src/less/dashboard.less | 49 +++++++++++-------- front/src/views/dashboard.html | 19 ++++++-- lib/server/controllers/frontController.js | 2 +- 6 files changed, 94 insertions(+), 49 deletions(-) diff --git a/front/src/css/dashboard.css b/front/src/css/dashboard.css index 9690c0b..9d64baf 100644 --- a/front/src/css/dashboard.css +++ b/front/src/css/dashboard.css @@ -51,7 +51,7 @@ h4 { } .notations { display: table; - width: 90%; + width: 80%; margin: 0 10%; border-spacing: 1em; } @@ -63,21 +63,25 @@ h4 { height: 2.5em; vertical-align: middle; } -.notations .notation { +.notations .category { font-weight: bold; text-align: center; + width: 20%; } .notations .criteria { font-weight: normal; + width: 75%; } -.notations .A, -.notations .B, -.notations .C, -.notations .D, -.notations .E, -.notations .F, -.notations .NA { +.notations .A.categoryScore, +.notations .B.categoryScore, +.notations .C.categoryScore, +.notations .D.categoryScore, +.notations .E.categoryScore, +.notations .F.categoryScore, +.notations .NA.categoryScore { width: 2.5em; + max-width: 2.5em; + min-width: 2.5em; font-size: 2em; text-align: center; border-radius: 0.5em; @@ -95,6 +99,7 @@ h4 { font-size: 1em; color: transparent; margin: 0 auto; + border-radius: 0.5em; } .notations .A { /* green */ @@ -124,12 +129,18 @@ h4 { /* Non applicable */ background: #CCC; } -.notations .icon-eye { - color: #9c4274; +.notations .criteria .table { + width: 100%; +} +.notations .criteria .table > div:hover > div { + background: #F1C40F; cursor: pointer; } -.notations .criteria .table { - width: 75%; +.notations .criteria .table > div:hover > div.info { + background: #FFF; +} +.notations .criteria .table > div:hover > div.info .icon-question { + color: #F1C40F; } .notations .criteria .grade { width: 10%; @@ -141,23 +152,27 @@ h4 { width: 70%; } .notations .criteria .result { - width: 20%; + width: 18%; font-weight: bold; white-space: nowrap; text-align: center; vertical-align: middle; } .notations .warning .label, -.notations .warning .result { +.notations .warning .result, +.notations .icon-warning { color: #FF1919; } .notations .criteria .info { - width: 10%; + width: 2%; text-align: center; + vertical-align: middle; + background: #FFF; + padding-left: 0.1em; + padding-right: 0.1em; } .notations .criteria .icon-question { - color: #f1c40f; - cursor: pointer; + color: transparent; } .timeline { margin: 2em 0 5em; @@ -363,8 +378,9 @@ input.textFilter { color: #f1c40f; cursor: pointer; } -.table .details .icon-warning { - cursor: pointer; +.table .icon-warning { + display: inline-block; + width: 0.8em; } .detailsOverlay { position: absolute; @@ -417,9 +433,6 @@ input.textFilter { .table > div > .startTime.domCreation { background: #ffe0cc; } -.table .icon-warning { - color: #e74c3c; -} /**** NgModal popin (have a look inside bower_components) ****/ .ng-modal { position: fixed; diff --git a/front/src/js/app.js b/front/src/js/app.js index 0c48a13..6d44767 100644 --- a/front/src/js/app.js +++ b/front/src/js/app.js @@ -29,6 +29,14 @@ yltApp.config(['$routeProvider', '$locationProvider', templateUrl: 'front/views/dashboard.html', controller: 'DashboardCtrl' }). + when('/result/:runId/timeline', { + templateUrl: 'front/views/timeline.html', + controller: 'TimelineCtrl' + }). + when('/result/:runId/rule/:policy', { + templateUrl: 'front/views/rule.html', + controller: 'RuleCtrl' + }). otherwise({ redirectTo: '/' }); diff --git a/front/src/js/controllers/dashboardCtrl.js b/front/src/js/controllers/dashboardCtrl.js index 2d8e22b..3598b70 100644 --- a/front/src/js/controllers/dashboardCtrl.js +++ b/front/src/js/controllers/dashboardCtrl.js @@ -1,6 +1,6 @@ var dashboardCtrl = angular.module('dashboardCtrl', ['resultsFactory', 'menuService']); -dashboardCtrl.controller('DashboardCtrl', ['$scope', '$routeParams', 'Results', 'Menu', function($scope, $routeParams, Results, Menu) { +dashboardCtrl.controller('DashboardCtrl', ['$scope', '$routeParams', '$location', 'Results', 'Menu', function($scope, $routeParams, $location, Results, Menu) { $scope.runId = $routeParams.runId; $scope.Menu = Menu.setCurrentPage('dashboard', $scope.runId); @@ -8,4 +8,8 @@ dashboardCtrl.controller('DashboardCtrl', ['$scope', '$routeParams', 'Results', $scope.result = result; console.log(result); }); + + $scope.showRulePage = function(ruleName) { + $location.path('/result/' + $scope.runId + '/rule/' + ruleName); + }; }]); \ No newline at end of file diff --git a/front/src/less/dashboard.less b/front/src/less/dashboard.less index f5b1a05..629df3b 100644 --- a/front/src/less/dashboard.less +++ b/front/src/less/dashboard.less @@ -67,7 +67,7 @@ h4 { .notations { display: table; - width: 90%; + width: 80%; margin: 0 10%; border-spacing: 1em; } @@ -79,16 +79,20 @@ h4 { height: 2.5em; vertical-align: middle; } -.notations .notation { +.notations .category { font-weight: bold; text-align: center; + width: 20%; } .notations .criteria { font-weight: normal; + width: 75%; } .A, .B, .C, .D, .E, .F, .NA { - .notations & { + .notations &.categoryScore { width: 2.5em; + max-width: 2.5em; + min-width: 2.5em; font-size: 2em; text-align: center; border-radius: 0.5em; @@ -100,6 +104,7 @@ h4 { font-size: 1em; color: transparent; margin: 0 auto; + border-radius: 0.5em; } } .notations .A { @@ -130,13 +135,19 @@ h4 { /* Non applicable */ background: #CCC; } -.notations .icon-eye { - color: #9c4274; - cursor: pointer; -} .notations .criteria .table { - width: 75%; + width: 100%; + > div:hover > div { + background: #F1C40F; + cursor: pointer; + &.info { + background: #FFF; + .icon-question { + color: #F1C40F; + } + } + } } .notations .criteria .grade { width: 10%; @@ -148,22 +159,25 @@ h4 { width: 70%; } .notations .criteria .result { - width: 20%; + width: 18%; font-weight: bold; white-space: nowrap; text-align: center; vertical-align: middle; } -.notations .warning .label, .notations .warning .result { +.notations .warning .label, .notations .warning .result, .notations .icon-warning { color: #FF1919; } .notations .criteria .info { - width: 10%; + width: 2%; text-align: center; + vertical-align: middle; + background: #FFF; + padding-left: 0.1em; + padding-right: 0.1em; } .notations .criteria .icon-question { - color: #f1c40f; - cursor: pointer; + color: transparent; } @@ -387,8 +401,9 @@ input.textFilter { color: #f1c40f; cursor: pointer; } -.table .details .icon-warning { - cursor: pointer; +.table .icon-warning { + display: inline-block; + width: 0.8em; } .detailsOverlay { @@ -443,10 +458,6 @@ input.textFilter { background: @domCreationBg; } -.table .icon-warning { - color: #e74c3c; -} - /**** NgModal popin (have a look inside bower_components) ****/ .ng-modal { diff --git a/front/src/views/dashboard.html b/front/src/views/dashboard.html index ee492c7..cfb3f01 100644 --- a/front/src/views/dashboard.html +++ b/front/src/views/dashboard.html @@ -4,16 +4,25 @@
- -
{{category.label}}
+ +
{{category.label}}
-
-
+
+
{{rule.policy.label}}
-
{{rule.value}}
+
+ {{rule.value}} + + + +
+
diff --git a/lib/server/controllers/frontController.js b/lib/server/controllers/frontController.js index 25b84cc..ebcf139 100644 --- a/lib/server/controllers/frontController.js +++ b/lib/server/controllers/frontController.js @@ -4,7 +4,7 @@ var express = require('express'); var FrontController = function(app) { 'use strict'; - var routes = ['/', '/about', '/result/:runId', '/queue/:runId']; + var routes = ['/', '/about', '/result/:runId', '/result/:runId/timeline', '/result/:runId/rule/:policy', '/queue/:runId']; routes.forEach(function(route) { app.get(route, function(req, res) {