topical media & game development
actionscript-extra-flickr-cube.mx
actionscript-extra-flickr-cube.mx
[swf]
flex
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:distortion="view.distortion.*"
applicationComplete="init()" xmlns:mxeffects="com.adobe.ac.mxeffects.*"
backgroundColor="#000000"
frameRate="30"
>
<mx:Script>
<![CDATA[
import mx.containers.VBox;
import mx.controls.*;
import mx.effects.*;
import mx.events.EffectEvent;
import com.adobe.webapis.flickr.*;
import com.adobe.webapis.flickr.events.FlickrResultEvent;
import com.adobe.ac.mxeffects.*;
private const API:String = "[your flickr api key]"; // your flickr api key
private const NSID:String = "51213739@N00"; // user to fetch images from
private const PAUSE:uint = 2000; // pause between images
private const EFFECT_DURATION:uint = 1000; // Cube Effect duration
private const BLUR_FILTER:BlurFilter = new BlurFilter(3, 3, 1) // Cube effect blur
private const TOTAL_IMAGES:uint = 100; //10; // how many images to display
private const directions:Array = [DistortionConstants.LEFT, DistortionConstants.RIGHT, DistortionConstants.TOP, DistortionConstants.BOTTOM];
private var _flickr:FlickrService;
private var _current:Photo;
private var _next_photo:Photo;
private var _timer:Timer;
private var order:Number = 1;
private var direction:uint = 0;
private var currentIndex:int = 1;
Create the container for the next image to load
private function loadNext():void
{
var canv:VBox = new VBox();
var loader:SWFLoader = new SWFLoader();
loader.load(getPhotoURI(current));
loader.name = "loader";
loader.scaleContent = false;
loader.maintainAspectRatio = true;
loader.width = 150; //150;
loader.height = 150; //150;
loader.addEventListener(Event.COMPLETE, onImageLoaded);
canv.addChild(loader);
canv.clipContent = false;
}
Image has been loaded
Create the appropriate effect to display it
private function onImageLoaded(e:Event):void
{
var f:Effect;
if(container.getChildren().length < 1)
{
// ok, first image loaded, use a Fade effect
f = new Fade(SWFLoader(e.target).parent);
Fade(f).alphaFrom = 0;
Fade(f).alphaTo = 1;
container.addChild(SWFLoader(e.target).parent);
} else {
// from this point we will use always the CubeEffect
f = new CubeRotate(container.getChildAt(container.getChildren().length-1));
CubeRotate(f).siblings = [SWFLoader(e.target).parent]
direction++;
if(direction >= directions.length) direction = 0;
CubeRotate(f).direction = directions[direction]
CubeRotate(f).blur = BLUR_FILTER;
}
f.duration = EFFECT_DURATION;
f.play();
f.addEventListener(EffectEvent.EFFECT_END, onEffectEnd);
}
Image effect display finished
go to the next image
private function onEffectEnd(e:EffectEvent):void
{
if(e.target is CubeRotate)
{
container.removeChild(DisplayObject(CubeRotate(e.target).target))
container.addChild(DisplayObject(CubeRotate(e.target).siblings[0]))
}
next();
}
Initialize application
private function init():void
{
_flickr = new FlickrService(API);
_flickr.addEventListener(FlickrResultEvent.PEOPLE_GET_PUBLIC_PHOTOS, handleEvent);
_flickr.addEventListener(FlickrResultEvent.PHOTOS_GET_CONTEXT, handleEvent);
_flickr.addEventListener(FlickrResultEvent.PHOTOS_GET_INFO, handleEvent);
_timer = new Timer(PAUSE, 1);
_timer.addEventListener(TimerEvent.TIMER, onTimerStep);
_timer.stop();
first();
}
private function onTimerStep(e:TimerEvent):void
{
current = _next_photo;
}
private function handleEvent(e:Event):void
{
var tmp_photo:Photo;
if(e.type == FlickrResultEvent.PEOPLE_GET_PUBLIC_PHOTOS)
{
var plist:PagedPhotoList = PagedPhotoList(FlickrResultEvent(e).data.photos);
if(plist.photos.length > 0)
{
current = plist.photos[0];
}
} else if(e.type == FlickrResultEvent.PHOTOS_GET_CONTEXT)
{
var context:Array = FlickrResultEvent(e).data.context;
if(order == 0)
{
currentIndex++;
if(Photo(context[0]).id == '0' || currentIndex >= TOTAL_IMAGES)
{
order = 1
}
}
if(order == 1)
{
if(Photo(context[1]).id == '0')
{
order = 0
currentIndex = 1;
}
}
tmp_photo = Photo(context[order]);
if(tmp_photo.id != "0")
{
_flickr.photos.getInfo(tmp_photo.id, tmp_photo.secret);
}
} else if(e.type == FlickrResultEvent.PHOTOS_GET_INFO)
{
_next_photo = Photo(FlickrResultEvent(e).data.photo);
if(_timer.running) _timer.stop();
_timer.start();
}
}
Load the First Image
private function first():void
{
_flickr.people.getPublicPhotos(NSID, "", 1, 1);
}
Load the next image
private function next():void
{
_flickr.photos.getContext(current.id);
}
Get the photo source path
private function getPhotoURI(p:Photo):String
{
// Wee need a php wrapper page for reading the image contents, otherwise every bitmapdata
// based effect will fail on images loaded from external domains
//return "http://localhost/media/actionscript-extra-flickr-read.php?file=http://static.flickr.com/" + p.server + "/" + p.id +"_" + p.secret + "_m.jpg";
//return "http://static.flickr.com/" + p.server + "/" + p.id +"_" + p.secret + "_m.jpg";
//return "actionscript-extra-flickr-read.php?file=http://static.flickr.com/" + p.server + "/" + p.id +"_" + p.secret + "_m.jpg";
return "actionscript-extra-flickr-read.php?file=http://static.flickr.com/" + p.server + "/" + p.id +"_" + p.secret + "_m.jpg";
}
private function set current(p:Photo):void
{
_current = p;
loadNext();
}
private function get current():Photo
{
return _current;
}
]]>
</mx:Script>
<mx:Box horizontalAlign="center" verticalAlign="middle" id="container">
</mx:Box>
</mx:Application>
(C) Æliens
27/08/2009
You may not copy or print any of this material without explicit permission of the author or the publisher.
In case of other copyright issues, contact the author.
