From c297342ba05326e439b1631f1c99248a0b2c5d3c Mon Sep 17 00:00:00 2001 From: Chris Houseknecht Date: Fri, 13 Jun 2014 14:30:42 -0400 Subject: [PATCH] Job detail page refactor Latest changes. Things are still broken thought. Task status not working correctly or at all, and hosts results are not showing up. --- awx/ui/static/js/controllers/JobDetail.js | 27 ++++-- awx/ui/static/js/helpers/JobDetail.js | 106 +++++++++++----------- awx/ui/static/partials/job_detail.html | 6 +- 3 files changed, 73 insertions(+), 66 deletions(-) diff --git a/awx/ui/static/js/controllers/JobDetail.js b/awx/ui/static/js/controllers/JobDetail.js index 42a324ea21..c4bd10d4fd 100644 --- a/awx/ui/static/js/controllers/JobDetail.js +++ b/awx/ui/static/js/controllers/JobDetail.js @@ -61,6 +61,7 @@ function JobDetailController ($scope, $compile, $routeParams, $log, ClearScope, event_socket.on("job_events-" + job_id, function(data) { if (api_complete && data.id > lastEventId) { // api loading is complete, process incoming events + data.event = data.event_name; DigestEvents({ scope: scope, events: [ data ] @@ -77,7 +78,7 @@ function JobDetailController ($scope, $compile, $routeParams, $log, ClearScope, } scope.removeAPIComplete = scope.$on('APIComplete', function() { // process any events sitting in the queue - var events = [], url; + var events = [], url, hostId = 0, taskId = 0, playId = 0; function notEmpty(x) { return Object.keys(x).length > 0; @@ -91,14 +92,15 @@ function JobDetailController ($scope, $compile, $routeParams, $log, ClearScope, // Find the max event.id value in memory if (notEmpty(scope.hostResults)) { - lastEventId = getMaxId(scope.hostResults); + hostId = getMaxId(scope.hostResults); } else if (notEmpty(scope.tasks)) { - lastEventId = getMaxId(scope.tasks); + taskId = getMaxId(scope.tasks); } else if (notEmpty(scope.plays)) { - lastEventId = getMaxId(scope.plays); + playId = getMaxId(scope.plays); } + lastEventId = Math.max(hostId, taskId, playId); // Only process queued events > the max event in memory if (event_queue.length > 0) { @@ -117,7 +119,7 @@ function JobDetailController ($scope, $compile, $routeParams, $log, ClearScope, api_complete = true; // Draw the graph - if (scope.job.status === 'successful' && scope.job.status === 'failed' && scope.job.status === 'error') { + if (scope.job.status === 'successful' || scope.job.status === 'failed' || scope.job.status === 'error') { // The job has already completed. graph values found on playbook stats url = scope.job.related.job_events + '?event=playbook_on_stats'; Rest.setUrl(url); @@ -212,11 +214,12 @@ function JobDetailController ($scope, $compile, $routeParams, $log, ClearScope, elapsed: elapsed, playActiveClass: '' }; - scope.host_summary.total += data.total; - scope.host_summary.ok += data.ok; - scope.host_summary.changed += data.changed; - scope.host_summary.unreachable += data.unreachable; - scope.host_summary.failed += data.failed; + scope.host_summary.ok += data.ok_count; + scope.host_summary.changed += data.changed_count; + scope.host_summary.unreachable += (data.unreachable_count) ? data.unreachable_count : 0; + scope.host_summary.failed += data.failed_count; + scope.host_summary.total = scope.host_summary.ok + scope.host_summary.changed + + scope.host_summary.unreachable + scope.host_summary.failed; }); scope.$emit('PlaysReady', events_url); @@ -462,6 +465,10 @@ function JobDetailController ($scope, $compile, $routeParams, $log, ClearScope, } }; + scope.objectIsEmpty = function(obj) { + return (Object.keys(obj).length > 0) ? false : true; + }; + scope.HostDetailOnTotalScroll = _.debounce(function() { // Called when user scrolls down (or forward in time). Using _.debounce var url, mcs = arguments[0]; diff --git a/awx/ui/static/js/helpers/JobDetail.js b/awx/ui/static/js/helpers/JobDetail.js index 09a5522dd3..c5c22ffc44 100644 --- a/awx/ui/static/js/helpers/JobDetail.js +++ b/awx/ui/static/js/helpers/JobDetail.js @@ -50,7 +50,6 @@ function(UpdatePlayStatus, UpdateHostStatus, AddHostResult, SelectPlay, SelectTa events.forEach(function(event) { var hostCount; - if (event.event === 'playbook_on_start') { if (scope.job_status.status!== 'failed' && scope.job_status.status !== 'canceled' && scope.job_status.status !== 'error' && scope.job_status !== 'successful') { @@ -125,6 +124,7 @@ function(UpdatePlayStatus, UpdateHostStatus, AddHostResult, SelectPlay, SelectTa scope: scope, play_id: event.parent }); + scope.tasks[event.id] = { id: event.id, name: event.task, @@ -258,10 +258,7 @@ function(UpdatePlayStatus, UpdateHostStatus, AddHostResult, SelectPlay, SelectTa var scope = params.scope, taskIds; taskIds = Object.keys(scope.tasks); - if (taskIds.length > 0) { - return scope.tasks[taskIds.length - 1].id; - } - return null; + return (taskIds.length > 0) ? taskIds[0] : null; }; }) @@ -329,24 +326,27 @@ function(UpdatePlayStatus, UpdateHostStatus, AddHostResult, SelectPlay, SelectTa status_text = params.status_text, play = scope.plays[id]; - if (failed) { - scope.plays[id].status = 'failed'; - } - else if (play.status !== 'changed' && play.status !== 'failed') { - // once the status becomes 'changed' or 'failed' don't modify it - if (no_hosts) { - scope.plays[id].status = 'no-matching-hosts'; + if (scope.plays[id]) { + if (failed) { + scope.plays[id].status = 'failed'; } - else { - scope.plays[id].status = (changed) ? 'changed' : (failed) ? 'failed' : 'successful'; + else if (play.status !== 'changed' && play.status !== 'failed') { + // once the status becomes 'changed' or 'failed' don't modify it + if (no_hosts) { + scope.plays[id].status = 'no-matching-hosts'; + } + else { + scope.plays[id].status = (changed) ? 'changed' : (failed) ? 'failed' : 'successful'; + } } + scope.plays[id].finished = modified; + scope.plays[id].elapsed = GetElapsed({ + start: play.created, + end: modified + }); + scope.plays[id].status_text = (status_text) ? status_text : scope.plays[id].status; } - scope.plays[id].finished = modified; - scope.plays[id].elapsed = GetElapsed({ - start: play.created, - end: modified - }); - scope.plays[id].status_text = (status_text) ? status_text : scope.plays[id].status; + UpdateJobStatus({ scope: scope, failed: null, @@ -363,30 +363,34 @@ function(UpdatePlayStatus, UpdateHostStatus, AddHostResult, SelectPlay, SelectTa id = params.task_id, modified = params.modified, no_hosts = params.no_hosts, - task = scope.tasks[scope.activePlay][id]; - if (no_hosts){ - task.status = 'no-matching-hosts'; + task = scope.tasks[id]; + + if (scope.tasks[id]) { + if (no_hosts){ + task.status = 'no-matching-hosts'; + } + else if (failed) { + task.status = 'failed'; + } + else if (task.status !== 'changed' && task.status !== 'failed') { + // once the status becomes 'changed' or 'failed' don't modify it + task.status = (failed) ? 'failed' : (changed) ? 'changed' : 'successful'; + } + task.finished = params.modified; + task.elapsed = GetElapsed({ + start: task.created, + end: modified + }); + + UpdatePlayStatus({ + scope: scope, + failed: failed, + changed: changed, + play_id: task.play_id, + modified: modified, + no_hosts: no_hosts + }); } - else if (failed) { - task.status = 'failed'; - } - else if (task.status !== 'changed' && task.status !== 'failed') { - // once the status becomes 'changed' or 'failed' don't modify it - task.status = (failed) ? 'failed' : (changed) ? 'changed' : 'successful'; - } - task.finished = params.modified; - task.elapsed = GetElapsed({ - start: task.created, - end: modified - }); - UpdatePlayStatus({ - scope: scope, - failed: failed, - changed: changed, - play_id: task.play_id, - modified: modified, - no_hosts: no_hosts - }); }; }]) @@ -419,6 +423,7 @@ function(UpdatePlayStatus, UpdateHostStatus, AddHostResult, SelectPlay, SelectTa scope.host_summary.changed += (status === 'changed') ? 1 : 0; scope.host_summary.unreachable += (status === 'unreachable') ? 1 : 0; scope.host_summary.failed += (status === 'failed') ? 1 : 0; + scope.hosts.push({ id: host_id, name: name, @@ -446,10 +451,6 @@ function(UpdatePlayStatus, UpdateHostStatus, AddHostResult, SelectPlay, SelectTa scope.hostsMap[host.id] = idx; }); $('#tasks-table-detail').mCustomScrollbar("update"); - /*setTimeout( function() { - scope.auto_scroll = true; - $('#hosts-summary-table').mCustomScrollbar("scrollTo", "bottom"); - }, 700);*/ } UpdateTaskStatus({ @@ -526,14 +527,14 @@ function(UpdatePlayStatus, UpdateHostStatus, AddHostResult, SelectPlay, SelectTa scope: scope, play_id: play_id }); - - task.hostCount += 1; - task.reportedHosts++; + if (task.id === first) { + task.hostCount += 1; + } + task.reportedHosts += 1; task.failedCount += (status === 'failed' || status === 'unreachable') ? 1 : 0; task.changedCount += (status === 'changed') ? 1 : 0; task.successfulCount += (status === 'successful') ? 1 : 0; task.skippedCount += (status === 'skipped') ? 1 : 0; - SetTaskStyles({ task: task }); } }; @@ -543,7 +544,6 @@ function(UpdatePlayStatus, UpdateHostStatus, AddHostResult, SelectPlay, SelectTa return function(params) { var task = params.task, diff; - task.failedPct = (task.hostCount > 0) ? Math.ceil((100 * (task.failedCount / task.hostCount))) : 0; task.changedPct = (task.hostCount > 0) ? Math.ceil((100 * (task.changedCount / task.hostCount))) : 0; task.skippedPct = (task.hostCount > 0) ? Math.ceil((100 * (task.skippedCount / task.hostCount))) : 0; @@ -637,7 +637,7 @@ function(UpdatePlayStatus, UpdateHostStatus, AddHostResult, SelectPlay, SelectTa scope.tasks[event.id] = { id: event.id, - play_id: event.id, + play_id: scope.activePlay, name: event.name, status: ( (event.failed) ? 'failed' : (event.changed) ? 'changed' : 'successful' ), created: event.created, diff --git a/awx/ui/static/partials/job_detail.html b/awx/ui/static/partials/job_detail.html index ae3305ca41..739cea2894 100644 --- a/awx/ui/static/partials/job_detail.html +++ b/awx/ui/static/partials/job_detail.html @@ -100,7 +100,7 @@
{{ task.successfulCount }}
{{ task.changedCount }}
{{ task.skippedCount }}
{{ task.failedCount }}
No matching hosts
-
+
No tasks matched
@@ -120,7 +120,7 @@
-
+
{{ result.name }} @@ -129,7 +129,7 @@ {{ result.msg }}
-
+
No hosts matched