updating info (part 1)
This commit is contained in:
parent
5adeb5290b
commit
02db844ef0
3 changed files with 35 additions and 38 deletions
|
@ -9,54 +9,47 @@ pandora.ui.info = function(id) {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
if (id) {
|
if (id) {
|
||||||
if (!pandora.user.ui.item && pandora.user.ui.lists[pandora.user.ui.list].listView == 'clip') {
|
if (!pandora.user.ui.item && pandora.isClipView(pandora.user.ui.lists[pandora.user.ui.list].listView)) {
|
||||||
// Poster
|
// Poster
|
||||||
pandora.api.get({id: id, keys: ['posterRatio']}, function(result) {
|
pandora.api.get({id: id, keys: ['director', 'posterRatio', 'title']}, function(result) {
|
||||||
var ratio = result.data.posterRatio,
|
var ratio = result.data.posterRatio,
|
||||||
height = pandora.user.ui.sidebarSize;
|
height = Math.min(pandora.user.ui.sidebarSize, 256);
|
||||||
that.empty().append(
|
that.empty().append(
|
||||||
$('<img>').attr({
|
Ox.Element({
|
||||||
src: '/' + id + '/poster' + pandora.user.ui.sidebarSize + '.jpg'
|
element: '<img>',
|
||||||
|
tooltip: '<span class="OxBright">' + result.data.title + '</span>' + (
|
||||||
|
result.data.director ? '<br/>' + result.data.director.join(', ') : ''
|
||||||
|
)
|
||||||
|
}).attr({
|
||||||
|
src: '/' + id + '/poster256.jpg'
|
||||||
}).css({
|
}).css({
|
||||||
position: 'absolute',
|
position: 'absolute',
|
||||||
left: 0,
|
left: 0,
|
||||||
top: 0,
|
top: 0,
|
||||||
right: 0,
|
right: 0,
|
||||||
bottom: 0,
|
bottom: 0,
|
||||||
|
height: height + 'px',
|
||||||
margin: 'auto'
|
margin: 'auto'
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
pandora.user.infoRatio = 1;
|
pandora.user.infoRatio = 1;
|
||||||
resize(height);
|
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
// Video Preview
|
// Video Preview
|
||||||
pandora.api.get({id: id, keys: ['duration', 'videoRatio']}, function(result) {
|
pandora.api.get({id: id, keys: ['duration', 'videoRatio']}, function(result) {
|
||||||
if(result.data) {
|
if (result.data) {
|
||||||
var height = Math.round(pandora.user.ui.sidebarSize / result.data.videoRatio) + 16;
|
|
||||||
pandora.$ui.videoPreview && pandora.$ui.videoPreview.removeElement();
|
pandora.$ui.videoPreview && pandora.$ui.videoPreview.removeElement();
|
||||||
pandora.$ui.videoPreview = pandora.ui.videoPreview({
|
pandora.$ui.videoPreview = pandora.ui.videoPreview({
|
||||||
id: id,
|
id: id,
|
||||||
duration: result.data.duration,
|
duration: result.data.duration,
|
||||||
ratio: result.data.videoRatio
|
frameRatio: result.data.videoRatio
|
||||||
}).appendTo(pandora.$ui.info);
|
}).appendTo(pandora.$ui.info);
|
||||||
pandora.user.infoRatio = pandora.user.ui.sidebarSize / height;
|
|
||||||
resize(height);
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
} else if (pandora.$ui.leftPanel) {
|
} else if (pandora.$ui.leftPanel) {
|
||||||
pandora.user.infoRatio = 1;
|
//pandora.user.infoRatio = 1;
|
||||||
resize(pandora.user.ui.sidebarSize);
|
//resize(pandora.user.ui.sidebarSize);
|
||||||
}
|
|
||||||
function resize(height) {
|
|
||||||
!pandora.user.ui.showInfo && pandora.$ui.leftPanel.css({bottom: -height});
|
|
||||||
pandora.$ui.leftPanel.size(2, height);
|
|
||||||
that.animate({
|
|
||||||
height: height + 'px'
|
|
||||||
}, 250, function() {
|
|
||||||
pandora.resizeFolders();
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
return that;
|
return that;
|
||||||
};
|
};
|
||||||
|
|
|
@ -13,7 +13,7 @@ pandora.ui.leftPanel = function() {
|
||||||
collapsed: !pandora.user.ui.showInfo,
|
collapsed: !pandora.user.ui.showInfo,
|
||||||
collapsible: true,
|
collapsible: true,
|
||||||
element: pandora.$ui.info = pandora.ui.info(),
|
element: pandora.$ui.info = pandora.ui.info(),
|
||||||
size: Math.round(pandora.user.ui.sidebarSize / pandora.user.infoRatio),
|
size: Math.min(pandora.user.ui.sidebarSize, 256),
|
||||||
tooltip: 'info'
|
tooltip: 'info'
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
|
@ -23,7 +23,8 @@ pandora.ui.leftPanel = function() {
|
||||||
.bindEvent({
|
.bindEvent({
|
||||||
resize: function(data) {
|
resize: function(data) {
|
||||||
Ox.print('LEFT PANEL RESIZE')
|
Ox.print('LEFT PANEL RESIZE')
|
||||||
var infoSize = Math.round(data.size / pandora.user.infoRatio);
|
var infoSize = Math.min(data.size, 256);
|
||||||
|
// fixme: don't make a request here:
|
||||||
pandora.UI.set('sidebarSize', data.size);
|
pandora.UI.set('sidebarSize', data.size);
|
||||||
if (data.size < pandora.site.sectionButtonsWidth && pandora.$ui.sectionButtons) {
|
if (data.size < pandora.site.sectionButtonsWidth && pandora.$ui.sectionButtons) {
|
||||||
pandora.$ui.sectionButtons.removeElement();
|
pandora.$ui.sectionButtons.removeElement();
|
||||||
|
@ -36,10 +37,14 @@ pandora.ui.leftPanel = function() {
|
||||||
}
|
}
|
||||||
!pandora.user.ui.showInfo && pandora.$ui.leftPanel.css({bottom: -infoSize});
|
!pandora.user.ui.showInfo && pandora.$ui.leftPanel.css({bottom: -infoSize});
|
||||||
pandora.$ui.leftPanel.size(2, infoSize);
|
pandora.$ui.leftPanel.size(2, infoSize);
|
||||||
pandora.$ui.videoPreview && pandora.$ui.videoPreview.options({
|
if (pandora.$ui.videoPreview) {
|
||||||
frameHeight: infoSize - 16,
|
pandora.$ui.videoPreview.options({
|
||||||
frameWidth: data.size
|
height: infoSize,
|
||||||
});
|
width: data.size
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
pandora.$ui.info.find('img').css({height: infoSize + 'px'})
|
||||||
|
}
|
||||||
pandora.resizeFolders();
|
pandora.resizeFolders();
|
||||||
},
|
},
|
||||||
resizeend: function(data) {
|
resizeend: function(data) {
|
||||||
|
|
|
@ -1,13 +1,11 @@
|
||||||
// vim: et:ts=4:sw=4:sts=4:ft=javascript
|
// vim: et:ts=4:sw=4:sts=4:ft=javascript
|
||||||
|
|
||||||
pandora.ui.videoPreview = function(data) {
|
pandora.ui.videoPreview = function(data) {
|
||||||
var frameWidth = pandora.user.ui.sidebarSize,
|
var that = Ox.VideoPreview({
|
||||||
frameHeight = Math.round(frameWidth / data.ratio),
|
|
||||||
that = Ox.VideoPreview({
|
|
||||||
duration: data.duration,
|
duration: data.duration,
|
||||||
getFrame: function(position) {
|
getFrame: function(position) {
|
||||||
var width = pandora.user.ui.sidebarSize,
|
var width = pandora.user.ui.sidebarSize,
|
||||||
height = Math.round(width / pandora.user.infoRatio),
|
height = Math.min(width, 256),
|
||||||
resolution = Ox.filter(pandora.site.video.resolutions, function(resolution, i) {
|
resolution = Ox.filter(pandora.site.video.resolutions, function(resolution, i) {
|
||||||
return resolution >= height || i == pandora.site.video.resolutions.length - 1;
|
return resolution >= height || i == pandora.site.video.resolutions.length - 1;
|
||||||
})[0];
|
})[0];
|
||||||
|
@ -15,9 +13,10 @@ pandora.ui.videoPreview = function(data) {
|
||||||
Ox.isUndefined(position) ? '' : position
|
Ox.isUndefined(position) ? '' : position
|
||||||
) + '.jpg';
|
) + '.jpg';
|
||||||
},
|
},
|
||||||
frameHeight: frameHeight,
|
frameRatio: data.frameRatio,
|
||||||
frameWidth: frameWidth,
|
height: Math.min(pandora.user.ui.sidebarSize, 256),
|
||||||
timeline: '/' + data.id + '/timeline16p.png',
|
timeline: '/' + data.id + '/timeline16p.png',
|
||||||
|
width: pandora.user.ui.sidebarSize
|
||||||
})
|
})
|
||||||
.bindEvent({
|
.bindEvent({
|
||||||
click: function(event) {
|
click: function(event) {
|
||||||
|
@ -28,16 +27,16 @@ pandora.ui.videoPreview = function(data) {
|
||||||
position: event.position
|
position: event.position
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
pandora.UI.set('videoPosition|' + data.id, event.position);
|
pandora.UI.set(
|
||||||
|
'videoPoints|' + data.id,
|
||||||
|
{'in': 0, out: 0, position: event.position}
|
||||||
|
);
|
||||||
pandora.URL.set(
|
pandora.URL.set(
|
||||||
'/' + data.id + '/timeline' //'/' + Ox.formatDuration(event.position, 2)
|
'/' + data.id + '/timeline' //'/' + Ox.formatDuration(event.position, 2)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
function getResolution() {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
return that;
|
return that;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue