83 lines
2.5 KiB
JavaScript
83 lines
2.5 KiB
JavaScript
Ox.load('UI', function() {
|
|
|
|
Ox.Theme('modern');
|
|
|
|
var $innerPanel = Ox.SplitPanel({
|
|
elements: [
|
|
{
|
|
element: Ox.Element(),
|
|
resizable: true,
|
|
resize: [64, 128, 192],
|
|
size: 64
|
|
},
|
|
{
|
|
element: Ox.Element()
|
|
}
|
|
],
|
|
orientation: 'vertical'
|
|
}),
|
|
$outerPanel = Ox.SplitPanel({
|
|
elements: [
|
|
{
|
|
element: Ox.Element(),
|
|
resizable: true,
|
|
resize: [128, 256, 384],
|
|
size: 128
|
|
},
|
|
{
|
|
element: $innerPanel
|
|
}
|
|
],
|
|
orientation: 'horizontal'
|
|
}).appendTo(Ox.$body);
|
|
|
|
Ox.get('srt/0097514.srt', function(srt) {
|
|
|
|
var id = '0097514',
|
|
// var id = '0318034',
|
|
|
|
$videoTimelinePlayer = Ox.VideoTimelinePlayer({
|
|
duration: 3029.96,
|
|
//duration: 5956.24,
|
|
getFrameURL: function(position) {
|
|
return 'http://0xdb.org/' + id + '/64p' + position + '.jpg'
|
|
},
|
|
getImageURL: function(i) {
|
|
return 'http://0xdb.org/' + id + '/timeline64p' + i + '.png'
|
|
//return 'png/timelinecenter64p' + i + '.png'
|
|
},
|
|
height: window.innerHeight - 65,
|
|
paused: true,
|
|
position: 1000,
|
|
subtitles: Ox.parseSRT(srt),
|
|
timelineURL: 'http://0xdb.org/' + id + '/timeline16p.png',
|
|
videoRatio: 1.291667,
|
|
//videoRatio: 1.833333,
|
|
videoURL: 'http://0xdb.org/' + id + '/96p.webm',
|
|
width: window.innerWidth - 129
|
|
})
|
|
.bindEvent({
|
|
resizeend: function(data) {
|
|
Ox.print('RESIZE', data.size)
|
|
$videoTimelinePlayer.options({
|
|
height: data.size
|
|
});
|
|
}
|
|
});
|
|
|
|
$innerPanel
|
|
.replaceElement(1, $videoTimelinePlayer)
|
|
.bindEvent({
|
|
resize: function(data) {
|
|
Ox.print('RESIZE', data.size)
|
|
$videoTimelinePlayer.options({
|
|
width: data.size
|
|
});
|
|
}
|
|
});
|
|
|
|
$videoTimelinePlayer.gainFocus();
|
|
|
|
});
|
|
|
|
});
|