1
0
Fork 0
forked from 0x2620/oxjs

implement 'show subtitles' functionality for players and timelines

This commit is contained in:
rlx 2012-02-19 18:26:57 +00:00
commit 02b5b56be8
6 changed files with 83 additions and 40 deletions

View file

@ -306,7 +306,7 @@ Ox.VideoEditor = function(options, self) {
//matches: self.options.matches,
out: self.options.out,
position: self.options.position,
subtitles: self.options.subtitles,
subtitles: self.options.enableSubtitles ? self.options.subtitles : [],
type: 'editor',
width: self.sizes.timeline[0].width
})
@ -332,9 +332,8 @@ Ox.VideoEditor = function(options, self) {
position: self.options.position,
results: find(self.options.find),
showPointMarkers: true,
showSubtitles: true,
state: self.options.selected ? 'selected' : 'default',
subtitles: self.options.subtitles,
subtitles: self.options.enableSubtitles ? self.options.subtitles : [],
videoId: self.options.videoId,
width: self.sizes.timeline[1].width
})
@ -431,34 +430,39 @@ Ox.VideoEditor = function(options, self) {
});
self.$videoMenuButton = Ox.MenuButton({
items: Ox.merge([
{group: 'size', min: 1, max: 1, items: [
{id: 'small', title: 'Small Player', checked: self.options.videoSize == 'small'},
{id: 'large', title: 'Large Player', checked: self.options.videoSize == 'large'}
]},
{},
{group: 'resolution', min: 1, max: 1, items: self.resolutions},
{},
{id: 'largeTimeline', title: 'Hide Large Timeline', disabled: true},
{id: 'subtitlesTimeline', title: 'Hide Subtitles on Large Timeline', disabled: true},
{},
{id: 'downloadVideo', title: 'Download Video...', disabled: !self.options.enableDownload },
{id: 'downloadSelection', title: 'Download Selection...', disabled: !self.options.enableDownload},
{id: 'embedSelection', title: 'Embed Selection...'},
items: Ox.merge(
[
{group: 'size', min: 1, max: 1, items: [
{id: 'small', title: 'Small Player', checked: self.options.videoSize == 'small'},
{id: 'large', title: 'Large Player', checked: self.options.videoSize == 'large'}
]},
{},
{group: 'resolution', min: 1, max: 1, items: self.resolutions}
],
self.options.subtitles.length ? [
{},
{id: 'subtitles', title: 'Show Subtitles', checked: self.options.enableSubtitles}
] : [],
[
{},
{id: 'downloadVideo', title: 'Download Video...', disabled: !self.options.enableDownload },
{id: 'downloadSelection', title: 'Download Selection...', disabled: !self.options.enableDownload},
{id: 'embedSelection', title: 'Embed Selection...'}
],
self.options.enableImport ? [
{},
{id: 'importAnnotations', title: 'Import Annotations...'},
{id: 'importAnnotations', title: 'Import Annotations...'}
] : [],
],
self.options.posterFrameControls ? [
{},
{id: 'gotoPosterFrame', title: 'Go to Poster Frame'},
{id: 'setPosterFrame', title: 'Set Poster Frame'},
] : [],
[
{},
{id: 'keyboard', title: 'Keyboard Shortcuts...', keyboard: 'h'}
]),
self.options.posterFrameControls ? [
{},
{id: 'gotoPosterFrame', title: 'Go to Poster Frame'},
{id: 'setPosterFrame', title: 'Set Poster Frame'}
] : [],
[
{},
{id: 'keyboard', title: 'Keyboard Shortcuts...', keyboard: 'h'}
]
),
style: 'square',
title: 'set',
tooltip: 'Actions and Settings',
@ -503,6 +507,8 @@ Ox.VideoEditor = function(options, self) {
self.$player[0].options({resolution: self.options.resolution});
} else if (id == 'size') {
toggleSize();
} else if (id == 'subtitles') {
toggleSubtitles();
}
},
hide: function() {
@ -1285,6 +1291,23 @@ Ox.VideoEditor = function(options, self) {
});
}
function toggleSubtitles() {
self.options.enableSubtitles = !self.options.enableSubtitles;
self.$player.forEach(function($player) {
$player.options({
enableSubtitles: self.options.enableSubtitles
});
});
self.$timeline.forEach(function($timeline) {
$timeline.options({
subtitles: self.options.enableSubtitles ? self.options.subtitles : []
});
});
that.triggerEvent('subtitles', {
subtitles: self.options.enableSubtitles
});
}
function updateWords(action) {
// action can be 'add' or 'remove'
var words = [];