September 14, 2004
Load PNG, GIF or progressive JPEG into SWF?

Did you have the problem before that you wanted to load some file formats into your Flash site but loadMovie does not accept them? Something like PNGs, GIFs or progressive JPEGs? Do you want to load images or SWFs from a different domain but the security sandbox is in your way? For these purposes I have written swfImageProxy, a PHP script that automatically converts file formats that are usually indigestible for Flash into something that it can display. On top of that it acts a proxy and is able to download images from other domains.

Here is a simple Flash demo that allows you to enter the URL of an image and swfImageProxy will try to retrieve and convert it.

If you want to use the full functionality of the script your server will have to fulfill certain prerequisites:

  • For basic functionality you will at least need PHP with GD support.

  • If you want the conversion of progressive JPEGs to baseline optimized JPEGs to be lossless the script needs access to the jpegtran utility.

  • If you want to be able to read GIFs the minimum required version of GD is 2.0.28 which currently happens to be the latest version

  • If you want to preserve the transparency of PNGs and GIFs they have to be packaged as SWFs. For this purpose the png2swf utility from the excellent swftools package by Rainer Böhme and Matthias Kramm has to be installed

  • To convert animated GIFs you need access to ImageMagick

You can download swfImageProxy here. Currently I have only tested this on Linux - if you are able to run this on Windows I'm happy to hear about it. I have tried to make this as secure as possible, but of course you use this on your own risk. It also looks like the png2swf tool does not fully support every format of PNGs yet.

Thanks to Jon Williams for the initial inspiration!

Update: I have just fixed a bug that killed the transparency with 24-bit PNGs so the latest version is swfImageProxy v0.2

Update: fixed the quality=0 bug that occured when you used GD only for conversion. The latest version is now swfImageProxy v0.3

Latest update: I integrated an option to use ImageMagick for the conversion of animated GIFs to SWFs. Though it does not yet give optimum results for every type of GIF. Latest version: swfImageProxy v0.4

Posted at September 14, 2004 02:12 PM | Further reading
Comments

this sounds very cute! :) but actually the download link doesn't work. for any reason it forwards me to a search results page. :(

Posted by: nesium on September 14, 2004 02:28 PM

As nicole richie would say.. "thats hot"

Posted by: Dominick on September 14, 2004 02:30 PM

ok, well here's the correct link: click

thanks a lot :)

Posted by: nesium on September 14, 2004 02:41 PM

ok, links are deleted, so here you are ...
http://www.quasimondo.com/swfimgproxy/swfimageproxy_v01.rar

Posted by: nesium on September 14, 2004 02:42 PM

try to use "swfimgproxy" instead of "swfimageproxy" in the download link. Anyway, thats a real nice add-on to the exsisting functionality :)

Posted by: lunatic on September 14, 2004 02:44 PM

Thanks for pointing me to the wrong links - I've corrected them now...

Posted by: Mario Klingemann on September 14, 2004 02:53 PM

BTW - if you don't have any transparent PNG link at hand, here's one for you:

http://www.quasimondo.com/swfimgproxy/png24_interlaced.png - just copy that one into the demo's url box (do it twice to the transparency) - did I say that you can drag the loaded images in the demo?

Posted by: Mario Klingemann on September 14, 2004 04:59 PM

What kind of lincense are you releasing this under?

Posted by: Peldi on September 14, 2004 05:14 PM

Good Question. I always forget the legal mumbo-jumbo. So let this be released under GPL: http://www.gnu.org/copyleft/gpl.html

Looks like I'll have to add that to the sourcecode, too.

Posted by: Mario Klingemann on September 14, 2004 05:50 PM

Sorry... but this is not "new"... used PHP with GD-lib so often for flashbased e-Commerce systems... my new project FLOE (flash-based online editor) will also a module with image editing of GIF, JPG and PNG...

Posted by: Erik Lembke on September 14, 2004 08:07 PM

Hello -

I just downloaded and adapted this to my site…
I mean by adapted, my .SWF, for the rest I upload both .PHP files on the serveur (Apache/1.3.29 Server at thebend.be Port 80 , PHP Version 4.3.8, GV version 2.0 or higher).

