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

video edit panel: handle cuts, add more keyboard shortcuts

Browse source
This commit is contained in:
rlx 2013-07-18 12:55:42 +00:00
parent 86b741f552
commit 8f9473fa92
1 changed files with 81 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -12,7 +12,6 @@ Ox.VideoEditPanel = function(options, self) {
clipTooltip: 'clips',
clipView: 'list',
clickLink: null,
cuts: [],
duration: 0,
editable: false,
enableSubtitles: false,
@ -91,10 +90,15 @@ Ox.VideoEditPanel = function(options, self) {
self.$timeline.options({type: self.options.timeline});
},
video: function() {
self.chapters = getChapters();
self.cuts = getCuts();
self.$video.options({
chapters: getChapters(),
chapters: self.chapters,
video: self.options.video
});
self.$timeline.options({
cuts: self.cuts
});
},
width: function() {
self.$video.options({width: getPlayerWidth()});
@ -104,6 +108,9 @@ Ox.VideoEditPanel = function(options, self) {
.bindEvent({
//resize: resizeElement,
key_0: toggleMuted,
key_comma: function() {
movePositionTo('cut', -1);
},
key_control_c: function() {
that.triggerEvent('copy', [{
annotation: self.options.selected,
@ -111,21 +118,50 @@ Ox.VideoEditPanel = function(options, self) {
out: self.options.out
}]);
},
key_dot: function() {
movePositionTo('cut', 1);
},
key_down: function() {
movePositionTo('chapter', 1);
},
key_equal: function() {
self.$video.changeVolume(0.1);
},
key_i: function() {
setPoint('in', self.options.position, true);
},
key_left: function() {
movePositionBy(-0.04);
},
key_minus: function() {
self.$video.changeVolume(-0.1);
},
key_o: function() {
setPoint('out', self.options.position, true);
},
key_space: togglePaused
key_right: function() {
movePositionBy(0.04);
},
key_shift_i: function() {
goToPoint('in');
},
key_shift_left: function() {
movePositionBy(-1);
},
key_shift_o: function() {
goToPoint('out');
},
key_shift_right: function() {
movePositionBy(1);
},
key_space: togglePaused,
key_up: function() {
movePositionTo('chapter', -1);
}
});
self.chapters = getChapters();
self.cuts = getCuts();
self.fullscreen = false;
self.listSizes = [
144 + Ox.UI.SCROLLBAR_SIZE,
@ -138,12 +174,13 @@ Ox.VideoEditPanel = function(options, self) {
self.$player = Ox.Element().css({overflowX: 'hidden'});
self.$video = Ox.VideoPlayer({
chapters: getChapters(),
chapters: self.chapters,
controlsTop: ['fullscreen', 'space', 'open'],
controlsBottom: [
'play', 'playInToOut', 'volume', 'scale', 'timeline',
'previous', 'next', 'loop', 'position', 'settings'
],
cuts: self.cuts,
enableKeyboard: true,
enableMouse: true,
enablePosition: true,
@ -335,6 +372,34 @@ Ox.VideoEditPanel = function(options, self) {
return Ox.getObjectById(self.options.clips, id);
}
function getCuts() {
var cuts = [];
self.options.clips.forEach(function(clip, i) {
if (i > 0) {
cuts.push(clip.position);
}
clip.cuts.forEach(function(cut) {
Ox.print('PUSHING CLIP CUT', clip.position + cut - clip['in'])
cuts.push(clip.position + cut - clip['in']);
});
});
return cuts;
}
// fixme: why not goToNextPosition()?
function getNextPosition(type, direction) {
// type can be 'chapter' or 'cut'
var positions;
if (type == 'chapter') {
positions = self.chapters.map(function(chapter) {
return chapter.position;
});
} else if (type == 'cut') {
positions = [0].concat(self.options.cuts, self.options.duration);
}
return Ox.nextValue(positions, self.options.position, direction);
}
function getPlayerHeight() {
return self.options.height - 24 - 32
- self.options.showTimeline * 80 - 1;
@ -348,6 +413,7 @@ Ox.VideoEditPanel = function(options, self) {
function getTimeline() {
return Ox.LargeVideoTimeline({
cuts: self.cuts,
duration: self.options.duration,
getImageURL: self.options.getLargeTimelineURL,
'in': self.options['in'],
@ -370,6 +436,17 @@ Ox.VideoEditPanel = function(options, self) {
* self.options.clipSize - 16 - 1;
}
function goToPoint(point) {
setPosition(self.options[point]);
}
function movePositionBy(sec) {
setPosition(Ox.limit(self.options.position + sec, 0, self.options.duration));
}
function movePositionTo(type, direction) {
setPosition(getNextPosition(type, direction));
}
function resizeClips(data) {
// called on clips resize