12479: Updated example vocabulary. Attempt to show all the items

[arvados.git] / apps / workbench / app / assets / javascripts / components / edit_tags.js

diff --git a/apps/workbench/app/assets/javascripts/components/edit_tags.js b/apps/workbench/app/assets/javascripts/components/edit_tags.js
index 6ac4a9bb2c0ee86e97a5989fd9953400c30775e7..4feef77ecdaa32bf26a5ca52e2033681830867e0 100644 (file)
--- a/apps/workbench/app/assets/javascripts/components/edit_tags.js
+++ b/apps/workbench/app/assets/javascripts/components/edit_tags.js
@@ -35,14 +35,18 @@ window.SelectOrAutocomplete = {
         vnode.state.awesomplete = new Awesomplete(vnode.dom, {
             list: vnode.attrs.options,
             minChars: 0,
+            maxItems: 1000000,
             autoFirst: true,
+            sort: false,
         })
+        vnode.state.create = vnode.attrs.create
+        vnode.state.options = vnode.attrs.options
         // Option is selected from the list.
         $(vnode.dom).on('awesomplete-selectcomplete', function(event) {
             vnode.attrs.value(this.value)
         })
         $(vnode.dom).on('change', function(event) {
-            if (!vnode.attrs.create && !(this.value in vnode.attrs.options)) {
+            if (!vnode.state.create && !(this.value in vnode.state.options)) {
                 this.value = vnode.attrs.value()
             } else {
                 if (vnode.attrs.value() !== this.value) {
@@ -51,16 +55,16 @@ window.SelectOrAutocomplete = {
             }
         })
         $(vnode.dom).on('focusin', function(event) {
-            // Open list when focusing on empty strict fields
-            if (!vnode.attrs.create && this.value === '') {
-                // minChars = 0 && evaluate() makes the list open without
-                // input events
+            if (this.value === '') {
                 vnode.state.awesomplete.evaluate()
+                vnode.state.awesomplete.open()
             }
         })
     },
     onupdate: function(vnode) {
         vnode.state.awesomplete.list = vnode.attrs.options
+        vnode.state.create = vnode.attrs.create
+        vnode.state.options = vnode.attrs.options
     },
 }
 
@@ -174,16 +178,8 @@ window.TagEditorApp = {
         var tag = {name: m.stream(name), value: m.stream(value), rowKey: uniqueID++}
         vnode.state.tags.push(tag)
         // Set dirty flag when any of name/value changes to non empty string
-        tag.name.map(function(v) {
-            if (v !== '') {
-                vnode.state.dirty(true)
-            }
-        })
-        tag.value.map(function(v) {
-            if (v !== '') {
-                vnode.state.dirty(true)
-            }
-        })
+        tag.name.map(function() { vnode.state.dirty(true) })
+        tag.value.map(function() { vnode.state.dirty(true) })
         tag.name.map(m.redraw)
     },
     oninit: function(vnode) {
@@ -211,6 +207,9 @@ window.TagEditorApp = {
                     Object.keys(o.properties).forEach(function(k) {
                         vnode.state.appendTag(vnode, k, o.properties[k])
                     })
+                    if (vnode.state.editMode) {
+                        vnode.state.appendTag(vnode, '', '')
+                    }
                     // Data synced with server, so dirty state should be false
                     vnode.state.dirty(false)
                     // Add new tag row when the last one is completed
@@ -236,7 +235,8 @@ window.TagEditorApp = {
                     onclick: function(e) {
                         var tags = {}
                         vnode.state.tags.forEach(function(t) {
-                            if (t.name() != '' && t.value() != '') {
+                            // Only ignore tags with empty key
+                            if (t.name() != '') {
                                 tags[t.name()] = t.value()
                             }
                         })