diff --git a/source/Ox.UI/js/Menu/Ox.Menu.js b/source/Ox.UI/js/Menu/Ox.Menu.js index cd1c6059..229c6a9b 100644 --- a/source/Ox.UI/js/Menu/Ox.Menu.js +++ b/source/Ox.UI/js/Menu/Ox.Menu.js @@ -287,8 +287,10 @@ Ox.Menu = function(options, self) { 'min' in item ? item.min : 1, 'max' in item ? item.max : 1 ); - self.optionGroupOffset[item.group] = i + offset; - offset += items[i].length - 1; + self.optionGroupOffset[item.group] = offset; + offset += items[i].length; + } else if ('id' in item) { + offset += 1; } }); items = Ox.flatten(items); diff --git a/source/Ox.UI/js/Video/Ox.AnnotationPanel.js b/source/Ox.UI/js/Video/Ox.AnnotationPanel.js index 9d0a65b1..2e5053ff 100644 --- a/source/Ox.UI/js/Video/Ox.AnnotationPanel.js +++ b/source/Ox.UI/js/Video/Ox.AnnotationPanel.js @@ -75,8 +75,12 @@ Ox.AnnotationPanel = function(options, self) { edit: function() { $item.removeClass('OxTarget'); }, - submit: function(data) { - $item.addClass('OxTarget') + submit: function(newData) { + $item.addClass('OxTarget'); + updateAnnotation({ + id: data.id, + value: newData.value + }); } }) ) @@ -102,8 +106,8 @@ Ox.AnnotationPanel = function(options, self) { self.$annotations.editItem(pos); } }, - remove: function(data) { - that.triggerEvent('remove', data); + 'delete': function(data) { + that.triggerEvent('remove', {id: data.ids[0]}); }, select: selectAnnotation, submit: updateAnnotation @@ -149,6 +153,7 @@ Ox.AnnotationPanel = function(options, self) { } function updateAnnotation(data) { + Ox.print('updateAnnotation', data); var item = Ox.getObjectById(self.options.items, data.id); item.value = data.value; that.triggerEvent('submit', item); @@ -188,13 +193,6 @@ Ox.AnnotationPanel = function(options, self) { self.$annotations.editItem(pos); }; - /*@ - removeItems removeItems - @*/ - that.removeItems = function(ids) { - self.$annotations.removeItems(ids); - }; - /*@ deselectItems deselectItems @*/ @@ -202,6 +200,13 @@ Ox.AnnotationPanel = function(options, self) { self.$annotations.options('selected', []); }; + /*@ + removeItems removeItems + @*/ + that.removeItem = function(id) { + self.$annotations.removeItems([id]); + }; + return that; }; diff --git a/source/Ox.UI/js/Video/Ox.VideoEditor.js b/source/Ox.UI/js/Video/Ox.VideoEditor.js index a3bbc227..9c262186 100644 --- a/source/Ox.UI/js/Video/Ox.VideoEditor.js +++ b/source/Ox.UI/js/Video/Ox.VideoEditor.js @@ -323,11 +323,10 @@ Ox.VideoEditor = function(options, self) { that.triggerEvent('addannotation', data); }, remove: function(data) { - data = { - ids: [data], + that.triggerEvent('removeannotation', { + id: data.id, layer: layer.id - }; - that.triggerEvent('removeannotations', data); + }); }, select: function(data) { self.options.layers.forEach(function(layer_, i_) { @@ -339,7 +338,7 @@ Ox.VideoEditor = function(options, self) { }); selectAnnotation(data); }, - submit: updateAnnotation + submit: editAnnotation }) .appendTo(self.$annotations); }); @@ -410,27 +409,20 @@ Ox.VideoEditor = function(options, self) { }); self.$videoMenuButton = Ox.MenuButton({ - items: Ox.merge( - [ - {id: 'toggleSize', title: 'Large Player', selected: self.options.playerSize == 'large', keyboard: 'shift +'}, - {} - ], - { - 'id': 'resolution', title:'Resolution', - items: [ { group: 'resolution', min: 1, max: 1, items: self.resolutions } ] - }, - [ - {}, - {id: 'largeTimeline', title: 'Hide Large Timeline', disabled: true}, - {id: 'subtitlesTimeline', title: 'Hide Subtitles on Large Timeline', disabled: true}, - {}, - {id: 'downloadVideo', title: 'Download Video...', disabled: true}, - {id: 'downloadSelection', title: 'Download Selection...', disabled: true}, - {id: 'embedSelection', title: 'Embed Selection...', disabled: true}, - {}, - {id: 'keyboard', title: 'Keyboard Shortcuts...', keyboard: 'h'} - ] - ), + items: [ + {id: 'toggleSize', title: 'Large Player', checked: self.options.playerSize == 'large', keyboard: 'shift +'}, + {}, + {group: 'resolution', min: 1, max: 1, items: self.resolutions}, + {}, + {id: 'largeTimeline', title: 'Hide Large Timeline', disabled: true}, + {id: 'subtitlesTimeline', title: 'Hide Subtitles on Large Timeline', disabled: true}, + {}, + {id: 'downloadVideo', title: 'Download Video...', disabled: true}, + {id: 'downloadSelection', title: 'Download Selection...', disabled: true}, + {id: 'embedSelection', title: 'Embed Selection...', disabled: true}, + {}, + {id: 'keyboard', title: 'Keyboard Shortcuts...', keyboard: 'h'} + ], style: 'square', title: 'set', tooltip: 'Actions and Settings', @@ -440,9 +432,7 @@ Ox.VideoEditor = function(options, self) { .bindEvent({ click: function(data) { var id = data.id; - if (id == 'toggleSize') { - toggleSize(); - } else if (id == 'keyboard') { + if (id == 'keyboard') { var dialog = Ox.Dialog({ buttons: [ Ox.Button({id: 'close', title: 'Close'}) @@ -454,7 +444,13 @@ Ox.VideoEditor = function(options, self) { title: 'Keyboard Shortcuts', width: 256 }).open(); - } else if (id == 'resolution') { + } + }, + change: function(data) { + var id = data.id; + if (id == 'toggleSize') { + toggleSize(); + } else if (data.id == 'resolution') { self.options.resolution = parseInt(data.checked[0].id); self.$player[0].options({resolution: self.options.resolution}); } @@ -717,6 +713,12 @@ Ox.VideoEditor = function(options, self) { submitFindInput(self.options.find, true); }, 0); + function editAnnotation(data) { + data['in'] = self.options['in']; + data.out = self.options.out; + that.triggerEvent('editannotation', data); + } + function find(query) { var results = []; if (query.length) { @@ -913,11 +915,6 @@ Ox.VideoEditor = function(options, self) { setPoint('in', data['in']); setPoint('out', data.out); } - function updateAnnotation(data) { - data['in'] = self.options['in']; - data.out = self.options.out; - that.triggerEvent('updateannotation', data); - } function select(type) { self.options.points = getPoints(type); @@ -1078,14 +1075,14 @@ Ox.VideoEditor = function(options, self) { }; /*@ - removeAnnotations add annotation + removeAnnotation remove annotation (layer, ids) -> remove annotation from layer layer layer id ids array of item ids to remove @*/ - that.removeAnnotations = function(layer, ids) { + that.removeAnnotation = function(layer, id) { var i = Ox.getPositionById(self.options.layers, layer); - self.$annotationPanel[i].removeItems(ids); + self.$annotationPanel[i].removeItem(id); }; return that; diff --git a/source/Ox.UI/themes/classic/css/classic.css b/source/Ox.UI/themes/classic/css/classic.css index f19f073b..68d52e95 100644 --- a/source/Ox.UI/themes/classic/css/classic.css +++ b/source/Ox.UI/themes/classic/css/classic.css @@ -340,6 +340,9 @@ Forms background: -webkit-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192)); } +.OxThemeClassic .OxEditableElement.OxSelected { + background: rgb(208, 208, 208); +} /* ================================================================================ diff --git a/source/Ox.UI/themes/modern/css/modern.css b/source/Ox.UI/themes/modern/css/modern.css index f4f2ed1b..92a72109 100644 --- a/source/Ox.UI/themes/modern/css/modern.css +++ b/source/Ox.UI/themes/modern/css/modern.css @@ -329,7 +329,9 @@ Forms background: -webkit-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32) 10%, rgb(64, 64, 64)); } - +.OxThemeModern .OxEditableElement.OxSelected { + background: rgb(48, 48, 48); +} /* ================================================================================