Dropdown 'Select a Module' fix (#1352)

* Update demo.js

* Codeclimate

* Update demo.js

* Code comments

* Comments codestyle

* Update demo.js

examples/demo.js

@@ -8,7 +8,29 @@ var defaultHtmlSequencerUi = require('./lib/defaultHtmlSequencerUi.js'),
 window.onload = function () {
   sequencer = ImageSequencer();
 
-  function refreshOptions() {
+  options = {
+      sortField: 'text',
+      openOnFocus: false,
+      onInitialize: function () {
+          this.$control.on("click", () => {
+            this.ignoreFocusOpen = true;
+            setTimeout(() => { 
+              // Trigger onFocus and open dropdown.
+              this.ignoreFocusOpen = false;
+            }, 50);
+          });
+      }, 
+      // Open dropdown after timeout of onClick.
+      onFocus: function () {
+          if (!this.ignoreFocusOpen) {
+              this.open();
+          }
+      }
+  }
+
+  function refreshOptions(options) {
+    // Default options if parameter is empty.
+    if (options == undefined) options = { sortField: 'text' };
     // Load information of all modules (Name, Inputs, Outputs)
     var modulesInfo = sequencer.modulesInfo();
 
@@ -24,11 +46,9 @@ window.onload = function () {
     }
     // Null option
     addStepSelect.append('<option value="" disabled selected>Select a Module</option>');
-    addStepSelect.selectize({
+    addStepSelect.selectize(options);
-      sortField: 'text'
-    });
   }
-  refreshOptions();
+  refreshOptions(options);
 
   $(window).on('scroll', scrollFunction);
 
@@ -304,4 +324,4 @@ window.onload = function () {
   } else {
     insertPreview.updatePreviews('images/tulips.png', '#addStep');
   }
-};
+};