fix video editor bugs

This commit is contained in:
rlx 2012-02-04 11:44:19 +00:00
parent 3c94f44a99
commit 76466e7eeb
6 changed files with 63 additions and 47 deletions

View file

@ -440,7 +440,7 @@ Ox.Element = function(options, self) {
'mousedown', 'mouserepeat', 'anyclick', 'singleclick', 'doubleclick', 'mousedown', 'mouserepeat', 'anyclick', 'singleclick', 'doubleclick',
'dragstart', 'drag', 'dragenter', 'dragleave', 'dragpause', 'dragend', 'dragstart', 'drag', 'dragenter', 'dragleave', 'dragpause', 'dragend',
'draganddropstart', 'draganddrop', 'draganddropenter', 'draganddropleave', 'draganddropend', 'draganddropstart', 'draganddrop', 'draganddropenter', 'draganddropleave', 'draganddropend',
'playing', 'position', 'progress' 'playing', 'position', 'progress', 'request'
].indexOf(event) == -1) { ].indexOf(event) == -1) {
if (!/^pandora_/.test(event)) { if (!/^pandora_/.test(event)) {
Ox.Log('EVENT', that.id, self.options.id, 'trigger', event, data); Ox.Log('EVENT', that.id, self.options.id, 'trigger', event, data);

View file

@ -143,7 +143,9 @@ Ox.ArrayEditable = function(options, self) {
cancel: function(data) { cancel: function(data) {
self.editing = false; self.editing = false;
that.gainFocus(); that.gainFocus();
that.triggerEvent('blur', data); data.value === ''
? submitItem(i, '')
: that.triggerEvent('blur', data);
}, },
change: function(data) { change: function(data) {
that.triggerEvent('change', { that.triggerEvent('change', {
@ -190,7 +192,7 @@ Ox.ArrayEditable = function(options, self) {
self.editing = false; self.editing = false;
that.blurItem(); that.blurItem();
} }
Ox.print('SELECT ITEM', self.options.selected, self.selected); Ox.print('AE SELECT ITEM', self.options.selected, self.selected);
that.find('.OxSelected').removeClass('OxSelected'); that.find('.OxSelected').removeClass('OxSelected');
self.selected > -1 && self.$items[self.selected].addClass('OxSelected'); self.selected > -1 && self.$items[self.selected].addClass('OxSelected');
triggerSelectEvent(); triggerSelectEvent();

View file

@ -44,7 +44,7 @@ Ox.IconItem = function(options, self) {
}) })
.options(options || {}); .options(options || {});
Ox.print('ICON ITEM FIND', self.options.find) //Ox.print('ICON ITEM FIND', self.options.find)
Ox.extend(self, { Ox.extend(self, {
fontSize: self.options.itemWidth == 64 ? 6 : 9, fontSize: self.options.itemWidth == 64 ? 6 : 9,

View file

@ -285,7 +285,9 @@ Ox.AnnotationFolder = function(options, self) {
} }
function crossesPoint() { function crossesPoint() {
var sort = [self.position, self.options.position].sort(), var sort = [self.position, self.options.position].sort(function(a, b) {
return a - b
}),
positionA = sort[0], positionA = sort[0],
positionB = sort[1]; positionB = sort[1];
return self.points.some(function(point) { return self.points.some(function(point) {
@ -389,9 +391,9 @@ Ox.AnnotationFolder = function(options, self) {
function getSort() { function getSort() {
return ({ return ({
duration: ['-duration', '+in', '+value'], duration: ['+duration', '+in', '+value'],
position: ['+in', '-duration', '+value'], position: ['+in', '+duration', '+value'],
text: ['+value', '+in', '-duration'] text: ['+value', '+in', '+duration']
})[self.options.sort]; })[self.options.sort];
} }

View file

@ -261,22 +261,27 @@ Ox.AnnotationPanel = function(options, self) {
} }
function scrollToSelected(type) { function scrollToSelected(type) {
var $item = that.find('.OxEditableElement.OxSelected'), try {
itemHeight = $item.height() + (type == 'text' ? 8 : 0), Ox.print('scrollToSelected $item', that.find('.OxEditableElement.OxSelected'))
itemTop = $item.offset().top, var $item = that.find('.OxEditableElement.OxSelected'),
itemBottom = itemTop + itemHeight, itemHeight = $item.height() + (type == 'text' ? 8 : 0),
height = self.$folders.height(), itemTop = $item.offset().top,
scrollTop = self.$folders.scrollTop(), itemBottom = itemTop + itemHeight,
top = self.$folders.offset().top; height = self.$folders.height(),
if (itemTop < top || itemBottom > top + height) { scrollTop = self.$folders.scrollTop(),
if (itemTop < top) { top = self.$folders.offset().top;
scrollTop += itemTop - top; if (itemTop < top || itemBottom > top + height) {
} else { if (itemTop < top) {
scrollTop += itemBottom - top - height; scrollTop += itemTop - top;
} else {
scrollTop += itemBottom - top - height;
}
self.$folders.animate({
scrollTop: scrollTop + 'px'
}, 0);
} }
self.$folders.animate({ } catch(e) {
scrollTop: scrollTop + 'px' Ox.print('THIS SHOULD NOT HAPPEN');
}, 0);
} }
} }

View file

@ -127,7 +127,7 @@ Ox.VideoEditor = function(options, self) {
self.options.videoSize == 'large' && toggleSize(); self.options.videoSize == 'large' && toggleSize();
}, },
key_n: function() { key_n: function() {
selectAnnotation(getNextAnnotation('annotation', 1)); selectAnnotation(getNextAnnotation('annotation', 1), true);
}, },
key_o: function() { key_o: function() {
setPoint('out', self.options.position); setPoint('out', self.options.position);
@ -183,7 +183,10 @@ Ox.VideoEditor = function(options, self) {
Ox.loop(1, self.options.layers.length + 1, function(i) { Ox.loop(1, self.options.layers.length + 1, function(i) {
that.bindEvent('key_' + i, function() { that.bindEvent('key_' + i, function() {
addAnnotation(self.options.layers[i - 1].id); var layer = self.options.layers[i - 1];
layer.editable
? addAnnotation(layer.id)
: that.triggerEvent('info', {layer: layer.id});
}); });
}); });
@ -342,7 +345,7 @@ Ox.VideoEditor = function(options, self) {
setPosition(data.position); setPosition(data.position);
}, },
select: function() { select: function() {
selectAnnotation(); selectAnnotation(void 0, true);
} }
}) })
.appendTo(self.$editor); .appendTo(self.$editor);
@ -634,7 +637,9 @@ Ox.VideoEditor = function(options, self) {
resizemap: function(data) { resizemap: function(data) {
that.triggerEvent('resizemap', data); that.triggerEvent('resizemap', data);
}, },
select: selectAnnotation, select: function(data) {
selectAnnotation(data, true);
},
submit: submitAnnotation, submit: submitAnnotation,
toggle: toggleAnnotations, toggle: toggleAnnotations,
togglecalendar: function(data) { togglecalendar: function(data) {
@ -727,17 +732,11 @@ Ox.VideoEditor = function(options, self) {
var results = []; var results = [];
if (query.length) { if (query.length) {
query = query.toLowerCase(); query = query.toLowerCase();
results = Ox.flatten(Ox.merge(self.options.layers.map(function(layer) { results = self.annotations.filter(function(annotation) {
return Ox.map(layer.items, function(item) { return Ox.decodeHTML(Ox.stripTags(
return Ox.decodeHTML(Ox.stripTags( annotation.value.toLowerCase()
item.value.toLowerCase() )).indexOf(query) > -1;
)).indexOf(query) > -1 ? { });
id: item.id,
'in': item['in'],
out: item.out
} : null;
});
}))).sort(sortAnnotations);
} }
return results; return results;
} }
@ -923,11 +922,9 @@ Ox.VideoEditor = function(options, self) {
function getWords() { function getWords() {
var words = []; var words = [];
Ox.forEach(Ox.count(Ox.words( Ox.forEach(Ox.count(Ox.words(
Ox.merge(self.options.layers.map(function(layer) { self.annotations.map(function(annotation) {
return layer.items.map(function(item) { return Ox.decodeHTML(Ox.stripTags(annotation.value.toLowerCase()));
return Ox.decodeHTML(Ox.stripTags(item.value.toLowerCase())); }).join(' ')
});
})).join(' ')
)), function(count, value) { )), function(count, value) {
words.push({count: count, value: value}); words.push({count: count, value: value});
}) })
@ -960,6 +957,7 @@ Ox.VideoEditor = function(options, self) {
layer.items.splice(index, 1); layer.items.splice(index, 1);
self.annotations = getAnnotations(); self.annotations = getAnnotations();
self.positions = getPositions(); self.positions = getPositions();
self.options.find && submitFindInput(self.options.find);
self.editing = false; self.editing = false;
self.options.selected = ''; self.options.selected = '';
setTimelineState(); setTimelineState();
@ -976,7 +974,7 @@ Ox.VideoEditor = function(options, self) {
that.triggerEvent('annotationssize', {size: data.size}); that.triggerEvent('annotationssize', {size: data.size});
} }
function selectAnnotation(data) { function selectAnnotation(data, stayAtPosition) {
if (Ox.isUndefined(data)) { if (Ox.isUndefined(data)) {
// doubleclick on small timeline // doubleclick on small timeline
data = getAnnotation(); data = getAnnotation();
@ -985,12 +983,20 @@ Ox.VideoEditor = function(options, self) {
} }
// FIXME // FIXME
// self.editing = false; // self.editing = false;
self.options.selected = data.id; if (data.id) {
if (self.options.selected) { if (!stayAtPosition
self.options.annotationsRange != 'position' && setPosition(data['in']); || self.options.annotationsRange != 'position'
|| self.options.position < data['in']
|| self.options.position > data.out
) {
setPosition(data['in']);
// if annotationsRange is 'position',
// this may cause a deselect
}
setPoint('in', data['in'], true); setPoint('in', data['in'], true);
setPoint('out', data.out, true); setPoint('out', data.out, true);
} }
self.options.selected = data.id;
self.$annotationPanel.options({selected: self.options.selected}); self.$annotationPanel.options({selected: self.options.selected});
setTimelineState(); setTimelineState();
that.triggerEvent('select', {id: self.options.selected}); that.triggerEvent('select', {id: self.options.selected});
@ -1122,6 +1128,7 @@ Ox.VideoEditor = function(options, self) {
self.annotations = getAnnotations(); self.annotations = getAnnotations();
self.positions = getPositions(); self.positions = getPositions();
updateWords('add'); updateWords('add');
self.options.find && submitFindInput(self.options.find);
self.editing = false; self.editing = false;
setTimelineState(); setTimelineState();
if ( if (