shaba/awx
1
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2024-11-01 16:51:11 +03:00
Code Releases Activity

Job detail page refactor

Browse Source 
Reconnected scroll bar bits mostly.
This commit is contained in:
Chris Houseknecht 2014-06-20 02:00:15 -04:00
parent ff1cce8509
commit a024de5702
2 changed files with 71 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
awx/ui/static/js/controllers/JobDetail.js
View File

@ -25,10 +25,10 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
scope.tasks = [];
scope.hostResults = [];
scope.hostResultsMaxRows = 25;
scope.hostSummariesMaxRows = 25;
scope.tasksMaxRows = 25;
scope.playsMaxRows = 25;
scope.hostResultsMaxRows = 15;
scope.hostSummariesMaxRows = 15;
scope.tasksMaxRows = 15;
scope.playsMaxRows = 15;
scope.search_all_tasks = [];
scope.search_all_plays = [];
@ -107,6 +107,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
});
}
UpdateDOM({ scope: scope });
DrawGraph({ scope: scope, resize: false });
})
.error(function(data, status) {
ProcessErrors(scope, data, status, null, { hdr: 'Error!',
@ -261,11 +262,12 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
hostResults: {}
};
SetTaskStyles({
scope: scope,
task_id: event.id
task: play.tasks[event.id]
});
});
scope.jobData.plays[scope.activePlay].tasks[scope.activeTask].taskActiveClass = 'active';
if (scope.activeTask) {
scope.jobData.plays[scope.activePlay].tasks[scope.activeTask].taskActiveClass = 'active';
}
scope.$emit('LoadHosts');
})
.error(function(data) {
@ -640,21 +642,6 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
return true;
};
function rebuildHostResultsMap() {
scope.hostResultsMap = {};
scope.hostResults.forEach(function(result, idx) {
scope.hostResultsMap[result.id] = idx;
});
}
function rebuildTasksMap() {
scope.tasksMap = {};
scope.tasks.forEach(function(task, idx) {
scope.tasksMap[task.id] = idx;
});
}
scope.HostDetailOnTotalScroll = _.debounce(function() {
// Called when user scrolls down (or forward in time)
var url, mcs = arguments[0];
@ -664,7 +651,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
url = GetBasePath('jobs') + job_id + '/job_events/?parent=' + scope.activeTask + '&';
url += (scope.search_all_hosts_name) ? 'host__name__icontains=' + scope.search_all_hosts_name + '&' : '';
url += (scope.searchAllStatus === 'failed') ? 'failed=true&' : '';
url += 'host__name__gt=' + scope.hostResults[scope.hostResults.length - 1].name + '&host__isnull=false&page_size=' + scope.hostTableRows + '&order_by=host__name';
url += 'host__name__gt=' + scope.hostResults[scope.hostResults.length - 1].name + '&host__isnull=false&page_size=' + scope.hostResultsMaxRows + '&order_by=host__name';
Wait('start');
Rest.setUrl(url);
Rest.get()
@ -679,7 +666,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
created: row.created,
msg: ( (row.event_data && row.event_data.res) ? row.event_data.res.msg : '' )
});
if (scope.hostResults.length > scope.hostTableRows) {
if (scope.hostResults.length > scope.hostResultsMaxRows) {
scope.hostResults.shift();
}
});
@ -688,7 +675,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
setTimeout(function() { $('#hosts-table-detail .mCSB_dragger').css({ top: (mcs.draggerTop - 15) + 'px'}); }, 700);
}
scope.auto_scroll = false;
rebuildHostResultsMap();
//rebuildHostResultsMap();
Wait('stop');
})
.error(function(data, status) {
@ -711,7 +698,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
url = GetBasePath('jobs') + job_id + '/job_events/?parent=' + scope.activeTask + '&';
url += (scope.search_all_hosts_name) ? 'host__name__icontains=' + scope.search_all_hosts_name + '&' : '';
url += (scope.searchAllStatus === 'failed') ? 'failed=true&' : '';
url += 'host__name__lt=' + scope.hostResults[0].name + '&host__isnull=false&page_size=' + scope.hostTableRows + '&order_by=-host__name';
url += 'host__name__lt=' + scope.hostResults[0].name + '&host__isnull=false&page_size=' + scope.hostResultsMaxRows + '&order_by=-host__name';
Wait('start');
Rest.setUrl(url);
Rest.get()
@ -726,7 +713,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
created: row.created,
msg: ( (row.event_data && row.event_data.res) ? row.event_data.res.msg : '' )
});
if (scope.hostResults.length > scope.hostTableRows) {
if (scope.hostResults.length > scope.hostResultsMaxRows) {
scope.hostResults.pop();
}
});
@ -734,7 +721,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
// there are more rows. move dragger down, letting user know.
setTimeout(function() { $('#hosts-table-detail .mCSB_dragger').css({ top: (mcs.draggerTop + 15) + 'px' }); }, 700);
}
rebuildHostResultsMap();
//rebuildHostResultsMap();
Wait('stop');
scope.auto_scroll = false;
})
@ -749,6 +736,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
});
}, 300);
scope.TasksOnTotalScroll = _.debounce(function() {
// Called when user scrolls down (or forward in time)
var url, mcs = arguments[0];
@ -771,7 +759,13 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
}
else {
// no next event (task), get the end time of the play
end = scope.plays[scope.playsMap[scope.activePlay]].finished;
scope.plays.every(function(p, j) {
if (p.id === scope.activePlay) {
end = scope.plays[j].finished;
return false;
}
return true;
});
}
if (end) {
elapsed = GetElapsed({
@ -799,10 +793,8 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
skippedCount: event.skipped_count,
taskActiveClass: ''
});
scope.tasksMap[event.id] = scope.tasks.length - 1;
SetTaskStyles({
scope: scope,
task_id: event.id
task: scope.tasks[scope.tasks.length - 1]
});
if (scope.tasks.length > scope.tasksMaxRows) {
scope.tasks.shift();
@ -813,7 +805,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
setTimeout(function() { $('#tasks-table-detail .mCSB_dragger').css({ top: (mcs.draggerTop - 15) + 'px'}); }, 700);
}
scope.auto_scroll = false;
rebuildTasksMap();
//rebuildTasksMap();
Wait('stop');
})
.error(function(data, status) {
@ -849,7 +841,13 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
}
else {
// no next event (task), get the end time of the play
end = scope.plays[scope.playsMap[scope.activePlay]].finished;
scope.plays.every(function(p, j) {
if (p.id === scope.activePlay) {
end = scope.plays[j].finished;
return false;
}
return true;
});
}
if (end) {
elapsed = GetElapsed({
@ -877,10 +875,8 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
skippedCount: event.skipped_count,
taskActiveClass: ''
});
scope.tasksMap[event.id] = scope.tasks.length - 1;
SetTaskStyles({
scope: scope,
task_id: event.id
task: scope.tasks[0]
});
if (scope.tasks.length > scope.tasksMaxRows) {
scope.tasks.pop();
@ -891,7 +887,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
setTimeout(function() { $('#tasks-table-detail .mCSB_dragger').css({ top: (mcs.draggerTop + 15) + 'px'}); }, 700);
}
scope.auto_scroll = false;
rebuildTasksMap();
//rebuildTasksMap();
Wait('stop');
})
.error(function(data, status) {
@ -911,7 +907,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
url = GetBasePath('jobs') + job_id + '/job_host_summaries/?';
url += (scope.search_all_hosts_name) ? 'host__name__icontains=' + scope.search_all_hosts_name + '&' : '';
url += (scope.searchAllStatus === 'failed') ? 'failed=true&' : '';
url += 'host__name__gt=' + scope.hosts[scope.hosts.length - 1].name + '&page_size=' + scope.hostSummaryTableRows + '&order_by=host__name';
url += 'host__name__gt=' + scope.hosts[scope.hosts.length - 1].name + '&page_size=' + scope.hostSummariesMaxRows + '&order_by=host__name';
Wait('start');
Rest.setUrl(url);
Rest.get()
@ -927,7 +923,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
unreachable: row.dark,
failed: row.failures
});
if (scope.hosts.length > scope.hostSummaryTableRows) {
if (scope.hosts.length > scope.hostSummariesMaxRows) {
scope.hosts.shift();
}
});
@ -955,7 +951,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
url = GetBasePath('jobs') + job_id + '/job_host_summaries/?';
url += (scope.search_all_hosts_name) ? 'host__name__icontains=' + scope.search_all_hosts_name + '&' : '';
url += (scope.searchAllStatus === 'failed') ? 'failed=true&' : '';
url += 'host__name__lt=' + scope.hosts[0].name + '&page_size=' + scope.hostSummaryTableRows + '&order_by=-host__name';
url += 'host__name__lt=' + scope.hosts[0].name + '&page_size=' + scope.hostSummariesMaxRows + '&order_by=-host__name';
Wait('start');
Rest.setUrl(url);
Rest.get()
@ -971,7 +967,7 @@ function JobDetailController ($rootScope, $scope, $compile, $routeParams, $log,
unreachable: row.dark,
failed: row.failures
});
if (scope.hosts.length > scope.hostSummaryTableRows) {
if (scope.hosts.length > scope.hostSummariesMaxRows) {
scope.hosts.pop();
}
});

