Argument suggestions (#252)

* feature: Suggestions for inputs

* feature: #103 Completed suggestions support

webui.dev/js/ArgumentForm.js

@@ -64,6 +64,7 @@ class ArgumentForm extends window.HTMLElement {
       domArgumentWrapper.classList.add('argument-wrapper')
 
       domArgumentWrapper.appendChild(this.createDomLabel(arg))
+      domArgumentWrapper.appendChild(this.createDomSuggestions(arg))
       domArgumentWrapper.appendChild(this.createDomInput(arg))
       domArgumentWrapper.appendChild(this.createDomDescription(arg))
 
@@ -79,6 +80,29 @@ class ArgumentForm extends window.HTMLElement {
     return domLbl
   }
 
+  createDomSuggestions (arg) {
+    if (typeof arg.suggestions !== 'object' || arg.suggestions.length === 0) {
+      return document.createElement('span')
+    }
+
+    const ret = document.createElement('datalist')
+    ret.setAttribute('id', arg.name + '-choices')
+
+    for (const suggestion of Object.keys(arg.suggestions)) {
+      const opt = document.createElement('option')
+
+      opt.setAttribute('value', suggestion)
+
+      if (typeof arg.suggestions[suggestion] !== 'undefined' && arg.suggestions[suggestion].length > 0) {
+        opt.innerText = arg.suggestions[suggestion]
+      }
+
+      ret.appendChild(opt)
+    }
+
+    return ret
+  }
+
   createDomInput (arg) {
     let domEl = null
 
@@ -144,6 +168,10 @@ class ArgumentForm extends window.HTMLElement {
     domEl.name = arg.name
     domEl.value = arg.defaultValue
 
+    if (typeof arg.suggestions === 'object' && Object.keys(arg.suggestions).length > 0) {
+      domEl.setAttribute('list', arg.name + '-choices')
+    }
+
     this.argInputs.push(domEl)
 
     return domEl