Flickrのティッカーを作りました。

前から作りたかったFlickrのティッカーを作りました。AS3ですね。ばり楽しい。サイドバーで順番にフェードイン&アウトして表示するようにしています。

Flash Playerは10でもいいかな、と思ったんだけど、ユーザに影響が少ないように9で書き出しています。

jsで作っているNew Entryのティッカーと動きがかぶるのと、重くなってると思うので前のjsバージョンに戻すかもですが、ひとまずこのままいこうかな。今後むだにPapervisionとか使ってみるかも。

FlickrはAPIがあってコールできるんですが、検索APIしかなくて、自分の写真だけ持ってきたい、というのができないようなので、RSSをPHPで独自にparseしています。

PHPをcronで回して、parseしたものをtxtに書き出して、ASでloadしています。今までFlashのエディタでASを書こうとしてたけど、FlashDevelopでやるとさくさくですね。

リンクもつけたいんだけど、parseのところ調整しないといけないからまたにしようかな。

HTMLへの埋め込みにはswfobject.jsを使ってソースを綺麗にしています。
気が向いたのでソースを載せてみますね。

HTML(head)

<script type="text/javascript" src="/mt/js/swfobject.js"></script>

HTML(body)

<script type="text/javascript">
swfobject.embedSWF("/mt/swf/Imgloader.swf", "imgloader", "110", "77", "9,0,0", "/mt/swf/expressInstall.swf");
</script>
<div id="imgloader"></div>

txt sample

http://farm4.static.flickr.com/3485/4007169559_322d580607_m.jpg
http://farm3.static.flickr.com/2572/3976260940_02edb43524_m.jpg
http://farm4.static.flickr.com/3498/3975499153_8a0aa6692d_m.jpg
http://farm4.static.flickr.com/3458/3976260064_942cc5f99b_m.jpg
http://farm3.static.flickr.com/2637/3975498195_b2a36571c7_m.jpg

PHP

<?php
	$xml = simplexml_load_file("http://api.flickr.com/services/feeds/photos_public.gne?id=94621077@N00&lang=en-us&format=rss_200");
	foreach($xml->channel->item as $item){
		$data[] = $item->description."\n";
	}
	for($i=0; $i<count($data); $i++){
		$str[$i] = strrchr($data[$i], ":");
		$str[$i] = substr($str[$i], 0);
		$str[$i] = split("[\" ]", $str[$i]);
	}
	$fp = fopen("flickrimg.txt", "w");
	for($i=0; $i<count($data); $i++){
		fwrite($fp, "http".$str[$i][0]."\n");
	}
?>

package 
{
	import flash.display.Loader;
	import flash.display.MovieClip;
	import flash.events.TimerEvent;
	import flash.net.URLLoader;
	import flash.net.URLRequest;
	import flash.events.MouseEvent;
	import flash.events.Event;
	import caurina.transitions.Tweener;
	import flash.utils.Timer;
	
	public class Imgloader extends MovieClip {
		public function Imgloader() {
			var image_array:Array = [];
			var image_index:int = 0;
			
			var image_ldr:Loader = new Loader();
			this.addChild(image_ldr);
			
			image_ldr.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);
			
			function loadComplete(eventObject:Event) {
				image_ldr.width = 110;
				image_ldr.height = 77;
				image_ldr.alpha = 0;
				Tweener.addTween(image_ldr, {alpha:1, time:2, onComplete:fadeOut});
			}
			
			function fadeOut() {
				Tweener.addTween(image_ldr, {alpha:0, time:2, delay:3});
			}
			
			var index_req:URLRequest = new URLRequest("flickrimg.txt");
			var index_ldr:URLLoader = new URLLoader();
			index_ldr.addEventListener(Event.COMPLETE, indexOnComplete);
			index_ldr.load(index_req);
			
			function indexOnComplete(e) {
				var txt = index_ldr.data;
				image_array = txt.split("\n");
				loadImage();
			}
			function loadImage() {
				var url = image_array[image_index];
				var req = new URLRequest(url);
				image_ldr.load(req);
			}
			var myTimer:Timer = new Timer(7000);
			myTimer.addEventListener("timer", timerHandler);
			myTimer.start();
			 
			function timerHandler(even:TimerEvent):void {
				image_index++;
				if (image_index >= image_array.length || image_array[image_index] == "") {
					image_index = 0;
				}
				loadImage();
			}
		}
	}
}

アニメーションにはTweenerを使用。アップデートが終了してしまったので、BetweenAS3も使ってみたいな、というところですね。

ほかにもいろいろ作っていこうと思います！