basic flipbook embed
This commit is contained in:
parent
70bf214ec9
commit
47d059d17c
1 changed files with 53 additions and 12 deletions
|
@ -4,17 +4,58 @@
|
|||
|
||||
var pandora = new Ox.App({
|
||||
apiURL: '/api/',
|
||||
config: '/site.json',
|
||||
init: 'hello',
|
||||
}).launch(function(data) {
|
||||
var d = $('<div>').html('Pan.do/ra embed')
|
||||
.css({'position': 'absolute',
|
||||
'padding-top': $(window).height()/4,
|
||||
'padding-left':$(window).width()/4});
|
||||
$(document.body).append(d);
|
||||
var d = $('<div>').html('here be unicorns')
|
||||
.css({'position': 'absolute',
|
||||
'padding-top': $(window).height()/2,
|
||||
'padding-left':$(window).width()/2});
|
||||
$(document.body).append(d);
|
||||
var ui = {};
|
||||
var app = {
|
||||
info: function(item) {
|
||||
var that = new Ox.Element()
|
||||
.append(
|
||||
ui.infoTimeline = new Ox.Element('img')
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
bottom: 0,
|
||||
height: '16px',
|
||||
})
|
||||
.attr('src', '/' + item + '/timeline.16.png')
|
||||
)
|
||||
.append(
|
||||
ui.infoStill = new app.flipbook(item)
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
width: '100%',
|
||||
height: $(document).height()-16 + 'px',
|
||||
})
|
||||
)
|
||||
return that;
|
||||
},
|
||||
flipbook: function(item) {
|
||||
var that = new Ox.Flipbook({
|
||||
}).bindEvent('click', function(event, data) {
|
||||
var item_url = document.location.origin + '/' + item;
|
||||
window.top.location.href = item_url + '/timeline#t=' + data.position;
|
||||
});
|
||||
pandora.api.getItem(item, function(result) {
|
||||
var duration = result.data.item.duration,
|
||||
posterFrame = result.data.item.posterFrame || parseInt(duration/2),
|
||||
steps = 24,
|
||||
framePrefix = '/' + item + '/frame/' + that.width() + '/',
|
||||
frames = {};
|
||||
Ox.range(0, duration, duration/steps).forEach(function(position) {
|
||||
position = parseInt(position);
|
||||
frames[position] = framePrefix + position + '.jpg';
|
||||
});
|
||||
that.options({
|
||||
frames: frames,
|
||||
icon: framePrefix + posterFrame + '.jpg',
|
||||
duration: duration
|
||||
});
|
||||
});
|
||||
return that;
|
||||
}
|
||||
};
|
||||
var item = document.location.pathname.split('/')[1];
|
||||
ui.info= new app.info(item)
|
||||
.appendTo(document.body);
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue