From 957567123e0967c632a2f04eb5530817271fd0d3 Mon Sep 17 00:00:00 2001 From: j <0x006A@0x2620.org> Date: Sun, 19 Jun 2011 14:51:36 +0200 Subject: [PATCH] embedded video --- static/js/pandora.embed.js | 92 +++++++++++++++++++++++++++++++++----- 1 file changed, 81 insertions(+), 11 deletions(-) diff --git a/static/js/pandora.embed.js b/static/js/pandora.embed.js index 7ce6728..03d16fd 100755 --- a/static/js/pandora.embed.js +++ b/static/js/pandora.embed.js @@ -1,16 +1,22 @@ /*** Pandora embed ***/ -Ox.load('UI', function() { -var pandora = new Ox.App({ +Ox.load('UI', { + debug: true, + hideScreen: false, + loadImages: true, + showScreen: true, + theme: 'modern' +}, function() { +window.pandora = new Ox.App({url: '/api/'}).bindEvent({ apiURL: '/api/', -}).launch(function(data) { - var ui = {}; - var app = { +}).bindEvent('load', function(data) { + $.extend(pandora, { + ui: {}, info: function(item) { - var that = new Ox.Element() + var that = Ox.Element() .append( - ui.infoTimeline = new Ox.Element('img') + ui.infoTimeline = Ox.Element('') .css({ position: 'absolute', left: 0, @@ -30,8 +36,52 @@ var pandora = new Ox.App({ ) return that; }, + clip: function(item, inPoint, outPoint) { + Ox.print('!@#!@#!@#', inPoint, outPoint); + var that = Ox.Element(); + pandora.api.getItem(item, function(result) { + var video = result.data.stream, + format = $.support.video.supportedFormat(video.formats); + video.height = video.profiles[0]; + video.width = parseInt(video.height * video.aspectRatio / 2) * 2; + video.url = video.baseUrl + '/' + video.height + 'p.' + format; + that.append(pandora.player = Ox.VideoPlayer({ + controlsBottom: ['playInToOut', 'space', 'position'], + enableFind: false, + enableFullscreen: true, + enableVolume: true, + externalControls: false, + height: 192, + paused: true, + showMarkers: true, + showMilliseconds: 2, + width: 360, + 'in': inPoint, + out: outPoint, + position: inPoint, + poster: '/' + item + '/frame/' + '128' + '/' + inPoint +'.jpg', + title: result.data.title, + video: video.url + }) + .bindEvent({ + position: function(data) { + if(data.positionoutPoint) { + if(!pandora.player.options('paused')) + pandora.player.togglePaused(); + pandora.player.options({ + position: inPoint, + }); + } + } + }) + + ); + Ox.UI.hideLoadingScreen(); + }); + return that; + }, flipbook: function(item) { - var that = new Ox.Flipbook({ + var that = Ox.Flipbook({ }).bindEvent('click', function(event, data) { var item_url = document.location.origin + '/' + item; window.top.location.href = item_url + '/timeline#t=' + data.position; @@ -54,9 +104,29 @@ var pandora = new Ox.App({ }); return that; } - }; + }); var item = document.location.pathname.split('/')[1]; - ui.info = new app.info(item) - .appendTo(document.body); + function getArgument(key, result) { + var args = Ox.map(document.location.hash.substr(1).split('&'), function(a) { + a = a.split('='); + var key = a[0], + value = a[1]; + return { + 'key': key, + 'value': value + } + }); + $.each(args, function(i, a) { + Ox.print(i, a); + if (a.key == key) { + result = a.value; + return false; + } + }); + return result; + } + var t = getArgument('t', '0,10').split(',') + pandora.ui.info = pandora.clip(item, parseInt(t[0]), parseInt(t[1])) + .appendTo(document.body); }); });