Share score button + Restart test button
This commit is contained in:
Gaël Métais
+55
-62
@@ -1,8 +1,49 @@
|
||||
.testedUrl {
|
||||
color: inherit;
|
||||
}
|
||||
h4 {
|
||||
margin-bottom: 0.5em;
|
||||
.summary {
|
||||
text-align: center;
|
||||
}
|
||||
.globalScore {
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
.globalScore .globalGrade {
|
||||
margin: 0.5 auto;
|
||||
width: 2.5em;
|
||||
height: 2.5em;
|
||||
line-height: 2.5em;
|
||||
border-radius: 0.5em;
|
||||
font-size: 3em;
|
||||
font-weight: bold;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.globalScore .on100 {
|
||||
font-size: 1.2em;
|
||||
font-weight: bold;
|
||||
margin: 0.5em 0 1em;
|
||||
}
|
||||
.globalScore .tweetText {
|
||||
color: #333;
|
||||
background: #F2F2F2;
|
||||
border: none;
|
||||
width: 25em;
|
||||
padding: 0.4em;
|
||||
border-radius: 0.5em;
|
||||
box-shadow: 0.05em 0.1em 0 0 #999;
|
||||
}
|
||||
.globalScore .tweetButton,
|
||||
.globalScore .linkedinButton {
|
||||
color: #333;
|
||||
background: #F2F2F2;
|
||||
margin-right: 0;
|
||||
}
|
||||
.globalScore .tweetButton:hover,
|
||||
.globalScore .linkedinButton:hover {
|
||||
color: #F2F2F2;
|
||||
background: #e74c3c;
|
||||
}
|
||||
.globalScore input {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
.notations {
|
||||
display: table;
|
||||
@@ -101,66 +142,18 @@ h4 {
|
||||
.notations .criteria .icon-question {
|
||||
color: transparent;
|
||||
}
|
||||
/**** NgModal popin (have a look inside bower_components) ****/
|
||||
.ng-modal {
|
||||
position: fixed;
|
||||
z-index: 9999;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
text-align: left;
|
||||
.fromShare {
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
.ng-modal-overlay {
|
||||
position: absolute;
|
||||
z-index: 9999;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #000;
|
||||
opacity: 0.5;
|
||||
}
|
||||
.ng-modal-dialog {
|
||||
z-index: 10000;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
border: 3px solid #f1c40f;
|
||||
.fromShare a {
|
||||
font-size: 1em;
|
||||
padding: 0.3em 0.5em;
|
||||
margin: 0.5em;
|
||||
line-height: 2em;
|
||||
border: 0 solid;
|
||||
border-radius: 0.5em;
|
||||
color: #000;
|
||||
}
|
||||
.ng-modal-dialog-content {
|
||||
overflow-x: hidden;
|
||||
overflow-y: scroll;
|
||||
word-wrap: break-word;
|
||||
max-height: 20em;
|
||||
font-weight: normal;
|
||||
white-space: normal;
|
||||
}
|
||||
.ng-modal-close {
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
right: 5px;
|
||||
cursor: pointer;
|
||||
font-size: 120%;
|
||||
padding: 5px;
|
||||
display: inline-block;
|
||||
}
|
||||
.ng-modal-close-x {
|
||||
font-weight: bold;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
.ng-modal-title {
|
||||
font-weight: bold;
|
||||
font-size: 1.5em;
|
||||
display: block;
|
||||
margin-bottom: 10px;
|
||||
padding-bottom: 7px;
|
||||
border-bottom: solid 1px #999;
|
||||
box-shadow: 0.1em 0.2em 0 0 #5e2846;
|
||||
background: #e74c3c;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
+19
-5
@@ -46,7 +46,8 @@ h1 span {
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
.resultsMenu .back {
|
||||
.resultsMenu .menuItem.back,
|
||||
.resultsMenu .menuItem.restart {
|
||||
color: #413;
|
||||
border-color: #413;
|
||||
}
|
||||
@@ -137,7 +138,7 @@ h1 span {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
.icon-lab:before {
|
||||
content: "\e003";
|
||||
content: "\e004";
|
||||
}
|
||||
.icon-question {
|
||||
font-family: "fontsmith-icons";
|
||||
@@ -176,7 +177,7 @@ h1 span {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
.icon-back:before {
|
||||
content: "\e005";
|
||||
content: "\e006";
|
||||
}
|
||||
.icon-summary {
|
||||
font-family: "fontsmith-icons";
|
||||
@@ -189,7 +190,7 @@ h1 span {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
.icon-summary:before {
|
||||
content: "\e002";
|
||||
content: "\e003";
|
||||
}
|
||||
.icon-spaghetti {
|
||||
font-family: "fontsmith-icons";
|
||||
@@ -202,5 +203,18 @@ h1 span {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
.icon-spaghetti:before {
|
||||
content: "\e004";
|
||||
content: "\e005";
|
||||
}
|
||||
.icon-loop {
|
||||
font-family: "fontsmith-icons";
|
||||
speak: none;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
.icon-loop:before {
|
||||
content: "\e002";
|
||||
}
|
||||
|
||||
@@ -1,4 +1,7 @@
|
||||
/* Timeline colors, related to Window Performances */
|
||||
.execution {
|
||||
text-align: center;
|
||||
}
|
||||
.timeline {
|
||||
margin: 2em 0 5em;
|
||||
}
|
||||
@@ -117,9 +120,12 @@
|
||||
border-radius: 0.2em;
|
||||
}
|
||||
.filters {
|
||||
margin: 1em 0;
|
||||
margin: 1em auto;
|
||||
padding: 0.5em;
|
||||
min-width: 30em;
|
||||
width: 30%;
|
||||
border: 1px dotted #aaa;
|
||||
text-align: left;
|
||||
}
|
||||
.slowRequestsLimit {
|
||||
width: 3em;
|
||||
|
||||
Binary file not shown.
Executable
+1
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" encoding="utf-8"?> <!-- Generator: IcoMoon.io --> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg width="512" height="512" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000"><g class="svgGrid" id="svgGrid"><line stroke-width="1" stroke="#B35047" x1="32" x2="32" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="64" x2="64" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="96" x2="96" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="128" x2="128" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="160" x2="160" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="192" x2="192" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="224" x2="224" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="256" x2="256" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="288" x2="288" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="320" x2="320" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="352" x2="352" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="384" x2="384" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="416" x2="416" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="448" x2="448" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="480" x2="480" y1="0" y2="512"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="32" y2="32"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="64" y2="64"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="96" y2="96"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="128" y2="128"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="160" y2="160"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="192" y2="192"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="224" y2="224"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="256" y2="256"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="288" y2="288"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="320" y2="320"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="352" y2="352"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="384" y2="384"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="416" y2="416"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="448" y2="448"></line><line stroke-width="1" stroke="#B35047" x1="0" x2="512" y1="480" y2="480"></line><rect x="0" y="0" width="512" height="512" fill="none" stroke-width="1" stroke="#B35047"></rect></g><path d="M 437.011,74.99C 390.685,28.662, 326.693,0.00, 256.00,0.00C 146.256,0.00, 52.655,69.064, 16.251,166.094l 59.938,22.477 C 103.491,115.798, 173.692,64.00, 256.00,64.00c 53.02,0.00, 101.01,21.50, 135.753,56.247L 320.00,192.00l 192.00,0.00 L 512.00,0.00 L 437.011,74.99zM 256.00,448.00c-53.02,0.00-101.013-21.496-135.756-56.244L 192.00,320.00L0.00,320.00 l0.00,192.00 l 74.997-74.997C 121.32,483.334, 185.306,512.00, 256.00,512.00 c 109.745,0.00, 203.346-69.064, 239.75-166.094l-59.938-22.477C 408.51,396.202, 338.309,448.00, 256.00,448.00z" ></path></svg>
|
||||
|
After Width: | Height: | Size: 3.3 KiB |
@@ -1,8 +1,9 @@
|
||||
var dashboardCtrl = angular.module('dashboardCtrl', ['resultsFactory', 'menuService']);
|
||||
|
||||
dashboardCtrl.controller('DashboardCtrl', ['$scope', '$rootScope', '$routeParams', '$location', 'Results', 'Menu', function($scope, $rootScope, $routeParams, $location, Results, Menu) {
|
||||
dashboardCtrl.controller('DashboardCtrl', ['$scope', '$rootScope', '$routeParams', '$location', 'Results', 'Runs', 'Menu', function($scope, $rootScope, $routeParams, $location, Results, Runs, Menu) {
|
||||
$scope.runId = $routeParams.runId;
|
||||
$scope.Menu = Menu.setCurrentPage('dashboard', $scope.runId);
|
||||
$scope.fromSocialShare = $location.search().share;
|
||||
|
||||
function loadResults() {
|
||||
// Load result if needed
|
||||
@@ -10,15 +11,53 @@ dashboardCtrl.controller('DashboardCtrl', ['$scope', '$rootScope', '$routeParams
|
||||
Results.get({runId: $routeParams.runId}, function(result) {
|
||||
$rootScope.loadedResult = result;
|
||||
$scope.result = result;
|
||||
init();
|
||||
});
|
||||
} else {
|
||||
$scope.result = $rootScope.loadedResult;
|
||||
init();
|
||||
}
|
||||
}
|
||||
|
||||
function init() {
|
||||
$scope.globalScore = Math.max($scope.result.scoreProfiles.generic.globalScore, 0);
|
||||
$scope.tweetText = 'My website\'s score is ' + $scope.globalScore + '/100 on #YellowLabTools!';
|
||||
}
|
||||
|
||||
$scope.showRulePage = function(ruleName) {
|
||||
$location.path('/result/' + $scope.runId + '/rule/' + ruleName);
|
||||
};
|
||||
|
||||
$scope.testAgain = function() {
|
||||
Runs.save({
|
||||
url: $scope.result.params.url,
|
||||
waitForResponse: false
|
||||
}, function(data) {
|
||||
$location.path('/queue/' + data.runId);
|
||||
});
|
||||
};
|
||||
|
||||
/// When comming from a social shared link, the user needs to click on "See full report" button to display the full dashboard.
|
||||
$scope.seeFullReport = function() {
|
||||
$scope.fromSocialShare = false;
|
||||
$location.search({});
|
||||
};
|
||||
|
||||
$scope.shareOnTwitter = function(message) {
|
||||
openSocialPopup('https://twitter.com/intent/tweet?url=' + document.URL + '%3Fshare&text=' + encodeURIComponent(message));
|
||||
};
|
||||
|
||||
$scope.shareOnLinkedin = function(message) {
|
||||
openSocialPopup('https://www.linkedin.com/shareArticle?mini=true&url=' + document.URL + '%3Fshare&title=' + encodeURIComponent(message) + '&summary=' + encodeURIComponent('YellowLabTools is a free online tool that analyzes performance and front-end quality of a webpage.'));
|
||||
};
|
||||
|
||||
function openSocialPopup(url) {
|
||||
var winHeight = 400;
|
||||
var winWidth = 600;
|
||||
var winTop = (screen.height / 2) - (winHeight / 2);
|
||||
var winLeft = (screen.width / 2) - (winWidth / 2);
|
||||
window.open(url, 'sharer', 'top=' + winTop + ',left=' + winLeft + ',toolbar=0,status=0,width=' + winWidth + ',height=' + winHeight);
|
||||
}
|
||||
|
||||
loadResults();
|
||||
}]);
|
||||
@@ -1,6 +1,6 @@
|
||||
var ruleCtrl = angular.module('ruleCtrl', []);
|
||||
|
||||
ruleCtrl.controller('RuleCtrl', ['$scope', '$rootScope', '$routeParams', '$location', '$sce', 'Menu', 'Results', function($scope, $rootScope, $routeParams, $location, $sce, Menu, Results) {
|
||||
ruleCtrl.controller('RuleCtrl', ['$scope', '$rootScope', '$routeParams', '$location', '$sce', 'Menu', 'Results', 'Runs', function($scope, $rootScope, $routeParams, $location, $sce, Menu, Results, Run) {
|
||||
$scope.runId = $routeParams.runId;
|
||||
$scope.policyName = $routeParams.policy;
|
||||
$scope.Menu = Menu.setCurrentPage(null, $scope.runId);
|
||||
@@ -29,5 +29,14 @@ ruleCtrl.controller('RuleCtrl', ['$scope', '$rootScope', '$routeParams', '$locat
|
||||
$location.path('/result/' + $scope.runId);
|
||||
};
|
||||
|
||||
$scope.testAgain = function() {
|
||||
Runs.save({
|
||||
url: $scope.result.params.url,
|
||||
waitForResponse: false
|
||||
}, function(data) {
|
||||
$location.path('/queue/' + data.runId);
|
||||
});
|
||||
};
|
||||
|
||||
loadResults();
|
||||
}]);
|
||||
@@ -1,6 +1,6 @@
|
||||
var timelineCtrl = angular.module('timelineCtrl', []);
|
||||
|
||||
timelineCtrl.controller('TimelineCtrl', ['$scope', '$rootScope', '$routeParams', '$location', '$timeout', 'Menu', 'Results', function($scope, $rootScope, $routeParams, $location, $timeout, Menu, Results) {
|
||||
timelineCtrl.controller('TimelineCtrl', ['$scope', '$rootScope', '$routeParams', '$location', '$timeout', 'Menu', 'Results', 'Runs', function($scope, $rootScope, $routeParams, $location, $timeout, Menu, Results, Runs) {
|
||||
$scope.runId = $routeParams.runId;
|
||||
$scope.Menu = Menu.setCurrentPage('timeline', $scope.runId);
|
||||
|
||||
@@ -131,6 +131,15 @@ timelineCtrl.controller('TimelineCtrl', ['$scope', '$rootScope', '$routeParams',
|
||||
$location.path('/result/' + $scope.runId);
|
||||
};
|
||||
|
||||
$scope.testAgain = function() {
|
||||
Runs.save({
|
||||
url: $scope.result.params.url,
|
||||
waitForResponse: false
|
||||
}, function(data) {
|
||||
$location.path('/queue/' + data.runId);
|
||||
});
|
||||
};
|
||||
|
||||
loadResults();
|
||||
|
||||
}]);
|
||||
@@ -2,8 +2,48 @@
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
h4 {
|
||||
margin-bottom: 0.5em;
|
||||
.summary {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.globalScore {
|
||||
margin-bottom: 3em;
|
||||
.globalGrade {
|
||||
margin: 0.5 auto;
|
||||
width: 2.5em;
|
||||
height: 2.5em;
|
||||
line-height: 2.5em;
|
||||
border-radius: 0.5em;
|
||||
font-size: 3em;
|
||||
font-weight: bold;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.on100 {
|
||||
font-size: 1.2em;
|
||||
font-weight: bold;
|
||||
margin: 0.5em 0 1em;
|
||||
}
|
||||
.tweetText {
|
||||
color: #333;
|
||||
background: #F2F2F2;
|
||||
border: none;
|
||||
width: 25em;
|
||||
padding: 0.4em;
|
||||
border-radius: 0.5em;
|
||||
box-shadow: 0.05em 0.1em 0 0 #999;
|
||||
}
|
||||
.tweetButton, .linkedinButton {
|
||||
color: #333;
|
||||
background: #F2F2F2;
|
||||
margin-right: 0;
|
||||
&:hover {
|
||||
color: #F2F2F2;
|
||||
background: #e74c3c;
|
||||
}
|
||||
}
|
||||
input {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
}
|
||||
|
||||
.notations {
|
||||
@@ -93,67 +133,18 @@ h4 {
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
|
||||
/**** NgModal popin (have a look inside bower_components) ****/
|
||||
.ng-modal {
|
||||
position: fixed;
|
||||
z-index: 9999;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
text-align: left;
|
||||
}
|
||||
.ng-modal-overlay {
|
||||
position: absolute;
|
||||
z-index: 9999;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #000;
|
||||
opacity: 0.5;
|
||||
}
|
||||
.ng-modal-dialog {
|
||||
z-index: 10000;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
border: 3px solid #f1c40f;
|
||||
border-radius: 0.5em;
|
||||
color: #000;
|
||||
}
|
||||
.ng-modal-dialog-content {
|
||||
overflow-x: hidden;
|
||||
overflow-y: scroll;
|
||||
word-wrap: break-word;
|
||||
max-height: 20em;
|
||||
font-weight: normal;
|
||||
white-space: normal;
|
||||
}
|
||||
.ng-modal-close {
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
right: 5px;
|
||||
cursor: pointer;
|
||||
font-size: 120%;
|
||||
padding: 5px;
|
||||
display: inline-block;
|
||||
}
|
||||
.ng-modal-close-x {
|
||||
font-weight: bold;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
.ng-modal-title {
|
||||
font-weight: bold;
|
||||
font-size: 1.5em;
|
||||
display: block;
|
||||
margin-bottom: 10px;
|
||||
padding-bottom: 7px;
|
||||
border-bottom: solid 1px #999;
|
||||
}
|
||||
.fromShare {
|
||||
margin-bottom: 3em;
|
||||
a {
|
||||
font-size: 1em;
|
||||
padding: 0.3em 0.5em;
|
||||
margin: 0.5em;
|
||||
line-height: 2em;
|
||||
border: 0 solid;
|
||||
border-radius: 0.5em;
|
||||
box-shadow: 0.1em 0.2em 0 0 #5e2846;
|
||||
background: #e74c3c;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
+14
-11
@@ -1,21 +1,24 @@
|
||||
@list-font-family: "fontsmith-icons";
|
||||
@list-value: "\e002";
|
||||
@list: '"fontsmith-icons"' '"\\e002"';
|
||||
@bars-font-family: "fontsmith-icons";
|
||||
@bars-value: "\e004";
|
||||
@bars: '"fontsmith-icons"' '"\\e004"';
|
||||
@lab-font-family: "fontsmith-icons";
|
||||
@lab-value: "\e003";
|
||||
@lab: '"fontsmith-icons"' '"\\e003"';
|
||||
@lab-value: "\e004";
|
||||
@lab: '"fontsmith-icons"' '"\\e004"';
|
||||
@list-font-family: "fontsmith-icons";
|
||||
@list-value: "\e003";
|
||||
@list: '"fontsmith-icons"' '"\\e003"';
|
||||
@loop-font-family: "fontsmith-icons";
|
||||
@loop-value: "\e002";
|
||||
@loop: '"fontsmith-icons"' '"\\e002"';
|
||||
@warning-font-family: "fontsmith-icons";
|
||||
@warning-value: "\e000";
|
||||
@warning: '"fontsmith-icons"' '"\\e000"';
|
||||
@arrow-left3-font-family: "fontsmith-icons";
|
||||
@arrow-left3-value: "\e005";
|
||||
@arrow-left3: '"fontsmith-icons"' '"\\e005"';
|
||||
@question-font-family: "fontsmith-icons";
|
||||
@question-value: "\e001";
|
||||
@question: '"fontsmith-icons"' '"\\e001"';
|
||||
@bars-font-family: "fontsmith-icons";
|
||||
@bars-value: "\e005";
|
||||
@bars: '"fontsmith-icons"' '"\\e005"';
|
||||
@arrow-left3-font-family: "fontsmith-icons";
|
||||
@arrow-left3-value: "\e006";
|
||||
@arrow-left3: '"fontsmith-icons"' '"\\e006"';
|
||||
|
||||
.icon-font-family(@char) {
|
||||
font-family: ~`@{char}[0]`;
|
||||
|
||||
@@ -41,10 +41,10 @@ h1 span {
|
||||
border-radius: 0.5em;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
.resultsMenu .back {
|
||||
color: #413;
|
||||
border-color: #413;
|
||||
&.back, &.restart {
|
||||
color: #413;
|
||||
border-color: #413;
|
||||
}
|
||||
}
|
||||
.resultsMenu .menuItem div {
|
||||
padding-top: 0.5em;
|
||||
@@ -146,4 +146,7 @@ h1 span {
|
||||
}
|
||||
.icon-spaghetti {
|
||||
.icon(@bars);
|
||||
}
|
||||
.icon-loop {
|
||||
.icon(@loop);
|
||||
}
|
||||
@@ -10,6 +10,9 @@
|
||||
@domInteractiveColor: #FFE433;
|
||||
@domInteractiveBg: #FFFCCC;
|
||||
|
||||
.execution {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.timeline {
|
||||
margin: 2em 0 5em;
|
||||
@@ -130,9 +133,12 @@
|
||||
}
|
||||
|
||||
.filters {
|
||||
margin: 1em 0;
|
||||
margin: 1em auto;
|
||||
padding: 0.5em;
|
||||
min-width: 30em;
|
||||
width: 30%;
|
||||
border: 1px dotted #aaa;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.slowRequestsLimit {
|
||||
|
||||
@@ -1,14 +1,30 @@
|
||||
<div ng-include="'/front/views/resultSubHeader.html'"></div>
|
||||
<div class="summary board">
|
||||
<h2>Grades</h2>
|
||||
|
||||
<h2> Global score</h2>
|
||||
<div class="globalScore" ng-if="globalScore === 0 || globalScore > 0">
|
||||
<div class="globalScoreDisplay">
|
||||
<grade score="result.scoreProfiles.generic.globalScore" class="globalGrade"></grade>
|
||||
<div class="on100">{{globalScore}}/100</div>
|
||||
</div>
|
||||
<div class="tweet" ng-if="!fromSocialShare">
|
||||
<form ng-submit="sendTweet()">
|
||||
<input type="text" class="tweetText" ng-model="tweetText">
|
||||
<input type="submit" class="tweetButton" value="Tweet this!" ng-click="shareOnTwitter(tweetText)">
|
||||
<input type="submit" class="linkedinButton" value="LinkedIn" ng-click="shareOnLinkedin(tweetText)">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="notations">
|
||||
<h2 ng-if="!fromSocialShare">Score details</h2>
|
||||
<div ng-if="!fromSocialShare" class="notations">
|
||||
<div ng-repeat="category in result.scoreProfiles.generic.categories">
|
||||
<grade score="category.categoryScore" class="categoryScore"></grade>
|
||||
<div class="category">{{category.label}}</div>
|
||||
<div class="criteria">
|
||||
<div class="table" title="Click to see details">
|
||||
<div ng-repeat="ruleName in category.rules"
|
||||
<div ng-repeat="ruleName in category.rules"
|
||||
ng-if="result.rules[ruleName]"
|
||||
ng-init="rule = result.rules[ruleName]"
|
||||
ng-class="{'warning': rule.abnormal}"
|
||||
ng-click="showRulePage(ruleName)">
|
||||
@@ -28,4 +44,10 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="fromShare" ng-if="fromSocialShare">
|
||||
<p>Yellow Lab Tools is a free online tool that analyzes performance and front-end quality.</p>
|
||||
<a href="" ng-click="seeFullReport()">See the full report for this page</a>
|
||||
<a href="/">Test another webpage</a>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,6 +1,6 @@
|
||||
<h2 class="promess">Free online test to help speeding up <b>heavy</b> web pages</h2>
|
||||
|
||||
<form ng-submit="launchTest()" >
|
||||
<input type="text"ng-model="url" placeholder="http://www.mysite.com" class="url" />
|
||||
<input type="text" name="url" ng-model="url" placeholder="http://www.mysite.com" class="url" />
|
||||
<input type="submit" value="Launch test" class="launchBtn" ng-class="{disabled: !url}" />
|
||||
</form>
|
||||
@@ -2,6 +2,7 @@
|
||||
|
||||
<div class="resultsMenu">
|
||||
<a class="menuItem back" href="/"><div class="icon-back"></div><span>New test<span></a>
|
||||
<a class="menuItem restart" href="" ng-click="testAgain()"><div class="icon-loop"></div><span>Test again<span></a>
|
||||
<div class="menuItem" ng-class="{active: Menu.getCurrentPage() == 'dashboard'}" ng-click="Menu.changePage('dashboard')"><div class="icon-summary"></div><span>Dashboard</span></div>
|
||||
<div class="menuItem" ng-class="{active: Menu.getCurrentPage() == 'timeline'}" ng-click="Menu.changePage('timeline')"><div class="icon-spaghetti"></div><span>JS Timeline</span></div>
|
||||
</div>
|
||||
Vendored
+3
-3
@@ -1,9 +1,9 @@
|
||||
{
|
||||
"globalScore": 57,
|
||||
"globalScore": 36,
|
||||
"categories": {
|
||||
"category1": {
|
||||
"label": "Category 1",
|
||||
"categoryScore": 83,
|
||||
"categoryScore": 79,
|
||||
"rules": [
|
||||
"metric1",
|
||||
"metric2",
|
||||
@@ -13,7 +13,7 @@
|
||||
},
|
||||
"category2": {
|
||||
"label": "Category 2",
|
||||
"categoryScore": 0,
|
||||
"categoryScore": -55,
|
||||
"rules": [
|
||||
"metric5",
|
||||
"metric6",
|
||||
|
||||
Reference in New Issue
Block a user