BUT, I encounter a very strange problem, my pictures (.GIF, .JPG, …) are well downloaded, but look very damaged.
Please would you mind to take a rapid look at: http://www.thebend.be/ideas/
Search for "log" (by example) and tell me what do you think don't works correctly? Thanks…

Have a nice evening…


- Dimitri

Posted by: Dimitri Castrique on September 14, 2004 10:04 PM

@dimitri: oh it looks like I forgot to put the quality setting into the function that returns the JPEG. I have fixed that bug and uploaded the new version.

But if you see this it also means that the script on your machine can only use GD. So your PNGs and GIFs will not be transparent.

@Erik Lembke: I'm sure that others have found similar solutions for this task before and maybe I just used the wrong keywords to find them on Google.

But feel free to add the URL to your script here. It would be interesting to see if you found a way that needs less installations on the server (which is definitely a negative point of my solution).

Posted by: Mario Klingemann on September 14, 2004 10:21 PM

Well, it looks like I did not search well enough. Here is a .NET based solution I just came across: http://www.img2swf.com - you can get that one for US$99.

Posted by: Mario Klingemann on September 14, 2004 11:15 PM

By any chance, do you think that an animated gif could be turned into a swf?

Posted by: Dominick on September 14, 2004 11:49 PM

Animated GIF ... now that would be something wouldn't it? Unfortunately, it looks like GD is not able to access the single frames of animated GIFs which is a pity because the png2swf utility is already able to create an animation out of a series of PNGs (to which I convert GIFs anyway). So what I would need for that is some tool or script to access the single frames of a GIF and their respective delays - then it should be possible to do it. So if anybody can point me to a free tool I'll give it a try.

Posted by: Mario Klingemann on September 15, 2004 12:09 AM

Hey Mario - very cool - nice work!

I thought I would mention that there are a couple other PHP specific solutions for doing this that have been around for some time - (I really like the support for PNG and gif in yours though as it seems more robust) - I had written an article back in July of 2002 comparing some features of Flash 5 with new features found in MX right after MX had just been released, that used a similar php system to load jpeg's. for a dynamic webcam. You can check it out here: http://www.informit.com/articles/article.asp?p=27770&seqNum=1

Wow, havent read that article in sometime - and it looks like I also referenced Claus's Wahlers tool jpg2swf, and another tool I still use occassionally by Stefan Schuessler - which can now be found here: http://www.bronsonbeta.com/oldstuff/

Have you ever played with imagemagick? http://www.imagemagick.org/

I have used that in a few projects server side to accomplish some similar results as well. Thought you might want to take look at it because of its support for many different image formats, including steganographic images. I simply call it from php using shell or exec, and it works great. Might be worth looking into for the animated .gif support.

Nice work!
Rob

Posted by: Robert M. Hall on September 15, 2004 06:22 AM

I agree with Rob, very nice work!
Thanks for all Mario… Long life to Quasimondo!

Posted by: Dimitri Castrique on September 15, 2004 07:43 AM

So good! I just translated this news into Russian and posted on flash-ripper site. Thank you!

Posted by: Rostislav Siryk on September 15, 2004 09:57 AM

Fabulous ! thanks :)

Posted by: ekameleon on September 16, 2004 11:21 AM

Okay, I have checked out ImageMagic now and yes - it's really powerful. Theoretically It could convert almost any image format to something I can embed into an SWF file. With the right additional libraries one could even take screenshots from webpages.

But okay let's stay with the animated gifs for a start. I have integrated a first version and if you test it in the demo you should be able to see something if you point the URL to an animated GIF.

Though it is not perfect yet: currently I completely ignore the delay of the single GIF frames and just use the default framerate of the swf. But what is worse is that I could not force Imagemagick to export all the frames of a GIF in the same size if they use an optimized canvas. The consequence is that GIFs that use this technique will jump around. I have tried any trick that I could imagine, but no success. Maybe someone here has an idea?

Posted by: Mario Klingemann on September 18, 2004 05:10 PM

Does this works with tiff format also?

Posted by: Tushar on September 21, 2004 02:56 PM

