Remove query params from ui-router and manually reload work packages.

app/assets/javascripts/angular/directives/components/table-pagination-directive.js

@@ -33,8 +33,7 @@ angular.module('openproject.uiComponents')
     restrict: 'EA',
     templateUrl: '/templates/components/table_pagination.html',
     scope: {
-      totalEntries: '=',
+      totalEntries: '='
-      updateResults: '&'
     },
     link: function(scope, element, attributes) {
       scope.I18n = I18n;
@@ -53,7 +52,7 @@ angular.module('openproject.uiComponents')
         updateCurrentRangeLabel();
         updatePageNumbers();
 
-        scope.updateResults(); // update table
+        scope.$emit('workPackagesRefreshRequired');
       };
 
       /**

app/assets/javascripts/angular/helpers/url-params-helper.js

@@ -51,6 +51,7 @@ angular.module('openproject.helpers')
       return parts.join('&');
     },
 
+    // TODO: Remove
     encodeQueryForJsonParams: function(query) {
       var paramsData = {};
 
@@ -84,6 +85,7 @@ angular.module('openproject.helpers')
       return JSON.stringify(paramsData);
     },
 
+    // TODO: Remove
     encodeQueryForNonUpdateJsonParams: function(query) {
       var paramsData = {
         c: query.columns.map(function(column) { return column.name; })
@@ -95,23 +97,67 @@ angular.module('openproject.helpers')
       return JSON.stringify(paramsData);
     },
 
-    decodeQueryFromJsonParams: function(queryId, requiringUpdateJson, nonRequiringUpdateJson) {
+    encodeQueryAllJsonParams: function(query) {
+      var paramsData = {
+        c: query.columns.map(function(column) { return column.name; })
+      };
+      if(!!query.displaySums) {
+        paramsData.s = query.displaySums;
+      }
+
+      if(!!query.projectId) {
+        paramsData.p = query.projectId;
+      }
+      if(!!query.groupBy) {
+        paramsData.g = query.groupBy;
+      }
+      if(!!query.getSortation()) {
+        paramsData.t = query.getSortation().encode()
+      }
+      if(query.filters && query.filters.length) {
+        paramsData.f = query.filters.filter(function(filter) {
+          return !filter.deactivated;
+        })
+        .map(function(filter) {
+          var filterData = {
+            n: filter.name,
+            m: filter.modelName,
+            o: encodeURIComponent(filter.operator),
+            t: filter.type
+          };
+          if(filter.values) {
+            angular.extend(filterData, { v: filter.values })
+          }
+          return filterData
+        });
+      }
+
+      return JSON.stringify(paramsData);
+    },
+
+    decodeQueryFromJsonParams: function(queryId, updateJson) {
       var queryData = {};
       if(queryId) {
         queryData.id = queryId;
       }
 
-      if(requiringUpdateJson) {
+      if(updateJson) {
-        var updateRequiringProperties = JSON.parse(requiringUpdateJson);
+        var properties = JSON.parse(updateJson);
 
-        if(!!updateRequiringProperties.p) {
+        if(!!properties.c) {
-          queryData.projectId = updateRequiringProperties.p;
+          queryData.columns = properties.c.map(function(column) { return { name: column }; });
+        }
+        if(!!properties.s) {
+          queryData.displaySums = properties.s;
+        }
+        if(!!properties.p) {
+          queryData.projectId = properties.p;
         }
-        if(!!updateRequiringProperties.g) {
+        if(!!properties.g) {
-          queryData.groupBy = updateRequiringProperties.g;
+          queryData.groupBy = properties.g;
         }
-        if(!!updateRequiringProperties.f) {
+        if(!!properties.f) {
-          queryData.filters = updateRequiringProperties.f.map(function(urlFilter) {
+          queryData.filters = properties.f.map(function(urlFilter) {
             var filterData = {
               name: urlFilter.n,
               modelName: urlFilter.m,
@@ -125,19 +171,8 @@ angular.module('openproject.helpers')
             return filterData;
           });
         }
-        if(!!updateRequiringProperties.t) {
+        if(!!properties.t) {
-          queryData.sortCriteria = updateRequiringProperties.t;
+          queryData.sortCriteria = properties.t;
-        }
-      }
-
-      if(nonRequiringUpdateJson) {
-        var nonUpdateRequiringProperties = JSON.parse(nonRequiringUpdateJson);
-
-        if(!!nonUpdateRequiringProperties.c) {
-          queryData.columns = nonUpdateRequiringProperties.c.map(function(column) { return { name: column }; });
-        }
-        if(!!nonUpdateRequiringProperties.s) {
-          queryData.displaySums = nonUpdateRequiringProperties.s;
         }
       }
 

app/assets/javascripts/angular/routing.js

@@ -35,7 +35,7 @@ angular.module('openproject')
 
   $stateProvider
     .state('work-packages', {
-      url: '{projectPath:.*}/work_packages?query_id&live_query',
+      url: '{projectPath:.*}/work_packages?query_id',
       abstract: true,
       templateUrl: "/templates/work_packages.html",
       controller: 'WorkPackagesController',

app/assets/javascripts/angular/work_packages/controllers/work-packages-list-controller.js

@@ -55,13 +55,12 @@ angular.module('openproject.workPackages.controllers')
     $scope.operatorsAndLabelsByFilterType = OPERATORS_AND_LABELS_BY_FILTER_TYPE;
     $scope.disableFilters = false;
     $scope.disableNewWorkPackage = true;
-    var updateCausingParams = $state.params.live_query;
+    var queryParams = $location.search().query_props;
-    var nonUpdeCausingParams = $location.search().passive_query;
 
     var fetchWorkPackages;
-    if(updateCausingParams || nonUpdeCausingParams) {
+    if(queryParams) {
       // Attempt to build up query from URL params
-      fetchWorkPackages = fetchWorkPackagesFromUrlParams(updateCausingParams, nonUpdeCausingParams);
+      fetchWorkPackages = fetchWorkPackagesFromUrlParams(queryParams);
     } else if($state.params.query_id) {
       // Load the query by id if present
       fetchWorkPackages = WorkPackageService.getWorkPackagesByQueryId($scope.projectIdentifier, $state.params.query_id);
@@ -80,9 +79,9 @@ angular.module('openproject.workPackages.controllers')
       });
   }
 
-  function fetchWorkPackagesFromUrlParams(updateCausingParams, nonUpdeCausingParams) {
+  function fetchWorkPackagesFromUrlParams(queryParams) {
     try {
-      var queryData = UrlParamsHelper.decodeQueryFromJsonParams($state.params.query_id, updateCausingParams, nonUpdeCausingParams);
+      var queryData = UrlParamsHelper.decodeQueryFromJsonParams($state.params.query_id, queryParams);
       var queryFromParams = new Query(queryData, { rawFilters: true });
 
       return WorkPackageService.getWorkPackages($scope.projectIdentifier, queryFromParams);
@@ -196,27 +195,22 @@ angular.module('openproject.workPackages.controllers')
     }
 
     if($scope.query) {
-      var queryString = UrlParamsHelper.encodeQueryForNonUpdateJsonParams($scope.query);
+      var queryString = UrlParamsHelper.encodeQueryAllJsonParams($scope.query);
-      $location.search('passive_query', queryString);
+      $location.search('query_props', queryString);
-      relativeUrl = relativeUrl + "?passive_query=" + queryString;
+      relativeUrl = relativeUrl + "?query_props=" + queryString;
 
-      var queryString = UrlParamsHelper.encodeQueryForJsonParams($scope.query);
+      // var queryString = UrlParamsHelper.encodeQueryForNonUpdateJsonParams($scope.query);
-      $location.search('live_query', queryString);
+      // $location.search('passive_query', queryString);
-      relativeUrl = relativeUrl + "?live_query=" + queryString;
+      // relativeUrl = relativeUrl + "?passive_query=" + queryString;
+
+      // var queryString = UrlParamsHelper.encodeQueryForJsonParams($scope.query);
+      // $location.search('live_query', queryString);
+      // relativeUrl = relativeUrl + "?live_query=" + queryString;
     }
 
     $scope.backUrl = relativeUrl;
   };
 
-  $scope.updateResults = function() {
-    $scope.$broadcast('openproject.workPackages.updateResults');
-
-    $scope.refreshWorkPackages = WorkPackageService.getWorkPackages($scope.projectIdentifier, $scope.query, PaginationService.getPaginationOptions())
-      .then(setupWorkPackagesTable);
-
-    return $scope.refreshWorkPackages;
-  };
-
   $scope.loadQuery = function(queryId) {
     // Clear unsaved changes to current query
     clearUrlQueryParams();
@@ -225,6 +219,15 @@ angular.module('openproject.workPackages.controllers')
     $state.go('work-packages.list', { query_id: queryId });
   };
 
+  function updateResults() {
+    $scope.$broadcast('openproject.workPackages.updateResults');
+
+    $scope.refreshWorkPackages = WorkPackageService.getWorkPackages($scope.projectIdentifier, $scope.query, PaginationService.getPaginationOptions())
+      .then(setupWorkPackagesTable);
+
+    return $scope.refreshWorkPackages;
+  };
+
   // More
 
   function serviceErrorHandler(data) {
@@ -246,6 +249,10 @@ angular.module('openproject.workPackages.controllers')
 
   $rootScope.$on('queryStateChange', function(event, message) {
     $scope.maintainUrlQueryState();
+  });
+
+  $rootScope.$on('workPackagesRefreshRequired', function(event, message) {
+    updateResults();
   })
 
   $scope.openLatestTab = function() {

app/assets/javascripts/angular/work_packages/directives/query-filter-directive.js

@@ -65,6 +65,7 @@ angular.module('openproject.workPackages.directives')
           if (filter.isConfigured() && (filterChanged(filter, oldFilter) || valueReset(filter, oldFilter))) {
             PaginationService.resetPage();
             scope.$emit('queryStateChange');
+            scope.$emit('workPackagesRefreshRequired');
           }
         }
       }, true);

app/assets/javascripts/angular/work_packages/directives/query-form-directive.js

@@ -51,10 +51,17 @@ angular.module('openproject.workPackages.directives')
 
             var groupByChanged = currentProperties.groupBy !== formerProperties.groupBy;
             var sortElementsChanged = JSON.stringify(currentProperties.sortElements) !== JSON.stringify(formerProperties.sortElements);
+
+            return groupByChanged || sortElementsChanged;
+          }
+
+          function passiveQueryPropertiesChanged(currentProperties, formerProperties) {
+            if (formerProperties === undefined) return false;
+
             var columnsChanged = JSON.stringify(currentProperties.columns) !== JSON.stringify(formerProperties.columns);
             var displaySumsChanged = currentProperties.displaySums !== formerProperties.displaySums;
 
-            return groupByChanged || sortElementsChanged || columnsChanged || displaySumsChanged;
+            return columnsChanged || displaySumsChanged;
           }
 
           function observedQueryProperties() {
@@ -66,7 +73,16 @@ angular.module('openproject.workPackages.directives')
               return {
                 id: query.id,
                 groupBy: query.groupBy,
-                sortElements: query.sortation.sortElements,
+                sortElements: query.sortation.sortElements
+              };
+            }
+          }
+
+          function passiveQueryProperties() {
+            var query = scope.query;
+
+            if (query !== undefined) {
+              return {
                 columns: query.columns,
                 displaySums: query.displaySums
               };
@@ -77,9 +93,16 @@ angular.module('openproject.workPackages.directives')
             if (!querySwitched(newProperties, oldProperties)) {
               if (queryPropertiesChanged(newProperties, oldProperties)) {
                 scope.$emit('queryStateChange');
+                scope.$emit('workPackagesRefreshRequired');
               }
             }
           }, true);
+
+          scope.$watch(passiveQueryProperties, function(newProperties, oldProperties) {
+            if (passiveQueryPropertiesChanged(newProperties, oldProperties)) {
+              scope.$emit('queryStateChange');
+            }
+          }, true);
         }
       };
     }

app/assets/javascripts/angular/work_packages/directives/work-package-group-sums-directive.js

@@ -49,6 +49,7 @@ angular.module('openproject.workPackages.directives')
             // map columns to sums if the column data is a number
             setSums();
             scope.$emit('queryStateChange');
+            scope.$emit('workPackagesRefreshRequired');
           });
 
         }

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

@@ -50,8 +50,7 @@ angular.module('openproject.workPackages.directives')
       groupByColumn: '=',
       displaySums: '=',
       totalSums: '=',
-      groupSums: '=',
+      groupSums: '='
-      updateResults: '&'
     },
     link: function(scope, element, attributes) {
       var activeSelectionBorderIndex;

public/templates/work_packages.list.html

@@ -120,12 +120,10 @@
                            count-by-group="workPackageCountByGroup"
                            display-sums="query.displaySums"
                            total-sums="totalSums"
-                           group-sums="groupSums"
+                           group-sums="groupSums">
-                           update-results="updateResults()">
       </work-packages-table>
 
-      <table-pagination total-entries="totalEntries"
+      <table-pagination total-entries="totalEntries">
-                        update-results="updateResults()">
       </table-pagination>
     </div>
     <modal-loading>

public/templates/work_packages/query_filters.html

@@ -58,8 +58,7 @@
                              size="30"
                              type="text"
                              value=""
-                             ng-disabled="isLoading"
+                             ng-disabled="isLoading"/>
-                             execute-on-enter="updateResults()"/>
                       <label ng-switch-when="string"
                              for="values_{{name}}"
                              class="hidden-for-sighted">
@@ -76,8 +75,7 @@
                              size="30"
                              type="text"
                              value=""
-                             ng-disabled="isLoading"
+                             ng-disabled="isLoading"/>
-                             execute-on-enter="updateResults()"/>
                       <label ng-switch-when="'text'"for="values_{{name}}" class="hidden-for-sighted">
                         {{ I18n.t('js.work_packages.description_enter_text') }}
                       </label>
@@ -91,8 +89,7 @@
                              min="0"
                              type="number"
                              value=""
-                             ng-disabled="isLoading"
+                             ng-disabled="isLoading"/>
-                             execute-on-enter="updateResults()"/>
                       <label ng-switch-when="'integer'" for="values_{{name}}" class="hidden-for-sighted">
                         {{ I18n.t('js.work_packages.description_enter_text') }}
                       </label>
@@ -105,8 +102,7 @@
                              name="v[{{filter.name}}]"
                              size="3"
                              type="text"
-                             ng-disabled="isLoading"
+                             ng-disabled="isLoading"/>
-                             execute-on-enter="updateResults()"/>
                       <label ng-switch-when="date" for="values_{{name}}" class="hidden-for-sighted">
                         {{ I18n.t('js.work_packages.time_relative.days') }}
                       </label>
@@ -120,8 +116,7 @@
                              name="v[{{filter.name}}]"
                              size="3"
                              type="text"
-                             ng-disabled="isLoading"
+                             ng-disabled="isLoading"/>
-                             execute-on-enter="updateResults()"/>
                       <label ng-switch-when="date_past" for="values_{{name}}" class="hidden-for-sighted">
                         {{ I18n.t('js.work_packages.time_relative.days') }}
                       </label>

public/templates/work_packages/work_packages_table.html

@@ -24,8 +24,7 @@
           target="ColumnContextMenu"
           locals="columns, column"
           sortable="true"
-          query="query"
+          query="query"/>
-          update-results="updateResults()"/>
 
       <th sort-header ng-repeat="column in columns"
                       has-dropdown-menu