Kill strict mode in favor of doing it once

This commit is contained in:
Joe Fiorini
2015-01-28 17:14:27 -05:00
parent a70d6b80aa
commit f4350f4a28
116 changed files with 641 additions and 114 deletions

View File

@@ -13,7 +13,7 @@
*
*/
'use strict';
angular.module('DashboardCountsWidget', ['RestServices', 'Utilities'])
.factory('DashboardCounts', ['$rootScope', '$compile', 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',

View File

@@ -8,7 +8,7 @@
*
*/
'use strict';
angular.module('DashboardJobsWidget', ['RestServices', 'Utilities'])
.factory('DashboardJobs', ['$rootScope', '$compile', 'LoadSchedulesScope', 'LoadJobsScope', 'JobsList', 'ScheduledJobsList', 'GetChoices', 'GetBasePath',

View File

@@ -0,0 +1,180 @@
/*********************************************
* Copyright (c) 2014 AnsibleWorks, Inc.
*/
/**
* @ngdoc function
* @name widgets.function:HostGraph
* @description
*
*/
angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
.factory('HostGraph', ['$rootScope', '$compile', '$location', 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',
function ($rootScope, $compile, $location, Rest, GetBasePath, ProcessErrors) {
return function (params) {
var scope = params.scope,
target = params.target,
html, element, url, license, license_graph;
// html = "<div class=\"graph-container\">\n";
html ="<div class=\"row\">\n";
html += "<div class=\"h6 col-xs-8 text-center\"><b>Host Count</b></div>\n";
html += "</div>\n";
html +="<div class=\"row\">\n";
html += "<div class=\"host-count-graph\"><svg></svg></div>\n";
// html += "</div>\n";
element = angular.element(document.getElementById(target));
element.html(html);
$compile(element)(scope);
url = GetBasePath('config');
if (scope.removeResizeHostGraph) {
scope.removeResizeHostGraph();
}
scope.removeResizeHostGraph= scope.$on('ResizeHostGraph', function () {
if($(window).width()<500){
$('.graph-container').height(300);
}
else{
var winHeight = $(window).height(),
available_height = winHeight - $('#main-menu-container .navbar').outerHeight() - $('#count-container').outerHeight() - 120;
$('.graph-container').height(available_height/2);
license_graph.update();
}
});
Rest.setUrl(url);
Rest.get()
.success(function (data){
license = data.license_info.instance_count;
scope.$emit('licenseCountReady', license);
})
.error(function (data, status) {
ProcessErrors(scope, data, status, null, { hdr: 'Error!',
msg: 'Failed to get: ' + url + ' GET returned: ' + status });
});
if (scope.removeLicenseCountReady) {
scope.removeLicenseCountReady();
}
scope.removeLicenseCountReady = scope.$on('licenseCountReady', function (e, license) {
url = GetBasePath('dashboard')+'graphs/inventory/';
Rest.setUrl(url);
Rest.get()
.success(function (data) {
scope.$emit('hostDataReady', data, license);
})
.error(function (data, status) {
ProcessErrors(scope, data, status, null, { hdr: 'Error!',
msg: 'Failed to get: ' + url + ' GET returned: ' + status });
});
});
if (scope.removeHostDataReady) {
scope.removeHostDataReady();
}
scope.removeHostDataReady = scope.$on('hostDataReady', function (e, data, license) {
//url = GetBasePath('dashboard')+'graphs/';
var 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;
});
nv.addGraph({
generate: function() {
var width = $('.graph-container').width(), // nv.utils.windowSize().width/3,
height = $('.graph-container').height()*0.6; //nv.utils.windowSize().height/5,
license_graph = nv.models.lineChart()
.margin({top: 15, right: 75, bottom: 40, left: 85})
.x(function(d,i) { return i ;})
.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
;
license_graph.xAxis
.axisLabel("Time")
.tickFormat(function(d) {
var dx = graphData[0].values[d] && graphData[0].values[d].x || 0;
return dx ? d3.time.format('%m/%d')(new Date(Number(dx+'000'))) : '';
});
license_graph.yAxis //Chart y-axis settings
.axisLabel('Hosts')
.tickFormat(d3.format('.f'));
d3.select('.host-count-graph svg')
.datum(graphData).transition()
.attr('width', width)
.attr('height', height)
.duration(500)
.call(license_graph)
.style({
// 'width': width,
// 'height': height,
"font-family": 'Open Sans',
"font-style": "normal",
"font-weight":400,
"src": "url(/static/fonts/OpenSans-Regular.ttf)"
});
// nv.utils.windowResize(license_graph.update);
scope.$emit('WidgetLoaded');
return license_graph;
},
});
//});
});
};
}
]);

View File

@@ -0,0 +1,128 @@
/*********************************************
* Copyright (c) 2014 AnsibleWorks, Inc.
*/
/**
* @ngdoc function
* @name widgets.function:HostPieChart
* @description
* HostPieChart.js
*
* file for the host status pie chart
*
*/
angular.module('HostPieChartWidget', ['RestServices', 'Utilities'])
.factory('HostPieChart', ['$rootScope', '$compile',
//'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',
function ($rootScope, $compile){
//, Rest, GetBasePath, ProcessErrors) {
return function (params) {
var scope = params.scope,
target = params.target,
dashboard = params.dashboard,
html, element, data,
canvas, context, winHeight, available_height, host_pie_chart;
// html = "<div class=\"graph-container\">\n";
html ="<div class=\"row\">\n";
html += "<div id=\"job-status-title\" class=\"h6 col-xs-8 text-center\"><b>Host Status</b></div>\n";
html += "</div>\n";
html +="<div class=\"row\">\n";
html += "<div class=\"host-pie-chart text-center\"><svg></svg></div>\n";
html += "</div>\n";
// html += "</div>\n";
element = angular.element(document.getElementById(target));
element.html(html);
$compile(element)(scope);
if (scope.removeResizeHostPieGraph) {
scope.removeResizeHostPieGraph();
}
scope.removeResizeHostPieGraph= scope.$on('ResizeHostPieGraph', function () {
if($(window).width()<500){
$('.graph-container').height(300);
}
else{
var winHeight = $(window).height(),
available_height = winHeight - $('#main-menu-container .navbar').outerHeight() - $('#count-container').outerHeight() - 120;
$('.graph-container').height(available_height/2);
if(host_pie_chart){
host_pie_chart.update();
}
}
});
if(dashboard.hosts.total+dashboard.hosts.failed>0){
data = [
{
"label": "Successful",
"color": "#00aa00",
"value" : dashboard.hosts.total
} ,
{
"label": "Failed",
"color" : "#aa0000",
"value" : dashboard.hosts.failed
}
];
nv.addGraph(function() {
var width = $('.graph-container').width(), // nv.utils.windowSize().width/3,
height = $('.graph-container').height()*0.7; //nv.utils.windowSize().height/5,
host_pie_chart = nv.models.pieChart()
.margin({top: 5, right: 75, bottom: 40, left: 85})
.x(function(d) { return d.label; })
.y(function(d) { return d.value; })
.showLabels(true)
.labelThreshold(0.01)
.tooltipContent(function(x, y) {
return '<b>'+x+'</b>'+ '<p>' + Math.floor(y.replace(',','')) + ' Hosts ' + '</p>';
})
.color(['#00aa00', '#aa0000']);
host_pie_chart.pie.pieLabelsOutside(true).labelType("percent");
d3.select(".host-pie-chart svg")
.datum(data)
.attr('width', width)
.attr('height', height)
.transition().duration(350)
.call(host_pie_chart)
.style({
"font-family": 'Open Sans',
"font-style": "normal",
"font-weight":400,
"src": "url(/static/fonts/OpenSans-Regular.ttf)"
});
// nv.utils.windowResize(host_pie_chart.update);
scope.$emit('WidgetLoaded');
return host_pie_chart;
});
}
else{
winHeight = $(window).height();
available_height = winHeight - $('#main-menu-container .navbar').outerHeight() - $('#count-container').outerHeight() - 120;
$('.graph-container:eq(1)').height(available_height/2);
$('.host-pie-chart svg').replaceWith('<canvas id="circlecanvas" width="120" height="120"></canvas>');
canvas = document.getElementById("circlecanvas");
context = canvas.getContext("2d");
context.arc(55, 55, 50, 0, Math.PI * 2, false);
context.lineWidth = 1;
context.strokeStyle = '#1778c3';
context.stroke();
context.font = "12px Open Sans";
context.fillText("No Host data",18,55);
scope.$emit('WidgetLoaded');
}
};
}
]);

View File

@@ -11,7 +11,7 @@
*
*/
'use strict';
angular.module('InventorySyncStatusWidget', ['RestServices', 'Utilities'])
.factory('InventorySyncStatus', ['$rootScope', '$compile', function ($rootScope, $compile) {

View File

@@ -11,7 +11,7 @@
*
*/
'use strict';
angular.module('JobStatusWidget', ['RestServices', 'Utilities'])
.factory('JobStatus', ['$rootScope', '$compile', 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',

View File

@@ -0,0 +1,219 @@
/*********************************************
* Copyright (c) 2014 AnsibleWorks, Inc.
*/
/**
* @ngdoc function
* @name widgets.function:JobStatusGraph
* @description
*/
angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
.factory('JobStatusGraph', ['$rootScope', '$compile', '$location' , 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',
function ($rootScope, $compile , $location, Rest, GetBasePath, ProcessErrors) {
return function (params) {
var scope = params.scope,
target = params.target,
// dashboard = params.dashboard,
html, element, url, job_status_chart,
period="month",
job_type="all";
// html = "<div class=\"graph-container\">\n";
html = "<div class=\"row\">\n";
html += "<div id=\"job-status-title\" class=\"h6 col-xs-2 col-sm-3 col-lg-4 text-center\"><b>Job Status</b></div>\n"; // for All Jobs, Past Month
html += "<div class=\"h6 col-xs-5 col-sm-5 col-lg-4\">\n";
html += "<div class=\"dropdown\">\n";
html += "Job Type: <a id=\"type-dropdown\" role=\"button\" data-toggle=\"dropdown\" data-target=\"#\" href=\"/page.html\">\n";
html += "All<span class=\"caret\"></span>\n";
html += " </a>\n";
html += "<ul class=\"dropdown-menu\" role=\"menu\" aria-labelledby=\"type-dropdown\">\n";
html += "<li><a class=\"m\" id=\"all\">All</a></li>\n";
html += "<li><a class=\"m\" id=\"inv_sync\">Inventory Sync</a></li>\n";
html += "<li><a class=\"m\" id=\"scm_update\">SCM Update</a></li>\n";
html += "<li><a class=\"m\" id=\"playbook_run\">Playbook Run</a></li>\n";
html += "</ul>\n";
html += "</div>\n";
html += "</div>\n"; //end of filter div
html += "<div class=\"h6 col-xs-5 col-sm-4 col-lg-4\">\n";
html += "<div class=\"dropdown\">\n";
html += "Period: <a id=\"period-dropdown\" role=\"button\" data-toggle=\"dropdown\" data-target=\"#\" href=\"/page.html\">\n";
html += "Past Month<span class=\"caret\"></span>\n";
html += " </a>\n";
html += "<ul class=\"dropdown-menu\" role=\"menu\" aria-labelledby=\"period-dropdown\">\n";
html += "<li><a class=\"n\" id=\"day\" >Past 24 Hours </a></li>\n";
html += "<li><a class=\"n\" id=\"week\">Past Week</a></li>\n";
html += "<li><a class=\"n\" id=\"month\">Past Month</a></li>\n";
html += "</ul>\n";
html += "</div>\n";
html += "</div>\n"; //end of filter div
html += "</div>\n"; // end of row
html +="<div class=\"row\">\n";
html += "<div class=\"job-status-graph\"><svg></svg></div>\n";
html += "</div>\n";
// html += "</div>\n";
function createGraph(){
url = GetBasePath('dashboard')+'graphs/jobs/?period='+period+'&job_type='+job_type;
Rest.setUrl(url);
Rest.get()
.success(function (data){
scope.$emit('graphDataReady', data);
return job_type, period;
})
.error(function (data, status) {
ProcessErrors(scope, data, status, null, { hdr: 'Error!',
msg: 'Failed to get: ' + url + ' GET returned: ' + status });
});
}
if ($rootScope.removeReloadJobStatusGraph) {
$rootScope.removeReloadJobStatusGraph();
}
$rootScope.removeReloadJobStatusGraph = $rootScope.$on('ReloadJobStatusGraph', function() {
createGraph();
});
element = angular.element(document.getElementById(target));
element.html(html);
$compile(element)(scope);
createGraph();
if (scope.removeResizeJobGraph) {
scope.removeResizeJobGraph();
}
scope.removeResizeJobGraph= scope.$on('ResizeJobGraph', function () {
if($(window).width()<500){
$('.graph-container').height(300);
}
else{
var winHeight = $(window).height(),
available_height = winHeight - $('#main-menu-container .navbar').outerHeight() - $('#count-container').outerHeight() - 120;
$('.graph-container').height(available_height/2);
job_status_chart.update();
}
});
if (scope.removeGraphDataReady) {
scope.removeGraphDataReady();
}
scope.removeGraphDataReady = scope.$on('graphDataReady', function (e, data) {
var timeFormat, graphData = [
{
"color": "#00aa00",
"key": "Successful",
"values": data.jobs.successful
},
{
"key" : "Failed" ,
"color" : "#aa0000",
"values": data.jobs.failed
}
];
if(period==="day"){
timeFormat="%H:%M";
}
else {
timeFormat = '%m/%d';
}
graphData.map(function(series) {
series.values = series.values.map(function(d) {
return {
x: d[0],
y: d[1]
};
});
return series;
});
nv.addGraph({
generate: function() {
var width = $('.graph-container').width(), // nv.utils.windowSize().width/3,
height = $('.graph-container').height()*0.7; //nv.utils.windowSize().height/5,
job_status_chart = nv.models.lineChart()
.margin({top: 5, right: 75, bottom: 80, left: 85}) //Adjust chart margins to give the x-axis some breathing room.
.x(function(d,i) { return i; })
.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
// .width(width)
// .height(height)
;
job_status_chart.xAxis
.axisLabel("Time")//.showMaxMin(true)
.tickFormat(function(d) {
var dx = graphData[0].values[d] && graphData[0].values[d].x || 0;
return dx ? d3.time.format(timeFormat)(new Date(Number(dx+'000'))) : '';
});
job_status_chart.yAxis //Chart y-axis settings
.axisLabel('Jobs')
.tickFormat(d3.format('.f'));
d3.select('.job-status-graph svg')
.datum(graphData).transition()
.attr('width', width)
.attr('height', height)
.duration(1000)
.call(job_status_chart)
.style({
// 'width': width,
// 'height': height,
"font-family": 'Open Sans',
"font-style": "normal",
"font-weight":400,
"src": "url(/static/fonts/OpenSans-Regular.ttf)"
});
// when the Period drop down filter is used, create a new graph based on the
d3.selectAll(".n")
.on("click", function() {
period = this.getAttribute("id");
$('#period-dropdown').replaceWith("<a id=\"period-dropdown\" role=\"button\" data-toggle=\"dropdown\" data-target=\"#\" href=\"/page.html\">"+this.text+"<span class=\"caret\"><span>\n");
createGraph();
});
//On click, update with new data
d3.selectAll(".m")
.on("click", function() {
job_type = this.getAttribute("id");
$('#type-dropdown').replaceWith("<a id=\"type-dropdown\" role=\"button\" data-toggle=\"dropdown\" data-target=\"#\" href=\"/page.html\">"+this.text+"<span class=\"caret\"><span>\n");
createGraph();
});
scope.$emit('WidgetLoaded');
return job_status_chart;
},
});
});
};
}
]);

View File

@@ -11,7 +11,7 @@
*
*/
'use strict';
angular.module('ObjectCountWidget', ['RestServices', 'Utilities'])
.factory('ObjectCount', ['$rootScope', '$compile', 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',

View File

@@ -8,7 +8,7 @@
*
*/
'use strict';
angular.module('PortalJobsWidget', ['RestServices', 'Utilities'])
.factory('PortalJobsWidget', ['$rootScope', '$compile', 'LoadSchedulesScope', 'LoadJobsScope', 'PortalJobsList', 'ScheduledJobsList', 'GetChoices', 'GetBasePath', 'PortalJobTemplateList' ,

View File

@@ -10,7 +10,7 @@
* Dashboard widget showing object counts and license availability.
*
*/
'use strict';
angular.module('SCMSyncStatusWidget', ['RestServices', 'Utilities'])
.factory('SCMSyncStatus', ['$rootScope', '$compile',

View File

@@ -11,7 +11,7 @@
*
*/
'use strict';
angular.module('StreamWidget', ['RestServices', 'Utilities', 'StreamListDefinition', 'SearchHelper', 'PaginationHelpers',
'RefreshHelper', 'ListGenerator', 'StreamWidget', 'AuthService',
@@ -531,4 +531,4 @@ angular.module('StreamWidget', ['RestServices', 'Utilities', 'StreamListDefiniti
scope.search(list.iterator);
};
}
]);
]);