Merge branch '836-remember-user-parameters-for-sorting-table-in-admin-panel' into 'master'

Resolve "Remember user parameters for sorting table in Admin Panel"

Closes #836

See merge request minerva/core!994

CHANGELOG

+minerva (15.0.0~alpha.1) stable; urgency=medium
+  * Small improvement: sort order of tables in admin panel is preserved among
+    sessions (#836)
+
 minerva (15.0.0~alpha.0) stable; urgency=medium
   * Improvement: logs provided for validation data model are structurized (#325)
   * Improvement: import/export of GPML implemented
@@ -19,6 +23,8 @@ minerva (15.0.0~alpha.0) stable; urgency=medium
     file (#671)
   * Bug fix: problematic notes doesn't crash CellDesigner upload (#968)
 
+ -- Piotr Gawron <piotr.gawron@uni.lu>  Wed, 4 Nov 2019 11:00:00 +0200
+
 minerva (14.0.3) stable; urgency=medium
   * Bug fix: default zoom level on main map works even when x or y are
     undefined (#993)

frontend-js/src/main/js/gui/admin/AbstractAdminPanel.js

 "use strict";
 
+var $ = require('jquery');
+
 /* exported logger */
 /* exported Promise*/
 
@@ -7,9 +9,7 @@ var Panel = require('../Panel');
 var UserPreferences = require('../../map/data/UserPreferences');
 var GuiConnector = require('../../GuiConnector');
 
-// noinspection JSUnusedLocalSymbols
 var logger = require('../../logger');
-// noinspection JSUnusedLocalSymbols
 var Functions = require('../../Functions');
 var Promise = require("bluebird");
 
@@ -29,7 +29,6 @@ var Promise = require("bluebird");
 function AbstractAdminPanel(params) {
   params["scrollable"] = true;
   Panel.call(this, params);
-  this._createHeader(params.name);
 
   this._initPromises = [];
   this._eventBinds = [];
@@ -38,13 +37,6 @@ function AbstractAdminPanel(params) {
 AbstractAdminPanel.prototype = Object.create(Panel.prototype);
 AbstractAdminPanel.prototype.constructor = AbstractAdminPanel;
 
-AbstractAdminPanel.prototype._createHeader = function (name) {
-  // this.getElement().appendChild(Functions.createElement({
-  //   type: "h1",
-  //   content: name
-  // }));
-};
-
 /**
  *
  * @returns {Promise}
@@ -65,8 +57,9 @@ AbstractAdminPanel.prototype.init = function () {
  * @param {function} params.setter
  */
 AbstractAdminPanel.prototype.bindUserGuiPreference = function (params) {
+  var self = this;
   params.jQueryObject.on(params.event, function () {
-    return ServerConnector.getLoggedUser().then(function (user) {
+    return self.getServerConnector().getLoggedUser().then(function (user) {
       var oldValue = user.getPreferences().getGuiPreference(params.preferenceName, params.defaultValue);
       var newValue = params.getter();
       if (oldValue !== newValue) {
@@ -74,11 +67,11 @@ AbstractAdminPanel.prototype.bindUserGuiPreference = function (params) {
 
         var data = new UserPreferences();
         data.setGuiPreference(params.preferenceName, newValue);
-        return ServerConnector.updateUserPreferences({user: user, preferences: data});
+        return self.getServerConnector().updateUserPreferences({user: user, preferences: data});
       }
     }).catch(GuiConnector.alert);
   });
-  var promise = ServerConnector.getLoggedUser().then(function (user) {
+  var promise = self.getServerConnector().getLoggedUser().then(function (user) {
     var value = user.getPreferences().getGuiPreference(params.preferenceName, params.defaultValue);
     return params.setter(value);
   });
@@ -92,6 +85,59 @@ AbstractAdminPanel.prototype.bindUserGuiPreference = function (params) {
 
 };
 
+/**
+ *
+ * @param {Object} param
+ * @param {HTMLElement} param.element
+ * @param {string} param.preferenceName
+ */
+AbstractAdminPanel.prototype.bindDataTablePageLengthToUserPreference = function (param) {
+  var jQueryObject = $(param.element);
+  return this.bindUserGuiPreference({
+    jQueryObject: jQueryObject,
+    event: 'length.dt',
+    preferenceName: param.preferenceName,
+    defaultValue: '10',
+    getter: function () {
+      return jQueryObject.DataTable().page.len() + '';
+    },
+    setter: function (value) {
+      return jQueryObject.DataTable().page.len(value).draw();
+    }
+  })
+};
+
+/**
+ *
+ * @param {Object} param
+ * @param {HTMLElement} param.element
+ * @param {string} param.preferenceName
+ */
+AbstractAdminPanel.prototype.bindDataTableOrderToUserPreference = function (param) {
+  var jQueryObject = $(param.element);
+  return this.bindUserGuiPreference({
+    jQueryObject: jQueryObject,
+    event: 'order.dt',
+    preferenceName: param.preferenceName,
+    defaultValue: '0-asc',
+    getter: function () {
+      var order = jQueryObject.DataTable().order();
+      return order[0][0] + "-" + order[0][1];
+    },
+    setter: function (value) {
+      var tmp = value.split("-");
+      var column = parseInt(tmp[0]);
+      var order = tmp[1];
+      if (Functions.isInt(column) && (order === "asc" || order === "desc")) {
+        return jQueryObject.DataTable().order([column, order]).draw();
+      } else {
+        logger.warn("Invalid order: " + column + "; " + order);
+      }
+    }
+  })
+};
+
+
 /**
  *
  * @returns {Promise}

frontend-js/src/main/js/gui/admin/ConfigurationAdminPanel.js

@@ -141,18 +141,13 @@ ConfigurationAdminPanel.prototype.createOptionsTable = function (options, type)
 
   self.getGuiUtils().addTab(self, {name: type, content: configurationDiv});
 
-  return self.bindUserGuiPreference({
-    jQueryObject: $(configurationTable),
-    event: 'length.dt',
-    preferenceName: 'admin-configuration-datatable-length',
-    defaultValue: '10',
-    getter: function () {
-      return $(configurationTable).DataTable().page.len() + '';
-    },
-    setter: function (value) {
-      return $(configurationTable).DataTable().page.len(value).draw();
-    }
-  });
+  return Promise.all([self.bindDataTablePageLengthToUserPreference({
+    element: configurationTable,
+    preferenceName: 'admin-configuration-datatable-length'
+  }), self.bindDataTableOrderToUserPreference({
+    element: configurationTable,
+    preferenceName: 'admin-configuration-' + type + '-datatable-order'
+  })]);
 };
 
 /**

frontend-js/src/main/js/gui/admin/GenomeAdminPanel.js

@@ -90,17 +90,9 @@ GenomeAdminPanel.prototype._createGui = function () {
     }],
     order: [[1, "asc"], [4, "asc"]]
   });
-  self.bindUserGuiPreference({
-    jQueryObject: $(genomesTable),
-    event: 'length.dt',
-    preferenceName: 'admin-genome-datatable-length',
-    defaultValue: '10',
-    getter: function () {
-      return $(genomesTable).DataTable().page.len() + '';
-    },
-    setter: function (value) {
-      return $(genomesTable).DataTable().page.len(value).draw();
-    }
+  self.bindDataTablePageLengthToUserPreference({
+    element: genomesTable,
+    preferenceName: 'admin-genome-datatable-length'
   });
 
   $(genomesTable).on("click", "[name='removeGenome']", function () {
@@ -177,6 +169,14 @@ GenomeAdminPanel.prototype.init = function () {
     } else {
       self.disablePanel("You have no privilege to manage genomes");
     }
+
+  }).then(function () {
+    var genomesTable = $("[name='genomeTable']", self.getElement())[0];
+
+    return self.bindDataTableOrderToUserPreference({
+      element: genomesTable,
+      preferenceName: 'admin-genome-datatable-order'
+    });
   });
 };
 
@@ -267,7 +267,7 @@ GenomeAdminPanel.prototype.destroy = function () {
 /**
  *
  * @param {ReferenceGenome} [genome]
- * @returns {Promise}
+ * @returns {Promise<EditGenomeDialog>}
  */
 GenomeAdminPanel.prototype.getDialog = function (genome) {
   var self = this;

frontend-js/src/main/js/gui/admin/MapsAdminPanel.js

@@ -142,21 +142,14 @@ MapsAdminPanel.prototype._createProjectTableRow = function () {
     }, {
       title: 'Remove'
     }],
+    order: [[0, "asc"]],
     columnDefs: [
       {"orderable": false, "targets": [7, 8]}
     ]
   });
-  self.bindUserGuiPreference({
-    jQueryObject: $(projectsTable),
-    event: 'length.dt',
-    preferenceName: 'admin-projects-datatable-length',
-    defaultValue: '10',
-    getter: function () {
-      return $(projectsTable).DataTable().page.len() + '';
-    },
-    setter: function (value) {
-      return $(projectsTable).DataTable().page.len(value).draw();
-    }
+  self.bindDataTablePageLengthToUserPreference({
+    element: projectsTable,
+    preferenceName: 'admin-projects-datatable-length'
   });
 
   $(projectsTable).on("click", "[name='removeProject']", function () {
@@ -190,7 +183,9 @@ MapsAdminPanel.prototype._createProjectTableRow = function () {
  */
 MapsAdminPanel.prototype.init = function () {
   var self = this;
-  return self.getServerConnector().getProjects().then(function (projects) {
+  return AbstractAdminPanel.prototype.init.call(self).then(function () {
+    return self.getServerConnector().getProjects();
+  }).then(function (projects) {
     return self.setProjects(projects);
   }).then(function () {
     return self.getServerConnector().getLoggedUser();
@@ -199,6 +194,13 @@ MapsAdminPanel.prototype.init = function () {
     var canAddProject = user.hasPrivilege(configuration.getPrivilegeType(PrivilegeType.IS_CURATOR)) ||
       user.hasPrivilege(configuration.getPrivilegeType(PrivilegeType.IS_ADMIN));
     $("[name='addProject']", self.getElement()).attr("disabled", !canAddProject);
+
+    var projectsTable = $("[name='projectsTable']", self.getElement())[0];
+
+    return self.bindDataTableOrderToUserPreference({
+      element: projectsTable,
+      preferenceName: 'admin-projects-datatable-order'
+    });
   });
 };
 

frontend-js/src/main/js/gui/admin/PluginAdminPanel.js

@@ -69,17 +69,9 @@ PluginAdminPanel.prototype._createGui = function () {
     }],
     order: [[1, "asc"]]
   });
-  self.bindUserGuiPreference({
-    jQueryObject: $(pluginsTable),
-    event: 'length.dt',
-    preferenceName: 'admin-plugins-datatable-length',
-    defaultValue: '10',
-    getter: function () {
-      return $(pluginsTable).DataTable().page.len() + '';
-    },
-    setter: function (value) {
-      return $(pluginsTable).DataTable().page.len(value).draw();
-    }
+  self.bindDataTablePageLengthToUserPreference({
+    element: pluginsTable,
+    preferenceName: 'admin-plugins-datatable-length'
   });
 
   $(pluginsTable).on("click", "[name='removePlugin']", function () {
@@ -150,6 +142,13 @@ PluginAdminPanel.prototype.init = function () {
     } else {
       self.disablePanel("You have no privilege to manage plugins");
     }
+  }).then(function () {
+    var pluginsTable = $("[name='pluginsTable']", self.getElement())[0];
+
+    return self.bindDataTableOrderToUserPreference({
+      element: pluginsTable,
+      preferenceName: 'admin-plugins-datatable-order'
+    });
   });
 };
 

frontend-js/src/main/js/gui/admin/UsersAdminPanel.js

@@ -137,17 +137,9 @@ UsersAdminPanel.prototype._createUsersTableRow = function () {
     ]
   });
 
-  self.bindUserGuiPreference({
-    jQueryObject: $(usersTable),
-    event: 'length.dt',
-    preferenceName: 'admin-users-datatable-length',
-    defaultValue: '10',
-    getter: function () {
-      return $(usersTable).DataTable().page.len() + '';
-    },
-    setter: function (value) {
-      return $(usersTable).DataTable().page.len(value).draw();
-    }
+  self.bindDataTablePageLengthToUserPreference({
+    element: usersTable,
+    preferenceName: 'admin-users-datatable-length'
   });
 
   $(usersTable).on("click", "[name='removeUser']", function () {
@@ -265,6 +257,14 @@ UsersAdminPanel.prototype.init = function () {
     } else {
       self.disablePanel("You have no privilege to manage users");
     }
+
+  }).then(function () {
+    var usersTable = $("[name='usersTable']", self.getElement())[0];
+
+    return self.bindDataTableOrderToUserPreference({
+      element: usersTable,
+      preferenceName: 'admin-users-datatable-order'
+    });
   });
 };
 

frontend-js/src/test/js/minerva-test.js

@@ -282,6 +282,7 @@ describe('minerva global', function () {
   });
 
   describe('createAdmin', function () {
+    this.timeout(3000);
     it('as admin', function () {
       helper.loginAsAdmin();
       var options = helper.createCustomMapOptions(null);