editor view: fix invalid entity inputs; fix keyboard focus

source/UI/js/Form/Editable.js

@@ -66,6 +66,7 @@ Ox.Editable = function(options, self) {
             },
             value: function() {
                 self.$value.html(formatValue());
+                self.$input && self.$input.options({value: formatInputValue()});
             }
         })
         .addClass(

source/UI/js/Video/AnnotationFolder.js

@@ -342,6 +342,20 @@ Ox.AnnotationFolder = function(options, self) {
             ? self.$outer : that.$content
         );
 
+    [
+        '0', '1', '2', '3', '4', '5', '6', '7', '8', '9',
+        'b', 'backslash', 'closebracket', 'comma', 'dot',
+        'equal', 'f', 'g', 'h', 'i', 'minus', 'n', 'o',
+        'openbracket', 'p', 'shift_0', 'shift_equal',
+        'shift_g', 'shift_i', 'shift_minus', 'shift_o',
+        'slash', 'space'
+    ].forEach(function(key) {
+        key = 'key.' + key;
+        self.$annotations.bindEvent(key, function() {
+            that.triggerEvent(key);
+        });
+    });
+
     self.loaded = false;
     setTimeout(function() {
         self.$annotations.options({
@@ -445,14 +459,6 @@ Ox.AnnotationFolder = function(options, self) {
                 )
             );
         });
-        if (self.options.type == 'entity') {
-            annotations = annotations.map(function(annotation) {
-                annotation.value = '<a href="/entities/'
-                    + annotation.entity.id + '">'
-                    + annotation.value + '</a>';
-                return annotation;
-            });
-        }
         return annotations;
     }
 
@@ -723,9 +729,13 @@ Ox.AnnotationFolder = function(options, self) {
             });
             self.options.selected = item.id;
         }
-        if (self.options.type == 'entity' && Ox.isEmpty(data)) {
+        if (self.options.type == 'entity') {
-            // did not match any existing entity
+            // data.value is missing if input did not match any existing entity
-            self.$annotations.updateItem('');
+            if (data.value) {
+                self.$annotations.updateItem(data.value);
+            } else {
+                that.removeItem();
+            }
         }
         if (self.$widget) {
             // update may have made the item match,

source/UI/js/Video/AnnotationPanel.js

@@ -406,7 +406,8 @@ Ox.AnnotationPanel = function(options, self) {
                         layer.type == 'event' ? 'calendar' : 'map'
                     ), data);
                 }
-            });
+            })
+            .appendTo(self.$folders);
         [
             '0', '1', '2', '3', '4', '5', '6', '7', '8', '9',
             'b', 'backslash', 'closebracket', 'comma', 'dot',
@@ -415,12 +416,11 @@ Ox.AnnotationPanel = function(options, self) {
             'shift_g', 'shift_i', 'shift_minus', 'shift_o',
             'slash', 'space'
         ].forEach(function(key) {
-            key = 'key_' + key;
+            key = 'key.' + key;
             self.$folder[index].bindEvent(key, function() {
                 that.triggerEvent(key);
             });
         });
-        self.$folder[index].appendTo(self.$folders);
     }
 
     function renderFolders() {

source/UI/js/Video/VideoAnnotationPanel.js

@@ -911,7 +911,7 @@ Ox.VideoAnnotationPanel = function(options, self) {
         'shift_g', 'shift_i', 'shift_minus', 'shift_o',
         'slash', 'space'
     ].forEach(function(key) {
-        key = 'key_' + key;
+        key = 'key.' + key;
         self.$annotationPanel.bindEvent(key, function() {
             that.triggerEvent(key);
         });