External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-05-24 00:57:48 -02:30
Code Issues Packages Projects Releases Wiki Activity

job status graph now has live data

Browse Source
This commit is contained in:
Jared Tabor
2014-07-03 11:12:41 -04:00
parent 7db48fbe27
commit d6f6930847
3 changed files with 35 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
awx/ui/static/js/controllers/Home.js
View File

@@ -101,7 +101,7 @@ function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, Dashb
}; };
$scope.refresh = function () { $scope.refresh = function () {
Wait('start'); ('start');
loadedCount = 0; loadedCount = 0;
Rest.setUrl(GetBasePath('dashboard')); Rest.setUrl(GetBasePath('dashboard'));
Rest.get() Rest.get()
@@ -109,7 +109,7 @@ function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, Dashb
$scope.$emit('dashboardReady', data); $scope.$emit('dashboardReady', data);
}) })
.error(function (data, status) { .error(function (data, status) {
Wait('stop'); Wait('stWaitop');
ProcessErrors($scope, data, status, null, { hdr: 'Error!', msg: 'Failed to get dashboard: ' + status }); ProcessErrors($scope, data, status, null, { hdr: 'Error!', msg: 'Failed to get dashboard: ' + status });
}); });
}; };

2
awx/ui/static/js/widgets/DashboardCounts.js
View File

@@ -3,7 +3,7 @@
* *
* Dashboard.js * Dashboard.js
* *
* The new dashboard * The dashboard widget with stats across the top
* *
*/ */

42
awx/ui/static/js/widgets/JobStatusGraph.js
View File

@@ -10,14 +10,14 @@
'use strict'; 'use strict';
angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities']) angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
.factory('JobStatusGraph', ['$rootScope', '$compile', 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait', .factory('JobStatusGraph', ['$rootScope', '$compile', '$location' , 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',
function ($rootScope, $compile) { function ($rootScope, $compile, $location, Rest, GetBasePath, ProcessErrors, Wait) {
return function (params) { return function (params) {
var scope = params.scope, var scope = params.scope,
target = params.target, target = params.target,
// dashboard = params.dashboard, // dashboard = params.dashboard,
html, element; html, element, url;
html = "<div class=\"graph-container\">\n"; html = "<div class=\"graph-container\">\n";
@@ -67,10 +67,32 @@ angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
function makeJobStatusGraph(){ function makeJobStatusGraph(){
d3.json("static/js/jobstatusdata.json",function(error,data) { url = GetBasePath('dashboard')+'graphs/';
// d3.json(dashboard.graphs, function(error,data) { var graphData = [];
data.map(function(series) {
series.values = series.values.map(function(d) { return {x: d[0], y: d[1] }; }); //d3.json("static/js/jobstatusdata.json",function(error,data) {
d3.json(url, function(error,data) {
console.log(data);
graphData = [
{
"color": "#1778c3",
"key": "Successful",
"values": data.jobs.successful
},
{
"key" : "Failed" ,
"color" : "#aa0000",
"values": data.jobs.failed
}
];
graphData.map(function(series) {
series.values = series.values.map(function(d) {
return {
x: d[0],
y: d[1]
};
});
return series; return series;
}); });
@@ -93,8 +115,8 @@ angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
chart.xAxis chart.xAxis
.axisLabel("Time").showMaxMin(true) .axisLabel("Time").showMaxMin(true)
.tickFormat(function(d) { .tickFormat(function(d) {
var dx = data[0].values[d] && data[0].values[d].x || 0; var dx = graphData[0].values[d] && graphData[0].values[d].x || 0;
return dx ? d3.time.format('%m/%d')(new Date(dx)) : ''; return dx ? d3.time.format('%m/%d')(new Date(Number(dx+'000'))) : '';
}); });
chart.yAxis //Chart y-axis settings chart.yAxis //Chart y-axis settings
@@ -108,7 +130,7 @@ angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
// .call(chart); // .call(chart);
d3.select('.job-status-graph svg') d3.select('.job-status-graph svg')
.datum(data).transition() .datum(graphData).transition()
.attr('width', width) .attr('width', width)
.attr('height', height) .attr('height', height)
.duration(500) .duration(500)