04 October 2009

Save JPG /PNG image from AS2 project using AS3 & PHP

There's a tonne of Actionscript 2 image capture scripts out there but after an extensive search last month, the best ones I could find all ran into horrible memory problems and server timeouts when trying to capture large images. So I figured out a better way...


The problem is, the only way to capture a screenshot using AS2, is to record the RGB value of every pixel in flash, export it to a php file and have php rebuild the image using that data. This works great for small images but takes ages and always runs into difficulty when the image is very large (say, large enough to print at 300dpi)

So, since AS3 has high speed image capture functionality built in which can handle huge amounts of data, I decided to import my AS2 swf into AS3 and work at capturing the screenshot from there.

It's a bit tricky to get AS2 and AS3 talking to each other (they're like 2nd cousins from different countries!) ...but the result is great! Far superior (much quicker and cleaner) than anything AS2 can manage alone. So much so, I'd actually recommend this  technique over others even if you only have a small image to capture.

[update: 30th March 2010] Sample files (flash CS3 format) and full instructions are now included below.
[update: 16th February 2011] Files have been updated and made a lot easier to use for beginners. You can now run a function when save is complete. Files are now in CS4 format.

Please see right hand pane before downloading >
Download Now

Please see right hand pane before downloading >



Instructions:
  1. Replace myProjectAS2 files in this directory with your own AS2 project files.
  2. Add this code to the first frame of your AS2 project:
    //AS2-3 bridge:
    import com.gskinner.utils.SWFBridgeAS2;
    var myBridge:SWFBridgeAS2 = new SWFBridgeAS2("connectionID", this);
  3. Upload savePNG.php to your web server. By default, savePNG.php will save PNGs into the same folder where it is located so put it in a folder on its own somewhere.
  4. In printAS3.fla, change the paths under the 'setup' section of the code to match the paths on your server.
  5. Make sure the AS2 swf has been generated and then generate the printAS3 swf. 
  6. Change the loading symbol/print button graphics if you wish.

NOTE: You probably already know this but Flash will sandbox swfs unless run from the flash authoring environment so nothing will work outside of flash until you get it to a web server. 


References & Thank you's:
gSkinners SWFbridge to get communication going between AS2 & AS3
Mark Knol's image class to save the image from AS3


48 comments:

Evgeny Balter said...

Do you have an example of how to get to AS2 from AS3?

I am having difficulties doing it...to say the least.

If you have a link could please send it to evgeny.balter@gmail.com

Thanks in advance,
Evgeny

cron said...

Hi Evgeny,
I used gSkinner's SWFbridge to get them talking. It's not as easy as you'd like but it works. Check it out here: http://www.gskinner.com/blog/archives/2007/07/swfbridge_easie.html

Anonymous said...

I am trying to use your package but when I try to load the printAS3.fla file in Flash CS3, it just says "Unexpected file format" which makes me think the file is corrupted. Also in your instructions "put your as2 file...", do you mean swf? Thanks. Damien

cron said...

Hi Damien, I've updated files and instructions for you above.

Anonymous said...

Hi Cron. Thanks for your time but I still have the problem. You may use another later version than FlashCS3 I guess. And it seems incompatible. Sad. Damien

cron said...

I've saved all fla files down to CS3 now so this shouldn't be a problem in future.

Christian said...

Hi, this is great, although i couldn't get it to work, im using the same files/structure as in the sample package. I only put the path to 'savePNG.php' in a folder called img. i also change the urlPATH to in printAS3.fla to '/img/savePNG.php'
But it doesn't print any pictures to my ftp.

Any suggestions?
Best
Christian

Anonymous said...

i while to load 2 swf with AS2 on the AS3 main stage (with snaping Function)- i would try to comunicate between two mc with AS2 - I try to do (script in File(2AS2) to menaging objects in snaping/capturing = File(1AS2)) how to do conecting scripts from one AS2 to next AS2 file loading on stage with AS3 ?? ;/ sorry for my bad Ang.

Anonymous said...

ok :P sorry My Bad - gSkinner solved my problem / to Christian - try img/savePNG... or set the right to folder save ?!

Christian said...

Dont really understand, i use the path 'img/savePNG.php'. Doesnt work.

