add player only embed view for edits

This commit is contained in:
j 2014-02-09 08:07:33 +00:00
parent b894735fbd
commit 9c4b31c453
2 changed files with 74 additions and 5 deletions

View file

@ -1,6 +1,6 @@
'use strict'; 'use strict';
pandora.ui.editPanel = function() { pandora.ui.editPanel = function(isEmbed) {
var ui = pandora.user.ui, var ui = pandora.user.ui,
edit, edit,
@ -14,7 +14,7 @@ pandora.ui.editPanel = function() {
smallTimelineContext, smallTimelineContext,
that = Ox.Element(); that = Ox.Element();
ui.edit ? getEdit(renderEdit) : renderEdits(); ui.edit ? getEdit(isEmbed ? renderEmbedEdit : renderEdit) : renderEdits();
function editsKey(key) { function editsKey(key) {
return 'edits.' + ui.edit.replace(/\./g, '\\.') + '.' + key; return 'edits.' + ui.edit.replace(/\./g, '\\.') + '.' + key;
@ -70,7 +70,7 @@ pandora.ui.editPanel = function() {
} }
function renderEdit() { function renderEdit() {
if (ui.section != 'edits') { if (ui.section != 'edits' || ui.edit != edit.id) {
return; return;
} }
that = pandora.$ui.editPanel = Ox.VideoEditPanel({ that = pandora.$ui.editPanel = Ox.VideoEditPanel({
@ -381,6 +381,72 @@ pandora.ui.editPanel = function() {
}); });
} }
function renderEmbedEdit() {
that = Ox.VideoPlayer({
clickLink: pandora.clickLink,
clipRatio: pandora.site.video.previewRatio,
clipSize: listSize,
clips: Ox.clone(edit.clips),
clipTooltip: 'clips <span class="OxBright">' + Ox.SYMBOLS.SHIFT + 'C</span>',
clipView: ui.edits[ui.edit].view,
controlsBottom: [
'play', 'volume', 'scale', 'timeline', 'position', 'settings'
],
controlsTooltips: {
close: Ox._('Close'),
open: Ox._('Watch on {0}', [pandora.site.site.name])
},
controlsTop: [
Ox.Fullscreen.available ? 'fullscreen' : 'space16'
].concat(
['chapterTitle', 'open']
),
chapters: edit.clips.map(function(clip) {
return {
position: clip.position,
title: pandora.getItemTitle(clip)
};
}),
duration: edit.duration,
enableFullscreen: Ox.Fullscreen.available,
enableKeyboard: true,
enableMouse: true,
enablePosition: true,
enableSubtitles: ui.videoSubtitles,
enableTimeline: true,
enableVolume: true,
height: pandora.$ui.document.height(),
paused: true,
showIconOnLoad: true,
subtitles: getSubtitles(edit.clips),
timeline: getSmallTimelineURL(),
video: getVideos(),
volume: ui.videoVolume,
width: pandora.$ui.document.width()
}).bindEvent({
fullscreen: function(data) {
Ox.Fullscreen.toggle();
setTimeout(that.resizePanel, 100);
},
open: function(data) {
that.options({paused: true});
var clip = Ox.last(edit.clips.filter(function(clip) {
return clip.position <= that.options('position');
})),
position = clip['in'] + that.options('position') - clip['position'],
url = document.location.protocol + '//'
+ document.location.hostname + '/'
+ clip.item + '/'
+ Ox.formatDuration(position) + ','
+ Ox.formatDuration(clip['in']) + ','
+ Ox.formatDuration(clip.out);
window.open(url, '_blank');
},
});
pandora.$ui.embedPanel.replaceWith(that);
updateSmallTimelineURL();
}
function orderClips(ids) { function orderClips(ids) {
edit.clips.forEach(function(clip) { edit.clips.forEach(function(clip) {
clip.index = ids.indexOf(clip.id); clip.index = ids.indexOf(clip.id);
@ -529,7 +595,8 @@ pandora.ui.editPanel = function() {
load: function() { load: function() {
if (timelineIteration == self.timelineIteration) { if (timelineIteration == self.timelineIteration) {
context.drawImage(image, Math.floor(clip.position * fps), 0); context.drawImage(image, Math.floor(clip.position * fps), 0);
that.options({smallTimelineURL: canvas.toDataURL()}); that.options(isEmbed ? 'timeline' : 'smallTimelineURL',
canvas.toDataURL());
callback(); callback();
} else { } else {
callback(false); callback(false);

View file

@ -9,7 +9,9 @@ pandora.ui.embedPanel = function() {
view = !ui.item ? ui.listView : ui.itemView; view = !ui.item ? ui.listView : ui.itemView;
if (ui.section != 'texts' && !ui.page) { if (ui.section != 'texts' && !ui.page) {
if (!ui.item) { if (ui.section == 'edits') {
that = pandora.ui.editPanel(true);
} else if (!ui.item) {
if (view == 'grid') { if (view == 'grid') {
that = pandora.ui.embedGrid(); that = pandora.ui.embedGrid();
} else if (view == 'clip') { } else if (view == 'clip') {