decentral1se/pandora
1
0
Fork 0
forked from 0x2620/pandora
Code Issues Pull requests Projects Releases Wiki Activity

add embedded timeline view

Browse source
This commit is contained in:
j 2012-06-26 17:59:03 +02:00
parent 8b082023e9
commit 49e20c193a
1 changed files with 116 additions and 59 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

89
static/js/embed/pandora.js
View file

@ -8,22 +8,25 @@ Ox.load('UI', {
showScreen: true, showScreen: true,
theme: 'modern' theme: 'modern'
}, function() { }, function() {
var videoKeys = [ 'duration', 'layers', 'parts', 'posterFrame', 'rightslevel', 'size', 'title', 'videoRatio' ];
window.pandora = new Ox.App({url: '/api/'}).bindEvent({ window.pandora = new Ox.App({url: '/api/'}).bindEvent({
load: function(data) { load: function(data) {
Ox.extend(pandora, { Ox.extend(pandora, {
site: data.site, site: data.site,
user: data.user.level == 'guest' ? Ox.clone(data.site.user) : data.user, user: data.user.level == 'guest' ? Ox.clone(data.site.user) : data.user,
ui: {}, $ui: {},
clip: function(options) { ui: {
var that = Ox.Element(), player: function(options) {
keys = [ 'duration', 'layers', 'parts', 'posterFrame', 'rightslevel', 'size', 'title', 'videoRatio' ]; var that = Ox.Element();
pandora.user.ui.item = options.item; pandora.user.ui.item = options.item;
pandora.api.get({id: options.item, keys: keys}, function(result) { pandora.api.get({id: options.item, keys: videoKeys}, function(result) {
var videoOptions = getVideoOptions(result.data); var data = getVideoOptions(result.data);
that.append(pandora.player = Ox.VideoPlayer({ that.append(pandora.player = Ox.VideoPlayer({
censored: videoOptions.censored, censored: data.censored,
censoredIcon: pandora.site.cantPlay.icon,
censoredTooltip: pandora.site.cantPlay.text,
controlsBottom: ['play', 'volume', 'scale', 'timeline', 'settings'], controlsBottom: ['play', 'volume', 'scale', 'timeline', 'settings'],
duration: result.data.duration, duration: data.duration,
enableFind: false, enableFind: false,
enableFullscreen: true, enableFullscreen: true,
enableKeyboard: true, enableKeyboard: true,
@ -40,10 +43,10 @@ Ox.load('UI', {
resolution: pandora.user.ui.videoResolution, resolution: pandora.user.ui.videoResolution,
showMarkers: false, showMarkers: false,
showMilliseconds: 0, showMilliseconds: 0,
subtitles: videoOptions.subtitles, subtitles: data.subtitles,
timeline: '/' + options.item + '/' + 'timeline16p.png', timeline: '/' + options.item + '/' + 'timeline16p.png',
title: result.data.title, title: result.data.title,
video: videoOptions.video, video: data.video,
width: window.innerWidth width: window.innerWidth
}) })
.bindEvent({ .bindEvent({
@ -56,6 +59,58 @@ Ox.load('UI', {
); );
Ox.UI.hideLoadingScreen(); Ox.UI.hideLoadingScreen();
});
return that;
},
timeline: function(options) {
var that = Ox.Element();
pandora.user.ui.item = options.item;
pandora.api.get({id: options.item, keys: videoKeys}, function(result) {
Ox.UI.hideLoadingScreen();
var data = getVideoOptions(result.data),
ui = pandora.user.ui;
that.append(pandora.player = Ox.VideoTimelinePlayer({
censored: data.censored,
censoredIcon: pandora.site.cantPlay.icon,
censoredTooltip: pandora.site.cantPlay.text,
cuts: data.cuts || [],
duration: data.duration,
followPlayer: ui.followPlayer,
getFrameURL: function(position) {
return '/' + ui.item + '/' + ui.videoResolution + 'p' + position + '.jpg';
},
getLargeTimelineURL: function(type, i) {
return '/' + ui.item + '/timeline' + type + '64p' + i + '.jpg';
},
height: that.height(),
muted: ui.videoMuted,
'in': options['in'],
out: options.out,
paused: options.paused,
position: options['in'],
resolution: pandora.site.video.resolutions[0],
smallTimelineURL: '/' + ui.item + '/timeline16p.jpg',
subtitles: data.subtitles,
timeline: ui.videoTimeline,
timelines: pandora.site.timelines,
video: data.video,
videoRatio: data.videoRatio,
volume: ui.videoVolume,
width: that.width()
})
.bindEvent({
playing: checkRange,
position: checkRange,
resolution: function(data) {
pandora.api.setUI({'videoResolution': data.resolution});
},
})
);
});
return that;
}
}
});
function checkRange(data) { function checkRange(data) {
if ( if (
data.position < options['in'] - 0.04 data.position < options['in'] - 0.04
@ -69,17 +124,17 @@ Ox.load('UI', {
}); });
} }
} }
});
return that;
}
});
Ox.extend(pandora.user, { Ox.extend(pandora.user, {
videoFormat: Ox.UI.getVideoFormat(pandora.site.video.formats) videoFormat: Ox.UI.getVideoFormat(pandora.site.video.formats)
}); });
var options = parseQuery(); var options = parseQuery();
if (['video', 'player'].indexOf(options.view) > -1) { if (['video', 'player'].indexOf(options.view) > -1) {
pandora.ui.info = pandora.clip(options) pandora.$ui.player = pandora.ui.player(options)
.css({width: '100%', height: '100%'}) .css({top: 0, bottom: 0, left: 0, right: 0, position: 'absolute'})
.appendTo(document.body);
} else if (options.view == 'timeline') {
pandora.$ui.timeline = pandora.ui.timeline(options)
.css({top: 0, bottom: 0, left: 0, right: 0, position: 'absolute'})
.appendTo(document.body); .appendTo(document.body);
} }
} }
@ -142,6 +197,8 @@ Ox.load('UI', {
}) })
}); });
}); });
options.duration = data.duration;
options.videoRatio = data.videoRatio;
return options; return options;
} }