Update droplab

2 files changed, 26 insertions, 4 deletions

diff --git a/app/assets/javascripts/droplab/droplab.js b/app/assets/javascripts/droplab/droplab.js
index 56582e71b61..aff47aa23cf 100644
--- a/app/assets/javascripts/droplab/droplab.js
+++ b/app/assets/javascripts/droplab/droplab.js
@@ -51,13 +51,15 @@ Object.assign(DropDown.prototype, {
     var self = this;
     // event delegation.
     this.list.addEventListener('click', function(e) {
-      if(e.target.tagName === 'A' || e.target.tagName === 'button') {
+      // climb up the tree to find the LI
+      var selected = utils.closest(e.target, 'LI');
+      if(selected) {
         e.preventDefault();
         self.hide();
         var listEvent = new CustomEvent('click.dl', {
           detail: {
             list: self,
-            selected: e.target,
+            selected: selected,
             data: e.target.dataset,
           },
         });
@@ -102,6 +104,15 @@ Object.assign(DropDown.prototype, {
       var html = utils.t(sampleItem.outerHTML, dat);
       var template = document.createElement('template');
       template.innerHTML = html;
+
+      // Help set the image src template
+      var imageTags = template.content.querySelectorAll('img[data-src]');
+      for(var i = 0; i < imageTags.length; i++) {
+        var imageTag = imagetags[i];
+        imageTag.src = imageTag.getAttribute('data-src');
+        imageTag.removeAttribute('data-src');
+      }
+
       if(dat.hasOwnProperty('droplab_hidden') && dat.droplab_hidden){
         template.content.firstChild.style.display = 'none'
       }else{
@@ -115,6 +126,9 @@ Object.assign(DropDown.prototype, {
     } else {
       this.list.innerHTML = newChildren.join('');  
     }
+
+    // Show dropdown if there is data
+    data !== [] ? this.show() : this.hide();
   },
 
   show: function() {
@@ -221,6 +235,7 @@ require('./window')(function(w){
             // Restore initial State
             hook.list.list.innerHTML = hook.list.initialState;
             hook.list.hide();
+
             hook.trigger.removeEventListener('mousedown', hook.events.mousedown);
             hook.trigger.removeEventListener('input', hook.events.input);
             hook.trigger.removeEventListener('keyup', hook.events.keyup);
diff --git a/app/assets/javascripts/droplab/droplab_ajax.js b/app/assets/javascripts/droplab/droplab_ajax.js
index 23e43b352d6..2dff5b83fae 100644
--- a/app/assets/javascripts/droplab/droplab_ajax.js
+++ b/app/assets/javascripts/droplab/droplab_ajax.js
@@ -3,6 +3,7 @@
 /* global droplab */
 droplab.plugin(function init(DropLab) {
   var _addData = DropLab.prototype.addData;
+  var _setData = DropLab.prototype.setData;
 
   var _loadUrlData = function(url) {
     return new Promise(function(resolve, reject) {
@@ -24,10 +25,16 @@ droplab.plugin(function init(DropLab) {
 
   Object.assign(DropLab.prototype, {
     addData: function(trigger, data) {
+      this.processData(trigger, data, _addData);
+    },
+    setData: function(trigger, data) {
+      this.processData(trigger, data, _setData);
+    },
+    processData: function(trigger, data, methodName) {
       var _this = this;
       if('string' === typeof data) {
         _loadUrlData(data).then(function(d) {
-          _addData.call(_this, trigger, d);
+          methodName.call(_this, trigger, d);
         }).catch(function(e) {
           if(e.message)
             console.error(e.message, e.stack); // eslint-disable-line no-console
@@ -35,7 +42,7 @@ droplab.plugin(function init(DropLab) {
             console.error(e); // eslint-disable-line no-console
         })
       } else {
-        _addData.apply(this, arguments);
+        methodName.apply(this, arguments);
       }
     },
   });