Skip to content
January 11, 2009 / Shrikant Patil

File download without any server (ASP,PHP,etc) script in flash player 10

While reading through flash player 10 API, i come to know that FileReference Class has updated with few new features. FileReference Objetc now can take file into flash player (upload) and give file back to file system (download) without any server side script like ASP, PHP etc. flash player 10 can perform these tasks without any middle man 🙂

Below example allows user to sketch something on screen using mouse, after user done with sketching once he clicks on “download your sketch” button, download dialog is get displayed, select a location where you want to save and click on ok. you will get you sketched image as JPEG file. Looks NICE 🙂 . Example uses Bitmap.draw() method to draw the sketch as bitmap and example uses JPEG Encoder to convert bitmap data to JPEG encoded (you can download JPEG encoder at corelib project) after that FileReference.save() method to save the sketch image.

Note : Example targets the flash cs4 (you make some modification to the code if you want to run this on flex builder with flex 4 sdk). I am going to post this updated code for flex 4 sdk soon.

settings:

1. make sure that you have button component instance at below of the stage with name “saveDrawing” and set its label to “download your sketch”.

2. created a folder named as “flexScript” and put the below class into it.

3. download corelib from google code and put it JPEGEncoder class at the path of : com.adobe.images.

4. set the document class as “flexScript.flexScript.savejpgTest”

5. hit ctrl+enter……… look at the magic


package flexScript {
    import flash.display.Sprite;
    import flash.events.MouseEvent;
    import com.adobe.images.JPGEncoder;
    import flash.net.FileReference;
    import flash.display.*;
    import flash.events.*;
    import flash.utils.ByteArray;

    public class savejpgTest extends Sprite {
        private var jagFileRefSave:FileReference = new FileReference();
        private var increment:Number=1;
        private var drawCanvas:MovieClip = new MovieClip()
    public function savejpgTest(){
        addChildAt(drawCanvas, 0);
        sketch();
        saveDrawing.addEventListener(MouseEvent.CLICK, saveBtnPress);
    }
    private function sketch(){   
        drawCanvas.graphics.beginFill(0xFFFFFF);
        drawCanvas.graphics.drawRect(0, 0, 250, 210);
        drawCanvas.graphics.endFill();

        drawCanvas.addEventListener(MouseEvent.MOUSE_DOWN, startDrawing);
        drawCanvas.addEventListener(MouseEvent.MOUSE_UP, stopDrawing);
        drawCanvas.addEventListener(MouseEvent.MOUSE_MOVE, makeLine);   
    }       
    private function startDrawing(event:MouseEvent):void{   
        drawCanvas.graphics.lineStyle(1, 0, 1);
        drawCanvas.graphics.moveTo(mouseX, mouseY);
        drawCanvas.addEventListener(MouseEvent.MOUSE_MOVE, makeLine);
    }
    private function stopDrawing(event:MouseEvent):void{
        drawCanvas.removeEventListener(MouseEvent.MOUSE_MOVE, makeLine);
    }
    private function makeLine(event:MouseEvent):void{
        drawCanvas.graphics.lineTo(mouseX, mouseY);
    }

    private function saveJPG(sourceClip:MovieClip, jpgQuality:Number):void{
        var jpgClip:BitmapData = new BitmapData (sourceClip.width, sourceClip.height);
        jpgClip.draw(sourceClip);
        var jpgEncoder:JPGEncoder = new JPGEncoder(jpgQuality);
        var jpgBytes:ByteArray = jpgEncoder.encode(jpgClip);
        jagFileRefSave.save(jpgBytes,"image"+increment+".jpg");
        increment++;
    }
    private function saveBtnPress(e:Event):void{   
        saveJPG(drawCanvas, 90);
    }
    }
}

Advertisements

11 Comments

Leave a Comment
  1. Jeffery Mak / Jan 19 2009 10:19 am

    Hi, thanks for the source code. But I got an error 1046:Type was not found or was not a compile-time constant:BitString. Any idea what’s wrong with it?

    Cheers

    • Shrikant Patil / Jan 20 2009 5:37 pm

      Hi,
      thanks for you comment.. actually you need to import ;
      import flash.utils.ByteArray;
      in the beginning of the class;
      And make sure that you need to compiler and run the application in flash cs4, bcoz it targets to flash player 10. It will work

  2. Nate / Jul 28 2009 5:26 pm

    I would love to see a working example? Any way you can deliver on that?

    • Shrikant Patil / Jul 29 2009 4:03 am

      Sorry Nate, wordpress not allows to put the files for download, so i am not able to do that.

  3. E / Aug 16 2009 4:38 am

    How about uploading it to a hosing site such as MegaSWF and linking to it?

    • Shrikant Patil / Aug 17 2009 4:02 am

      For such kind of operations you need to use any backend technology like ASP.NET, PHP, Java etc.

  4. Amutha / Oct 15 2009 11:32 am

    hi… i need it in flex..can i save and load the files in flex into server without server side scripting ?

    • Shrikant Patil / Oct 26 2009 7:08 am

      Yes you can do it in flex, put the same code it will work in flex too. Flex framework is written using actionscript , so it will work. 🙂

  5. Craig McLachlan / Nov 18 2009 3:00 pm

    Is there anyway of merging this tutorial and the next one so that you have an image upload and then scribble on then download the edited image? I’ve been trying through trial and error for days now but as I am very new to actionscript I’m not getting far. 😦

    • Shrikant Patil / Nov 19 2009 5:51 am

      Yes it is possible to upload an image and work on it and then download it (save it back to local machine).
      The main thing is once modify image in your application you need to get the blob data of the image and then you can store it back on your local machine as per my tutorial.

  6. P48l0 / Feb 23 2010 12:54 pm

    Thanks! this was usefull!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: