establish filter context checking on job details page

in other words, stop making requests and doing stuff for a stale filter state
also currently removing the behavior that kept live events controlled by the filter

awx/ui/client/src/job-results/job-results.controller.js

@@ -3,6 +3,10 @@ function(jobData, jobDataOptions, jobLabels, jobFinished, count, $scope, ParseTy
     var toDestroy = [];
     var cancelRequests = false;
 
+    // this allows you to manage the timing of rest-call based events as
+    // filters are updated.  see processPage for more info
+    var currentContext = 1;
+
     // used for tag search
     $scope.job_event_dataset = Dataset.data;
 
@@ -187,7 +191,12 @@ function(jobData, jobDataOptions, jobLabels, jobFinished, count, $scope, ParseTy
 
     // This is where the async updates to the UI actually happen.
     // Flow is event queue munging in the service -> $scope setting in here
-    var processEvent = function(event) {
+    var processEvent = function(event, context) {
+        // only care about filter context checking when the event comes
+        // as a rest call
+        if (context && context !== currentContext) {
+            return;
+        }
         // put the event in the queue
         var mungedEvent = eventQueue.populate(event);
 
@@ -362,46 +371,69 @@ function(jobData, jobDataOptions, jobLabels, jobFinished, count, $scope, ParseTy
         getSkeleton(jobData.related.job_events + "?order_by=id&or__event__in=playbook_on_start,playbook_on_play_start,playbook_on_task_start,playbook_on_stats");
     });
 
+    var getEvents;
+
+    var processPage = function(events, context) {
+        // currentContext is the context of the filter when this request
+        // to processPage was made
+        //
+        // currentContext is the context of the filter currently
+        //
+        // if they are not the same, make sure to stop process events/
+        // making rest calls for next pages/etc. (you can see context is
+        // also passed into getEvents and processEvent and similar checks
+        // exist in these functions)
+        if (context !== currentContext) {
+            return;
+        }
+
+        events.results.forEach(event => {
+            // get the name in the same format as the data
+            // coming over the websocket
+            event.event_name = event.event;
+            delete event.event;
+
+            processEvent(event, context);
+        });
+        if (events.next && !cancelRequests) {
+            getEvents(events.next, context);
+        } else {
+            // put those paused events into the pane
+            $scope.gotPreviouslyRanEvents.resolve("");
+        }
+    };
+
     // grab non-header recap lines
-    var getEvents = function(url) {
+    getEvents = function(url, context) {
+        if (context !== currentContext) {
+            return;
+        }
+
         jobResultsService.getEvents(url)
             .then(events => {
-                events.results.forEach(event => {
+                processPage(events, context);
-                    // get the name in the same format as the data
-                    // coming over the websocket
-                    event.event_name = event.event;
-                    delete event.event;
-                    processEvent(event);
-                });
-                if (events.next && !cancelRequests) {
-                    getEvents(events.next);
-                } else {
-                    // put those paused events into the pane
-                    $scope.gotPreviouslyRanEvents.resolve("");
-                }
             });
     };
 
     // grab non-header recap lines
     toDestroy.push($scope.$watch('job_event_dataset', function(val) {
+        eventQueue.initialize();
+        Object.keys($scope.events)
+            .forEach(v => {
+                $scope.events[v].$destroy();
+                $scope.events[v] = null;
+            });
+        $scope.events = {};
+
         // pause websocket events from coming in to the pane
         $scope.gotPreviouslyRanEvents = $q.defer();
+        currentContext += 1;
+
+        let context = currentContext;
 
         $( ".JobResultsStdOut-aLineOfStdOut.not_skeleton" ).remove();
         $scope.hasSkeleton.promise.then(() => {
-            val.results.forEach(event => {
+            processPage(val, context);
-                // get the name in the same format as the data
-                // coming over the websocket
-                event.event_name = event.event;
-                delete event.event;
-                processEvent(event);
-            });
-            if (val.next  && !cancelRequests) {
-                getEvents(val.next);
-            } else {
-                // put those paused events into the pane
-                $scope.gotPreviouslyRanEvents.resolve("");
-            }
         });
     }));
 
@@ -411,45 +443,16 @@ function(jobData, jobDataOptions, jobLabels, jobFinished, count, $scope, ParseTy
     toDestroy.push($scope.$on(`ws-job_events-${$scope.job.id}`, function(e, data) {
         $q.all([$scope.gotPreviouslyRanEvents.promise,
             $scope.hasSkeleton.promise]).then(() => {
-            var url = Dataset
+            // for header and recap lines, as well as if no filters
-                .config.url.split("?")[0] +
+            // were added by the user, just put the line in the
-                QuerySet.encodeQueryset($state.params.job_event_search);
+            // standard out pane (and increment play and task
-            var noFilter = (url.split("&")
+            // count)
-                .filter(v => v.indexOf("page=") !== 0 &&
+            if (data.event_name === "playbook_on_play_start") {
-                    v.indexOf("/api/v1") !== 0 &&
+                $scope.playCount++;
-                    v.indexOf("order_by=id") !== 0 &&
+            } else if (data.event_name === "playbook_on_task_start") {
-                    v.indexOf("not__event__in=playbook_on_start,playbook_on_play_start,playbook_on_task_start,playbook_on_stats") !== 0).length === 0);
+                $scope.taskCount++;
-
-            if(data.event_name === "playbook_on_start" ||
-                data.event_name === "playbook_on_play_start" ||
-                data.event_name === "playbook_on_task_start" ||
-                data.event_name === "playbook_on_stats" ||
-                noFilter) {
-                // for header and recap lines, as well as if no filters
-                // were added by the user, just put the line in the
-                // standard out pane (and increment play and task
-                // count)
-                if (data.event_name === "playbook_on_play_start") {
-                    $scope.playCount++;
-                } else if (data.event_name === "playbook_on_task_start") {
-                    $scope.taskCount++;
-                }
-                processEvent(data);
-            } else {
-                // to make sure host event/verbose lines go through a
-                // user defined filter, appent the id to the url, and
-                // make a request to the job_events endpoint with the
-                // id of the incoming event appended.  If the event,
-                // is returned, put the line in the standard out pane
-                Rest.setUrl(`${url}&id=${data.id}`);
-                Rest.get()
-                    .success(function(isHere) {
-                        if (isHere.count) {
-                            processEvent(data);
-                        }
-                    });
             }
-
+            processEvent(data);
         });
     }));