blog
copyright ©
creamu Inc. All Rights Reserved.
art direction & design: Kunitaka Kawashimo
code, interaction & photography: creamu Inc.
category: Technology

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

Pocket

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");
}
?>
AS
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も使ってみたいな、というところですね。 ほかにもいろいろ作っていこうと思います! FlashDevelopまじで便利だ。結構慣れてきた。