Do you need TIFF? Well, with ImageMagick's help it's definitely possible to do that. I'll try to integrate that in the next Update.

Posted by: Mario Klingemann on September 21, 2004 02:58 PM

That's great to here!
Eyes open for the next update :-)

Posted by: Tushar on September 22, 2004 11:22 AM

Nice work, I especially like the gif support you are working on.

FYI, PHP's Ming module (current CVS) has support for PNG's including transparency and non-animated GIF built it. http://ming.sourceforge.net

For those interested, the link below is to an example that works in reverse, taking the Flash drawing API and converting it to PNG, JPEG, or static SWF. http://jerryscript.hostrocket.com/flash/draw/SWFDrawing2JPEG.html

Keep up the great work!

Posted by: Jerry on September 22, 2004 08:32 PM

Hi Mario! Great stuff! But I still haven't been able to get a noncorrupted file from all of these links! Can you post it as a zip or sit?

Thanks,

Bruce

Posted by: Bruce on October 6, 2004 08:32 PM

@Bruce: Really? I just tested this link: http://www.quasimondo.com/swfimgproxy/swfimageproxy_v04.rar and it opens just fine.

Posted by: Mario Klingemann on October 7, 2004 12:30 AM

Thanks,
Nice work!

Posted by: ATMaster on October 18, 2004 12:07 AM

Love it! Been using gif2swf on my local machine until this point. This is a godsend!

Posted by: Ben Jackson on October 20, 2004 02:50 PM

Asad iqbal you are regisered to post coment

Posted by: asad on October 29, 2004 04:41 PM

Mario,

swfImageProxy is very cool and exactly the type of package I'm looking for. I'm in the process of reading your code and hopefully I'll get it running soon.

In the mean time, I was wondering how you view the project several months later. Are you using it in any production environments? Has it been stable? Did you find a better solution?

Thanks,

Denny

Posted by: Dennis Crall on January 20, 2005 08:35 PM

Does anyone know if this is possible to do in ASP? I'm afraid I don't know PHP.

Posted by: David Buchan on February 1, 2005 11:08 AM

I am unable to get this to work on Windows. I get a large "X" image (image not found) error. Anybody get this to work on Windows?

WinXP/Apache

Posted by: Tom on February 1, 2005 08:11 PM

I never tried to run it on Windows. I guess it's the wrong file paths that break it. Do you have all the necessary libraries installed already?

Posted by: Mario Klingemann on February 2, 2005 11:57 AM

