Pixel Joint Forum: New tool: JavaScript-based GIF animation player

Message

   One of the problems with animated GIFs is that we can't just stop them in the browser and play them frame by frame. It is very cumbersome when someone posts an animation and we have to save it and open it locally in order to analyze it.

Well, I created this little tool to help us with that. It's entirely based on JavaScript and some server-side processing of GIF files. The whole thing is cached, too, so it should be really fast once the first person processes a GIF file. The usage in a page is completely unobtrusive and simple and will work with any GIF file in any server, as long as it is below 1 MB in size.

Here's a test page

Here's a link to a quick input form for the tool

Now, I'm not sure if the admins here would like to implement this, but I think it would be very neat and useful for us. I'll also try to integrate it with the zoom feature soon, and I'm working on a few extra ideas (hotlinking to specific frames, etc.)

Either way, it should be possible to use it as a GreaseMonkey/UserJS script to whoever is interested.

Also, notice there are still some minor bugs in processing the frames (Fool's dog disappears for a few frames, I'm still trying to figure that out).

Suggestions are welcomed!

Edited by 1ucas - 10 April 2010 at 7:51pm

Author	Message
1ucas Commander Joined: 27 June 2005 Location: Brazil Online Status: Offline Posts: 174	Topic: New tool: JavaScript-based GIF animation player Posted: 10 April 2010 at 4:58pm
	One of the problems with animated GIFs is that we can't just stop them in the browser and play them frame by frame. It is very cumbersome when someone posts an animation and we have to save it and open it locally in order to analyze it. Well, I created this little tool to help us with that. It's entirely based on JavaScript and some server-side processing of GIF files. The whole thing is cached, too, so it should be really fast once the first person processes a GIF file. The usage in a page is completely unobtrusive and simple and will work with any GIF file in any server, as long as it is below 1 MB in size. Here's a test page Here's a link to a quick input form for the tool Now, I'm not sure if the admins here would like to implement this, but I think it would be very neat and useful for us. I'll also try to integrate it with the zoom feature soon, and I'm working on a few extra ideas (hotlinking to specific frames, etc.) Either way, it should be possible to use it as a GreaseMonkey/UserJS script to whoever is interested. Also, notice there are still some minor bugs in processing the frames (Fool's dog disappears for a few frames, I'm still trying to figure that out). Suggestions are welcomed! Edited by 1ucas - 10 April 2010 at 7:51pm
	Online Animated GIF Frame Viewer
	IP Logged

Hatch Admiral Joined: 05 August 2015 Online Status: Offline Posts: 1387	Posted: 10 April 2010 at 6:20pm
	I'm pretty sure the bug is in Fool's animation, not your code. The frame that disappears is wholly transparent except for a few purple pixels and uses the replace disposal method, so it seems you're displaying it accurately. Though I'm not sure why the animation doesn't flicker there if that's the case.... Anyhoo, that brings me to my feature request: would it be possible to show the disposal method and delay for each frame? Edited by Hatch - 10 April 2010 at 6:20pm
	IP Logged

1ucas Commander Joined: 27 June 2005 Location: Brazil Online Status: Offline Posts: 174	Posted: 10 April 2010 at 6:32pm
	*Originally posted by Hatch* I'm pretty sure the bug is in Fool's animation, not your code. The frame that disappears is wholly transparent except for a few purple pixels and uses the replace disposal method, so it seems you're displaying it accurately. Though I'm not sure why the animation doesn't flicker there if that's the case....Anyhoo, that brings me to my feature request: would it be possible to show the disposal method and delay for each frame? Yeah, it's a really weird use of the "revert to background color" disposal method. It works everywhere else besides that one time. Browsers don't seem to have a problem displaying it, though, so I'm sure it's some sort of quirk I forgot to consider. The specs are really vague on the matter, unfortunetly. I'm already working on the frame information (delay and hot linking stuff), so that's just a matter of time. I don't see any use for displaying the disposal method, though, since it's really just an optimization trick, and each software will deal with it their own way. Why do you think that would be useful?
	Online Animated GIF Frame Viewer
	IP Logged

1ucas Commander Joined: 27 June 2005 Location: Brazil Online Status: Offline Posts: 174	Posted: 15 April 2010 at 6:02am
	NEW UPDATE! Good news, everyone! I've worked some more on the tool and I think it's just about ready for us to use here (if the admins are up to it, that is). Here's a changelog: Zoom feature integration!: The tool now plays nicely with the zoom feature, working exactly the same as with the usual images! ;D Customization: You can setup the class name to use, URL for the skin image, the colors, position of the toolbar, hide delay, etc. Smaller UI: looks good enough now Auto image interpolation fix: The code automatically fixes the issue with image interpolation on Firefox and Internet Explorer. Browser support: Code now works on Firefox, Chrome, Opera, Safari and Internet Explorer 8. If you use anything lower than IE8, fk you. Also, I've created some quick aids for the viewer: Get all images from link referer: this link makes the viewer list all GIF files in the refering page (originating page), for convenience. Viewer now includes zoom: Images in the viewer have the zoom feature enabled by default. Get all images by URL: you can pass a page's url as a parameter, like this Link to an image directly: like this Bookmarklet!**: Check the bottom of viewer for a handy bookmarklet to submit the current page to the viewer. Well, that's it for now! Got a few more ideas to implement, but this is good enough to go! Again, don't refrain from posting any comments, bugs and suggestions. Cheers! Edited by 1ucas - 15 April 2010 at 6:02am
	Online Animated GIF Frame Viewer
	IP Logged

Hatch Admiral Joined: 05 August 2015 Online Status: Offline Posts: 1387	Posted: 16 April 2010 at 2:25pm
	*Originally posted by 1ucas* I don't see any use for displaying the disposal method, though, since it's really just an optimization trick, and each software will deal with it their own way. Why do you think that would be useful? Mm, makes sense. I retract my request! Anyhoo, new version's looking great! Thanks for writing it.
	IP Logged

Manupix Commander Joined: 05 November 2024 Online Status: Offline Posts: 771	Posted: 17 April 2010 at 3:22pm
	Awesome tool! Would it be possible to display frametime next to each frame?
	IP Logged

1ucas Commander Joined: 27 June 2005 Location: Brazil Online Status: Offline Posts: 174	Posted: 17 April 2010 at 6:19pm
	Yep, Manupix. That feature's coming in the next update. :)
	Online Animated GIF Frame Viewer
	IP Logged

Resources and Support
Pixel Joint Forum : The Lounge : Resources and Support