diff options
Diffstat (limited to 'app')
4 files changed, 27 insertions, 0 deletions
diff --git a/app/assets/javascripts/droplab/droplab_ajax.js b/app/assets/javascripts/droplab/droplab_ajax.js index b81663c281d..629260006f3 100644 --- a/app/assets/javascripts/droplab/droplab_ajax.js +++ b/app/assets/javascripts/droplab/droplab_ajax.js @@ -23,6 +23,7 @@ require('../window')(function(w){ }, init: function init(hook) { + var self = this; var config = hook.config.droplabAjax; if (!config || !config.endpoint || !config.method) { @@ -33,7 +34,21 @@ require('../window')(function(w){ return; } + if (config.loadingTemplate) { + var dynamicList = hook.list.list.querySelector('[data-dynamic]'); + + var loadingTemplate = document.createElement('div'); + loadingTemplate.innerHTML = config.loadingTemplate; + loadingTemplate.setAttribute('data-loading-template', true); + + this.listTemplate = dynamicList.outerHTML; + dynamicList.outerHTML = loadingTemplate.outerHTML; + } + this._loadUrlData(config.endpoint).then(function(d) { + if (config.loadingTemplate) { + hook.list.list.querySelector('[data-loading-template]').outerHTML = self.listTemplate; + } hook.list[config.method].call(hook.list, d); }).catch(function(e) { if(e.message) { diff --git a/app/assets/javascripts/filtered_search/dropdown_label.js.es6 b/app/assets/javascripts/filtered_search/dropdown_label.js.es6 index 4c9926c1f78..0912336b6cf 100644 --- a/app/assets/javascripts/filtered_search/dropdown_label.js.es6 +++ b/app/assets/javascripts/filtered_search/dropdown_label.js.es6 @@ -10,6 +10,10 @@ droplabAjax: { endpoint: 'labels.json', method: 'setData', + loadingTemplate: ` + <div class="filter-dropdown-loading"> + <i class="fa fa-spinner fa-spin"></i> + </div>`, }, droplabFilter: { filterFunction: this.filterWithSymbol.bind(this, '~'), diff --git a/app/assets/javascripts/filtered_search/dropdown_milestone.js.es6 b/app/assets/javascripts/filtered_search/dropdown_milestone.js.es6 index 33967ddff24..73d67573868 100644 --- a/app/assets/javascripts/filtered_search/dropdown_milestone.js.es6 +++ b/app/assets/javascripts/filtered_search/dropdown_milestone.js.es6 @@ -10,6 +10,10 @@ droplabAjax: { endpoint: 'milestones.json', method: 'setData', + loadingTemplate: ` + <div class="filter-dropdown-loading"> + <i class="fa fa-spinner fa-spin"></i> + </div>`, }, droplabFilter: { filterFunction: this.filterWithSymbol.bind(this, '%'), diff --git a/app/assets/stylesheets/framework/filters.scss b/app/assets/stylesheets/framework/filters.scss index 205cecb4906..b6c137d647a 100644 --- a/app/assets/stylesheets/framework/filters.scss +++ b/app/assets/stylesheets/framework/filters.scss @@ -121,3 +121,7 @@ .hint-dropdown { width: 250px; } + +.filter-dropdown-loading { + padding: 8px 16px; +} |