From 724d22e14fd58e41029849c4e0365faa011384d0 Mon Sep 17 00:00:00 2001 From: j <0x006A@0x2620.org> Date: Tue, 3 Jan 2012 01:37:32 +0530 Subject: [PATCH 1/5] inline resolution selection again --- source/Ox.UI/js/Video/Ox.VideoEditor.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/source/Ox.UI/js/Video/Ox.VideoEditor.js b/source/Ox.UI/js/Video/Ox.VideoEditor.js index a3bbc227..4ea11cfa 100644 --- a/source/Ox.UI/js/Video/Ox.VideoEditor.js +++ b/source/Ox.UI/js/Video/Ox.VideoEditor.js @@ -415,10 +415,7 @@ Ox.VideoEditor = function(options, self) { {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 } ] - }, + { group: 'resolution', min: 1, max: 1, items: self.resolutions }, [ {}, {id: 'largeTimeline', title: 'Hide Large Timeline', disabled: true}, From f8895e259ca2f259c536b7515fb9e113fd30bb6c Mon Sep 17 00:00:00 2001 From: j <0x006A@0x2620.org> Date: Tue, 3 Jan 2012 01:50:09 +0530 Subject: [PATCH 2/5] flatten video actions and settings menu --- source/Ox.UI/js/Video/Ox.VideoEditor.js | 32 +++++++++++-------------- 1 file changed, 14 insertions(+), 18 deletions(-) diff --git a/source/Ox.UI/js/Video/Ox.VideoEditor.js b/source/Ox.UI/js/Video/Ox.VideoEditor.js index 4ea11cfa..f4544970 100644 --- a/source/Ox.UI/js/Video/Ox.VideoEditor.js +++ b/source/Ox.UI/js/Video/Ox.VideoEditor.js @@ -410,24 +410,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 +'}, - {} - ], - { 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', selected: 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', From a7b14f9e0a644ec9aa050f86ab0df8c67dab42f1 Mon Sep 17 00:00:00 2001 From: j <0x006A@0x2620.org> Date: Tue, 3 Jan 2012 13:05:22 +0530 Subject: [PATCH 3/5] fix optionsGroupOffset for multiple groups and seperators --- source/Ox.UI/js/Menu/Ox.Menu.js | 6 ++++-- source/Ox.UI/js/Video/Ox.VideoEditor.js | 6 +++++- 2 files changed, 9 insertions(+), 3 deletions(-) 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.VideoEditor.js b/source/Ox.UI/js/Video/Ox.VideoEditor.js index f4544970..d88d115c 100644 --- a/source/Ox.UI/js/Video/Ox.VideoEditor.js +++ b/source/Ox.UI/js/Video/Ox.VideoEditor.js @@ -447,7 +447,11 @@ Ox.VideoEditor = function(options, self) { title: 'Keyboard Shortcuts', width: 256 }).open(); - } else if (id == 'resolution') { + } + }, + change: function(data) { + Ox.print('CHANGE', data); + if (data.id == 'resolution') { self.options.resolution = parseInt(data.checked[0].id); self.$player[0].options({resolution: self.options.resolution}); } From 969daf07e545b3c50d5ce7034da9321c12bce26a Mon Sep 17 00:00:00 2001 From: j <0x006A@0x2620.org> Date: Tue, 3 Jan 2012 13:24:29 +0530 Subject: [PATCH 4/5] toggle size --- source/Ox.UI/js/Video/Ox.VideoEditor.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/source/Ox.UI/js/Video/Ox.VideoEditor.js b/source/Ox.UI/js/Video/Ox.VideoEditor.js index d88d115c..427e13d0 100644 --- a/source/Ox.UI/js/Video/Ox.VideoEditor.js +++ b/source/Ox.UI/js/Video/Ox.VideoEditor.js @@ -411,7 +411,7 @@ Ox.VideoEditor = function(options, self) { self.$videoMenuButton = Ox.MenuButton({ items: [ - {id: 'toggleSize', title: 'Large Player', selected: self.options.playerSize == 'large', keyboard: 'shift +'}, + {id: 'toggleSize', title: 'Large Player', checked: self.options.playerSize == 'large', keyboard: 'shift +'}, {}, {group: 'resolution', min: 1, max: 1, items: self.resolutions}, {}, @@ -433,9 +433,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'}) @@ -450,8 +448,10 @@ Ox.VideoEditor = function(options, self) { } }, change: function(data) { - Ox.print('CHANGE', data); - if (data.id == 'resolution') { + 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}); } From 815ae5d253c4bde646c60aa35b3acaa718efe41d Mon Sep 17 00:00:00 2001 From: rlx <0x0073@0x2620.org> Date: Tue, 3 Jan 2012 15:56:15 +0530 Subject: [PATCH 5/5] update video editor / annotation panel --- source/Ox.UI/js/Video/Ox.AnnotationPanel.js | 27 ++++++++++++--------- source/Ox.UI/js/Video/Ox.VideoEditor.js | 26 ++++++++++---------- source/Ox.UI/themes/classic/css/classic.css | 3 +++ source/Ox.UI/themes/modern/css/modern.css | 4 ++- 4 files changed, 35 insertions(+), 25 deletions(-) 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 427e13d0..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); }); @@ -714,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) { @@ -910,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); @@ -1075,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); +} /* ================================================================================