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

video editor panel: handle loop, update menu

Browse source
This commit is contained in:
rlx 2013-08-06 09:56:50 +00:00
parent cbd2143714
commit fcaa9ab755
1 changed files with 47 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -62,6 +62,7 @@ Ox.VideoEditor = function(options, self) {
duration: 0,
enableDownload: false,
enableImport: false,
enableExport: false,
enableSetPosterFrame: false,
enableSubtitles: false,
find: '',
@ -72,6 +73,7 @@ Ox.VideoEditor = function(options, self) {
'in': 0,
height: 0,
layers: [],
loop: false,
muted: false,
out: 0,
paused: true,
@ -100,6 +102,9 @@ Ox.VideoEditor = function(options, self) {
'in': function() {
setPoint('in', self.options['in']);
},
loop: function() {
self.$video.options({loop: self.options.loop});
},
out: function() {
setPoint('out', self.options.out);
},
@ -206,6 +211,7 @@ Ox.VideoEditor = function(options, self) {
key_i: function() {
setPoint('in', self.options.position);
},
key_l: toggleLoop,
key_left: function() {
movePositionBy(-1 / self.options.fps);
},
@ -324,6 +330,7 @@ Ox.VideoEditor = function(options, self) {
height: self.sizes.player[i].height,
id: 'player' + Ox.toTitleCase(type),
'in': self.options['in'],
loop: self.options.loop,
muted: self.options.muted,
out: self.options.out,
paused: self.options.paused,
@ -349,6 +356,9 @@ Ox.VideoEditor = function(options, self) {
that.triggerEvent('censored');
}
}, type == 'play' ? {
loop: function(data) {
that.triggerEvent('loop', data);
},
muted: function(data) {
that.triggerEvent('muted', data);
},
@ -476,6 +486,7 @@ Ox.VideoEditor = function(options, self) {
[
{key: Ox.UI.symbols.space, action: Ox._('Play/Pause')},
{key: 'P', action: Ox._('Play In to Out')},
{key: 'L', action: Ox._('Loop')},
{key: '0', action: Ox._('Mute/Unmute')},
{key: '-', action: Ox._('Turn Volume Down')},
{key: '+', action: Ox._('Turn Volume Up')},
@ -536,7 +547,9 @@ Ox.VideoEditor = function(options, self) {
items: [].concat(
[
{id: 'size', title: Ox._('Large Player'), checked: self.options.videoSize == 'large'},
{id: 'loop', title: Ox._('Loop'), checked: self.options.loop, keyboard: 'l'},
{},
{id: 'resolutions', title: Ox._('Resolution'), disabled: true},
{group: 'resolution', min: 1, max: 1, items: self.resolutions}
],
self.options.subtitles.length ? [
@ -554,20 +567,17 @@ Ox.VideoEditor = function(options, self) {
}, timeline);
}
)},
{},
{id: 'downloadVideo', title: Ox._('Download Video...'), disabled: !self.options.enableDownload },
{id: 'downloadSelection', title: Ox._('Download Selection...'), disabled: !self.options.enableDownload},
{id: 'embedSelection', title: Ox._('Embed Selection...')}
],
self.options.enableImport ? [
{},
{id: 'importAnnotations', title: Ox._('Import Annotations...')}
] : [],
[
{},
{id: 'gotoPosterFrame', title: Ox._('Go to Poster Frame'), keyboard: 'shift p'},
{id: 'setPosterFrame', title: Ox._('Set Poster Frame'), disabled: !self.options.enableSetPosterFrame},
{},
{id: 'downloadVideo', title: Ox._('Download Video...'), disabled: !self.options.enableDownload },
{id: 'downloadSelection', title: Ox._('Download Selection...'), disabled: !self.options.enableDownload},
{id: 'embedSelection', title: Ox._('Embed Selection...')},
{},
{id: 'importAnnotations', title: Ox._('Import Annotations...'), disabled: !self.options.enableImport},
{id: 'exportAnnotations', title: Ox._('Export Annotations...'), disabled: !self.options.enableExport},
{},
{id: 'keyboard', title: Ox._('Keyboard Shortcuts...'), keyboard: 'h'}
]
),
@ -580,8 +590,16 @@ Ox.VideoEditor = function(options, self) {
.bindEvent({
click: function(data) {
var id = data.id;
if (id == 'keyboard') {
showKeyboardShortcuts();
if (id == 'gotoPosterFrame') {
setPosition(self.options.posterFrame);
} else if (id == 'setPosterFrame') {
self.options.posterFrame = self.options.position;
self.$player.forEach(function($player) {
$player.options('posterFrame', self.options.posterFrame);
});
that.triggerEvent('posterframe', {
position: self.options.posterFrame
});
} else if (id == 'downloadVideo') {
that.triggerEvent('downloadvideo');
} else if (id == 'downloadSelection') {
@ -596,25 +614,21 @@ Ox.VideoEditor = function(options, self) {
});
} else if (id == 'importAnnotations') {
that.triggerEvent('importannotations');
} else if (id == 'gotoPosterFrame') {
setPosition(self.options.posterFrame);
} else if (id == 'setPosterFrame') {
self.options.posterFrame = self.options.position;
self.$player.forEach(function($player) {
$player.options('posterFrame', self.options.posterFrame);
});
that.triggerEvent('posterframe', {
position: self.options.posterFrame
});
} else if (id == 'exportAnnotations') {
// ...
} else if (id == 'keyboard') {
showKeyboardShortcuts();
}
},
change: function(data) {
var id = data.id;
if (id == 'resolution') {
if (id == 'size') {
toggleSize();
} else if (id == 'loop') {
toggleLoop();
} else if (id == 'resolution') {
self.options.resolution = parseInt(data.checked[0].id, 10);
self.$player[0].options({resolution: self.options.resolution});
} else if (id == 'size') {
toggleSize();
} else if (id == 'subtitles') {
toggleSubtitles();
} else if (id == 'timeline') {
@ -1360,6 +1374,14 @@ Ox.VideoEditor = function(options, self) {
});
}
function toggleLoop() {
self.options.loop = !self.options.loop;
self.$menuButton[
self.options.loop ? 'checkItem' : 'uncheckItem'
]('loop');
self.$player[0].toggleLoop();
}
function toggleMuted() {
self.$player[0].toggleMuted();
}