0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

add Ox.ArrayEditable

Browse source
This commit is contained in:
rolux 2012-01-03 15:57:54 +05:30
commit d64e39c5b2
5 changed files with 61 additions and 52 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
source/Ox.UI/js/Menu/Ox.Menu.js
View file

@ -287,8 +287,10 @@ Ox.Menu = function(options, self) {
'min' in item ? item.min : 1, 'min' in item ? item.min : 1,
'max' in item ? item.max : 1 'max' in item ? item.max : 1
); );
self.optionGroupOffset[item.group] = i + offset; self.optionGroupOffset[item.group] = offset;
offset += items[i].length - 1; offset += items[i].length;
} else if ('id' in item) {
offset += 1;
} }
}); });
items = Ox.flatten(items); items = Ox.flatten(items);

27
source/Ox.UI/js/Video/Ox.AnnotationPanel.js
View file

@ -75,8 +75,12 @@ Ox.AnnotationPanel = function(options, self) {
edit: function() { edit: function() {
$item.removeClass('OxTarget'); $item.removeClass('OxTarget');
}, },
submit: function(data) { submit: function(newData) {
$item.addClass('OxTarget') $item.addClass('OxTarget');
updateAnnotation({
id: data.id,
value: newData.value
});
} }
}) })
) )
@ -102,8 +106,8 @@ Ox.AnnotationPanel = function(options, self) {
self.$annotations.editItem(pos); self.$annotations.editItem(pos);
} }
}, },
remove: function(data) { 'delete': function(data) {
that.triggerEvent('remove', data); that.triggerEvent('remove', {id: data.ids[0]});
}, },
select: selectAnnotation, select: selectAnnotation,
submit: updateAnnotation submit: updateAnnotation
@ -149,6 +153,7 @@ Ox.AnnotationPanel = function(options, self) {
} }
function updateAnnotation(data) { function updateAnnotation(data) {
Ox.print('updateAnnotation', data);
var item = Ox.getObjectById(self.options.items, data.id); var item = Ox.getObjectById(self.options.items, data.id);
item.value = data.value; item.value = data.value;
that.triggerEvent('submit', item); that.triggerEvent('submit', item);
@ -188,13 +193,6 @@ Ox.AnnotationPanel = function(options, self) {
self.$annotations.editItem(pos); self.$annotations.editItem(pos);
}; };
/*@
removeItems <f> removeItems
@*/
that.removeItems = function(ids) {
self.$annotations.removeItems(ids);
};
/*@ /*@
deselectItems <f> deselectItems deselectItems <f> deselectItems
@*/ @*/
@ -202,6 +200,13 @@ Ox.AnnotationPanel = function(options, self) {
self.$annotations.options('selected', []); self.$annotations.options('selected', []);
}; };
/*@
removeItems <f> removeItems
@*/
that.removeItem = function(id) {
self.$annotations.removeItems([id]);
};
return that; return that;
}; };

55
source/Ox.UI/js/Video/Ox.VideoEditor.js
View file

