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

video edit panel: allow for clip selection via keyboard shortcuts

Browse source
This commit is contained in:
rlx 2013-07-18 13:56:50 +00:00
parent 174aa87e9f
commit 196cb0f45f
2 changed files with 37 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
source/Ox.UI/js/Video/ClipPanel.js
View file

@ -12,7 +12,7 @@ Ox.ClipPanel = function(options, self) {
'in': 0, 'in': 0,
out: 0, out: 0,
position: 0, position: 0,
selected: '', selected: [],
sort: [], sort: [],
sortOptions: [], sortOptions: [],
view: 'list', view: 'list',
@ -32,6 +32,9 @@ Ox.ClipPanel = function(options, self) {
height: function() { height: function() {
self.$list.size(); self.$list.size();
}, },
selected: function() {
self.$list.options({selected: self.options.selected});
},
sort: function() { sort: function() {
updateSortElement(); updateSortElement();
self.$list.options({ self.$list.options({

53
source/Ox.UI/js/Video/VideoEditPanel.js
View file

@ -15,6 +15,7 @@ Ox.VideoEditPanel = function(options, self) {
duration: 0, duration: 0,
editable: false, editable: false,
enableSubtitles: false, enableSubtitles: false,
fps: 25,
fullscreen: false, fullscreen: false,
getClipImageURL: null, getClipImageURL: null,
getLargeTimelineURL: null, getLargeTimelineURL: null,
@ -28,7 +29,7 @@ Ox.VideoEditPanel = function(options, self) {
position: 0, position: 0,
resolution: 0, resolution: 0,
scaleToFill: false, scaleToFill: false,
selected: '', selected: [],
showClips: false, showClips: false,
showTimeline: false, showTimeline: false,
smallTimelineURL: '', smallTimelineURL: '',
@ -108,6 +109,10 @@ Ox.VideoEditPanel = function(options, self) {
.bindEvent({ .bindEvent({
//resize: resizeElement, //resize: resizeElement,
key_0: toggleMuted, key_0: toggleMuted,
key_backslash: selectClip,
key_closebracket: function() {
movePositionTo('chapter', 1);
},
key_comma: function() { key_comma: function() {
movePositionTo('cut', -1); movePositionTo('cut', -1);
}, },
@ -121,9 +126,6 @@ Ox.VideoEditPanel = function(options, self) {
key_dot: function() { key_dot: function() {
movePositionTo('cut', 1); movePositionTo('cut', 1);
}, },
key_down: function() {
movePositionTo('chapter', 1);
},
key_equal: function() { key_equal: function() {
self.$video.changeVolume(0.1); self.$video.changeVolume(0.1);
}, },
@ -139,6 +141,9 @@ Ox.VideoEditPanel = function(options, self) {
key_o: function() { key_o: function() {
setPoint('out', self.options.position, true); setPoint('out', self.options.position, true);
}, },
key_openbracket: function() {
movePositionTo('chapter', -1);
},
key_right: function() { key_right: function() {
movePositionBy(0.04); movePositionBy(0.04);
}, },
@ -154,10 +159,7 @@ Ox.VideoEditPanel = function(options, self) {
key_shift_right: function() { key_shift_right: function() {
movePositionBy(1); movePositionBy(1);
}, },
key_space: togglePaused, key_space: togglePaused
key_up: function() {
movePositionTo('chapter', -1);
}
}); });
self.chapters = getChapters(); self.chapters = getChapters();
@ -357,14 +359,11 @@ Ox.VideoEditPanel = function(options, self) {
} }
function getChapters() { function getChapters() {
var currentTime = 0;
return self.options.clips.map(function(clip) { return self.options.clips.map(function(clip) {
var chapter = { return {
position: currentTime, position: clip.position,
title: clip.title || clip.id title: clip.title || clip.id
}; };
currentTime += clip.duration;
return chapter;
}); });
} }
@ -463,13 +462,27 @@ Ox.VideoEditPanel = function(options, self) {
that.triggerEvent('size', data.size); that.triggerEvent('size', data.size);
} }
function selectClip(data) { function selectClip() {
self.options.selected = data.id; var id,
if (self.options.selected) { points = {
setPosition(data['in']); 'in': Ox.last(self.options.clips).position,
setPoint('in', data['in']); out: self.options.duration
setPoint('out', data.out); };
} Ox.forEach(self.options.clips, function(clip, i) {
if (clip.position > self.options.position) {
id = self.options.clips[i - 1].id;
points = {
'in': self.options.clips[i - 1].position,
out: self.options.clips[i].position
};
return false; // break
}
});
setPosition(points['in']);
setPoint('in', points['in']);
setPoint('out', points.out);
self.options.selected = [id];
Ox.print('????', self.$clipPanel.options('selected'))
self.$clipPanel.options({selected: self.options.selected}); self.$clipPanel.options({selected: self.options.selected});
that.triggerEvent('select', {id: self.options.selected}); that.triggerEvent('select', {id: self.options.selected});
} }