mirror of
https://github.com/ansible/awx.git
synced 2026-03-21 02:47:35 -02:30
made host vs license graph consume live data
This commit is contained in:
@@ -101,7 +101,7 @@ function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, Dashb
|
|||||||
};
|
};
|
||||||
|
|
||||||
$scope.refresh = function () {
|
$scope.refresh = function () {
|
||||||
('start');
|
Wait('start');
|
||||||
loadedCount = 0;
|
loadedCount = 0;
|
||||||
Rest.setUrl(GetBasePath('dashboard'));
|
Rest.setUrl(GetBasePath('dashboard'));
|
||||||
Rest.get()
|
Rest.get()
|
||||||
|
|||||||
@@ -10,15 +10,15 @@
|
|||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
|
angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
|
||||||
.factory('HostGraph', ['$rootScope', '$compile', 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',
|
.factory('HostGraph', ['$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, license;
|
||||||
|
|
||||||
|
|
||||||
html = "<div class=\"graph-container\">\n";
|
html = "<div class=\"graph-container\">\n";
|
||||||
@@ -28,12 +28,66 @@ angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
|
|||||||
html += "</div>\n";
|
html += "</div>\n";
|
||||||
html += "</div>\n";
|
html += "</div>\n";
|
||||||
|
|
||||||
function makeHostCountGraph(){
|
|
||||||
d3.json("static/js/hostcount.json",function(error,data) {
|
|
||||||
|
|
||||||
data.map(function(series) {
|
function getLicenseNumber(){
|
||||||
series.values = series.values.map(function(d) { return {x: d[0], y: d[1] }; });
|
Rest.setUrl(GetBasePath('config'));
|
||||||
|
Rest.get()
|
||||||
|
.success(function (data) {
|
||||||
|
//$scope.$emit('dashboardReady', data);
|
||||||
|
// console.log(data);
|
||||||
|
license = data.license_info.available_instances;
|
||||||
|
makeHostCountGraph(license);
|
||||||
|
|
||||||
|
})
|
||||||
|
.error(function (data, status) {
|
||||||
|
//Wait('stWaitop');
|
||||||
|
ProcessErrors(null, data, status, null, { hdr: 'Error!', msg: 'Failed to get dashboard graph data: ' + status });
|
||||||
|
});
|
||||||
|
|
||||||
|
//return license;
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
function makeHostCountGraph(license){
|
||||||
|
url = GetBasePath('dashboard')+'graphs/';
|
||||||
|
var graphData = [];
|
||||||
|
|
||||||
|
//d3.json("static/js/jobstatusdata.json",function(error,data) {
|
||||||
|
d3.json(url, function(error,data) {
|
||||||
|
// console.log(data);
|
||||||
|
graphData = [
|
||||||
|
{
|
||||||
|
"key" : "Hosts" ,
|
||||||
|
"color" : "#1778c3",
|
||||||
|
"values": data.hosts
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"key" : "License" ,
|
||||||
|
"color" : "#171717",
|
||||||
|
"values": data.hosts
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
graphData.map(function(series) {
|
||||||
|
if(series.key==="Hosts"){
|
||||||
|
series.values = series.values.map(function(d) {
|
||||||
|
return {
|
||||||
|
x: d[0],
|
||||||
|
y: d[1]
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
if(series.key==="License"){
|
||||||
|
series.values = series.values.map(function(d) {
|
||||||
|
return {
|
||||||
|
x: d[0],
|
||||||
|
y: license
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
return series;
|
return series;
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
nv.addGraph({
|
nv.addGraph({
|
||||||
@@ -53,8 +107,8 @@ angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
|
|||||||
chart.xAxis
|
chart.xAxis
|
||||||
.axisLabel("Time")
|
.axisLabel("Time")
|
||||||
.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
|
||||||
@@ -62,7 +116,7 @@ angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
|
|||||||
.tickFormat(d3.format('.f'));
|
.tickFormat(d3.format('.f'));
|
||||||
|
|
||||||
d3.select('.host-count-graph svg')
|
d3.select('.host-count-graph svg')
|
||||||
.datum(data).transition()
|
.datum(graphData).transition()
|
||||||
.attr('width', width)
|
.attr('width', width)
|
||||||
.attr('height', height)
|
.attr('height', height)
|
||||||
.duration(500)
|
.duration(500)
|
||||||
@@ -91,8 +145,8 @@ angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
|
|||||||
element = angular.element(document.getElementById(target));
|
element = angular.element(document.getElementById(target));
|
||||||
element.html(html);
|
element.html(html);
|
||||||
$compile(element)(scope);
|
$compile(element)(scope);
|
||||||
// makeJobStatusGraph();
|
getLicenseNumber();
|
||||||
makeHostCountGraph();
|
// makeHostCountGraph(license);
|
||||||
scope.$emit('WidgetLoaded');
|
scope.$emit('WidgetLoaded');
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -11,7 +11,7 @@
|
|||||||
|
|
||||||
angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
|
angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
|
||||||
.factory('JobStatusGraph', ['$rootScope', '$compile', '$location' , 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',
|
.factory('JobStatusGraph', ['$rootScope', '$compile', '$location' , 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',
|
||||||
function ($rootScope, $compile, $location, Rest, GetBasePath, ProcessErrors, Wait) {
|
function ($rootScope, $compile , $location, Rest, GetBasePath, ProcessErrors, Wait) {
|
||||||
return function (params) {
|
return function (params) {
|
||||||
|
|
||||||
var scope = params.scope,
|
var scope = params.scope,
|
||||||
@@ -72,7 +72,7 @@ angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
|
|||||||
|
|
||||||
//d3.json("static/js/jobstatusdata.json",function(error,data) {
|
//d3.json("static/js/jobstatusdata.json",function(error,data) {
|
||||||
d3.json(url, function(error,data) {
|
d3.json(url, function(error,data) {
|
||||||
console.log(data);
|
//console.log(data);
|
||||||
graphData = [
|
graphData = [
|
||||||
{
|
{
|
||||||
"color": "#1778c3",
|
"color": "#1778c3",
|
||||||
|
|||||||
Reference in New Issue
Block a user