diff --git a/source/Ox.UI/js/Video/VideoEditPanel.js b/source/Ox.UI/js/Video/VideoEditPanel.js index 480a0123..21c6c715 100644 --- a/source/Ox.UI/js/Video/VideoEditPanel.js +++ b/source/Ox.UI/js/Video/VideoEditPanel.js @@ -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