publish muk_web_searchpanel - 12.0

muk_web_searchpanel/__manifest__.py

@@ -20,7 +20,7 @@
 {
     'name': 'MuK Search Panel',
     'summary': 'Kanban Search Panel',
-    'version': '12.0.1.0.3',
+    'version': '12.0.1.1.0',
     'category': 'Extra Tools',
     'license': 'AGPL-3',
     'author': 'MuK IT',

muk_web_searchpanel/doc/changelog.rst

@@ -1,3 +1,10 @@
+`1.1.0`
+-------
+
+- Lazy Loading on long requests
+
+`1.0.0`
 -------
 
 - Init version
+

muk_web_searchpanel/static/src/js/kanban_searchpanel.js

@@ -60,16 +60,41 @@ var SearchPanel = Widget.extend({
         this.fields = params.fields;
         this.model = params.model;
         this.searchDomain = params.searchDomain;
+        
+        this.loadProm = $.Deferred();
+        this.loadPromLazy = true;
     },
     willStart: function () {
         var self = this;
-        var loadProm = this._fetchCategories().then(function () {
-            return self._fetchFilters();
+        var loading = $.Deferred();
+        var loadPromTimer = setTimeout(function () {
+        	if(loading.state() !== 'resolved') {
+        		loading.resolve();
+        	}
+        }, this.loadPromMaxTime || 250);
+        this._fetchCategories().then(function () {
+            self._fetchFilters().then(function () {
+            	if(loading.state() !== 'resolved') {
+                	clearTimeout(loadPromTimer);
+                	self.loadPromLazy = false;
+                	loading.resolve();
+            	}
+            	self.loadProm.resolve();
             });
-        return $.when(loadProm, this._super.apply(this, arguments));
+        });
+        return $.when(loading, this._super.apply(this, arguments));
     },
     start: function () {
-        this._render();
+        var self = this;
+        if(this.loadProm.state() !== 'resolved') {
+        	this.$el.html($("<div/>", {
+        		'class': "o_search_panel_loading",
+        		'html': "<i class='fa fa-spinner fa-pulse' />"
+        	}));
+    	}
+        this.loadProm.then(function() {
+    		self._render();
+    	});
         return this._super.apply(this, arguments);
     },
 
@@ -93,15 +118,18 @@ var SearchPanel = Widget.extend({
      * @returns {$.Promise}
      */
     update: function (params) {
-        var currentSearchDomainStr = JSON.stringify(this.searchDomain);
+        if(this.loadProm.state() === 'resolved') {
         	var newSearchDomainStr = JSON.stringify(params.searchDomain);
-        var def;
+            var currentSearchDomainStr = JSON.stringify(this.searchDomain);
             if (this.needReload || (currentSearchDomainStr !== newSearchDomainStr)) {
                 this.needReload = false;
                 this.searchDomain = params.searchDomain;
-            def = this._fetchFilters();
+                this._fetchFilters().then(this._render.bind(this));
+            } else {
+                this._render();
             }
-        return $.when(def).then(this._render.bind(this));
+        }
+        return $.when();
     },
 
     //--------------------------------------------------------------------------
@@ -138,7 +166,9 @@ var SearchPanel = Widget.extend({
             var value = category.values[valueId];
             return value.parentId === false;
         });
+        category.activeValueId = false;
         
+        if(!this.loadPromLazy) {
 	        // set active value
 	        var validValues = _.pluck(category.values, 'id').concat([false]);
 	        // set active value from context
@@ -149,6 +179,7 @@ var SearchPanel = Widget.extend({
 	            var storageKey = this._getLocalStorageKey(category);
 	            value = this.call('local_storage', 'getItem', storageKey);
 	        }
+	        
 	        // if not set in localStorage either, select 'All'
 	        category.activeValueId = _.contains(validValues, value) ? value : false;
 	        
@@ -159,6 +190,7 @@ var SearchPanel = Widget.extend({
 	                category.values[parentValue].folded = false;
 	            });
 	        }
+        }
     },
     /**
      * @private
@@ -246,6 +278,8 @@ var SearchPanel = Widget.extend({
                         filter_domain: filterDomain,
                         search_domain: self.searchDomain,
                     },
+                }, {
+                	shadow: true,
                 }).then(function (result) {
                     category.parentField = result.parent_field;
                     return result.values;
@@ -287,6 +321,8 @@ var SearchPanel = Widget.extend({
                     group_by: filter.groupBy || false,
                     search_domain: self.searchDomain,
                 },
+            }, {
+            	shadow: true,
             }).then(function (values) {
                 self._createFilterTree(filterId, values);
             });
@@ -305,6 +341,11 @@ var SearchPanel = Widget.extend({
             var category = self.categories[categoryId];
             if (category.activeValueId) {
                 domain.push([category.fieldName, '=', category.activeValueId]);
+            } else if(self.loadPromLazy && self.loadProm.state() !== 'resolved') {
+            	var value = self.defaultCategoryValues[category.fieldName];
+            	if (value) {
+            		domain.push([category.fieldName, '=', value]);
+            	}
             }
             return domain;
         }
@@ -447,7 +488,6 @@ var SearchPanel = Widget.extend({
      */
     _notifyDomainUpdated: function () {
         this.needReload = true;
-        console.log(this)
         this.trigger_up('search_panel_domain_updated', {
             domain: this.getDomain(),
         });

muk_web_searchpanel/static/src/scss/kanban_view.scss

@@ -37,6 +37,20 @@
         padding: $o-searchpanel-p-small $o-searchpanel-p-small $o-searchpanel-p*2 $o-searchpanel-p;
         border-right: 1px solid $gray-300;
         background-color: white;
+        position: relative;
+
+		.o_search_panel_loading {
+		    position: absolute;
+		    margin-top: -30px;
+		    margin-left: -30px;
+		    margin-bottom: 0;
+		    margin-right: 0;
+		    font-size: 60px;
+		    height: 60px;
+			width: 60px;
+		    left: 50%;
+		    top: 50%;
+		}
 
         .o_search_panel_category .o_search_panel_section_icon {
             color: $o-searchpanel-category-default-color;