Merge pull request #1396 from opf/feature/ng-feature-flags

Feature flags for Angular app

app/assets/javascripts/angular/directives/components/toolbar.js

@@ -33,7 +33,6 @@ angular.module('openproject.uiComponents')
     return {
       restrict: 'EA',
       link: function(scope, element, attributes) {
-        scope.hideWorkPackageDetails = true; // temporarily disable work package details links
       }
     };
   });

app/assets/javascripts/angular/directives/work_packages/work-packages-table-directive.js

@@ -31,7 +31,8 @@ angular.module('openproject.workPackages.directives')
 .directive('workPackagesTable', [
   'I18n',
   'WorkPackagesTableService',
-  function(I18n, WorkPackagesTableService){
+  'flags',
+  function(I18n, WorkPackagesTableService, flags){
 
   return {
     restrict: 'E',
@@ -86,7 +87,11 @@ angular.module('openproject.workPackages.directives')
        }
       });
 
-      scope.hideWorkPackageDetails = true; // temporarily disable work package details links
+      scope.$watch(function() {
+        return flags.isOn('detailsView');
+      }, function(detailsEnabled) {
+        scope.hideWorkPackageDetails = !detailsEnabled;
+      });
     }
   };
 }]);

app/assets/javascripts/angular/openproject-app.js

@@ -116,7 +116,8 @@ var openprojectApp = angular.module('openproject', [
   'openproject.timeEntries',
   'ngAnimate',
   'ngSanitize',
-  'truncate'
+  'truncate',
+  'feature-flags'
 ]);
 
 window.appBasePath = jQuery('meta[name=app_base_path]').attr('content') || '';
@@ -139,8 +140,11 @@ openprojectApp
   .run([
     '$http',
     'ConfigurationService',
-    function($http, ConfigurationService){
+    'flags',
+    function($http, ConfigurationService, flags) {
     $http.defaults.headers.common.Accept = 'application/json';
 
     ConfigurationService.addConfiguration('accessibilityMode', OpenProject.Helpers.accessibilityModeEnabled());
+
+    flags.set($http.get('/javascripts/feature-flags.json'));
   }]);

app/assets/javascripts/application.js.erb

@@ -64,6 +64,7 @@
 //= require angular-ui-date/src/date
 //= require angular-sanitize
 //= require angular-truncate/dist/angular-truncate
+//= require angular-feature-flags/dist/featureFlags.js
 
 //= require ng-context-menu
 

bower.json

@@ -18,6 +18,7 @@
     "angular-modal": "~0.3.0",
     "angular-sanitize": "~1.2.14",
     "angular-truncate": "latest",
+    "angular-feature-flags": "mjt01/angular-feature-flags",
     "jquery-migrate": "~1.2.1",
     "momentjs": "~2.6.0",
     "moment-timezone": "~0.0.6",

public/javascripts/feature-flags.json

@@ -0,0 +1,8 @@
+[
+    {
+        "key":        "detailsView",
+        "active":     false,
+        "name":       "Details View",
+        "description": "Displays details for individual work packages."
+    }
+]

public/templates/work_packages.html

@@ -22,7 +22,7 @@
             <i class="icon-filter icon-buttons"></i>{{ I18n.t('js.toolbar.filter') }}
           </button>
         </li>
-        <li class="toolbar-item" ng-hide="hideWorkPackageDetails">
+        <li class="toolbar-item" feature-flag="detailsView">
           <ul id="work-packages-view-mode-selection" class="toolbar-button-group">
             <li>
               <button class="button"
@@ -31,7 +31,7 @@
                 <i class="icon-table-view icon-buttons"></i>
               </button>
             </li>
-            <li ng-hide="hideWorkPackageDetails">
+            <li feature-flag="detailsView">
               <button class="button"
                       ui-sref="work-packages.list.details({})"
                       ui-sref-active="active">

public/templates/work_packages.list.html

@@ -27,5 +27,6 @@
     <column-context-menu></column-context-menu>
 
   </div>
-  <div class="work-packages--details" ui-view></div>
+  <div class="work-packages--details" ui-view
+    feature-flag="detailsView"></div>
 </div>