edit panel: abort small timeline rendering when re-rendering

This commit is contained in:
rolux 2014-02-07 13:41:56 +00:00
parent acee6e0382
commit dafd36fd18

View File

@ -46,7 +46,6 @@ pandora.ui.editPanel = function() {
}); });
} }
// FIXME: not used below!
function getSmallTimelineCanvas() { function getSmallTimelineCanvas() {
var fps = getSmallTimelineFPS(), var fps = getSmallTimelineFPS(),
width = Math.ceil(edit.duration * fps), width = Math.ceil(edit.duration * fps),
@ -59,10 +58,7 @@ pandora.ui.editPanel = function() {
} }
function getSmallTimelineURL() { function getSmallTimelineURL() {
var fps = getSmallTimelineFPS(), smallTimelineCanvas = getSmallTimelineCanvas();
width = Math.ceil(edit.duration * fps),
height = fps == 1 ? 16 : 64;
smallTimelineCanvas = Ox.$('<canvas>').attr({width: width, height: height})[0];
smallTimelineContext = smallTimelineCanvas.getContext('2d'); smallTimelineContext = smallTimelineCanvas.getContext('2d');
return smallTimelineCanvas.toDataURL(); return smallTimelineCanvas.toDataURL();
} }
@ -311,6 +307,7 @@ pandora.ui.editPanel = function() {
pandora.UI.set({videoSubtitles: data.subtitles}); pandora.UI.set({videoSubtitles: data.subtitles});
}, },
timeline: function(data) { timeline: function(data) {
updateSmallTimelineURL();
pandora.UI.set({videoTimeline: data.timeline}); pandora.UI.set({videoTimeline: data.timeline});
}, },
toggleclips: function(data) { toggleclips: function(data) {
@ -517,7 +514,8 @@ pandora.ui.editPanel = function() {
function updateSmallTimelineURL() { function updateSmallTimelineURL() {
var canvas = getSmallTimelineCanvas(), var canvas = getSmallTimelineCanvas(),
context = canvas.getContext('2d'), context = canvas.getContext('2d'),
fps = getSmallTimelineFPS(); fps = getSmallTimelineFPS(),
timelineIteration = self.timelineIteration = Ox.uid();
Ox.serialForEach(edit.clips, function(clip) { Ox.serialForEach(edit.clips, function(clip) {
var callback = Ox.last(arguments); var callback = Ox.last(arguments);
pandora[ pandora[
@ -526,9 +524,13 @@ pandora.ui.editPanel = function() {
var image = Ox.$('<img>') var image = Ox.$('<img>')
.on({ .on({
load: function() { load: function() {
if (timelineIteration == self.timelineIteration) {
context.drawImage(image, Math.floor(clip.position * fps), 0); context.drawImage(image, Math.floor(clip.position * fps), 0);
that.options({smallTimelineURL: canvas.toDataURL()}); that.options({smallTimelineURL: canvas.toDataURL()});
callback(); callback();
} else {
callback(false);
}
} }
}) })
.attr({ .attr({