External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-03-01 00:38:45 -03:30
Code Issues Packages Projects Releases Wiki Activity

fixed pie chart formatting and added text for empty pie chart

Browse Source
This commit is contained in:
Jared Tabor
2014-07-14 17:14:02 -04:00
parent f56a8c16b0
commit 3ced24655a
4 changed files with 27 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -74,36 +74,36 @@ function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, Dashb
$scope.removeDashboardReady = $scope.$on('dashboardReady', function (e, data) { $scope.removeDashboardReady = $scope.$on('dashboardReady', function (e, data) {
DashboardCounts({ DashboardCounts({
scope: $scope, scope: $scope,
target: 'container1', target: 'dash-counts',
dashboard: data dashboard: data
}); });
JobStatusGraph({ JobStatusGraph({
scope: $scope, scope: $scope,
target: 'container2', target: 'dash-job-status-graph',
dashboard: data dashboard: data
}); });
if ($rootScope.user_is_superuser === true) { if ($rootScope.user_is_superuser === true) {
HostGraph({ HostGraph({
scope: $scope, scope: $scope,
target: 'container3', target: 'dash-host-count-graph',
dashboard: data dashboard: data
}); });
} }
else{ else{
$('#container4').replaceWith("<div id='container4' class='left-side col-sm-12 col-xs-12'></div>"); $('#dash-host-count-graph').replaceWith("<div id='dash-host-count-graph' class='left-side col-sm-12 col-xs-12'></div>");
} }
DashboardJobs({ DashboardJobs({
scope: $scope, scope: $scope,
target: 'container4', target: 'dash-jobs-list',
dashboard: data dashboard: data
}); });
HostPieChart({ HostPieChart({
scope: $scope, scope: $scope,
target: 'container5', target: 'dash-host-status-graph',
dashboard: data dashboard: data
}); });

3
awx/ui/static/js/controllers/Jobs.js
View File

@@ -24,6 +24,7 @@ function JobsListController ($log, $scope, $compile, $routeParams, ClearScope, B
expecting = 0, expecting = 0,
max_rows; max_rows;
event_socket = Socket({ event_socket = Socket({
scope: $scope, scope: $scope,
endpoint: "jobs" endpoint: "jobs"
@@ -274,7 +275,7 @@ function JobsListController ($log, $scope, $compile, $routeParams, ClearScope, B
} }
JobsListController.$inject = [ '$log', '$scope', '$compile', '$routeParams', 'ClearScope', 'Breadcrumbs', 'LoadBreadCrumbs', 'LoadSchedulesScope', 'LoadJobsScope', 'RunningJobsList', 'CompletedJobsList', JobsListController.$inject = [ '$log', '$scope', '$compile', '$routeParams', 'ClearScope', 'Breadcrumbs', 'LoadBreadCrumbs', 'LoadSchedulesScope', 'LoadJobsScope', 'RunningJobsList', 'CompletedJobsList',
'QueuedJobsList', 'ScheduledJobsList', 'GetChoices', 'GetBasePath', 'Wait', 'Socket' ]; 'QueuedJobsList', 'ScheduledJobsList', 'GetChoices', 'GetBasePath', 'Wait', 'Socket'];
function JobsEdit($scope, $rootScope, $compile, $location, $log, $routeParams, JobForm, JobTemplateForm, GenerateForm, Rest, function JobsEdit($scope, $rootScope, $compile, $location, $log, $routeParams, JobForm, JobTemplateForm, GenerateForm, Rest,
Alert, ProcessErrors, LoadBreadCrumbs, RelatedSearchInit, RelatedPaginateInit, ReturnToCaller, ClearScope, InventoryList, Alert, ProcessErrors, LoadBreadCrumbs, RelatedSearchInit, RelatedPaginateInit, ReturnToCaller, ClearScope, InventoryList,

19
awx/ui/static/js/widgets/HostPieChart.js
View File

@@ -62,6 +62,10 @@ angular.module('HostPieChartWidget', ['RestServices', 'Utilities'])
.x(function(d) { return d.label; }) .x(function(d) { return d.label; })
.y(function(d) { return d.value; }) .y(function(d) { return d.value; })
.showLabels(true) .showLabels(true)
.labelThreshold(0.01)
.tooltipContent(function(x, y) {
return '<b>'+x+'</b>'+ '<p>' + Math.floor(y) + ' hosts ' + '</p>';
})
.color(['#00aa00', '#aa0000']); .color(['#00aa00', '#aa0000']);
chart.pie.pieLabelsOutside(true).labelType("percent"); chart.pie.pieLabelsOutside(true).labelType("percent");
@@ -71,7 +75,13 @@ angular.module('HostPieChartWidget', ['RestServices', 'Utilities'])
.attr('width', width) .attr('width', width)
.attr('height', height) .attr('height', height)
.transition().duration(350) .transition().duration(350)
.call(chart); .call(chart)
.style({
"font-family": 'Open Sans',
"font-style": "normal",
"font-weight":400,
"src": "url(/static/fonts/OpenSans-Regular.ttf)"
});
nv.utils.windowResize(chart.update); nv.utils.windowResize(chart.update);
scope.$emit('WidgetLoaded'); scope.$emit('WidgetLoaded');
return chart; return chart;
@@ -86,13 +96,12 @@ angular.module('HostPieChartWidget', ['RestServices', 'Utilities'])
canvas = document.getElementById("circlecanvas"); canvas = document.getElementById("circlecanvas");
context = canvas.getContext("2d"); context = canvas.getContext("2d");
context.arc(50, 50, 50, 0, Math.PI * 2, false); context.arc(50, 50, 50, 0, Math.PI * 2, false);
//context.beginPath();
context.globalAlpha = 0.4;
context.fillStyle = '#A9A9A9';
context.fill();
context.lineWidth = 1; context.lineWidth = 1;
context.strokeStyle = '#1778c3'; context.strokeStyle = '#1778c3';
context.stroke(); context.stroke();
context.font = "12px Open Sans";
context.fillText("No Host data",10,50);
scope.$emit('WidgetLoaded'); scope.$emit('WidgetLoaded');
} }
}; };

10
awx/ui/static/partials/home.html
View File

@@ -9,15 +9,15 @@
--> -->
<div class="row"> <div class="row">
<div id="container1" class="col-sm-12 col-xs-12"></div> <div id="dash-counts" class="col-sm-12 col-xs-12"></div>
</div> </div>
<div class="row"> <div class="row">
<div id="container2" class="left-side col-sm-6 col-xs-12"></div> <div id="dash-job-status-graph" class="left-side col-sm-6 col-xs-12"></div>
<div id="container5" class="right-side col-sm-6 col-xs-12"></div> <div id="dash-host-status-graph" class="right-side col-sm-6 col-xs-12"></div>
</div> </div>
<div class="row"> <div class="row">
<div id="container4" class="left-side col-sm-6 col-xs-12"></div> <div id="dash-jobs-list" class="left-side col-sm-6 col-xs-12"></div>
<div id="container3" class="right-side col-sm-6 col-xs-12"></div> <div id="dash-host-count-graph" class="right-side col-sm-6 col-xs-12"></div>
</div> </div>
</div> </div>
</div> </div>