what do you mean with 'or set the right to folder save ?!'

So im using the same structure and files, only thing i changed is the path to the php-file, anything i forgot or that im doing wrong?

Christian said...

do i need to change something here
imageSaver.save ( thecrop, "0pages/buscard/cards/card" ); // path from public_html to save filename excluding file extension

cron said...

Hey Christian,
Yes, you need to change this to the path you'd like to save your images to. I will add this to the instructions.
If you're still having trouble, try using an absolute URL as the script path like this: http://www.domain.com/path/to/script/savePNG.php

Christian said...

by the way its very nice that this thread came to life agin

Christian said...

hey, i feel a bit stupid…

Cant get it to work…
theres something with the paths that is not working…hehe…
this is how it looks.
var scriptURL="http://www.xxxx.com/xxxx/savePNG.php";

var savePath="http://www.xxxx.com/xxxx/images/";
so the idea is that the images will be stored in the folder images?! Am i right? orway off

This is the only thing i changed form the original files.

/Cheers

gingyer said...

super super sollution.

I try to avoid as3 because it takes longer and sometimes schedules can be tight and this is just the sort of tip I needed.

Quick question though. how do I know that the image is done so i can continue the flow of the program.

Thanks

cron said...

Thanks gingyer, I've updated the sample files to demonstrate how this can be done. Files are in CS4 format now.

gingyer said...

thank you cron.

I have another question. Lets say we want the two platforms to communicate between them. That is the send and receive variables from one to the other?

is that possible? How would i go about and do that?

Thanks

Anonymous said...

Thanks Cron! This is really great!

I've got it to work when I click the PRINT button. Is there a way to call the goPrint() function at an event taking place in the AS2 file? Do i call goPrint() from the AS2 or from the AS3 file?
This is probably elementary for you... I can't get my head around the code...

Thanks for your help
Jason

cron said...

Hi jason, the goPrint() function needs to be called in AS3 so to call it from AS2 you'll need to use the SWFbridge class. Theres an example of AS3>AS2 in the code somewhere that's commented out. You need to go AS2>AS3 so look here for the example: http://gskinner.com/blog/archives/2007/07/swfbridge_easie.html

Anonymous said...

Thx Cron!
Got it sorted!

Thanks again for your help!

harun said...

hey there.
thanks so much for posting this solution. im making image editing site in flash im trying to use this as a "save" function.

ive been having a really strange problem however. when i press the print button.the loading symbol just stays there and it never makes the file.

heres the wierd thing. when i try it in flash with test movie, it works fine. it even accesses the php file on my server and creates the png on the server in my specified path.

if i load it into any browser, locally or on the server, it breaks.

any idea what could be causing this?

cron said...

@harun It sounds like flash sandbox security problems. http://www.adobe.com/devnet/flash/articles/fplayer8_security.html

Harun said...

hey there. you were right. that helped alot. aparently the new security settings dont like you accessing a php script with an absolute path like that. i made your variable for the absolute path to the php script = "" and it works fine now. now i just have to wrap my head around as3 enough to send a gotoAndStop() to a MC in the as2 swf from the print button.

Anonymous said...

hmmm... i couldn't open printAS3.fla.

I'm using CS4.

cron said...

Try again now. I've saved it down to CS4

Anonymous said...

Can you save the file compartibile with Adobe flash Pofessional CS3? I am using CS3

cron said...

No sorry I have CS5 which only allows saving down as far as CS4. Maybe someone else would oblige?

Nicolas said...

I can save the image to my computer from as3?
I appreciate your help

cron said...

No, Flash has no local access for security reasons. You need a web server to make this happen.

Nicolas said...

