From b743ec2783416706e81a840a1b89790531ba8bff Mon Sep 17 00:00:00 2001
From: Chris Houseknecht <chouse@ansible.com>
Date: Tue, 15 Jul 2014 18:17:04 -0400
Subject: [PATCH] Job detail page refactoration Added scope.$apply to each
 drawing function in hopes of stopping the blockage or pause that seems to
 occur on page refresh. Seems to be working. Added ability to pause live event
 processing by clicking a play or task. Now just need a way to restart it.

---
 awx/ui/static/js/controllers/JobDetail.js | 41 ++++++++---------
 awx/ui/static/js/helpers/JobDetail.js     | 55 ++++++++++++++++-------
 2 files changed, 59 insertions(+), 37 deletions(-)

diff --git a/awx/ui/static/js/controllers/JobDetail.js b/awx/ui/static/js/controllers/JobDetail.js
index e7f5d962a3..b145692500 100644
--- a/awx/ui/static/js/controllers/JobDetail.js
+++ b/awx/ui/static/js/controllers/JobDetail.js
@@ -32,6 +32,7 @@ function JobDetailController ($location, $rootScope, $scope, $compile, $routePar
     scope.playsMaxRows = 200;
 
     scope.liveEventProcessing = true;  // control play/pause state of event processing
+    scope.pauseLiveEvents = false;
 
     scope.job_status = {};
     scope.job_id = job_id;
@@ -653,23 +654,23 @@ function JobDetailController ($location, $rootScope, $scope, $compile, $routePar
     }, 500));
 
     scope.selectPlay = function(id) {
-        if (!scope.liveEventProcessing) {
-            scope.auto_scroll_plays = false;
-            SelectPlay({
-                scope: scope,
-                id: id
-            });
+        if (scope.liveEventProcessing) {
+            scope.pauseLiveEvents = true;
         }
+        SelectPlay({
+            scope: scope,
+            id: id
+        });
     };
 
     scope.selectTask = function(id) {
-        if (!scope.liveEventProcessing) {
-            scope.auto_scroll_tasks = false;
-            SelectTask({
-                scope: scope,
-                id: id
-            });
+        if (scope.liveEventProcessing) {
+            scope.pauseLiveEvents = true;
         }
+        SelectTask({
+            scope: scope,
+            id: id
+        });
     };
 
     scope.toggleSummary = function(hide) {
@@ -893,7 +894,7 @@ function JobDetailController ($location, $rootScope, $scope, $compile, $routePar
 
     scope.playsScrollDown = function() {
         // check for more plays when user scrolls to bottom of play list...
-        if ((!scope.liveEventProcessing) && scope.next_plays) {
+        if (((!scope.liveEventProcessing) || (scope.liveEventProcessing && scope.pauseLiveEvents)) && scope.next_plays) {
             $('#playsMoreRows').fadeIn();
             Rest.setUrl(scope.next_plays);
             Rest.get()
@@ -950,14 +951,14 @@ function JobDetailController ($location, $rootScope, $scope, $compile, $routePar
                 })
                 .error( function(data, status) {
                     ProcessErrors(scope, data, status, null, { hdr: 'Error!',
-                        msg: 'Call to ' + url + '. GET returned: ' + status });
+                        msg: 'Call to ' + scope.next_plays + '. GET returned: ' + status });
                 });
         }
     };
 
     scope.tasksScrollDown = function() {
         // check for more tasks when user scrolls to bottom of task list...
-        if ((!scope.liveEventProcessing) && scope.next_tasks) {
+        if (((!scope.liveEventProcessing) || (scope.liveEventProcessing && scope.pauseLiveEvents)) && scope.next_tasks) {
             $('#tasksMoreRows').fadeIn();
             Rest.setUrl(scope.next_tasks);
             Rest.get()
@@ -1020,14 +1021,14 @@ function JobDetailController ($location, $rootScope, $scope, $compile, $routePar
                 .error(function(data, status) {
                     $('#tasksMoreRows').fadeOut(400);
                     ProcessErrors(scope, data, status, null, { hdr: 'Error!',
-                        msg: 'Call to ' + url + '. GET returned: ' + status });
+                        msg: 'Call to ' + scope.next_tasks + '. GET returned: ' + status });
                 });
         }
     };
 
     scope.hostResultsScrollDown = function() {
         // check for more hosts when user scrolls to bottom of host results list...
-        if (!scope.liveEventProcessing && scope.next_host_results) {
+        if (((!scope.liveEventProcessing) || (scope.liveEventProcessing && scope.pauseLiveEvents)) && scope.next_host_results) {
             $('#hostResultsMoreRows').fadeIn();
             Rest.setUrl(scope.next_host_results);
             Rest.get()
@@ -1083,14 +1084,14 @@ function JobDetailController ($location, $rootScope, $scope, $compile, $routePar
                 .error(function(data, status) {
                     $('#hostResultsMoreRows').fadeOut(400);
                     ProcessErrors(scope, data, status, null, { hdr: 'Error!',
-                        msg: 'Call to ' + url + '. GET returned: ' + status });
+                        msg: 'Call to ' + scope.next_host_results + '. GET returned: ' + status });
                 });
         }
     };
 
     scope.hostSummariesScrollDown = function() {
         // check for more hosts when user scrolls to bottom of host summaries list...
-        if ((!scope.liveEventProcessing) && scope.next_host_summaries) {
+        if (((!scope.liveEventProcessing) || (scope.liveEventProcessing && scope.pauseLiveEvents)) && scope.next_host_summaries) {
             Rest.setUrl(scope.next_host_summaries);
             Rest.get()
                 .success(function(data) {
@@ -1117,7 +1118,7 @@ function JobDetailController ($location, $rootScope, $scope, $compile, $routePar
                 .error(function(data, status) {
                     $('#hostSummariesMoreRows').fadeOut();
                     ProcessErrors(scope, data, status, null, { hdr: 'Error!',
-                        msg: 'Call to ' + url + '. GET returned: ' + status });
+                        msg: 'Call to ' + scope.next_host_summaries + '. GET returned: ' + status });
                 });
         }
     };
diff --git a/awx/ui/static/js/helpers/JobDetail.js b/awx/ui/static/js/helpers/JobDetail.js
index d3cc166d03..c77b1b25bd 100644
--- a/awx/ui/static/js/helpers/JobDetail.js
+++ b/awx/ui/static/js/helpers/JobDetail.js
@@ -1142,7 +1142,6 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
                 filteredListX[key] = plays[key];
             }
         }
-
         if (scope.search_play_name) {
             for (key in plays) {
                 if (filteredListX[key].name.indexOf(scope.search_play_name) > 0) {
@@ -1176,10 +1175,14 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
             result.push(filteredListB[newKeys[idx]]);
             idx++;
         }
-        scope.plays = result;
-        if (scope.liveEventProcessing) {
-            $('#plays-table-detail').scrollTop($('#plays-table-detail').prop("scrollHeight"));
-        }
+        setTimeout( function() {
+            scope.$apply( function() {
+                scope.plays = result;
+                if (scope.liveEventProcessing) {
+                    $('#plays-table-detail').scrollTop($('#plays-table-detail').prop("scrollHeight"));
+                }
+            });
+        });
     };
 }])
 
