0x2620/pandora
2
1
Fork 1
Code Issues 1.3k Pull requests Releases Wiki Activity

some info view updates

Browse source
This commit is contained in:
rolux 2011-10-02 15:37:58 +00:00
parent 6b225333cd
commit 68f0d1117c
3 changed files with 85 additions and 55 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
pandora/0xdb.json
View file

@ -1,10 +1,13 @@
{
"capabilities": {
"canPlayClips": {"guest": 1, "member": 2, "staff": 3, "admin": 4},
"canPlayVideo": {"guest": 0, "member": 1, "staff": 3, "admin": 4},
"canSeeItem": {"guest": 2, "member": 2, "staff": 3, "admin": 4},
"canSeeFiles": {"guest": -1, "member": -1, "staff": 3, "admin": 4},
"canSeeExtraItemViews": {"guest": false, "member": false, "staff": true, "admin": true}
"canDeleteItems": {"admin": true},
"canEditItemIcons": {"staff": true, "admin": true},
"canPlayClips": {"guest": 1, "member": 2, "friend": 3, "staff": 4, "admin": 4},
"canPlayVideo": {"guest": 0, "member": 1, "friend": 3, "staff": 4, "admin": 4},
"canReloadMetadata": {"staff": true, "admin": true},
"canSeeFiles": {"guest": -1, "member": -1, "friend": -1, "staff": 4, "admin": 4},
"canSeeItem": {"guest": 2, "member": 2, "friend": 3, "staff": 4, "admin": 4},
"canSeeExtraItemViews": {"friend": true, "staff": true, "admin": true}
},
"clipKeys": [
{"id": "clip:text", "title": "Text", "type": "string"},
@ -551,7 +554,6 @@
"columnWidth": {}
}
},
"editIcon": false,
"find": {"conditions": [], "operator": "&"},
"groups": [
{"id": "director", "sort": [{"key": "items", "operator": "-"}]},
@ -580,6 +582,7 @@
"showFlags": true,
"showGroups": true,
"showHome": true,
"showIconBrowser": false,
"showInfo": true,
"showMapControls": false,
"showMapLabels": false,
@ -608,7 +611,7 @@
{"name": "Movies A-Z", "path": "", "items": 1234}
]
},
"userLevels": ["guest", "member", "staff", "admin"],
"userLevels": ["guest", "member", "friend", "staff", "admin"],
"video": {
"download": false,
"formats": ["webm", "mp4"],

124
static/js/pandora/ui/infoView.js
View file

@ -3,46 +3,54 @@ pandora.ui.infoView = function(data) {
// fixme: given that currently, the info view doesn't scroll into view nicely
// when collapsing the movies browser, the info view should become a split panel
var css = {
var ui = pandora.user.ui,
canEditIcons = pandora.site.capabilities.canEditItemIcons[pandora.user.level],
borderRadius = ui.icons == 'posters' ? 0 : iconSize / 8,
css = {
marginTop: '4px',
textAlign: 'justify',
MozUserSelect: 'text',
WebkitUserSelect: 'text'
},
listWidth = 144 + Ox.UI.SCROLLBAR_SIZE,
margin = 16,
iconSize = pandora.user.ui.infoIconSize,
iconRatio = pandora.user.ui.icons == 'posters'
? (pandora.user.ui.showSitePoster ? 5/8 : data.posterRatio) : 1,
iconRatio = ui.icons == 'posters'
? (ui.showSitePoster ? 5/8 : data.posterRatio) : 1,
iconSize = ui.infoIconSize,
iconWidth = iconRatio > 1 ? iconSize : Math.round(iconSize * iconRatio),
iconHeight = iconRatio < 1 ? iconSize : Math.round(iconSize / iconRatio),
iconLeft = iconSize == 256 ? Math.floor((iconSize - iconWidth) / 2) : 0,
borderRadius = pandora.user.ui.icons == 'posters' ? 0 : iconSize / 8,
that = Ox.Element(),
listWidth = 144 + Ox.UI.SCROLLBAR_SIZE,
margin = 16,
statisticsWidth = 128,
uid = Ox.uid(),
that = Ox.Element(),
$list,
$info = $('<div>')
.css({
position: 'absolute',
left: pandora.user.level == 'admin' && !pandora.user.ui.editPoster ? -listWidth + 'px' : 0,
left: canEditIcons && !ui.showIconBrowser ? -listWidth + 'px' : 0,
top: 0,
right: 0,
})
.appendTo(that.$element),
$data = Ox.Container()
.css({
position: 'absolute',
left: (pandora.user.level == 'admin' ? listWidth : 0) + 'px',
left: (canEditIcons ? listWidth : 0) + 'px',
top: 0,
right: 0,
height: pandora.$ui.contentPanel.size(1) + 'px'
})
.appendTo($info),
$icon = Ox.Element('<img>')
.attr({
src: '/' + data.id + '/' + (
pandora.user.ui.icons == 'posters'
? (pandora.user.ui.showSitePoster ? 'siteposter' : 'poster') : 'icon'
ui.icons == 'posters'
? (ui.showSitePoster ? 'siteposter' : 'poster') : 'icon'
) + '512.jpg?' + uid
})
.css({
@ -58,6 +66,7 @@ pandora.ui.infoView = function(data) {
singleclick: toggleIconSize
})
.appendTo($data.$element),
$reflection = $('<div>')
.addClass('OxReflection')
.css({
@ -69,10 +78,11 @@ pandora.ui.infoView = function(data) {
overflow: 'hidden'
})
.appendTo($data.$element),
$reflectionIcon = $('<img>')
.attr({
src: '/' + data.id + '/' + (
pandora.user.ui.icons == 'posters' ? 'poster' : 'icon'
ui.icons == 'posters' ? 'poster' : 'icon'
) + '512.jpg?' + uid
})
.css({
@ -83,6 +93,7 @@ pandora.ui.infoView = function(data) {
borderRadius: borderRadius + 'px'
})
.appendTo($reflection),
$reflectionGradient = $('<div>')
.css({
position: 'absolute',
@ -90,12 +101,13 @@ pandora.ui.infoView = function(data) {
height: iconSize / 2 + 'px'
})
.appendTo($reflection),
$text = $('<div>')
.css({
position: 'absolute',
left: margin + (iconSize == 256 ? 256 : iconWidth) + margin + 'px',
top: margin + 'px',
right: margin + 'px'
right: margin + statisticsWidth + margin + 'px'
})
.bind({
click: function(e) {
@ -107,6 +119,16 @@ pandora.ui.infoView = function(data) {
}
})
.appendTo($data.$element),
$statistics = $('<div>')
.css({
position: 'absolute',
width: statisticsWidth + 'px',
top: margin + 'px',
right: margin + 'px'
})
.appendTo($data.$element),
$browserImages = [];
var match = /(\(S\d{2}(E\d{2})?\))/.exec(data.title);
@ -329,29 +351,31 @@ pandora.ui.infoView = function(data) {
$('<div>').css({height: '8px'}).appendTo($text);
if (pandora.user.level == 'admin') {
$icon.bindEvent({
doubleclick: function() {
pandora.UI.set('editPoster', !pandora.user.ui.editPoster);
if (pandora.user.ui.editPoster) {
$info.animate({
left: 0
}, 250);
} else {
$info.animate({
left: -listWidth + 'px'
}, 250);
}
}
['hue', 'saturation', 'lightness'].forEach(function(key) {
$('<div>')
.css({marginBottom: '4px'})
.append(formatKey(key, true))
.append(Ox.formatColor(data[key], key))
.appendTo($statistics);
});
renderList();
if (canEditIcons) {
$icon.bindEvent({
doubleclick: function() {
pandora.UI.set('showIconBrowser', !ui.showIconBrowser);
$info.animate({
left: ui.showIconBrowser ? 0 : -listWidth + 'px'
}, 250);
}
});
renderList();
}
function formatKey(key) {
return '<span style="font-weight: bold">' + Ox.toTitleCase(key) + ':</span> ';
function formatKey(key, isStatistics) {
return isStatistics
? $('<div>').css({marginBottom: '2px', fontWeight: 'bold'}).html(Ox.toTitleCase(key))
: '<span style="font-weight: bold">' + Ox.toTitleCase(key) + ':</span> ';
}
function formatLight(str) {
@ -369,15 +393,15 @@ pandora.ui.infoView = function(data) {
function renderList() {
pandora.api.get({
id: data.id,
keys: [pandora.user.ui.icons == 'posters' ? 'posters' : 'frames']
keys: [ui.icons == 'posters' ? 'posters' : 'frames']
}, 0, function(result) {
var images = result.data[pandora.user.ui.icons == 'posters' ? 'posters' : 'frames'],
var images = result.data[ui.icons == 'posters' ? 'posters' : 'frames'],
selectedImage = images.filter(function(image) {
return image.selected;
})[0];
$list = Ox.IconList({
defaultRatio: pandora.user.ui.icons == 'posters' ? 5/8 : data.stream.aspectRatio,
fixedRatio: pandora.user.ui.icons == 'posters' ? false : data.stream.aspectRatio,
defaultRatio: ui.icons == 'posters' ? 5/8 : data.stream.aspectRatio,
fixedRatio: ui.icons == 'posters' ? false : data.stream.aspectRatio,
item: function(data, sort, size) {
var ratio = data.width / data.height;
size = size || 128;
@ -385,13 +409,13 @@ pandora.ui.infoView = function(data) {
height: ratio <= 1 ? size : size / ratio,
id: data['id'],
info: data.width + ' x ' + data.height + ' px',
title: pandora.user.ui.icons == 'posters' ? data.source : Ox.formatDuration(data.position),
title: ui.icons == 'posters' ? data.source : Ox.formatDuration(data.position),
url: data.url,
width: ratio >= 1 ? size : size * ratio
}
},
items: images,
keys: pandora.user.ui.icons == 'posters'
keys: ui.icons == 'posters'
? ['index', 'source', 'width', 'height', 'url']
: ['index', 'position', 'width', 'height', 'url'],
max: 1,
@ -421,12 +445,12 @@ pandora.ui.infoView = function(data) {
if ($browserImages.length == 0) {
$browserImages = pandora.$ui.browser.find('img[src*="/' + data.id + '/"]');
}
if (pandora.user.ui.icons == 'posters' && !pandora.user.ui.showSitePoster) {
if (ui.icons == 'posters' && !ui.showSitePoster) {
$browserImages.each(function() {
var $this = $(this),
size = Math.max($this.width(), $this.height());
$this.attr({src: src});
pandora.user.ui.icons == 'posters' && $this.css(imageRatio < 1 ? {
ui.icons == 'posters' && $this.css(imageRatio < 1 ? {
width: Math.round(size * imageRatio) + 'px',
height: size + 'px'
} : {
@ -440,9 +464,9 @@ pandora.ui.infoView = function(data) {
iconSize = iconSize == 256 ? 512 : 256;
toggleIconSize();
}
pandora.api[pandora.user.ui.icons == 'posters' ? 'setPoster' : 'setPosterFrame'](Ox.extend({
pandora.api[ui.icons == 'posters' ? 'setPoster' : 'setPosterFrame'](Ox.extend({
id: data.id
}, pandora.user.ui.icons == 'posters' ? {
}, ui.icons == 'posters' ? {
source: selectedImage.source
} : {
// fixme: api slightly inconsistent, this shouldn't be "position"
@ -450,14 +474,14 @@ pandora.ui.infoView = function(data) {
}), function() {
// fixme: update the info (video preview) frame as well
var src;
if (pandora.user.ui.icons == 'frames') {
if (ui.icons == 'frames') {
src = '/' + data.id + '/icon512.jpg?' + Ox.uid()
$icon.attr({src: src});
$reflectionIcon.attr({src: src});
}
$browserImages.each(function() {
$(this).attr({src: '/' + data.id + '/' + (
pandora.user.ui.icons == 'posters' ? 'poster' : 'icon'
ui.icons == 'posters' ? 'poster' : 'icon'
) + '64.jpg?' + Ox.uid()});
});
});
@ -473,7 +497,7 @@ pandora.ui.infoView = function(data) {
iconWidth = iconRatio > 1 ? iconSize : Math.round(iconSize * iconRatio);
iconHeight = iconRatio < 1 ? iconSize : Math.round(iconSize / iconRatio);
iconLeft = iconSize == 256 ? Math.floor((iconSize - iconWidth) / 2) : 0,
borderRadius = pandora.user.ui.icons == 'posters' ? 0 : iconSize / 8;
borderRadius = ui.icons == 'posters' ? 0 : iconSize / 8;
$icon.animate({
left: margin + iconLeft + 'px',
width: iconWidth + 'px',
@ -503,14 +527,14 @@ pandora.ui.infoView = function(data) {
that.reload = function() {
var src = src = '/' + data.id + '/' + (
pandora.user.ui.icons == 'posters'
? (pandora.user.ui.showSitePoster ? 'siteposter' : 'poster') : 'icon'
ui.icons == 'posters'
? (ui.showSitePoster ? 'siteposter' : 'poster') : 'icon'
) + '512.jpg?' + Ox.uid()
$icon.attr({src: src});
$reflectionIcon.attr({src: src});
iconSize = iconSize == 256 ? 512 : 256;
iconRatio = pandora.user.ui.icons == 'posters'
? (pandora.user.ui.showSitePoster ? 5/8 : data.posterRatio) : 1;
iconRatio = ui.icons == 'posters'
? (ui.showSitePoster ? 5/8 : data.posterRatio) : 1;
toggleIconSize();
pandora.user.level == 'admin' && $list.replaceWith($list = renderList());
};
@ -524,7 +548,7 @@ pandora.ui.infoView = function(data) {
that.bindEvent({
pandora_icons: that.reload,
pandora_showsiteposter: function() {
pandora.user.ui.icons == 'posters' && that.reload();
ui.icons == 'posters' && that.reload();
}
});

5
static/js/pandora/ui/toolbar.js
View file

@ -23,7 +23,10 @@ pandora.ui.toolbar = function() {
pandora.$ui.orderButton = pandora.ui.orderButton()
);
}
if (ui.item && ui.itemView == 'info' && pandora.user.level == 'admin') {
if (
ui.item && ui.itemView == 'info'
&& pandora.site.capabilities.canReloadMetadata[pandora.user.level]
) {
that.append(
Ox.Button({
title: 'Reload Metadata'