openstack/stackviz
Code Issues Proposed changes

Add summary info to home page.

Browse Source 
This patch adds basic summary information to the tempest dataset
summary on the home page. Additionally, it allows users to select
between all available datasets, if more than one is specified in
the configuration file. Failing tests are displayed directly on
the front page, and a future patch will allow direct navigation to
details of failing tests.

Co-Authored-By: Austin Clark <austin.clark@hpe.com>
Change-Id: Ic08a4dd86b36f513acf8e50c1fb7d7a102876e1c
This commit is contained in:
Tim Buckley 2015-11-02 16:19:28 -07:00
parent 9d460e7b2a
commit 9b6d1ffbeb
5 changed files with 91 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/js/controllers/home.js
View File

@ -9,6 +9,7 @@ function HomeCtrl(datasetService) {
// ViewModel
var vm = this;
vm.focus = 0;
datasetService.list().then(function(response) {
vm.tempest = response.data.tempest;

7
app/js/directives/tempest-summary.js
View File

@ -7,8 +7,11 @@ var directivesModule = require('./_index.js');
*/
function tempestSummary() {
var controller = function($scope, $attrs, datasetService) {
// TODO get extra data here
// (may require raw details, or extra metadata inside config.json)
$scope.$watch('dataset', function(dataset) {
var stats = dataset.stats;
$scope.stats = stats;
$scope.timeDiff = (new Date(stats.end) - new Date(stats.start)) / 1000;
});
};
return {

24
app/js/filters/seconds-time.js Normal file
View File

@ -0,0 +1,24 @@
'use strict';
var d3 = require('d3');
var filtersModule = require('./_index.js');
var secondsToTime = function(seconds) {
var format = d3.format('02d');
var hours = Math.floor(seconds / 60 / 60);
seconds = seconds - (hours * 60 * 60);
var minutes = Math.floor(seconds / 60);
seconds = Math.floor(seconds - minutes * 60);
var ret = format(minutes) + ':' + format(seconds);
if (hours > 0) {
ret = hours + ':' + ret;
}
return ret;
};
filtersModule.filter('secondsToTime', function() { return secondsToTime; });

46
app/views/directives/tempest-summary.html
View File

@ -1,15 +1,55 @@
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">{{ dataset.name }}</h3>
<h3 class="panel-title">
{{dataset.name}}
<span class="text-muted" style="font-size: 65%">
{{stats.start | date:'d MMM, yyyy'}}
</span>
</h3>
</div>
<div class="panel-body">
More details go here
<div class="col-xs-3 text-center">
<span class="huge">{{timeDiff | secondsToTime}}</span>
<br>
runtime
</div>
<div class="col-xs-3 text-center">
<span class="huge">{{stats.count}}</span>
<br>
tests run
</div>
<div class="col-xs-3 text-center">
<span class="huge text-danger">{{stats.failures.length}}</span>
<br>
failed
</div>
<div class="col-xs-3 text-center">
<span class="huge text-primary">{{stats.skips.length}}</span>
<br>
skipped
</div>
</div>
<div class="panel-footer clearfix">
<div class="btn-group pull-right">
<a type="button"
class="btn btn-default"
ui-sref="timeline({datasetId: dataset.id})">Timeline</a>
ui-sref="timeline({datasetId: dataset.id})">Details</a>
</div>
</div>
</div>
<div class="panel panel-danger" ng-if="stats.failures.length > 0">
<div class="panel-heading">
<h3 class="panel-title">Failures</h3>
</div>
<div class="list-group">
<a class="list-group-item" ng-repeat="fail in stats.failures">
<h4 class="list-group-item-heading">
{{fail.name | split:'.' | slice:-2 | join:'.'}}
</h4>
<p class="list-group-item-text">
{{fail.details}}
</p>
</a>
</ul>
</div>

26
app/views/home.html
View File

@ -15,7 +15,7 @@
</div>
<div class="row" ng-if="!!home.tempest.length">
<div class="col-lg-8">
<tempest-summary ng-if="home.tempest.length >= 1" dataset="home.tempest[0]"></tempest-summary>
<tempest-summary ng-if="home.tempest.length >= 1" dataset="home.tempest[home.focus]"></tempest-summary>
</div>
<div class="col-lg-4" ng-if="home.tempest.length > 1">
<div class="panel panel-default">
@ -23,14 +23,24 @@
<h3 class="panel-title">Additional Datasets</h3>
</div>
<div class="list-group">
<a class="list-group-item"
ng-repeat="dataset in home.tempest"
ng-if="$index > 0"
ui-sref="timeline({datasetId: dataset.id})">
<ul class="list-group">
<li class="list-group-item"
ng-repeat="dataset in home.tempest"
ng-if="$index != home.focus"
ng-click="home.focus = $index"
style="cursor: pointer">
{{ dataset.name }}
</a>
</div>
<small class="text-muted" style="font-size: 75%">
{{dataset.stats.start | date:'MM/d/yyyy'}}
</small>
<a class="btn btn-default btn-xs pull-right"
ui-sref="timeline({datasetId: dataset.id})">
Details
</a>
</li>
</ul>
</div>
</div>
</div>