:(
Is there any possibility to save a jpg to the computer from actionscript 2?

Nicolas said...

my swf is running on my computer, I want to save the swf jpg in the same directory

Vladimir said...

Hy, this is great tutorial and work perfect.
I want to ask something:

My problem is:

- I have two buttons, one in AS2 and the other one in AS3 window.
- Buttons doing different job.
- Is it possibile when i click on button in AS2 to do also what button in AS3 doing.?
- Mean: Separately both button work fine. I want when click in AS2 button both event to start, if you understand what i'm saying.
I don't know how to do that, i am not good as you.
Can you please help me?

cron said...

Vladimir, see second comment on this page. You need to use swfbridge to call an as3 function from as2.

Vladimir said...

Why if it is open 2 or maby 3 windows (tab) of swf, saving not works?

Anonymous said...

Yes, that is coorect Vladimir, i have the same problem. Can anyone help?

cron said...

Good question fellas, I suspect it has something to do with Mark Knol's image class. Perhaps you'll find someone over there who can help... I dont have the time or motivation to start going through his code!

Vladimir: I got all your comments together when I came back from vacation. Did you get it sorted? It shouldn't be too difficult since everything's set up already. You just need to copy the example on Grant's blog onto the AS2 button:

Calling this from the AS2 swf:
myBridge.send("myMethod", "Hello", "World");

Is the same as calling this from the AS3 swf:
myMethod("Hello","World")

Vladimir said...

Thank's i found solution.

Only problem is two, three open window in the same time.

Vladimir said...

Hy Cron, again me :). I have one more problem. Maby you or someone other can help me. Here is the thing:

In AS2 swf combo box works fine.
But when AS2 open through AS3 there is a problem. I have about 15 items in the list.
Problem is that when I choose item and click on it display other item not one I choose (I can't from first click choose what I want). But example: when fist i click on arrow up or down and then click on item i want it works ok.
I need help.

JOii said...

Dear Cron, I have found this page and see that it's very useful to my project.. It's made of as2 http://www.apieceoffun.com/floodavatar/

With help from my friend to modify a little bit from your script ... we make the page printable yesterday... but after a few times ... It keeps calculating and not show the picture. Do yiu have any idea or suggestion about this? Thank you in advance :) I really appreciate your sharing.

sudarshan said...
This comment has been removed by the author.
sudarshan said...

i am using it will 800X560 as2 swf. i see its only loading but now response.

when i change it 400X560 its works

whats the maximum resoultion it will work with.

cron said...

@JOii Ive never had trouble like this so I'm not sure what's causing the problem. It could be a server safety setting, a script timeout or a build up of memory. Try flushing the php buffer and resetting the script time limit after each image (google these terms). It might work! Sorry I cant help further!

@sudarshan It depends on your server setup (ram, buffer settings, etc) I think. I can reliably get a 2500x2500 image printed so 400x560 seems quite low. Could you try it on another server?

Seb said...

hi i have trouble with the paths..same problem as harun had with it won't working when uploaded to a server
my paths is
var scriptURL=”http://test.mysite.com/flash/saveIMG/”; //absolute path to directory containing

savePNG.php on your server var savePath=”testIMAGE”; // save filename excluding

.png file extension (relative path from scriptURL) var scriptName=”savePNG.php” [/AS]

and my files is in the flash server, I have tried to change the scriptURL to saveIMG/ but it still won't work...any ideas?

Anonymous said...

THANKS a lot!! you made my day, I was looking for something like this WEEKS ago. After a few times, I finally got it reading the comments and your response. Just keep doing this great work!

By the way, if you need a small 3d work, contact me for free, you deserve it!:
http://projeqt.com/mikel#lsi41623ci0q

MikelBG said...

Hi, I´m the same as the previous comment ;) Well, as all above, I have a question. I can make the application work well, but I want to save the image created directly to the desktop.

I see that you say it can´t be done due to security problems, but in other pages says that the " FileReference.save() " can be used. Do you know how to put this function in the button without having to upload the image to the server? if you can solve this I´ll thank you forever!
(well, as you can see, my programmation skills as my english are not very good, sorry for that!)

subashselvaraj said...

Hi Cron Great Job. But I had achieved this in another way, check it out here http://subashselvaraj.wordpress.com/2012/11/22/save-image-from-as2-project-using-as3-and-php/.

Roberto said...

Tnx! doesn't work for me, but helped me to make my job

Meiqing Xu said...

canada goose
coach factory outlet
coach outlet
ray ban sunglasses
fit flops
canada goose jackets
kate spade outlet
cheap oakleys
birkenstock sandals
birkenstocks
20161228caiyan]
\

Post a Comment

Cron Design Studio: Dublin based web design & software development