diff --git a/src/lib/file-uploader.js b/src/lib/file-uploader.js index 628a1a552..15a018541 100644 --- a/src/lib/file-uploader.js +++ b/src/lib/file-uploader.js @@ -118,15 +118,14 @@ const costumeUpload = function (fileData, fileType, storage, handleCostume, hand } case 'image/gif': { let costumes = []; - const onFrame = (frameNumber, dataUrl) => { + gifDecoder(fileData, (frameNumber, dataUrl, numFrames) => { costumeUpload(dataUrl, 'image/png', storage, costumes_ => { costumes = costumes.concat(costumes_); + if (frameNumber === numFrames - 1) { + handleCostume(costumes); + } }, handleError); - }; - const onDone = () => { - handleCostume(costumes); - }; - gifDecoder(fileData, {onFrame, onDone}); + }); return; // Abandon this load, do not try to load gif itself } default: diff --git a/src/lib/gif-decoder.js b/src/lib/gif-decoder.js index 91466eaa4..d53a6205b 100644 --- a/src/lib/gif-decoder.js +++ b/src/lib/gif-decoder.js @@ -1,9 +1,10 @@ import {GifReader} from 'omggif'; -export default (arrayBuffer, {onFrame, onDone}) => { +export default (arrayBuffer, onFrame) => { const canvas = document.createElement('canvas'); const ctx = canvas.getContext('2d'); const gifReader = new GifReader(new Uint8Array(arrayBuffer)); + const numFrames = gifReader.numFrames(); canvas.width = gifReader.width; canvas.height = gifReader.height; @@ -14,7 +15,6 @@ export default (arrayBuffer, {onFrame, onDone}) => { const framePixels = []; gifReader.decodeAndBlitFrameRGBA(i, framePixels); const {x, y, width, height, disposal} = gifReader.frameInfo(i); - for (let row = 0; row < height; row++) { for (let column = 0; column < width; column++) { const indexOffset = 4 * (x + (y * canvas.width)); @@ -47,16 +47,12 @@ export default (arrayBuffer, {onFrame, onDone}) => { break; } - onFrame(i, dataUrl); + onFrame(i, dataUrl, numFrames); - if (i < gifReader.numFrames() - 1) { + if (i < numFrames - 1) { setTimeout(() => { loadFrame(i + 1); }); - } else { - setTimeout(() => { - onDone(); - }); } };