- find in layers

- change upadteAnnotation call to allow id updates

source/Ox.UI/js/Calendar/Ox.Calendar.js

@@ -841,9 +841,6 @@ Ox.Calendar = function(options, self) {
     }
 
     function getMouseDate(e) {
-        Ox.print('mousedate', e.clientX, that.offset().left, self.options.width, new Date(+self.options.date + (
-            e.clientX - that.offset().left - self.options.width / 2 - 1
-        ) * getSecondsPerPixel() * 1000))
         return new Date(+self.options.date + (
             e.clientX - that.offset().left - self.options.width / 2 - 1
         ) * getSecondsPerPixel() * 1000);

source/Ox.UI/js/Form/Ox.ArrayEditable.js

@@ -11,6 +11,7 @@ Ox.ArrayEditable = function(options, self) {
         .defaults({
             clickLink: null,
             editable: true,
+            highlight: null,
             itemName: 'item',
             items: [],
             maxHeight: void 0,
@@ -269,7 +270,11 @@ Ox.ArrayEditable = function(options, self) {
     }
 
     self.setOption = function(key, value) {
-        if (key == 'items') {
+        if (key == 'highlight') {
+            self.$items.forEach(function($item) {
+                $item.options({highlight: value})
+            });
+        } else if (key == 'items') {
             if (self.options.selected && getSelectedPosition() == -1) {
                 selectNone();
             }
@@ -318,7 +323,7 @@ Ox.ArrayEditable = function(options, self) {
     };
 
     that.editItem = function() {
-        Ox.print('AE EDIT ITEM')
+        Ox.Log('AE', 'EDIT ITEM', self.options.editable, self.options.selected);
         if (self.options.editable && self.options.selected) {
             self.editing = true;
             self.$items[self.selected].options({editing: true});

source/Ox.UI/js/Form/Ox.Editable.js

@@ -25,6 +25,7 @@ Ox.Editable = function(options, self) {
             editing: false,
             format: null,
             height: 0,
+            highlight: null,
             maxHeight: void 0,
             placeholder: '',
             submitOnBlur: true,
@@ -175,6 +176,9 @@ Ox.Editable = function(options, self) {
         } else if (self.options.format) {
             value = self.options.format(self.options.value)
         }
+        if (self.options.highlight) {
+            value = Ox.highlight(value, self.options.highlight, 'OxHighlight');
+        }
         return value;
     }
 
@@ -234,6 +238,8 @@ Ox.Editable = function(options, self) {
             self.$test && self.$test.css(css);
             self.$input && self.$input.css(css);
             self.$input && self.$input.find(self.options.type).css(css);
+        } else if (key == 'highlight') {
+            self.$value.html(formatValue());
         } else if (key == 'value') {
             self.$value.html(formatValue());
         }

source/Ox.UI/js/Video/Ox.AnnotationFolder.js

@@ -25,6 +25,7 @@ Ox.AnnotationFolder = function(options, self) {
             clickLink: null,
             collapsed: false,
             editable: false,
+            highlight: null,
             id: '',
             'in': 0,
             item: '',
@@ -205,6 +206,7 @@ Ox.AnnotationFolder = function(options, self) {
     self.$annotations = Ox.ArrayEditable({
             clickLink: self.options.clickLink,
             editable: self.options.editable,
+            highlight: self.highlight,
             items: self.annotations,
             placeholder: 'No ' + self.options.title,
             selected: self.options.selected,
@@ -479,6 +481,9 @@ Ox.AnnotationFolder = function(options, self) {
     }
 
     self.setOption = function(key, value) {
+        if (key == 'highlight') {
+            self.$annotations.options({highlight: value});
+        }
         if (['in', 'out'].indexOf(key) > -1 && self.editing) {
             var item = Ox.getObjectById(self.options.items, self.options.selected);
             item[key] = value;
@@ -528,7 +533,7 @@ Ox.AnnotationFolder = function(options, self) {
     addItem <f> addItem
     @*/
     that.addItem = function(item) {
-        Ox.print('FOLDER ADD ITEM', item)
+        Ox.Log('AF', 'FOLDER ADD ITEM', item)
         var pos = 0;
         self.options.items.splice(pos, 0, item);
         self.$panel.options({collapsed: false});
@@ -566,12 +571,13 @@ Ox.AnnotationFolder = function(options, self) {
     };
     */
 
-    that.updateItem = function(data) {
+    that.updateItem = function(id, data) {
-        var item = Ox.getObjectById(self.options.items, data.id);
+        var item = Ox.getObjectById(self.options.items, id);
         Ox.forEach(data, function(value, key) {
             item[key] = value;
         });
-        updateAnnotations();
+        self.options.selected = item.id;
+        self.$annotations.options({selected: self.options.selected});
         if (self.widget && item[self.options.type]) {
             // if updating has made the item match
             // an event or place, then select it

source/Ox.UI/js/Video/Ox.AnnotationPanel.js

@@ -13,6 +13,7 @@ Ox.AnnotationPanel = function(options, self) {
             clickLink: null,
             editable: false,
             font: 'small',
+            highlight: null,
             layers: [],
             mapSize: 256,
             range: 'all',
@@ -154,6 +155,7 @@ Ox.AnnotationPanel = function(options, self) {
                     collapsed: !self.options.showLayers[layer.id],
                     editable: self.options.editable,
                     font: self.options.font,
+                    highlight: self.options.highlight,
                     'in': self.options['in'],
                     out: self.options.out,
                     position: self.options.position,
@@ -308,7 +310,11 @@ Ox.AnnotationPanel = function(options, self) {
     }
 
     self.setOption = function(key, value) {
-        if (['in', 'out', 'position'].indexOf(key) > -1) {
+        if (key == 'highlight') {
+            self.$folder.forEach(function($folder) {
+                $folder.options({highlight: value});
+            });
+        } else if (['in', 'out', 'position'].indexOf(key) > -1) {
             self.$folder.forEach(function($folder) {
                 $folder.options(key, value);
             });
@@ -329,7 +335,7 @@ Ox.AnnotationPanel = function(options, self) {
     };
 
     that.addItem = function(layer, item) {
-        Ox.print('ADD ITEM', layer, item);
+        Ox.Log('AP', 'ADD ITEM', layer, item);
         var i = Ox.getIndexById(self.options.layers, layer);
         self.$folder[i].addItem(item);
     };
@@ -342,9 +348,10 @@ Ox.AnnotationPanel = function(options, self) {
         getFolder(self.options.selected).editItem();
     };
 
-    that.updateItem = function(item) {
+    that.updateItem = function(id, item) {
-        Ox.print('UPDATE ITEM', item);
+        Ox.Log('AP', 'UPDATE ITEM', id, item);
-        getFolder(item.id).updateItem(item);
+        self.options.selected = item.id;
+        getFolder(id).updateItem(id, item);
     };
 
     return that;

source/Ox.UI/js/Video/Ox.VideoEditor.js

@@ -181,28 +181,15 @@ Ox.VideoEditor = function(options, self) {
         });
     });
 
-    Ox.extend(self, {
+    self.$player = [];
-        $player: [],
+    self.$timeline = [];
-        $timeline: [],
+    self.controlsHeight = 16;
-        controlsHeight: 16,
+    self.editing = false;
-        editing: false,
+    self.margin = 8;
-        margin: 8,
+    self.words = getWords();
-    });
 
     Ox.print('VIDEO EDITOR OPTIONS', self.options)
 
-    self.words = [];
-    Ox.forEach(Ox.count(Ox.words(self.options.subtitles.map(function(subtitle) {
-        return subtitle.text;
-    }).join(' '))), function(count, word) {
-        self.words.push({count: count, word: word});
-    });
-    self.words = self.words.sort(function(a, b) {
-        return b.count - a.count;
-    }).map(function(obj) {
-        return obj.word;
-    });
-
     self.$editor = Ox.Element()
         .addClass('OxVideoEditor')
         .mousedown(function(e) {
@@ -549,7 +536,9 @@ Ox.VideoEditor = function(options, self) {
         .appendTo(self.$menubar);
 
     self.$findInput = Ox.Input({
-            autocomplete: self.words,
+            autocomplete: self.words.map(function(word) {
+                return word.value;
+            }),
             autocompleteReplace: true,
             autocompleteSelect: true,
             autocompleteSelectHighlight: true,
@@ -627,6 +616,7 @@ Ox.VideoEditor = function(options, self) {
         })
         .bindEvent({
             add: function(data) {
+                Ox.print('ADD EVENT REACHED EDITOR', data)
                 addAnnotation(data.layer);
             },
             annotationsfont: function(data) {
@@ -651,7 +641,8 @@ Ox.VideoEditor = function(options, self) {
             define: function(data) {
                 that.triggerEvent('define', data);
             },
-            edit: function() {
+            edit: function(data) {
+                Ox.print('EDIT EVENT REACHED EDITOR', data)
                 self.editing = true;
                 setTimelineState();
             },
@@ -660,7 +651,7 @@ Ox.VideoEditor = function(options, self) {
             },
             paused: togglePaused,
             remove: function(data) {
-                Ox.print('?>???', data)
+                Ox.print('REMOVE EVENT REACHED EDITOR', data)
                 var layer = Ox.getObjectById(self.options.layers, data.layer),
                     index = Ox.getIndexById(layer.items, data.id);
                 layer.items.splice(index, 1);
@@ -768,12 +759,25 @@ Ox.VideoEditor = function(options, self) {
         var results = [];
         if (query.length) {
             query = query.toLowerCase();
+            results = Ox.flatten(Ox.merge(self.options.layers.map(function(layer) {
+                return Ox.map(layer.items, function(item) {
+                    return Ox.decodeHTML(Ox.stripTags(
+                        item.value.toLowerCase()
+                    )).indexOf(query) > -1 ? {
+                        'in': item['in'],
+                        out: item.out
+                    } : null;
+                });
+            })));
+            Ox.print('RESULTS:', results)
+            /*
             results = Ox.map(self.options.subtitles, function(subtitle) {
                 return subtitle.text.toLowerCase().indexOf(query) > -1 ? {
                     'in': subtitle['in'],
                     out: subtitle.out
                 } : null;
             });
+            */
         }
         return results;
     }
@@ -948,6 +952,22 @@ Ox.VideoEditor = function(options, self) {
         return (!scrollbarIsVisible && height > self.options.height - 16) ? getSizes(true) : size;
     }
 
+    function getWords() {
+        var words = [];
+        Ox.forEach(Ox.count(Ox.words(
+            Ox.merge(self.options.layers.map(function(layer) {
+                return layer.items.map(function(item) {
+                    return item.value;
+                });
+            })).join(' ')
+        )), function(count, value) {
+            words.push({count: count, value: value});
+        })
+        return words.sort(function(a, b) {
+            return b.count - a.count;
+        });
+    }
+
     function goToPoint(point) {
         setPosition(self.options[point]);
     }
@@ -1148,6 +1168,7 @@ Ox.VideoEditor = function(options, self) {
             } else {
                 self.$findInput.focusInput(true);
             }
+            self.$annotationPanel.options({highlight: self.options.find});
         }
     }
 
@@ -1199,9 +1220,10 @@ Ox.VideoEditor = function(options, self) {
         self.$annotationPanel.addItem(layer, annotation);
     };
 
-    that.updateAnnotation = function(annotation) {
+    that.updateAnnotation = function(id, annotation) {
         // called from editannotation callback
-        self.$annotationPanel.updateItem(annotation);
+        self.options.selected = annotation.id;
+        self.$annotationPanel.updateItem(id, annotation);
     }
 
     /*@