WEBDIENSTE/YellowLabTools
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Front-end build for perfs - #11

Browse Source
This commit is contained in:
Gaël Métais
2015-01-09 13:54:00 +01:00
parent 7c8ffec254
commit db39e79cf7
16 changed files with 209 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files
front/src/views/dashboard.html
+3 -6
View File
@@ -1,4 +1,4 @@
<div ng-include="'/front/views/resultSubHeader.html'"></div>
<div ng-include="'views/resultSubHeader.html'"></div>
<div class="summary board">
<div class="globalScore" ng-if="globalScore === 0 || globalScore > 0">
@@ -16,11 +16,8 @@
<div class="category">{{category.label}}</div>
<div class="criteria">
<div class="table" title="Click to see details">
<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)">
<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)">
<div class="grade">
<grade score="rule.score"></grade>
</div>
front/src/views/queue.html
+1 -3
View File
@@ -8,9 +8,7 @@
</div>
<div ng-if="status.statusCode == 'awaiting'">
<div class="status">
<ng-pluralize count="status.position" when="{
'one': 'Waiting behind 1 other test',
'other': 'Waiting behind {} other tests'}">
<ng-pluralize count="status.position" when="{'one': 'Waiting behind 1 other test', 'other': 'Waiting behind {} other tests'}">
</ng-pluralize>
</div>
<p class="statusSubMessage">(auto-refresh activated)</p>
front/src/views/rule.html
+2 -5
View File
@@ -1,4 +1,4 @@
<div ng-include="'/front/views/resultSubHeader.html'"></div>
<div ng-include="'views/resultSubHeader.html'"></div>
<div class="rule board">
<div class="backToDashboard"><a href="#" ng-click="backToDashboard()">Back to dashboard</a></div>
@@ -19,10 +19,7 @@
</div>
<div class="offenders">
<h3>
<ng-pluralize count="rule.offenders.length || 0"
when="{'0': 'No offenders',
'one': '1 offender',
'other': '{} offenders'}">
<ng-pluralize count="rule.offenders.length || 0" when="{'0': 'No offenders', 'one': '1 offender', 'other': '{} offenders'}">
</ng-pluralize>
</h3>
<div class="offendersTable">
front/src/views/timeline.html
+16 -21
View File
@@ -1,4 +1,4 @@
<div ng-include="'/front/views/resultSubHeader.html'"></div>
<div ng-include="'views/resultSubHeader.html'"></div>
<div class="execution board">
<h2>Javascript Timeline</h2>
<p>This graph gives a quick view of when the Javascript interactions with the DOM occur during the loading of the page.</p>
@@ -9,14 +9,14 @@
<div ng-repeat="duration in timeline track by $index"
class="interval"
ng-class="{
domCreation: $index * timelineIntervalDuration < result.toolsResults.phantomas.metrics.domInteractive,
domInteractive: $index * timelineIntervalDuration >= result.toolsResults.phantomas.metrics.domInteractive
&& $index * timelineIntervalDuration < result.toolsResults.phantomas.metrics.domContentLoaded,
domContentLoaded: $index * timelineIntervalDuration >= result.toolsResults.phantomas.metrics.domContentLoaded
&& $index * timelineIntervalDuration < result.toolsResults.phantomas.metrics.domContentLoadedEnd,
domContentLoadedEnd: $index * timelineIntervalDuration >= result.toolsResults.phantomas.metrics.domContentLoadedEnd
&& $index * timelineIntervalDuration < result.toolsResults.phantomas.metrics.domComplete,
domComplete: $index * timelineIntervalDuration >= result.toolsResults.phantomas.metrics.domComplete
domCreation: $index * timelineIntervalDuration < result.toolsResults.phantomas.metrics.domInteractive,
domInteractive: $index * timelineIntervalDuration >= result.toolsResults.phantomas.metrics.domInteractive
&& $index * timelineIntervalDuration < result.toolsResults.phantomas.metrics.domContentLoaded,
domContentLoaded: $index * timelineIntervalDuration >= result.toolsResults.phantomas.metrics.domContentLoaded
&& $index * timelineIntervalDuration < result.toolsResults.phantomas.metrics.domContentLoadedEnd,
domContentLoadedEnd: $index * timelineIntervalDuration >= result.toolsResults.phantomas.metrics.domContentLoadedEnd
&& $index * timelineIntervalDuration < result.toolsResults.phantomas.metrics.domComplete,
domComplete: $index * timelineIntervalDuration >= result.toolsResults.phantomas.metrics.domComplete
}">
<div style="height: {{100 * duration / timelineMax | number: 0}}px" class="color"></div>
<div class="tooltip detailsOverlay">
@@ -70,14 +70,12 @@
<div><!-- details --></div>
<div>Timestamp</div>
</div>
<div ng-repeat="node in profilerData"
ng-if="(!warningsFilterOn || node.warning || node.error)
&& (!textFilterOn || !textFilter.length || node.searchIndex.indexOf(textFilter) >= 0)"
ng-class="{
showingDetails: node.showDetails,
jsError: node.error,
windowPerformance: node.windowPerformance
}">
<div ng-if="(!warningsFilterOn || node.warning || node.error) && (!textFilterOn || !textFilter.length || node.searchIndex.indexOf(textFilter) >= 0)"
ng-repeat="node in profilerData" ng-class="{
showingDetails: node.showDetails,
jsError: node.error,
windowPerformance: node.windowPerformance
}">
<div class="index">{{$index + 1}}</div>
<div class="type">{{node.data.type}}</div>
@@ -90,10 +88,7 @@
</div>
<div class="details">
<div ng-class="{
'icon-question': !node.warning && !node.error,
'icon-warning': node.warning || node.error
}"
<div ng-class="{'icon-question': !node.warning && !node.error, 'icon-warning': node.warning || node.error}"
ng-click="onNodeDetailsClick(node)"
ng-if="node.data.type != 'jQuery loaded' && node.data.type != 'jQuery version change' && !node.windowPerformance"></div>