diff --git a/static/js/app.js b/static/js/app.js index 26b8a4be1..b5a4b3ce1 100644 --- a/static/js/app.js +++ b/static/js/app.js @@ -215,6 +215,78 @@ quayApp = angular.module('quay', quayDependencies, function($provide, cfpLoading return service; }]); + /** + * Specialized class for conducting an HTTP poll, while properly preventing multiple calls. + */ + $provide.factory('AngularPollChannel', ['ApiService', '$timeout', function(ApiService, $timeout) { + var _PollChannel = function(scope, requester, opt_sleeptime) { + this.scope_ = scope; + this.requester_ = requester; + this.sleeptime_ = opt_sleeptime || (60 * 1000 /* 60s */); + this.timer_ = null; + + this.working = false; + this.polling = false; + + var that = this; + scope.$on('$destroy', function() { + that.stop(); + }); + }; + + _PollChannel.prototype.stop = function() { + if (this.timer_) { + $timeout.cancel(this.timer_); + this.timer_ = null; + this.polling_ = false; + } + + this.working = false; + }; + + _PollChannel.prototype.start = function() { + // Make sure we invoke call outside the normal digest cycle, since + // we'll call $scope.$apply ourselves. + var that = this; + setTimeout(function() { that.call_(); }, 0); + }; + + _PollChannel.prototype.call_ = function() { + if (this.working) { return; } + + var that = this; + this.working = true; + this.scope_.$apply(function() { + that.requester_(function(status) { + if (status) { + that.working = false; + that.setupTimer_(); + } else { + that.stop(); + } + }); + }); + }; + + _PollChannel.prototype.setupTimer_ = function() { + if (this.timer_) { return; } + + var that = this; + this.polling = true; + this.timer_ = $timeout(function() { + that.timer_ = null; + that.call_(); + }, this.sleeptime_) + }; + + var service = { + 'create': function(scope, requester, opt_sleeptime) { + return new _PollChannel(scope, requester, opt_sleeptime); + } + }; + + return service; + }]); $provide.factory('DataFileService', [function() { var dataFileService = {}; diff --git a/static/js/controllers.js b/static/js/controllers.js index 9131a0140..f259ead68 100644 --- a/static/js/controllers.js +++ b/static/js/controllers.js @@ -978,14 +978,9 @@ function BuildPackageCtrl($scope, Restangular, ApiService, DataFileService, $rou } function RepoBuildCtrl($scope, Restangular, ApiService, $routeParams, $rootScope, $location, $interval, $sanitize, - ansi2html, AngularViewArray) { + ansi2html, AngularViewArray, AngularPollChannel) { var namespace = $routeParams.namespace; var name = $routeParams.name; - var pollTimerHandle = null; - - $scope.$on('$destroy', function() { - stopPollTimer(); - }); // Watch for changes to the current parameter. $scope.$on('$routeUpdate', function(){ @@ -995,8 +990,7 @@ function RepoBuildCtrl($scope, Restangular, ApiService, $routeParams, $rootScope }); $scope.builds = null; - $scope.polling = false; - + $scope.pollChannel = null; $scope.buildDialogShowCounter = 0; $scope.showNewBuildDialog = function() { @@ -1081,8 +1075,6 @@ function RepoBuildCtrl($scope, Restangular, ApiService, $routeParams, $rootScope $scope.setCurrentBuildInternal = function(index, build, opt_updateURL) { if (build == $scope.currentBuild) { return; } - stopPollTimer(); - $scope.logEntries = null; $scope.logStartIndex = null; $scope.currentParentEntry = null; @@ -1103,47 +1095,35 @@ function RepoBuildCtrl($scope, Restangular, ApiService, $routeParams, $rootScope $scope.adjustLogHeight(); }, 1); - // Load the first set of logs. - getBuildStatusAndLogs(); - - // If the build is currently processing, start the build timer. - checkPollTimer(); - }; - - var checkPollTimer = function() { - var build = $scope.currentBuild; - if (!build) { - stopPollTimer(); - return; + // Stop any existing polling. + if ($scope.pollChannel) { + $scope.pollChannel.stop(); } + + // Create a new channel for polling the build status and logs. + var conductStatusAndLogRequest = function(callback) { + getBuildStatusAndLogs(build, callback); + }; - if (build['phase'] != 'complete' && build['phase'] != 'error') { - startPollTimer(); - return true; - } else { - stopPollTimer(); - return false; - } + $scope.pollChannel = AngularPollChannel.create($scope, conductStatusAndLogRequest, 5 * 1000 /* 5s */); + $scope.pollChannel.start(); }; - var stopPollTimer = function() { - $interval.cancel(pollTimerHandle); - }; - - var startPollTimer = function() { - stopPollTimer(); - pollTimerHandle = $interval(getBuildStatusAndLogs, 2000); - }; - - var processLogs = function(logs, startIndex) { + var processLogs = function(logs, startIndex, endIndex) { if (!$scope.logEntries) { $scope.logEntries = []; } + // If the start index given is less than that requested, then we've received a larger + // pool of logs, and we need to only consider the new ones. + if (startIndex < $scope.logStartIndex) { + logs = logs.slice($scope.logStartIndex - startIndex); + } + for (var i = 0; i < logs.length; ++i) { var entry = logs[i]; var type = entry['type'] || 'entry'; if (type == 'command' || type == 'phase' || type == 'error') { entry['logs'] = AngularViewArray.create(); - entry['index'] = startIndex + i; + entry['index'] = $scope.logStartIndex + i; $scope.logEntries.push(entry); $scope.currentParentEntry = entry; @@ -1151,18 +1131,19 @@ function RepoBuildCtrl($scope, Restangular, ApiService, $routeParams, $rootScope $scope.currentParentEntry['logs'].push(entry); } } + + return endIndex; }; - var getBuildStatusAndLogs = function() { - if (!$scope.currentBuild || $scope.polling) { return; } - $scope.polling = true; - + var getBuildStatusAndLogs = function(build, callback) { var params = { 'repository': namespace + '/' + name, - 'build_uuid': $scope.currentBuild.id + 'build_uuid': build.id }; ApiService.getRepoBuildStatus(null, params, true).then(function(resp) { + if (build != $scope.currentBuild) { callback(false); return; } + // Note: We use extend here rather than replacing as Angular is depending on the // root build object to remain the same object. var matchingBuilds = $.grep($scope.builds, function(elem) { @@ -1177,22 +1158,16 @@ function RepoBuildCtrl($scope, Restangular, ApiService, $routeParams, $rootScope $scope.builds.push(currentBuild); } - checkPollTimer(); - // Load the updated logs for the build. var options = { 'start': $scope.logStartIndex }; - ApiService.getRepoBuildLogsAsResource(params, true).withOptions(options).get(function(resp) { - if ($scope.logStartIndex != null && resp['start'] != $scope.logStartIndex) { - $scope.polling = false; - return; - } + ApiService.getRepoBuildLogsAsResource(params, true).withOptions(options).get(function(resp) { + if (build != $scope.currentBuild) { callback(false); return; } - processLogs(resp['logs'], resp['start']); - $scope.logStartIndex = resp['total']; - $scope.polling = false; + // Process the logs we've received. + $scope.logStartIndex = processLogs(resp['logs'], resp['start'], resp['total']); // If the build status is an error, open the last two log entries. if (currentBuild['phase'] == 'error' && $scope.logEntries.length > 1) { @@ -1205,9 +1180,15 @@ function RepoBuildCtrl($scope, Restangular, ApiService, $routeParams, $rootScope openLogEntries($scope.logEntries[$scope.logEntries.length - 2]); openLogEntries($scope.logEntries[$scope.logEntries.length - 1]); } + + // If the build phase is an error or a complete, then we mark the channel + // as closed. + callback(currentBuild['phase'] != 'error' && currentBuild['phase'] != 'complete'); }, function() { - $scope.polling = false; + callback(false); }); + }, function() { + callback(false); }); }; diff --git a/static/partials/repo-build.html b/static/partials/repo-build.html index 3afe87508..214078a03 100644 --- a/static/partials/repo-build.html +++ b/static/partials/repo-build.html @@ -94,7 +94,7 @@
- +