animated_gif.js
Past week I wanted to make an animated GIF - but didn't want to use GIMP or ffmpeg for that. I wondered: can an animated GIF be made in the browser? Of course it can! There was a library (JSGIF) which was a port of the original ActionScript library, AS3GIF.
I built a bit of wrapping code around the library, and did some tests to see if the port worked, first by creating a canvas and painting random squares on it, and then using them as input frames and building the GIF with that. Secondly, I tried using images. It worked acceptably enough (the color quantizer could be better, but we're not after photo-realistic animations, after all).
So I added the drag and drop + file api stuff, but there was still something missing... the look wasn't 90s enough! It was all begging for a bit of outdated aesthetics, but done with CSS3 and HTML5. Hence, there are multicolour logos via CSS animations, eye-cancer phosphorescent pink that turns into X-Files green glow (via CSS animations too), an HTML5 <footer> element used just because, and even a modern, 21st century blink-kind effect thanks to more CSS animations. You can't but love it. And those huge frames! They are done with an ingenious abuse of CSS borders, but that could be done with CSS five years ago already. Nothing new here, but all very funny in any case.
Note that even if I finished this yesterday --April's Fools-- it wasn't originally intended to be an April's Fools joke. Hopefully you can take it seriously, right?
Right!
PS I actually looked into making animated WebP's but the library I found wasn't fast enough so all the fun factor was lost :-(
Maybe in a couple of years, when WebP is retro already...