I tried flash demo with
http://www.quasimondo.com/swfimgproxy/png24_interlaced.png
but it doesn't work.
:(
What's the catch?

Posted by: Tamara on February 25, 2005 03:03 PM

@Tamara - that is strange indeed. Currently I have no idea why it doesn't work anymore. Maybe it's a problem with my server's configuration?

Posted by: Mario Klingemann on February 25, 2005 03:17 PM

i obtain Warning: fopen(p1110286756018452000) [function.fopen]: failed to create stream: Permission denied
what file o what directory need permiss?

Posted by: Lupito on March 8, 2005 02:03 PM

great work!

I don't suppose it's possible to get a load percentage when loading images via swfimgproxy? In my tests getBytesLoaded() is either 0 or 100%.

Posted by: felix on March 11, 2005 02:07 AM

@felix: That's strange because the format that arrives at your flash file is either a JPEG or a regular swf. So it should not affect the way that flash loads files. Maybe the files you tested were so small that they loaded immediately?

Posted by: Mario Klingemann on March 11, 2005 11:06 AM

Well, im trying to get it to work on my server ... but its not. So I tried the php on quasimondo.com

http://www.quasimondo.com/swfimgproxy/swfimgproxy.php?url=

Using a couple of diffrent pictures:

http://miniprofile.xfire.com/bg/bg/type/0/caffeineaddiciton.png
http://nervenexus.com/zone/zone_rating.php?name=RLX_Nemesis&theme=2&x=1.jpg

Neither of these work ... I am trying to Make a .swf file that can pull these dynamicly created pictures through some sort of proxy and then desplay them ... but I just cant get it to work.

Any Ideas?

Posted by: CaffeineAddiction on April 6, 2005 10:50 PM

It looks like GD's imageCreateFromPNG function has a problem with your PNG file. How do you generate those files?

Posted by: Mario Klingemann on April 6, 2005 11:31 PM

See thats part of the problem ... I dont know. They are both created by other peoples web script ... first one is from xfire a gaming client that monitors all games you play and makes a pic w/ stats of which game you play the most. And the second one is made by Zone a gaming website ... that particular one is for a game called Age of Conqures.

Posted by: CaffeineAddiction on April 14, 2005 06:20 AM

As your PNG doesn't use any transparency you could modify my script so it skips the part that uses imageCreateFromPNG and use the png2swf directly (I tested png2swf manually with your file and that worked)

Posted by: Mario Klingemann on April 14, 2005 10:39 AM

hi, this tool is great!! i've just downloaded it.. and about to use..well, try to use it..
butta, is there a tutorial that'd show us how to use it? what to do with it? how to code it in flash Actionscript or etc??? i'm clueless..

Posted by: thefather on April 16, 2005 01:44 AM

Hello Mario... really nice code..
Just want to post that what Felix wrote above, happens with me too. loadMovie can't get the bytes of the jpgs.
loadClip doesnt even work.
Could be fixed ? or my code that should be fixed ?

Posted by: ma on May 7, 2005 01:31 PM

Hello again,
Have someone had troubles with " " white spaces when using Mario's code?
The original I get this
/albums/album%20with%20spaces/pic1.jpg
dont work... so I str_replace to this:
/albums/album with spaces/pic1.jpg

should be something about changing the $imgname for the imageCreateFromJpeg() function...

but i'm a newbie in php.... could someone help ? heh

Posted by: ma on May 17, 2005 02:50 PM

hey mario,
first of all ... great work you did.
but secondly ... i have the same problem with png like caffeinAddiction. and it seems that the png you proposed yourself (sep 4, 2004) ... http://www.quasimondo.com/swfimgproxy/png24_interlaced.png ... doesnt work either. hm?! so, what now? :-|

Posted by: macmenace on May 20, 2005 05:11 PM

As my own png is not working anymore that makes it sound like some update to one of the used libraries: GD, imageMagick or swftools made it break.

Maybe I will find some time to look into this problem, but don't wait for it...

Posted by: Mario Klingemann on May 20, 2005 05:17 PM

yes, your png doesnt work on your site, on mine it does, so its your libraries! go find it :)

Posted by: Bo Voltair on June 10, 2005 12:17 AM

come on, bo ... tell us ... which libs / versions do you have? wouldnt it be nice, if everone knew what to use to make this very nice tool work?!

Posted by: macmenace on June 28, 2005 12:45 PM

check yourself at http://www.fotoserviss.com/phpinfo.php
soon to be removed..

Posted by: Bo Voltair on July 20, 2005 08:06 PM

We stumbled by this issue with a shop with many items (transp. PNG's). ASPimage, and GDimage didnt do it well, so testing img2swf (from www.img2swf.com) was a big relief :-)

Posted by: Chief on August 28, 2005 08:30 PM

can we run swfimageproxy through flash mx 2004

Posted by: soumya on September 5, 2005 11:59 AM
Post a comment
Name:


Email Address:


URL:


Comments:


Remember info?



Thank you!

Most Visited Entries
Sketches, Works & Source Code
Lectures
Contact
Backlog
In Love with
Powered by
Movable Type 2.661

© Copyright Mario Klingemann

Syndicate this site:
RSS 1.0 - RSS 2.0

Quasimondo @ flickr
Quasimondo @ LinkedIn
Quasimondo @ Twitter
Quasimondo @ Facebook
Quasimondo @ MySpace
Quasimondo is a Bright
Citizen of the TRansnational Republic
My other blog in german
Impressum


My family name is written Klingemann,
not Klingelmann, Klingeman, Klingaman, Kingemann,
Kindermann, Killingaman, Klingman, Klingmann, Klingonman
Klingemman, Cleangerman, Klingerman or Kleangerman

profile for Quasimondo at Stack Overflow, Q&A for professional and enthusiast programmers