@ -323,11 +323,10 @@ Ox.VideoEditor = function(options, self) {
that.triggerEvent('addannotation', data); that.triggerEvent('addannotation', data);
}, },
remove: function(data) { remove: function(data) {
data = { that.triggerEvent('removeannotation', {
ids: [data], id: data.id,
layer: layer.id layer: layer.id
}; });
that.triggerEvent('removeannotations', data);
}, },
select: function(data) { select: function(data) {
self.options.layers.forEach(function(layer_, i_) { self.options.layers.forEach(function(layer_, i_) {
@ -339,7 +338,7 @@ Ox.VideoEditor = function(options, self) {
}); });
selectAnnotation(data); selectAnnotation(data);
}, },
submit: updateAnnotation submit: editAnnotation
}) })
.appendTo(self.$annotations); .appendTo(self.$annotations);
}); });
@ -410,16 +409,10 @@ Ox.VideoEditor = function(options, self) {
}); });
self.$videoMenuButton = Ox.MenuButton({ self.$videoMenuButton = Ox.MenuButton({
items: Ox.merge( items: [
[ {id: 'toggleSize', title: 'Large Player', checked: self.options.playerSize == 'large', keyboard: 'shift +'},
{id: 'toggleSize', title: 'Large Player', selected: self.options.playerSize == 'large', keyboard: 'shift +'}, {},
{} {group: 'resolution', min: 1, max: 1, items: self.resolutions},
],
{
'id': 'resolution', title:'Resolution',
items: [ { group: 'resolution', min: 1, max: 1, items: self.resolutions } ]
},
[
{}, {},
{id: 'largeTimeline', title: 'Hide Large Timeline', disabled: true}, {id: 'largeTimeline', title: 'Hide Large Timeline', disabled: true},
{id: 'subtitlesTimeline', title: 'Hide Subtitles on Large Timeline', disabled: true}, {id: 'subtitlesTimeline', title: 'Hide Subtitles on Large Timeline', disabled: true},
@ -429,8 +422,7 @@ Ox.VideoEditor = function(options, self) {
{id: 'embedSelection', title: 'Embed Selection...', disabled: true}, {id: 'embedSelection', title: 'Embed Selection...', disabled: true},
{}, {},
{id: 'keyboard', title: 'Keyboard Shortcuts...', keyboard: 'h'} {id: 'keyboard', title: 'Keyboard Shortcuts...', keyboard: 'h'}
] ],
),
style: 'square', style: 'square',
title: 'set', title: 'set',
tooltip: 'Actions and Settings', tooltip: 'Actions and Settings',
@ -440,9 +432,7 @@ Ox.VideoEditor = function(options, self) {
.bindEvent({ .bindEvent({
click: function(data) { click: function(data) {
var id = data.id; var id = data.id;
if (id == 'toggleSize') { if (id == 'keyboard') {
toggleSize();
} else if (id == 'keyboard') {
var dialog = Ox.Dialog({ var dialog = Ox.Dialog({
buttons: [ buttons: [
Ox.Button({id: 'close', title: 'Close'}) Ox.Button({id: 'close', title: 'Close'})
@ -454,7 +444,13 @@ Ox.VideoEditor = function(options, self) {
title: 'Keyboard Shortcuts', title: 'Keyboard Shortcuts',
width: 256 width: 256
}).open(); }).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.options.resolution = parseInt(data.checked[0].id);
self.$player[0].options({resolution: self.options.resolution}); self.$player[0].options({resolution: self.options.resolution});
} }
@ -717,6 +713,12 @@ Ox.VideoEditor = function(options, self) {
submitFindInput(self.options.find, true); submitFindInput(self.options.find, true);
}, 0); }, 0);
function editAnnotation(data) {
data['in'] = self.options['in'];
data.out = self.options.out;
that.triggerEvent('editannotation', data);
}
function find(query) { function find(query) {
var results = []; var results = [];
if (query.length) { if (query.length) {
@ -913,11 +915,6 @@ Ox.VideoEditor = function(options, self) {
setPoint('in', data['in']); setPoint('in', data['in']);
setPoint('out', data.out); setPoint('out', data.out);
} }
function updateAnnotation(data) {
data['in'] = self.options['in'];
data.out = self.options.out;
that.triggerEvent('updateannotation', data);
}
function select(type) { function select(type) {
self.options.points = getPoints(type); self.options.points = getPoints(type);
@ -1078,14 +1075,14 @@ Ox.VideoEditor = function(options, self) {
}; };
/*@ /*@
removeAnnotations <f> add annotation removeAnnotation <f> remove annotation
(layer, ids) -> <o> remove annotation from layer (layer, ids) -> <o> remove annotation from layer
layer <s> layer id layer <s> layer id
ids <a> array of item ids to remove ids <a> array of item ids to remove
@*/ @*/
that.removeAnnotations = function(layer, ids) { that.removeAnnotation = function(layer, id) {
var i = Ox.getPositionById(self.options.layers, layer); var i = Ox.getPositionById(self.options.layers, layer);
self.$annotationPanel[i].removeItems(ids); self.$annotationPanel[i].removeItem(id);
}; };
return that; return that;

3
source/Ox.UI/themes/classic/css/classic.css
View file

@ -340,6 +340,9 @@ Forms
background: -webkit-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192)); background: -webkit-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192));
} }
.OxThemeClassic .OxEditableElement.OxSelected {
background: rgb(208, 208, 208);
}
/* /*
================================================================================ ================================================================================

4
source/Ox.UI/themes/modern/css/modern.css
View file

@ -329,7 +329,9 @@ Forms
background: -webkit-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32) 10%, rgb(64, 64, 64)); 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);
}
/* /*
================================================================================ ================================================================================