Merge pull request #1247 from opf/fix/timeline-timeout-error-handling-7286

Add basic error handling on timeline load timeout

app/assets/javascripts/angular/directives/timelines/timeline-container-directive.js

@@ -28,7 +28,7 @@
 
 angular.module('openproject.timelines.directives')
 
-.directive('timelineContainer', [function() {
+.directive('timelineContainer', ['Timeline', function(Timeline) {
   getInitialOutlineExpansion = function(timelineOptions) {
     initialOutlineExpansion = timelineOptions.initial_outline_expansion;
     if (initialOutlineExpansion && initialOutlineExpansion >= 0) {
@@ -41,8 +41,16 @@ angular.module('openproject.timelines.directives')
   return {
     restrict: 'E',
     replace: true,
+    controller: function($scope) {
+      this.showError = function(errorMessage) {
+        $scope.errorMessage = errorMessage;
+      };
+    },
     transclude: true,
-    template: '<div ng-transclude id="{{timelineContainerElementId}}"/>',
+    template: '<div>' +
+              '<div ng-hide="!!errorMessage" ng-transclude id="{{timelineContainerElementId}}"/>' +
+              '<div ng-if="!!errorMessage" ng-bind="errorMessage" class="flash error"/>' +
+              '</div>',
     link: function(scope) {
       scope.timelineContainerElementId = 'timeline-container-' + (++scope.timelineContainerCount);
 

app/assets/javascripts/angular/directives/timelines/timeline-table-container-directive.js

@@ -34,8 +34,9 @@ angular.module('openproject.timelines.directives')
   return {
     restrict: 'E',
     replace: true,
+    require: '^timelineContainer',
     templateUrl: '/templates/timelines/timeline_table_container.html',
-    link: function(scope, element, attributes) {
+    link: function(scope, element, attributes, timelineContainerCtrl) {
 
       function showWarning() {
         scope.underConstruction = false;
@@ -43,6 +44,11 @@ angular.module('openproject.timelines.directives')
         scope.$apply();
       }
 
+      function showError(errorMessage) {
+        scope.underConstruction = false;
+        timelineContainerCtrl.showError(errorMessage);
+      }
+
       function fetchData() {
         return TimelineLoaderService.loadTimelineData(scope.timeline);
       }
@@ -126,15 +132,19 @@ angular.module('openproject.timelines.directives')
       function renderTimeline() {
         return fetchData()
           .then(buildWorkPackageTable)
-          .then(drawChart);
+          .then(drawChart, showError);
       }
 
       function reloadTimeline() {
         return fetchData()
           .then(buildWorkPackageTable)
           .then(function() {
-            scope.timeline.expandToOutlineLevel(scope.currentOutlineLevel); // also triggers rebuildAll()
-          });
+            if (scope.currentOutlineLevel) {
+              scope.timeline.expandToOutlineLevel(scope.currentOutlineLevel); // also triggers rebuildAll()
+            } else {
+              scope.rebuildAll();
+            }
+          }, showError);
       }
 
       function registerModalHelper() {

app/assets/javascripts/angular/services/timeline-loader-service.js

@@ -39,7 +39,7 @@
 
 angular.module('openproject.timelines.services')
 
-.service('TimelineLoaderService', ['$q', 'FilterQueryStringBuilder', 'Color', 'HistoricalPlanningElement', 'PlanningElement', 'PlanningElementType', 'Project', 'ProjectAssociation', 'ProjectType', 'Reporting', 'Status','Timeline', 'User', 'CustomField', function($q, FilterQueryStringBuilder, Color, HistoricalPlanningElement, PlanningElement, PlanningElementType, Project, ProjectAssociation, ProjectType, Reporting, Status,Timeline, User, CustomField) {
+.service('TimelineLoaderService', ['$q', 'FilterQueryStringBuilder', 'Color', 'HistoricalPlanningElement', 'PlanningElement', 'PlanningElementType', 'Project', 'ProjectAssociation', 'ProjectType', 'Reporting', 'Status','Timeline', 'User', 'CustomField', function($q, FilterQueryStringBuilder, Color, HistoricalPlanningElement, PlanningElement, PlanningElementType, Project, ProjectAssociation, ProjectType, Reporting, Status, Timeline, User, CustomField) {
 
   /**
    * QueueingLoader
@@ -1159,14 +1159,12 @@ angular.module('openproject.timelines.services')
         });
 
         timeline.safetyHook = window.setTimeout(function() {
-          timeline.die(I18n.t('js.timelines.errors.report_timeout'));
           deferred.reject(I18n.t('js.timelines.errors.report_timeout'));
         }, Timeline.LOAD_ERROR_TIMEOUT);
 
         timelineLoader.load();
 
       } catch (e) {
-        timeline.die(e);
         deferred.reject(e);
       }
       return deferred.promise;

app/views/timelines/_timeline.html.erb

@@ -34,7 +34,7 @@ See doc/COPYRIGHT.rdoc for more details.
 <div ng-controller="TimelinesController">
   <timeline-container>
     <timeline-toolbar></timeline-toolbar>
-    <timeline-table-container/>
+    <timeline-table-container></timeline-table-container>
   </timeline-container>
 </div>
 

public/templates/timelines/timeline_table_container.html

@@ -2,9 +2,7 @@
   <div class="tl-left">
     <div class="tl-left-top tl-decoration"></div>
     <div class="tl-left-main">
-
       <timeline-table/>
-
     </div>
   </div>
   <div class="tl-right">