Flash Snapshot Application – an AIR/Flickr/Moo mashup

May 27th, 2008

There’s lots of fun to be had with Moo mini-cards, and I’ve been getting good feedback on the batch of fractal cards I made recently, which were created by taking snapshots of one of my flash experiments. The magic behind this was so simple I may as well share it with you. All you need to create your own set is the Flex/AIR app I created, which you can download here, and a Flickr account. This is how it works:

You give the app the path to your swf, and hit enter. It then runs a function to start a timed loop, as follows:

private var _saveDir:File;
private var _timer:Timer; 
private var _counter:int;
private function startSnapshot(url:String, time:Number = 5):void {
    // loadedSwf is  the name of the mx:Image that 
    // will contain the swf
    loadedSwf.source = url;
    // create a directory to store our snapshots
    var dirName:String = "snapshots";
    _saveDir = File.desktopDirectory.resolvePath(dirName);
    var x:Number = 1;
    while (_saveDir.exists) {
        _saveDir = 
          File.desktopDirectory.resolvePath(dirName + String(x++));
    }
    _saveDir.createDirectory();
    // start loop
    _counter = 1;
    _timer = new Timer(time * 1000);
    _timer.addEventListener(TimerEvent.TIMER, snapLoop);
    _timer.start();
}

Then, while the swf plays, the timer loop fires this function every few seconds to take a snapshot:

private function snapLoop(e:TimerEvent):void {
    // create a new BitmapData object based on the 
    // size of the loaded swf 
    var BMPData:BitmapData = new BitmapData(loadedSwf.width, 
                loadedSwf.height, true, 0xFFFFFF);		
    // take a snapshot of the swf, and store it in 
    // the BitmapData object
    BMPData.draw(loadedSwf);
    // encode it as a jpg
    var jpgEncoder:JPEGEncoder = new JPEGEncoder(80);
    var jpgBytes:ByteArray = jpgEncoder.encode(BMPData);
    // save it
    var ourFile:File = _saveDir.resolvePath("snap" + 
               _counter++ + ".jpg");
    var fileStream:FileStream = new FileStream();
    fileStream.open(ourFile, FileMode.WRITE);
    fileStream.writeBytes(jpgBytes, 0, jpgBytes.length);
    fileStream.close();
}

Note that the BitmapData snap may give unexpected results with transparent swfs, so it is best used with swfs that have a solid background.

Once you have a folder full of snapshots, upload these to Flickr. For this example I pointed the app at a local version of my favourite fractal experiment swf, to produce this set of images.

To turn these into mini-cards, the final step is to use Moo’s Flickr import option. Point it at the Flickr set you have created, pay your money, and in 10 days or so a pack of groovy cards pop through the postbox. Simple.

Tweet

Posted in AIR, as3, flash, flex, flickr, generative, mashups, print | 4 Comments »