mirror of
https://github.com/ansible/awx.git
synced 2026-05-16 13:57:39 -02:30
fixed jslint messages from earlier commit
This commit is contained in:
Jared Tabor
@@ -70,7 +70,7 @@ function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, NewDa
|
|||||||
if ($scope.removeDashboardReady) {
|
if ($scope.removeDashboardReady) {
|
||||||
$scope.removeDashboardReady();
|
$scope.removeDashboardReady();
|
||||||
}
|
}
|
||||||
$scope.removeDashboardReady = $scope.$on('dashboardReady', function (e, data) {
|
$scope.removeDashboardReady = $scope.$on('dashboardReady', function (e, data) {
|
||||||
JobStatus({
|
JobStatus({
|
||||||
scope: $scope,
|
scope: $scope,
|
||||||
target: 'container1',
|
target: 'container1',
|
||||||
@@ -91,7 +91,7 @@ function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, NewDa
|
|||||||
target: 'container3',
|
target: 'container3',
|
||||||
dashboard: data
|
dashboard: data
|
||||||
});
|
});
|
||||||
NewDash({
|
NewDash({
|
||||||
scope: $scope,
|
scope: $scope,
|
||||||
target: 'container5',
|
target: 'container5',
|
||||||
dashboard: data
|
dashboard: data
|
||||||
@@ -123,7 +123,7 @@ function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, NewDa
|
|||||||
}
|
}
|
||||||
|
|
||||||
Home.$inject = ['$scope', '$compile', '$routeParams', '$rootScope', '$location', 'Wait', 'NewDash', 'ObjectCount', 'JobStatus', 'InventorySyncStatus',
|
Home.$inject = ['$scope', '$compile', '$routeParams', '$rootScope', '$location', 'Wait', 'NewDash', 'ObjectCount', 'JobStatus', 'InventorySyncStatus',
|
||||||
'SCMSyncStatus', 'ClearScope', 'Stream', 'Rest', 'GetBasePath', 'ProcessErrors', 'Button'
|
'SCMSyncStatus', 'ClearScope', 'Stream', 'Rest', 'GetBasePath', 'ProcessErrors', 'Button'
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -1,17 +1,55 @@
|
|||||||
|
[
|
||||||
|
{
|
||||||
|
"key" : "Failed" ,
|
||||||
[
|
|
||||||
{
|
|
||||||
"key" : "Quantity" ,
|
|
||||||
"bar": true,
|
|
||||||
"color": "#ccf",
|
"color": "#ccf",
|
||||||
"values" : [ [ 1136005200000 , 1271000.0] , [ 1138683600000 , 1271000.0] , [ 1141102800000 , 1271000.0] , [ 1143781200000 , 0] , [ 1146369600000 , 0] , [ 1149048000000 , 0] , [ 1151640000000 , 0] , [ 1154318400000 , 0] , [ 1156996800000 , 0] , [ 1159588800000 , 3899486.0] , [ 1162270800000 , 3899486.0] , [ 1164862800000 , 3899486.0] , [ 1167541200000 , 3564700.0] , [ 1170219600000 , 3564700.0] , [ 1172638800000 , 3564700.0] , [ 1175313600000 , 2648493.0] , [ 1177905600000 , 2648493.0] , [ 1180584000000 , 2648493.0] , [ 1183176000000 , 2522993.0] , [ 1185854400000 , 2522993.0] , [ 1188532800000 , 2522993.0] , [ 1191124800000 , 2906501.0] , [ 1193803200000 , 2906501.0] , [ 1196398800000 , 2906501.0] , [ 1199077200000 , 2206761.0] , [ 1201755600000 , 2206761.0] , [ 1204261200000 , 2206761.0] , [ 1206936000000 , 2287726.0] , [ 1209528000000 , 2287726.0] , [ 1212206400000 , 2287726.0] , [ 1214798400000 , 2732646.0] , [ 1217476800000 , 2732646.0] , [ 1220155200000 , 2732646.0] , [ 1222747200000 , 2599196.0] , [ 1225425600000 , 2599196.0] , [ 1228021200000 , 2599196.0] , [ 1230699600000 , 1924387.0] , [ 1233378000000 , 1924387.0] , [ 1235797200000 , 1924387.0] , [ 1238472000000 , 1756311.0] , [ 1241064000000 , 1756311.0] , [ 1243742400000 , 1756311.0] , [ 1246334400000 , 1743470.0] , [ 1249012800000 , 1743470.0] , [ 1251691200000 , 1743470.0] , [ 1254283200000 , 1519010.0] , [ 1256961600000 , 1519010.0] , [ 1259557200000 , 1519010.0] , [ 1262235600000 , 1591444.0] , [ 1264914000000 , 1591444.0] , [ 1267333200000 , 1591444.0] , [ 1270008000000 , 1543784.0] , [ 1272600000000 , 1543784.0] , [ 1275278400000 , 1543784.0] , [ 1277870400000 , 1309915.0] , [ 1280548800000 , 1309915.0] , [ 1283227200000 , 1309915.0] , [ 1285819200000 , 1331875.0] , [ 1288497600000 , 1331875.0] , [ 1291093200000 , 1331875.0] , [ 1293771600000 , 1331875.0] , [ 1296450000000 , 1154695.0] , [ 1298869200000 , 1154695.0] , [ 1301544000000 , 1194025.0] , [ 1304136000000 , 1194025.0] , [ 1306814400000 , 1194025.0] , [ 1309406400000 , 1194025.0] , [ 1312084800000 , 1194025.0] , [ 1314763200000 , 1244525.0] , [ 1317355200000 , 475000.0] , [ 1320033600000 , 475000.0] , [ 1322629200000 , 475000.0] , [ 1325307600000 , 690033.0] , [ 1327986000000 , 690033.0] , [ 1330491600000 , 690033.0] , [ 1333166400000 , 514733.0] , [ 1335758400000 , 514733.0]]
|
"values" : [
|
||||||
} ,
|
[ 0 , 20.0] ,
|
||||||
|
[ 1 , 22.0] ,
|
||||||
{
|
[ 2 , 40] ,
|
||||||
"key" : "Price" ,
|
[ 3 , 50] ,
|
||||||
|
[ 4 , 60] ,
|
||||||
|
[ 5 , 70] ,
|
||||||
|
[ 6 , 80] ,
|
||||||
|
[ 7 , 90] ,
|
||||||
|
[ 8 , 100] ,
|
||||||
|
[ 9 , 110.0] ,
|
||||||
|
[ 10 , 222.0]
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"key" : "Changed" ,
|
||||||
"color" : "#333",
|
"color" : "#333",
|
||||||
"values" : [ [ 1136005200000 , 71.89] , [ 1138683600000 , 75.51] , [ 1141102800000 , 68.49] , [ 1143781200000 , 62.72] , [ 1146369600000 , 70.39] , [ 1149048000000 , 59.77] , [ 1151640000000 , 57.27] , [ 1154318400000 , 67.96] , [ 1156996800000 , 67.85] , [ 1159588800000 , 76.98] , [ 1162270800000 , 81.08] , [ 1164862800000 , 91.66] , [ 1167541200000 , 84.84] , [ 1170219600000 , 85.73] , [ 1172638800000 , 84.61] , [ 1175313600000 , 92.91] , [ 1177905600000 , 99.8] , [ 1180584000000 , 121.191] , [ 1183176000000 , 122.04] , [ 1185854400000 , 131.76] , [ 1188532800000 , 138.48] , [ 1191124800000 , 153.47] , [ 1193803200000 , 189.95] , [ 1196398800000 , 182.22] , [ 1199077200000 , 198.08] , [ 1201755600000 , 135.36] , [ 1204261200000 , 125.02] , [ 1206936000000 , 143.5] , [ 1209528000000 , 173.95] , [ 1212206400000 , 188.75] , [ 1214798400000 , 167.44] , [ 1217476800000 , 158.95] , [ 1220155200000 , 169.53] , [ 1222747200000 , 113.66] , [ 1225425600000 , 107.59] , [ 1228021200000 , 92.67] , [ 1230699600000 , 85.35] , [ 1233378000000 , 90.13] , [ 1235797200000 , 89.31] , [ 1238472000000 , 105.12] , [ 1241064000000 , 125.83] , [ 1243742400000 , 135.81] , [ 1246334400000 , 142.43] , [ 1249012800000 , 163.39] , [ 1251691200000 , 168.21] , [ 1254283200000 , 185.35] , [ 1256961600000 , 188.5] , [ 1259557200000 , 199.91] , [ 1262235600000 , 210.732] , [ 1264914000000 , 192.063] , [ 1267333200000 , 204.62] , [ 1270008000000 , 235.0] , [ 1272600000000 , 261.09] , [ 1275278400000 , 256.88] , [ 1277870400000 , 251.53] , [ 1280548800000 , 257.25] , [ 1283227200000 , 243.1] , [ 1285819200000 , 283.75] , [ 1288497600000 , 300.98] , [ 1291093200000 , 311.15] , [ 1293771600000 , 322.56] , [ 1296450000000 , 339.32] , [ 1298869200000 , 353.21] , [ 1301544000000 , 348.5075] , [ 1304136000000 , 350.13] , [ 1306814400000 , 347.83] , [ 1309406400000 , 335.67] , [ 1312084800000 , 390.48] , [ 1314763200000 , 384.83] , [ 1317355200000 , 381.32] , [ 1320033600000 , 404.78] , [ 1322629200000 , 382.2] , [ 1325307600000 , 405.0] , [ 1327986000000 , 456.48] , [ 1330491600000 , 542.44] , [ 1333166400000 , 599.55] , [ 1335758400000 , 583.98]]
|
"values" : [
|
||||||
|
[ 0 , 20.0] ,
|
||||||
|
[ 1 , 22.0] ,
|
||||||
|
[ 2 , 40] ,
|
||||||
|
[ 3 , 50] ,
|
||||||
|
[ 4 , 60] ,
|
||||||
|
[ 5 , 70] ,
|
||||||
|
[ 6 , 80] ,
|
||||||
|
[ 7 , 90] ,
|
||||||
|
[ 8 , 100] ,
|
||||||
|
[ 9 , 110.0] ,
|
||||||
|
[ 10 , 222.0]
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"key" : "OK" ,
|
||||||
|
"color" : "#333",
|
||||||
|
"values" : [
|
||||||
|
[ 0 , 20.0] ,
|
||||||
|
[ 1 , 22.0] ,
|
||||||
|
[ 2 , 40] ,
|
||||||
|
[ 3 , 50] ,
|
||||||
|
[ 4 , 60] ,
|
||||||
|
[ 5 , 70] ,
|
||||||
|
[ 6 , 80] ,
|
||||||
|
[ 7 , 90] ,
|
||||||
|
[ 8 , 100] ,
|
||||||
|
[ 9 , 110.0] ,
|
||||||
|
[ 10 , 222.0]
|
||||||
|
]
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -17,11 +17,8 @@ angular.module('NewDashWidget', ['RestServices', 'Utilities'])
|
|||||||
var scope = params.scope,
|
var scope = params.scope,
|
||||||
target = params.target,
|
target = params.target,
|
||||||
dashboard = params.dashboard,
|
dashboard = params.dashboard,
|
||||||
keys = ['hosts', 'hosts.failed'
|
|
||||||
// , 'teams', 'credentials', 'projects', 'inventories', 'groups', 'hosts',
|
html, element;
|
||||||
// 'job_templates', 'jobs'
|
|
||||||
],
|
|
||||||
i, html, element;
|
|
||||||
|
|
||||||
html = "<div id=\"dashcontainer\" class=\"panel panel-default\">\n";
|
html = "<div id=\"dashcontainer\" class=\"panel panel-default\">\n";
|
||||||
html += "<div class=\"panel-heading\">New Dashboard</div>\n";
|
html += "<div class=\"panel-heading\">New Dashboard</div>\n";
|
||||||
@@ -48,7 +45,7 @@ angular.module('NewDashWidget', ['RestServices', 'Utilities'])
|
|||||||
html += "<td class=\"h5 col-lg-1 text-center\">Users</td>\n";
|
html += "<td class=\"h5 col-lg-1 text-center\">Users</td>\n";
|
||||||
html += "</tr>\n";
|
html += "</tr>\n";
|
||||||
html += "</table>\n";
|
html += "</table>\n";
|
||||||
|
|
||||||
html += "<br>\n";
|
html += "<br>\n";
|
||||||
html += "<hr>\n";
|
html += "<hr>\n";
|
||||||
html += "<table class=\"table\">\n";
|
html += "<table class=\"table\">\n";
|
||||||
@@ -57,16 +54,16 @@ angular.module('NewDashWidget', ['RestServices', 'Utilities'])
|
|||||||
html += "<td class=\"h5 col-lg-6 text-center\" style=\"border:none\">Hosts</td>\n";
|
html += "<td class=\"h5 col-lg-6 text-center\" style=\"border:none\">Hosts</td>\n";
|
||||||
html += "</tr>\n";
|
html += "</tr>\n";
|
||||||
html += "<tr>\n";
|
html += "<tr>\n";
|
||||||
//html += "<td id=\"job-status-graph-container\" style=\"border:none\">\n";
|
//html += "<td id=\"job-status-graph-container\" style=\"border:none\">\n";
|
||||||
html += "<td class=\"job-status-graph\" style=\"border:none\"><svg></svg></td>\n";
|
html += "<td class=\"job-status-graph\" style=\"border:none\"><svg></svg></td>\n";
|
||||||
// //class=\"job-status-graph col-lg-6\" style=\"border:none\">\n";
|
// //class=\"job-status-graph col-lg-6\" style=\"border:none\">\n";
|
||||||
// html += "<svg class=\"job-status-graph\" width=\"500\" height=\"200\" viewBox=\"0 0 500 200\" perserveAspectRatio=\"xMidYMid\"></td>\n";
|
// html += "<svg class=\"job-status-graph\" width=\"500\" height=\"200\" viewBox=\"0 0 500 200\" perserveAspectRatio=\"xMidYMid\"></td>\n";
|
||||||
html += "<td class=\"host-count-graph\" style=\"border:none\"></td>\n";
|
html += "<td class=\"host-count-graph\" style=\"border:none\"></td>\n";
|
||||||
//<svg class=\"host-count-graph\" width=\"500\" height=\"200\" viewBox=\"0 0 500 200\" perserveAspectRatio=\"xMidYMid\"></td>\n";
|
//<svg class=\"host-count-graph\" width=\"500\" height=\"200\" viewBox=\"0 0 500 200\" perserveAspectRatio=\"xMidYMid\"></td>\n";
|
||||||
// html += "<td class=\"host-count-graph col-lg-6\" style=\"border:none\"></td>\n";
|
// html += "<td class=\"host-count-graph col-lg-6\" style=\"border:none\"></td>\n";
|
||||||
html += "</tr>\n";
|
html += "</tr>\n";
|
||||||
html += "</table>\n";
|
html += "</table>\n";
|
||||||
|
|
||||||
// html += "<br>\n";
|
// html += "<br>\n";
|
||||||
// html += "<hr>\n";
|
// html += "<hr>\n";
|
||||||
html += "<table class=\"table table-bordered\">\n";
|
html += "<table class=\"table table-bordered\">\n";
|
||||||
@@ -75,75 +72,104 @@ angular.module('NewDashWidget', ['RestServices', 'Utilities'])
|
|||||||
html += "<td class=\"h5 col-lg-6 text-center\">Remaining licenses</td>\n";
|
html += "<td class=\"h5 col-lg-6 text-center\">Remaining licenses</td>\n";
|
||||||
html += "</tr>\n";
|
html += "</tr>\n";
|
||||||
html += "<tr>\n";
|
html += "<tr>\n";
|
||||||
html += "<td class=\"col-lg-8\">\n";
|
html += "<td class=\"col-lg-8\">\n";
|
||||||
|
|
||||||
//---------------------------------------------------------------------------------------------------------
|
//---------------------------------------------------------------------------------------------------------
|
||||||
|
|
||||||
html += "<div class=\"col-md-6 right-side\">\n";
|
html += "<div class=\"col-md-6 right-side\">\n";
|
||||||
html += "<div class=\"jobs-list-container\">\n";
|
html += "<div class=\"jobs-list-container\">\n";
|
||||||
html += "<div class=\"row search-row\">\n";
|
html += "<div class=\"row search-row\">\n";
|
||||||
html += "<div class=\"col-md-6\"><div class=\"title\">Active</div></div>\n";
|
html += "<div class=\"col-md-6\"><div class=\"title\">Active</div></div>\n";
|
||||||
html += "<div class=\"col-md-6\" id=\"active-jobs-search-container\"></div>\n";
|
html += "<div class=\"col-md-6\" id=\"active-jobs-search-container\"></div>\n";
|
||||||
html += "</div>\n";
|
html += "</div>\n";
|
||||||
html += "<div class=\"job-list\" id=\"active-jobs-container\">\n";
|
html += "<div class=\"job-list\" id=\"active-jobs-container\">\n";
|
||||||
html += "<div id=\"active-jobs\" class=\"job-list-target\"></div>\n";
|
html += "<div id=\"active-jobs\" class=\"job-list-target\"></div>\n";
|
||||||
html += "</div>\n";
|
html += "</div>\n";
|
||||||
html += "</div>\n";
|
html += "</div>\n";
|
||||||
html += "</div>\n";
|
html += "</div>\n";
|
||||||
//---------------------------------------------------------------------------------------------------------
|
//---------------------------------------------------------------------------------------------------------
|
||||||
|
|
||||||
html += "</td>\n";
|
html += "</td>\n";
|
||||||
html += "<td class=\"col-lg-4 text-center\">Your license will out in <br><u> 365 </u> days</td>\n";
|
html += "<td class=\"col-lg-4 text-center\">Your license will out in <br><u> 365 </u> days</td>\n";
|
||||||
html += "</tr>\n";
|
html += "</tr>\n";
|
||||||
html += "</table>\n";
|
html += "</table>\n";
|
||||||
|
|
||||||
html += "</div>\n";
|
html += "</div>\n";
|
||||||
html += "</div>\n";
|
html += "</div>\n";
|
||||||
html += "</div>\n";
|
html += "</div>\n";
|
||||||
|
|
||||||
var graphWidth = ($(window).width())/3;
|
// var graphWidth = ($(window).width())/3;
|
||||||
var graphHeight = ($(window).height())/3;
|
// var graphHeight = ($(window).height())/3;
|
||||||
|
|
||||||
function makeGraph(){
|
|
||||||
d3.json("static/js/jobstatusdata.json",function(error,data) {
|
|
||||||
nv.addGraph(function() {
|
|
||||||
var chart = nv.models.linePlusBarChart()
|
|
||||||
.margin({top: 30, right: 60, bottom: 50, left: 70})
|
|
||||||
//We can set x data accessor to use index. Reason? So the bars all appear evenly spaced.
|
|
||||||
.x(function(d,i) { return i })
|
|
||||||
.y(function(d,i) {return d[1] })
|
|
||||||
;
|
|
||||||
|
|
||||||
chart.xAxis.tickFormat(function(d) {
|
//function makeGraph(){
|
||||||
var dx = data[0].values[d] && data[0].values[d][0] || 0;
|
// d3.json("static/js/jobstatusdata.json",function(error,data) {
|
||||||
return d3.time.format('%x')(new Date(dx))
|
// nv.addGraph(function() {
|
||||||
});
|
// var chart = nv.models.lineChart()
|
||||||
|
// .margin({left: 100}) //Adjust chart margins to give the x-axis some breathing room.
|
||||||
|
// .useInteractiveGuideline(true) //We want nice looking tooltips and a guideline!
|
||||||
|
// .transitionDuration(350) //how fast do you want the lines to transition?
|
||||||
|
// .showLegend(true) //Show the legend, allowing users to turn on/off line series.
|
||||||
|
// .showYAxis(true) //Show the y-axis
|
||||||
|
// .showXAxis(true) //Show the x-axis
|
||||||
|
|
||||||
chart.y1Axis
|
// chart.xAxis.tickFormat(function(d) {
|
||||||
.tickFormat(d3.format(',f'));
|
// var dx = data[0].values[d] && data[0].values[d][0] || 0;
|
||||||
|
// return d3.time.format('%x')(new Date(dx))
|
||||||
|
// });
|
||||||
|
|
||||||
chart.y2Axis
|
// chart.y1Axis
|
||||||
.tickFormat(function(d) { return '$' + d3.format(',f')(d) });
|
// .tickFormat(d3.format(',f'));
|
||||||
|
|
||||||
chart.bars.forceY([0]);
|
// chart.y2Axis
|
||||||
|
// .tickFormat(function(d) { return '$' + d3.format(',f')(d) });
|
||||||
|
|
||||||
d3.select('.job-status-graph svg')
|
// chart.bars.forceY([0]);
|
||||||
.datum(data)
|
|
||||||
.transition()
|
|
||||||
.duration(0)
|
|
||||||
.call(chart);
|
|
||||||
|
|
||||||
nv.utils.windowResize(chart.update);
|
// d3.select('.job-status-graph svg')
|
||||||
|
// .datum(data)
|
||||||
|
// .transition()
|
||||||
|
// .duration(0)
|
||||||
|
// .call(chart);
|
||||||
|
|
||||||
return chart;
|
// nv.utils.windowResize(chart.update);
|
||||||
});
|
|
||||||
|
|
||||||
});
|
// return chart;
|
||||||
|
// });
|
||||||
|
// var chart = nv.models.lineChart()
|
||||||
|
// .margin({left: 100}) //Adjust chart margins to give the x-axis some breathing room.
|
||||||
|
// .useInteractiveGuideline(true) //We want nice looking tooltips and a guideline!
|
||||||
|
// .transitionDuration(350) //how fast do you want the lines to transition?
|
||||||
|
// .showLegend(true) //Show the legend, allowing users to turn on/off line series.
|
||||||
|
// .showYAxis(true) //Show the y-axis
|
||||||
|
// .showXAxis(true) //Show the x-axis
|
||||||
|
// ;
|
||||||
|
|
||||||
};
|
// chart.xAxis //Chart x-axis settings
|
||||||
|
// .axisLabel('Time (ms)')
|
||||||
|
// .tickFormat(d3.format(',r'));
|
||||||
|
|
||||||
|
// chart.yAxis //Chart y-axis settings
|
||||||
|
// .axisLabel('Voltage (v)')
|
||||||
|
// .tickFormat(d3.format('.02f'));
|
||||||
|
|
||||||
|
// /* Done setting the chart up? Time to render it!*/
|
||||||
|
// //var myData = sinAndCos(); //You need data...
|
||||||
|
|
||||||
|
// d3.select('.job-status-graph svg') //Select the <svg> element you want to render the chart in.
|
||||||
|
// .datum(data) //Populate the <svg> element with chart data...
|
||||||
|
// .call(chart); //Finally, render the chart!
|
||||||
|
|
||||||
|
// //Update the chart when window resizes.
|
||||||
|
// nv.utils.windowResize(function() { chart.update() });
|
||||||
|
// return chart;
|
||||||
|
// });
|
||||||
|
|
||||||
|
// });
|
||||||
|
|
||||||
|
// };
|
||||||
|
|
||||||
|
|
||||||
function makeJobStatusGraph(){
|
// function makeJobStatusGraph(){
|
||||||
// Adjust the size
|
// Adjust the size
|
||||||
// width = $('#job-summary-container .job_well').width();
|
// width = $('#job-summary-container .job_well').width();
|
||||||
// height = $('#job-summary-container .job_well').height() - $('#summary-well-top-section').height() - $('#graph-section .header').outerHeight() - 15;
|
// height = $('#job-summary-container .job_well').height() - $('#summary-well-top-section').height() - $('#graph-section .header').outerHeight() - 15;
|
||||||
@@ -166,197 +192,197 @@ angular.module('NewDashWidget', ['RestServices', 'Utilities'])
|
|||||||
// }
|
// }
|
||||||
|
|
||||||
|
|
||||||
var margin = {top: 20, right: 80, bottom: 30, left: 50},
|
// var margin = {top: 20, right: 80, bottom: 30, left: 50},
|
||||||
width = graphWidth - margin.left - margin.right,
|
// width = graphWidth - margin.left - margin.right,
|
||||||
height = graphHeight - margin.top - margin.bottom;
|
// height = graphHeight - margin.top - margin.bottom;
|
||||||
|
|
||||||
var parseDate = d3.time.format("%Y%m%d").parse;
|
// var parseDate = d3.time.format("%Y%m%d").parse;
|
||||||
|
|
||||||
var x = d3.time.scale()
|
// var x = d3.time.scale()
|
||||||
.range([0, width]);
|
// .range([0, width]);
|
||||||
|
|
||||||
var y = d3.scale.linear()
|
// var y = d3.scale.linear()
|
||||||
.range([height, 0]);
|
// .range([height, 0]);
|
||||||
|
|
||||||
var color = d3.scale.category10();
|
// var color = d3.scale.category10();
|
||||||
|
|
||||||
var xAxis = d3.svg.axis()
|
// var xAxis = d3.svg.axis()
|
||||||
.scale(x)
|
// .scale(x)
|
||||||
.orient("bottom");
|
// .orient("bottom");
|
||||||
|
|
||||||
var yAxis = d3.svg.axis()
|
// var yAxis = d3.svg.axis()
|
||||||
.scale(y)
|
// .scale(y)
|
||||||
.orient("left");
|
// .orient("left");
|
||||||
|
|
||||||
var line = d3.svg.line()
|
// var line = d3.svg.line()
|
||||||
.interpolate("basis")
|
// .interpolate("basis")
|
||||||
.x(function(d) { return x(d.date); })
|
// .x(function(d) { return x(d.date); })
|
||||||
.y(function(d) { return y(d.hostCount); });
|
// .y(function(d) { return y(d.hostCount); });
|
||||||
|
|
||||||
var svg = d3.select(".job-status-graph").append("svg")
|
// var svg = d3.select(".job-status-graph").append("svg")
|
||||||
.attr("width", width + margin.left + margin.right)
|
// .attr("width", width + margin.left + margin.right)
|
||||||
.attr("height", height + margin.top + margin.bottom)
|
// .attr("height", height + margin.top + margin.bottom)
|
||||||
.append("g")
|
// .append("g")
|
||||||
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
|
// .attr("transform", "translate(" + margin.left + "," + margin.top + ")");
|
||||||
|
|
||||||
d3.json("static/js/jobstatusdata.json", function(error, data) {
|
// d3.json("static/js/jobstatusdata.json", function(error, data) {
|
||||||
color.domain(d3.keys(data[0]).filter(function(key) { return key !== "date"; }));
|
// color.domain(d3.keys(data[0]).filter(function(key) { return key !== "date"; }));
|
||||||
|
|
||||||
data.forEach(function(d) {
|
// data.forEach(function(d) {
|
||||||
d.date = parseDate(d.date);
|
// d.date = parseDate(d.date);
|
||||||
});
|
// });
|
||||||
|
|
||||||
var status = color.domain().map(function(name) {
|
// var status = color.domain().map(function(name) {
|
||||||
return {
|
// return {
|
||||||
name: name,
|
// name: name,
|
||||||
values: data.map(function(d) {
|
// values: data.map(function(d) {
|
||||||
return {date: d.date, hostCount: +d[name]};
|
// return {date: d.date, hostCount: +d[name]};
|
||||||
})
|
// })
|
||||||
};
|
// };
|
||||||
});
|
// });
|
||||||
|
|
||||||
x.domain(d3.extent(data, function(d) { return d.date; }));
|
// x.domain(d3.extent(data, function(d) { return d.date; }));
|
||||||
|
|
||||||
y.domain([
|
// y.domain([
|
||||||
d3.min(status, function(c) { return d3.min(c.values, function(v) { return v.hostCount; }); }),
|
// d3.min(status, function(c) { return d3.min(c.values, function(v) { return v.hostCount; }); }),
|
||||||
d3.max(status, function(c) { return d3.max(c.values, function(v) { return v.hostCount; }); })
|
// d3.max(status, function(c) { return d3.max(c.values, function(v) { return v.hostCount; }); })
|
||||||
]);
|
// ]);
|
||||||
|
|
||||||
svg.append("g")
|
// svg.append("g")
|
||||||
.attr("class", "x axis")
|
// .attr("class", "x axis")
|
||||||
.attr("transform", "translate(0," + height + ")")
|
// .attr("transform", "translate(0," + height + ")")
|
||||||
.call(xAxis);
|
// .call(xAxis);
|
||||||
|
|
||||||
svg.append("g")
|
// svg.append("g")
|
||||||
.attr("class", "y axis")
|
// .attr("class", "y axis")
|
||||||
.call(yAxis)
|
// .call(yAxis)
|
||||||
.append("text")
|
// .append("text")
|
||||||
.attr("transform", "rotate(-90)")
|
// .attr("transform", "rotate(-90)")
|
||||||
.attr("y", 6)
|
// .attr("y", 6)
|
||||||
.attr("dy", ".71em")
|
// .attr("dy", ".71em")
|
||||||
.style("text-anchor", "end")
|
// .style("text-anchor", "end")
|
||||||
.text("Number of hosts");
|
// .text("Number of hosts");
|
||||||
|
|
||||||
var series = svg.selectAll(".series")
|
// var series = svg.selectAll(".series")
|
||||||
.data(status)
|
// .data(status)
|
||||||
.enter().append("g")
|
// .enter().append("g")
|
||||||
.attr("class", "series");
|
// .attr("class", "series");
|
||||||
|
|
||||||
series.append("path")
|
// series.append("path")
|
||||||
.attr("class", "line")
|
// .attr("class", "line")
|
||||||
.attr("d", function(d) { return line(d.values); })
|
// .attr("d", function(d) { return line(d.values); })
|
||||||
.style("stroke", function(d) { return color(d.name); });
|
// .style("stroke", function(d) { return color(d.name); });
|
||||||
|
|
||||||
series.append("text")
|
// series.append("text")
|
||||||
.datum(function(d) { return {name: d.name, value: d.values[d.values.length - 1]}; })
|
// .datum(function(d) { return {name: d.name, value: d.values[d.values.length - 1]}; })
|
||||||
.attr("transform", function(d) { return "translate(" + x(d.value.date) + "," + y(d.value.hostCount) + ")"; })
|
// .attr("transform", function(d) { return "translate(" + x(d.value.date) + "," + y(d.value.hostCount) + ")"; })
|
||||||
.attr("x", 3)
|
// .attr("x", 3)
|
||||||
.attr("dy", ".35em")
|
// .attr("dy", ".35em")
|
||||||
.text(function(d) { return d.name; });
|
// .text(function(d) { return d.name; });
|
||||||
});
|
// });
|
||||||
|
|
||||||
};
|
// };
|
||||||
|
|
||||||
function makeHostCountGraph(){
|
// function makeHostCountGraph(){
|
||||||
var margin = {top: 20, right: 80, bottom: 30, left: 50},
|
// var margin = {top: 20, right: 80, bottom: 30, left: 50},
|
||||||
width = graphWidth - margin.left - margin.right,
|
// width = graphWidth - margin.left - margin.right,
|
||||||
height = graphHeight - margin.top - margin.bottom;
|
// height = graphHeight - margin.top - margin.bottom;
|
||||||
|
|
||||||
var parseDate = d3.time.format("%Y%m%d").parse;
|
// var parseDate = d3.time.format("%Y%m%d").parse;
|
||||||
|
|
||||||
var x = d3.time.scale()
|
// var x = d3.time.scale()
|
||||||
.range([0, width]);
|
// .range([0, width]);
|
||||||
|
|
||||||
var y = d3.scale.linear()
|
// var y = d3.scale.linear()
|
||||||
.range([height, 0]);
|
// .range([height, 0]);
|
||||||
|
|
||||||
var color = d3.scale.category10();
|
// var color = d3.scale.category10();
|
||||||
|
|
||||||
var xAxis = d3.svg.axis()
|
// var xAxis = d3.svg.axis()
|
||||||
.scale(x)
|
// .scale(x)
|
||||||
.orient("bottom");
|
// .orient("bottom");
|
||||||
|
|
||||||
var yAxis = d3.svg.axis()
|
// var yAxis = d3.svg.axis()
|
||||||
.scale(y)
|
// .scale(y)
|
||||||
.orient("left");
|
// .orient("left");
|
||||||
|
|
||||||
var line = d3.svg.line()
|
// var line = d3.svg.line()
|
||||||
.interpolate("basis")
|
// .interpolate("basis")
|
||||||
.x(function(d) { return x(d.date); })
|
// .x(function(d) { return x(d.date); })
|
||||||
.y(function(d) { return y(d.hostCount); });
|
// .y(function(d) { return y(d.hostCount); });
|
||||||
|
|
||||||
var svg = d3.select(".host-count-graph").append("svg")
|
// var svg = d3.select(".host-count-graph").append("svg")
|
||||||
.attr("width", width + margin.left + margin.right)
|
// .attr("width", width + margin.left + margin.right)
|
||||||
.attr("height", height + margin.top + margin.bottom)
|
// .attr("height", height + margin.top + margin.bottom)
|
||||||
.append("g")
|
// .append("g")
|
||||||
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
|
// .attr("transform", "translate(" + margin.left + "," + margin.top + ")");
|
||||||
|
|
||||||
d3.json("static/js/hostcount.json", function(error, data) {
|
// d3.json("static/js/hostcount.json", function(error, data) {
|
||||||
color.domain(d3.keys(data[0]).filter(function(key) { return key !== "date"; }));
|
// color.domain(d3.keys(data[0]).filter(function(key) { return key !== "date"; }));
|
||||||
|
|
||||||
data.forEach(function(d) {
|
// data.forEach(function(d) {
|
||||||
d.date = parseDate(d.date);
|
// d.date = parseDate(d.date);
|
||||||
});
|
// });
|
||||||
|
|
||||||
var status = color.domain().map(function(name) {
|
// var status = color.domain().map(function(name) {
|
||||||
return {
|
// return {
|
||||||
name: name,
|
// name: name,
|
||||||
values: data.map(function(d) {
|
// values: data.map(function(d) {
|
||||||
return {date: d.date, hostCount: +d[name]};
|
// return {date: d.date, hostCount: +d[name]};
|
||||||
})
|
// })
|
||||||
};
|
// };
|
||||||
});
|
// });
|
||||||
|
|
||||||
x.domain(d3.extent(data, function(d) { return d.date; }));
|
// x.domain(d3.extent(data, function(d) { return d.date; }));
|
||||||
|
|
||||||
y.domain([
|
// y.domain([
|
||||||
d3.min(status, function(c) { return d3.min(c.values, function(v) { return v.hostCount; }); }),
|
// d3.min(status, function(c) { return d3.min(c.values, function(v) { return v.hostCount; }); }),
|
||||||
d3.max(status, function(c) { return d3.max(c.values, function(v) { return v.hostCount; }); })
|
// d3.max(status, function(c) { return d3.max(c.values, function(v) { return v.hostCount; }); })
|
||||||
]);
|
// ]);
|
||||||
|
|
||||||
svg.append("g")
|
// svg.append("g")
|
||||||
.attr("class", "x axis")
|
// .attr("class", "x axis")
|
||||||
.attr("transform", "translate(0," + height + ")")
|
// .attr("transform", "translate(0," + height + ")")
|
||||||
.call(xAxis);
|
// .call(xAxis);
|
||||||
|
|
||||||
svg.append("g")
|
// svg.append("g")
|
||||||
.attr("class", "y axis")
|
// .attr("class", "y axis")
|
||||||
.call(yAxis)
|
// .call(yAxis)
|
||||||
.append("text")
|
// .append("text")
|
||||||
.attr("transform", "rotate(-90)")
|
// .attr("transform", "rotate(-90)")
|
||||||
.attr("y", 6)
|
// .attr("y", 6)
|
||||||
.attr("dy", ".71em")
|
// .attr("dy", ".71em")
|
||||||
.style("text-anchor", "end")
|
// .style("text-anchor", "end")
|
||||||
.text("Number of hosts");
|
// .text("Number of hosts");
|
||||||
|
|
||||||
var series = svg.selectAll(".series")
|
// var series = svg.selectAll(".series")
|
||||||
.data(status)
|
// .data(status)
|
||||||
.enter().append("g")
|
// .enter().append("g")
|
||||||
.attr("class", "series");
|
// .attr("class", "series");
|
||||||
|
|
||||||
series.append("path")
|
// series.append("path")
|
||||||
.attr("class", "line")
|
// .attr("class", "line")
|
||||||
.attr("d", function(d) { return line(d.values); })
|
// .attr("d", function(d) { return line(d.values); })
|
||||||
.style("stroke", function(d) { return color(d.name); });
|
// .style("stroke", function(d) { return color(d.name); });
|
||||||
|
|
||||||
series.append("text")
|
// series.append("text")
|
||||||
.datum(function(d) { return {name: d.name, value: d.values[d.values.length - 1]}; })
|
// .datum(function(d) { return {name: d.name, value: d.values[d.values.length - 1]}; })
|
||||||
.attr("transform", function(d) { return "translate(" + x(d.value.date) + "," + y(d.value.hostCount) + ")"; })
|
// .attr("transform", function(d) { return "translate(" + x(d.value.date) + "," + y(d.value.hostCount) + ")"; })
|
||||||
.attr("x", 3)
|
// .attr("x", 3)
|
||||||
.attr("dy", ".35em")
|
// .attr("dy", ".35em")
|
||||||
.text(function(d) { return d.name; });
|
// .text(function(d) { return d.name; });
|
||||||
});
|
// });
|
||||||
|
|
||||||
|
// };
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
element = angular.element(document.getElementById(target));
|
element = angular.element(document.getElementById(target));
|
||||||
element.html(html);
|
element.html(html);
|
||||||
$compile(element)(scope);
|
$compile(element)(scope);
|
||||||
makeGraph();
|
// makeGraph();
|
||||||
// makeJobStatusGraph();
|
// makeJobStatusGraph();
|
||||||
makeHostCountGraph();
|
// makeHostCountGraph();
|
||||||
scope.$emit('WidgetLoaded');
|
scope.$emit('WidgetLoaded');
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user