From 3f6bda466b5f9cfdc77e78224c65b297744c4afa Mon Sep 17 00:00:00 2001 From: rolux Date: Sat, 18 Sep 2010 00:10:38 +0200 Subject: [PATCH] add timeline view --- pandora/static/js/pandora.js | 60 +++++++++++++++++++++++++++++++++++- 1 file changed, 59 insertions(+), 1 deletion(-) diff --git a/pandora/static/js/pandora.js b/pandora/static/js/pandora.js index c8fa8ef9..8d6a9b38 100755 --- a/pandora/static/js/pandora.js +++ b/pandora/static/js/pandora.js @@ -503,6 +503,60 @@ app.constructInfo = function() { ); } +app.constructItem = function(id, view) { + var $item; + //location.hash = '!' + id; + app.$ui.contentPanel.resize(0, 80); + app.$ui.groupsOuterPanel.empty(); + if (view == 'timeline') { + // fixme: this should be one app request, not three getJSONs + $.getJSON('/' + id + '/data/video.json', function(data) { + var video = data; + video.height = 96; + video.width = parseInt(video.height * video.aspectRatio / 2) * 2; + video.url = video.baseUrl + '/' + video.height + 'p.' + ($.support.video.webm ? 'webm' : 'mp4'); + $.getJSON('/' + id + '/data/subtitles.json', function(data) { + var subtitles = data; + $.getJSON('/' + id + '/data/cuts.json', function(data) { + var cuts = data; + $item = new Ox.VideoEditor({ + cuts: cuts, + duration: video.duration, + find: '', + id: 'editor', + largeTimeline: true, + matches: [], + points: [0, 0], + position: 0, + posterFrame: parseInt(video.duration / 2), + subtitles: subtitles, + videoHeight: video.height, + videoId: id, + videoWidth: video.width, + videoSize: 'small', + videoURL: video.url, + width: app.$document.width() - app.$ui.leftPanel.width() - 1 - 256 - 1 + }); + app.$ui.contentPanel.replace(1, $item); + app.$ui.rightPanel + /*.unbindEvent('resize')*/ + .bindEvent('resize', function(event, data) { + Ox.print('seems to work', data) + $item.options({ + width: data - 256 - 1 + }); + }); + app.$window.resize(function() { + $item.options({ + width: app.$document.width() - app.$ui.leftPanel.width() - 1 - 256 - 1 + }); + }); + }); + }); + }); + } +} + app.constructList = function(view) { var $list, keys = ['director', 'id', 'poster', 'title', 'year']; @@ -573,6 +627,9 @@ app.constructList = function(view) { }); app.$ui.selected.html(app.constructStatus('selected', data)); }, + open: function(event, data) { + app.constructItem(data.ids[0], 'timeline') + }, openpreview: function(event, data) { app.requests.preview && app.api.cancel(app.requests.preview); app.requests.preview = app.api.find({ @@ -703,6 +760,7 @@ app.constructList = function(view) { width = app.$ui.info.width(), height = imageHeight * width / imageWidth; app.ui.infoRatio = width / height; + app.$ui.leftPanel.resize('infoPanel', height + 16); $still.css({ position: 'absolute', left: 0, @@ -930,7 +988,7 @@ app.constructMainMenu = function() { { id: 'report', title: 'Report a Bug' }, ] }, { id: 'helpMenu', title: 'Help', items: [ - { id: 'help', title: app.options('name') + ' Help', keyboard: 'shift ?' } + { id: 'help', title: app.config.site.name + ' Help', keyboard: 'shift ?' } ] }, { id: 'debugMenu', title: 'Debug', items: [ { id: 'query', title: 'Show Query' }