From fd964232666fb1d3b2c9fb2c6af9c44632f5c6d6 Mon Sep 17 00:00:00 2001 From: j <0x006A@0x2620.org> Date: Tue, 31 Jan 2012 10:57:09 +0000 Subject: [PATCH] - find in layers - change upadteAnnotation call to allow id updates --- source/Ox.UI/js/Calendar/Ox.Calendar.js | 3 - source/Ox.UI/js/Form/Ox.ArrayEditable.js | 9 ++- source/Ox.UI/js/Form/Ox.Editable.js | 6 ++ source/Ox.UI/js/Video/Ox.AnnotationFolder.js | 14 ++-- source/Ox.UI/js/Video/Ox.AnnotationPanel.js | 17 +++-- source/Ox.UI/js/Video/Ox.VideoEditor.js | 70 +++++++++++++------- 6 files changed, 81 insertions(+), 38 deletions(-) diff --git a/source/Ox.UI/js/Calendar/Ox.Calendar.js b/source/Ox.UI/js/Calendar/Ox.Calendar.js index 90448ebb..35d6dcd1 100644 --- a/source/Ox.UI/js/Calendar/Ox.Calendar.js +++ b/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); diff --git a/source/Ox.UI/js/Form/Ox.ArrayEditable.js b/source/Ox.UI/js/Form/Ox.ArrayEditable.js index 70861f78..153f9dd0 100644 --- a/source/Ox.UI/js/Form/Ox.ArrayEditable.js +++ b/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}); diff --git a/source/Ox.UI/js/Form/Ox.Editable.js b/source/Ox.UI/js/Form/Ox.Editable.js index 6b64c19e..01f82203 100644 --- a/source/Ox.UI/js/Form/Ox.Editable.js +++ b/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()); } diff --git a/source/Ox.UI/js/Video/Ox.AnnotationFolder.js b/source/Ox.UI/js/Video/Ox.AnnotationFolder.js index 5a4f0cf5..307fb273 100644 --- a/source/Ox.UI/js/Video/Ox.AnnotationFolder.js +++ b/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 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) { - var item = Ox.getObjectById(self.options.items, data.id); + that.updateItem = function(id, data) { + 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 diff --git a/source/Ox.UI/js/Video/Ox.AnnotationPanel.js b/source/Ox.UI/js/Video/Ox.AnnotationPanel.js index 132c8391..3c17bffc 100644 --- a/source/Ox.UI/js/Video/Ox.AnnotationPanel.js +++ b/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) { - Ox.print('UPDATE ITEM', item); - getFolder(item.id).updateItem(item); + that.updateItem = function(id, item) { + Ox.Log('AP', 'UPDATE ITEM', id, item); + self.options.selected = item.id; + getFolder(id).updateItem(id, item); }; return that; diff --git a/source/Ox.UI/js/Video/Ox.VideoEditor.js b/source/Ox.UI/js/Video/Ox.VideoEditor.js index 11572e97..cc88fac7 100644 --- a/source/Ox.UI/js/Video/Ox.VideoEditor.js +++ b/source/Ox.UI/js/Video/Ox.VideoEditor.js @@ -181,28 +181,15 @@ Ox.VideoEditor = function(options, self) { }); }); - Ox.extend(self, { - $player: [], - $timeline: [], - controlsHeight: 16, - editing: false, - margin: 8, - }); + self.$player = []; + self.$timeline = []; + self.controlsHeight = 16; + self.editing = false; + self.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); } /*@