57
awx/ui/static/js/helpers/JobDetail.js
View File

@ -493,8 +493,7 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
task.successfulCount += (status === 'successful') ? 1 : 0;
task.skippedCount += (status === 'skipped') ? 1 : 0;
SetTaskStyles({
scope: scope,
task_id: task_id
task: task
});
}
};
@ -502,11 +501,11 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
.factory('SetTaskStyles', [ function() {
return function(params) {
var task_id = params.task_id,
scope = params.scope,
diff, task;
var task = params.task,
diff;
task = scope.jobData.plays[scope.activePlay].tasks[task_id];
//task = scope.jobData.plays[scope.activePlay].tasks[task_id];
task.hostCount = task.failedCount + task.changedCount + task.skippedCount + task.successfulCount;
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;
@ -942,15 +941,22 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
var scope = params.scope,
idx = 0,
result = [],
newKeys = [],
keys = Object.keys(scope.jobData.plays);
keys.sort();
while (idx < keys.length && idx < scope.playsMaxRows) {
result.push(scope.jobData.plays[keys[idx]]);
keys.reverse();
for (idx=0; idx < scope.playsMaxRows && idx < keys.length; idx++) {
newKeys.push(keys[idx]);
}
newKeys.sort();
idx = 0;
while (idx < newKeys.length) {
result.push(scope.jobData.plays[newKeys[idx]]);
idx++;
}
setTimeout(function() {
scope.$apply(function() { scope.plays = result; });
});
scope.plays = result;
scope.$emit('FixPlaysScroll');
};
}])
@ -958,23 +964,25 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
return function(params) {
var scope = params.scope,
result = [],
idx = 0,
keys;
idx, keys, newKeys;
if (scope.activePlay) {
keys = Object.keys(scope.jobData.plays[scope.activePlay].tasks);
keys.reverse();
if (keys.length > scope.tasksMaxRows + 1) {
keys.splice(0, keys.length - (scope.taskMaxRows + 1));
newKeys = [];
for (idx=0; idx < scope.tasksMaxRows && idx < keys.length; idx++) {
newKeys.push(keys[idx]);
}
keys.sort();
while (idx < keys.length && idx < scope.tasksMaxRows) {
result.push(scope.jobData.plays[scope.activePlay].tasks[keys[idx]]);
newKeys.sort();
idx = 0;
while (idx < newKeys.length) {
result.push(scope.jobData.plays[scope.activePlay].tasks[newKeys[idx]]);
idx++;
}
}
setTimeout(function() {
scope.$apply(function() { scope.tasks = result; });
});
scope.tasks = result;
scope.$emit('FixTasksScroll');
};
}])
@ -1005,16 +1013,17 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
}
}
scope.hostResults = result;
scope.$emit('FixHostResultsScroll');
};
}])
.factory('UpdateDOM', ['DrawPlays', 'DrawTasks', 'DrawHostResults', 'DrawGraph', function(DrawPlays, DrawTasks, DrawHostResults, DrawGraph) {
.factory('UpdateDOM', ['DrawPlays', 'DrawTasks', 'DrawHostResults', function(DrawPlays, DrawTasks, DrawHostResults) {
return function(params) {
var scope = params.scope;
DrawPlays({ scope: scope });
DrawTasks({ scope: scope });
// DrawHostResults({ scope: scope });
DrawHostResults({ scope: scope });
//if (scope.host_summary.total > 0) {
// DrawGraph({ scope: scope, resize: true });