I am importing gifsicle via 'https://unpkg.com/gifsicle-wasm-browser@1.5.16/dist/gifsicle.min.js' and have successfully used it to optimize my gif files generated with gif.js.
However, I am now attempting to use --explode to extract the individual frames from the provided 'savedGif', but am getting stuck. (would love to be able to do exactly what https://ezgif.com/split is doing....) All documentation for gifsicle points to each exploded image being stored at 'saved.gif.001''saved.gif.002' etc.... but I am not sure how this works outside of a command line (since I am doing this via the web)...
Here is the code I have so far:
`if (savedGif != null) { try { // Explode savedGif await gifsicle.run({ input: [{ file: savedGif, name: 'saved.gif' }], command: ['--explode saved.gif -o /out/saved.gif'] }); // Fetch the list of frames const frameCount = await getFrameCount('/out/', 'saved.gif.'); // Read frames into gifStack and wait for them to load for (let i = 1; i < frameCount; i++) { const frameName = `saved.gif.${String(i).padStart(3, '0')}`; const frame = await fetch(`/path/to/exploded/frames/${frameName}`).then(res => res.blob()); const imageData = new Image(); imageData.src = URL.createObjectURL(frame); await new Promise((resolveLoad) => { imageData.onload = () => { gifStack.push(imageData); resolveLoad(); }; }); } } catch (error) { console.error('GIF explosion error:', error); loadingMessage.textContent = 'Error exploding GIF.'; setTimeout(() => { loadingModal.style.display = 'none'; }, 3000); reject(error); return; } }`I am getting no errors when running this, and when I try to send the output to the console I also get nothing. I've also thought that maybe I could trying something like
` const output = await gifsicle.run({ input: [{ file: savedGif, name: 'saved.gif' }], command: ['--explode saved.gif -o /out/saved.gif'] });` and then loop through output[0] for each frame, but this also did not work...
Any thoughts or insights would be greatly appreciated. Thank you!!!