rolux
parent
6e193cb681
commit
5b144d6cf1
3 changed files with 94 additions and 27 deletions
|
|
@ -15,18 +15,15 @@ Ox.load('UI', {
|
|||
user: data.user.level == 'guest' ? Ox.clone(data.site.user) : data.user,
|
||||
ui: {},
|
||||
clip: function(options) {
|
||||
var that = Ox.Element();
|
||||
pandora.api.get({id: options.item, keys: []}, function(result) {
|
||||
var video = {};
|
||||
pandora.site.video.resolutions.forEach(function(resolution) {
|
||||
video[resolution] = Ox.range(result.data.parts).map(function(i) {
|
||||
var part = (i + 1),
|
||||
prefix = pandora.site.site.videoprefix.replace('PART', part);
|
||||
return prefix + '/' + options.item + '/'
|
||||
+ resolution + 'p' + part + '.' + pandora.user.videoFormat;
|
||||
});
|
||||
});
|
||||
var that = Ox.Element(),
|
||||
keys = [ 'cuts', 'director', 'duration', 'layers', 'parts', 'posterFrame', 'rendered', 'rightslevel', 'size', 'title', 'videoRatio', 'year'];
|
||||
pandora.api.get({id: options.item, keys: keys}, function(result) {
|
||||
var video = {},
|
||||
videoOptions = getVideoOptions(result.data);
|
||||
Ox.print(videoOptions);
|
||||
Ox.print('/' + options.item + '/' + 'timeline16p.png');
|
||||
that.append(pandora.player = Ox.VideoPlayer({
|
||||
censored: videoOptions.censored,
|
||||
controlsBottom: ['play', 'volume', 'scale', 'timeline', 'position', 'settings'],
|
||||
enableFind: false,
|
||||
enableFullscreen: true,
|
||||
|
|
@ -40,13 +37,14 @@ Ox.load('UI', {
|
|||
out: options.out,
|
||||
paused: options.paused,
|
||||
position: options['in'],
|
||||
poster: '/' + options.item + '/' + '128p' + options['in'] +'.jpg',
|
||||
poster: '/' + options.item + '/' + '96p' + options['in'] +'.jpg',
|
||||
resolution: pandora.user.ui.videoResolution,
|
||||
showMarkers: false,
|
||||
showMilliseconds: 0,
|
||||
subtitles: videoOptions.subtitles,
|
||||
timeline: '/' + options.item + '/' + 'timeline16p.png',
|
||||
title: result.data.title,
|
||||
video: video,
|
||||
video: videoOptions.video,
|
||||
width: document.width
|
||||
})
|
||||
.bindEvent({
|
||||
|
|
@ -107,4 +105,56 @@ Ox.load('UI', {
|
|||
}
|
||||
}
|
||||
});
|
||||
function getVideoOptions(data) {
|
||||
var canPlayClips = data.editable || pandora.site.capabilities.canPlayClips[pandora.user.level] >= data.rightslevel,
|
||||
canPlayVideo = data.editable || pandora.site.capabilities.canPlayVideo[pandora.user.level] >= data.rightslevel,
|
||||
options = {};
|
||||
options.subtitles = data.layers.subtitles
|
||||
? data.layers.subtitles.map(function(subtitle) {
|
||||
return {'in': subtitle['in'], out: subtitle.out, text: subtitle.value};
|
||||
})
|
||||
: [];
|
||||
options.censored = canPlayVideo ? []
|
||||
: canPlayClips ? (
|
||||
options.subtitles.length
|
||||
? Ox.merge(
|
||||
options.subtitles.map(function(subtitle, i) {
|
||||
return {
|
||||
'in': i == 0 ? 0 : options.subtitles[i - 1].out,
|
||||
out: subtitle['in']
|
||||
};
|
||||
}),
|
||||
[{'in': Ox.last(options.subtitles).out, out: data.duration}]
|
||||
)
|
||||
: Ox.range(0, data.duration - 5, 60).map(function(position) {
|
||||
return {
|
||||
'in': position + 5,
|
||||
out: Math.min(position + 60, data.duration)
|
||||
};
|
||||
})
|
||||
)
|
||||
: [{'in': 0, out: data.duration}];
|
||||
options.video = {};
|
||||
pandora.site.video.resolutions.forEach(function(resolution) {
|
||||
options.video[resolution] = Ox.range(data.parts).map(function(i) {
|
||||
var part = (i + 1),
|
||||
prefix = pandora.site.site.videoprefix.replace('{part}', part);
|
||||
return prefix + '/' + (data.item || pandora.user.ui.item) + '/'
|
||||
+ resolution + 'p' + part + '.' + pandora.user.videoFormat;
|
||||
});
|
||||
});
|
||||
options.layers = [];
|
||||
pandora.site.layers.forEach(function(layer, i) {
|
||||
options.layers[i] = Ox.extend({}, layer, {
|
||||
items: data.layers[layer.id].map(function(annotation) {
|
||||
annotation.duration = Math.abs(annotation.out - annotation['in']);
|
||||
annotation.editable = annotation.editable
|
||||
|| annotation.user == pandora.user.username
|
||||
|| pandora.site.capabilities['canEditAnnotations'][pandora.user.level];
|
||||
return annotation;
|
||||
})
|
||||
});
|
||||
});
|
||||
return options;
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -262,12 +262,14 @@ pandora.ui.home = function() {
|
|||
sort: [{key: 'position', operator: '+'}]
|
||||
}, function(result) {
|
||||
var lists = result.data.items,
|
||||
items = 8, mouse = false, position = 0, selected = 0,
|
||||
counter = 0, items = 8, mouse = false, position = 0, selected = 0,
|
||||
color = Ox.Theme() == 'classic'
|
||||
? 'rgb(0, 0, 0)' : 'rgb(255, 255, 255)',
|
||||
? 'rgb(32, 32, 32)' : 'rgb(224, 224, 224)',
|
||||
$label, $icon, $text,
|
||||
$listsBox, $listsContainer, $listsContent, $list = [],
|
||||
$listsBox, $listsContainer, $listsContent,
|
||||
$listBox = [], $listIcon = [],
|
||||
$previousButton, $nextButton;
|
||||
$lists.empty();
|
||||
if (lists.length) {
|
||||
$label = Ox.Label({
|
||||
textAlign: 'center',
|
||||
|
|
@ -396,10 +398,13 @@ pandora.ui.home = function() {
|
|||
.hide()
|
||||
.bindEvent({
|
||||
mousedown: function() {
|
||||
counter = 0;
|
||||
scrollToPosition(position + 1, true);
|
||||
},
|
||||
mouserepeat: function() {
|
||||
scrollToPosition(position + 1, false);
|
||||
if (counter++ % 10 == 0) {
|
||||
scrollToPosition(position + 1, false);
|
||||
}
|
||||
}
|
||||
})
|
||||
.appendTo($listsBox);
|
||||
|
|
@ -417,6 +422,10 @@ pandora.ui.home = function() {
|
|||
}, 250, function() {
|
||||
$(this).hide();
|
||||
});
|
||||
},
|
||||
mousewheel: function(e, delta, deltaX, deltaY) {
|
||||
Ox.print('mwd', deltaX)
|
||||
scrollToPosition(position + Math.round(deltaX), true);
|
||||
}
|
||||
});
|
||||
self.keydown = function(e) {
|
||||
|
|
@ -440,7 +449,19 @@ pandora.ui.home = function() {
|
|||
Ox.$document.bind({keydown: self.keydown});
|
||||
}
|
||||
lists.forEach(function(list, i) {
|
||||
$list[i] = Ox.Element({
|
||||
$listBox[i] = $('<div>')
|
||||
.css({
|
||||
float: 'left',
|
||||
width: '57px',
|
||||
height: '57px',
|
||||
padding: '2px',
|
||||
margin: '2px',
|
||||
borderRadius: '16px',
|
||||
//background: i == selected ? color : 'transparent',
|
||||
boxShadow: '0 0 2px ' + (i == selected ? color : 'transparent')
|
||||
})
|
||||
.appendTo($listsContent);
|
||||
$listIcon[i] = Ox.Element({
|
||||
element: '<img>',
|
||||
tooltip: list.name
|
||||
})
|
||||
|
|
@ -449,13 +470,9 @@ pandora.ui.home = function() {
|
|||
+ list.name + '/icon256.jpg'
|
||||
})
|
||||
.css({
|
||||
float: 'left',
|
||||
width: '57px',
|
||||
height: '57px',
|
||||
borderRadius: '16px',
|
||||
margin: '4px',
|
||||
boxShadow: i == selected
|
||||
? '0 0 2px ' + color : '',
|
||||
cursor: 'pointer'
|
||||
})
|
||||
.bindEvent({
|
||||
|
|
@ -466,7 +483,7 @@ pandora.ui.home = function() {
|
|||
selectList(i);
|
||||
}
|
||||
})
|
||||
.appendTo($listsContent);
|
||||
.appendTo($listBox[i]);
|
||||
});
|
||||
}
|
||||
$lists.animate({opacity: 1}, 250);
|
||||
|
|
@ -506,7 +523,7 @@ pandora.ui.home = function() {
|
|||
opacity: 0
|
||||
}, 250, function() {
|
||||
$nextButton.hide();
|
||||
});;
|
||||
});
|
||||
} else {
|
||||
$nextButton.addClass('visible');
|
||||
}
|
||||
|
|
@ -518,11 +535,11 @@ pandora.ui.home = function() {
|
|||
}
|
||||
function selectList(i) {
|
||||
if (i >= 0 && i <= lists.length - 1 && i != selected) {
|
||||
$list[selected].css({
|
||||
$listBox[selected].css({
|
||||
boxShadow: 'none'
|
||||
});
|
||||
selected = i;
|
||||
$list[selected].css({
|
||||
$listBox[selected].css({
|
||||
boxShadow: '0 0 2px ' + color
|
||||
});
|
||||
if (selected < position) {
|
||||
|
|
|
|||
|
|
@ -246,7 +246,7 @@ pandora.ui.infoView = function(data) {
|
|||
clickLink: pandora.clickLink,
|
||||
editable: key != 'duration',
|
||||
format: function(value) {
|
||||
return key != 'duration' ? formatValue(value.split(', '), key)
|
||||
return key != 'duration' ? formatValue(value, key)
|
||||
: value < 60 ? Math.round(value) + ' sec'
|
||||
: Math.round(value / 60) + ' min';
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in a new issue