@@ -1247,10 +1250,15 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
             }
         }
 
-        scope.tasks = result;
-        if (scope.liveEventProcessing) {
-            $('#tasks-table-detail').scrollTop($('#tasks-table-detail').prop("scrollHeight"));
-        }
+        setTimeout( function() {
+            scope.$apply( function() {
+                scope.tasks = result;
+                if (scope.liveEventProcessing) {
+                    $('#tasks-table-detail').scrollTop($('#tasks-table-detail').prop("scrollHeight"));
+                }
+            });
+        });
+
     };
 }])
 
@@ -1305,10 +1313,16 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
                 idx++;
             }
         }
-        scope.hostResults = result;
-        if (scope.liveEventProcessing) {
-            $('#hosts-table-detail').scrollTop($('#hosts-table-detail').prop("scrollHeight"));
-        }
+
+        setTimeout( function() {
+            scope.$apply( function() {
+                scope.hostResults = result;
+                if (scope.liveEventProcessing) {
+                    $('#hosts-table-detail').scrollTop($('#hosts-table-detail').prop("scrollHeight"));
+                }
+            });
+        });
+
     };
 }])
 
@@ -1362,7 +1376,11 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
                 idx++;
             }
         }
-        scope.hosts = result;
+        setTimeout( function() {
+            scope.$apply( function() {
+                scope.hosts = result;
+            });
+        });
     };
 }])
 
@@ -1371,9 +1389,12 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
     return function(params) {
         var scope = params.scope;
 
-        DrawPlays({ scope: scope });
-        DrawTasks({ scope: scope });
-        DrawHostResults({ scope: scope });
+        if (!scope.pauseLiveEvents) {
+            DrawPlays({ scope: scope });
+            DrawTasks({ scope: scope });
+            DrawHostResults({ scope: scope });
+        }
+
         DrawHostSummaries({ scope: scope });
 
         if (scope.host_summary.total > 0) {