home
YouTube Player を Flash に埋め込む
August 13, 2010
YouTube のプレイヤー SWF（http://www.youtube.com/apiplayer?version=3）をロードすればできるようです。
ただし、Flash Player 10 以上。
フルスクリーンで埋め込んだデモ
http://www.publicroots.com/test/youtube/
package
{
import flash.display.DisplayObject;
import flash.display.Loader;
import flash.display.LoaderInfo;
import flash.display.MovieClip;
import flash.events.Event;
import flash.net.URLRequest;
import flash.system.Security;
public class YouTubeApi extends MovieClip
{
private var _youtubePlayer:Object;public function YouTubeApi()
{
Security.allowDomain("*");var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.INIT, initHandler);
loader.load(new URLRequest("http://www.youtube.com/apiplayer?version=3"));
}
private function initHandler(event:Event):void
{
_youtubePlayer = Loader(LoaderInfo(event.currentTarget).loader).content as Object;
addChild(_youtubePlayer as DisplayObject);
_youtubePlayer.addEventListener("onReady", onReadyHandler);
_youtubePlayer.addEventListener("onError", onErrorHandler);
_youtubePlayer.addEventListener("onStateChange", onStateChangeHandler);
_youtubePlayer.addEventListener("onPlaybackQualityChange", onPlaybackQualityChangeHandler);}
private function onReadyHandler(event:Event):void
{
trace("ready", Object(event).data);
_youtubePlayer.setSize(500, 375);
//リサイズ設定
addEventListener(Event.ENTER_FRAME, onEnterFrame);// OK GoのPVをロードして自動再生
_youtubePlayer.loadVideoById("V2fpgpanZAw");
}
private function onErrorHandler(event:Event):void
{
// error 150 となる場合は、指定した映像が「埋め込み拒否」されている。（どうしようもない）
trace("error", Object(event).data);
}
private function onStateChangeHandler(event:Event):void
{
// state -1 未スタート(SWFが読み込まれたときは -1 の onStateChange イベントが発行される)
// state 0 終了
// state 1 再生中
// state 2 一時停止
// state 3 バッファリング中
// state 5 停止(SWF が読み込まれ、キューに追加されて、再生可能になったら5の onStateChange イベントが発行される)
trace("state", Object(event).data);
}
private function onPlaybackQualityChangeHandler(event:Event):void
{
// クオリティを変更した場合
trace("quality", Object(event).data);
}
private function onEnterFrame(event:Event):void
{
var ww:Number = Math.floor(stage.stageWidth);
var hh:Number = Math.floor(stage.stageHeight);var scale_w:Number = stage.stageWidth/500;
var scale_h:Number = stage.stageHeight/375;
var scale:Number = Math.max(scale_w,scale_h);//大きい比率を検出
_youtubePlayer.setSize(500*scale, 375*scale);_youtubePlayer.x = -(ww - 500)/2;
_youtubePlayer.y = -(hh - 375)/2;
}
}
}
参考サイトはこちら
http://feb19.jp/blog/archives/000182.php
FlickrとFlashの連動 - Flickr API
August 04, 2010
ドキュメントクラス（MainStage.as）は省略。flaファイルのルートにphotoMCという名前のMCを配置します。必要ならローディングMC（loadingimg）も配置。
アクセス先
XML :
http://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=" + api_key + "&user_id=" + user_id +"&privacy_filter=1"
画像URL :
http://farm" + farm_id[i] + ".static.flickr.com/" + server_id[i] + "/" + photo_id[i] + "_" + secret[i] + ".jpg"
サイズ指定がある時
http://farm" + farm_id[i] + ".static.flickr.com/" + server_id[i] + "/" + photo_id[i] + "_" + secret[i] + "_" + size + ".jpg"
今回は使ってませんが、サイズの種類は下記です。
s small square 75x75
t thumbnail, 100 on longest side
m small, 240 on longest side
- medium, 500 on longest side
b large, 1024 on longest side (only exists for very large original images)
o original image, either a jpg, gif or png, depending on source format
詳しくは、Flickr APIのドキュメントを確認ください。
http://www.flickr.com/services/api/
Flickr APIを使ってデモを作ってみました。
2010.08.09
今流行の3D風にしてみました。3D眼鏡でみると何となくそう見えます。
3D Flickr Viewer
http://www.publicroots.com/test/flickr/
2010.08.12
ドットで表現してみました。
Dot Flickr Viewer
http://www.publicroots.com/test/flickr/index2.html
package{
import flash.media.*;
import flash.net.*;
import flash.display.*;
import flash.events.*;
import flash.xml.*;
import flash.net.URLRequest;
import flash.net.URLLoader;
import flash.net.URLLoaderDataFormat;
import flash.events.Event;
import flash.events.IOErrorEvent;
import flash.display.Loader;
import flash.display.LoaderInfo;
import flash.utils.Timer;
import flash.events.TimerEvent;
import flash.system.Security;public class Flickrapi
{
private var _mainstage:MainStage;
//NSID、api_keyを格納
private var user_id:String = "〜NSID〜";
private var api_key:String = "〜api_key〜"private var myXML:XML;
private var myLoader:Loader;
//リクエスト用のURLを生成します
private var url:String = "http://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=" + api_key + "&user_id=" + user_id +"&privacy_filter=1";
private var myURLReq:URLRequest;
private var myXMLLoader:URLLoader;
private var taotalimg:Number;
private var taotalmaxxx:Number = 100;
private var photoURL:Array = new Array();
private var photo_id:Array = new Array();
private var farm_id:Array = new Array();
private var server_id:Array = new Array();
private var secret:Array = new Array();private var loadcount:Number = 1;
private var myCont:MovieClip;
//ループ時間
private var timer:Timer;
private var myImage:Bitmap;
//サイズ
private var size:String = "b";public function Flickrapi(_ms:MainStage):void
{
trace("[ FlickrAPICls ]");
_mainstage = _ms;
myCont = _mainstage.photoMC;//クロスドメインポリシーファイルのロード
Security.loadPolicyFile("http://farm1.static.flickr.com/crossdomain.xml");
Security.loadPolicyFile("http://farm2.static.flickr.com/crossdomain.xml");
Security.loadPolicyFile("http://farm3.static.flickr.com/crossdomain.xml");
Security.loadPolicyFile("http://farm4.static.flickr.com/crossdomain.xml");
Security.loadPolicyFile("http://farm5.static.flickr.com/crossdomain.xml");_mainstage.loadingimg.visible = true;
TopLoading();
_mainstage.stage.addEventListener(Event.RESIZE, TopLoadingResize);//読込みスタート
FlickrAPIStart();
}//リサイズで中央表示
//TopLoadingResize
private function TopLoadingResize( event:Event ):void {
TopLoading();
}
public function TopLoading():void {
//loadingimg
_mainstage.loadingimg.x = _mainstage.stage.stageWidth/2;
_mainstage.loadingimg.y = _mainstage.stage.stageHeight/2;
//myCont
myCont.x = _mainstage.stage.stageWidth/2 - myCont.width/2;
myCont.y = _mainstage.stage.stageHeight/2 - myCont.height/2;
}
private function FlickrAPIStart():void
{
myURLReq = new URLRequest(url);
//リクエスト発行します
myXMLLoader = new URLLoader();
myXMLLoader.dataFormat = URLLoaderDataFormat.TEXT;
myXMLLoader.addEventListener(Event.COMPLETE,setPhotoXML);
myXMLLoader.addEventListener(IOErrorEvent.IO_ERROR,isError);
myXMLLoader.load(myURLReq);
}
private function setPhotoXML(e:Event):void{
//読み込んだ後の処理を記述
myXML = new XML(myXMLLoader.data);
taotalimg = myXML.photos.@total;
trace("投稿写真の枚数 = "+taotalimg);
//配列にURL格納
for(var i:int = 1 ; i <= taotalmaxxx; i++){
photo_id[i] = myXML.photos.photo[(i-1)].@id;
farm_id[i] = myXML.photos.photo[(i-1)].@farm;
server_id[i] = myXML.photos.photo[(i-1)].@server;
secret[i] = myXML.photos.photo[(i-1)].@secret;photoURL[i] = "http://farm" + farm_id[i] + ".static.flickr.com/" + server_id[i] + "/" + photo_id[i] + "_" + secret[i] + ".jpg";
//trace("photoURL[ "+i+" ] = "+photoURL[i]);
}
//写真のロード
PhotoLoad(loadcount);
}private function PhotoLoad(_lun:Number):void
{
_mainstage.loadingimg.visible = true;var photoURLreq:URLRequest = new URLRequest(photoURL[_lun]);
myLoader = new Loader();
myLoader.contentLoaderInfo.addEventListener(Event.COMPLETE,setImage);
myLoader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR,isError);
myLoader.load(photoURLreq);
}
private function setImage(e:Event){
myCont.alpha = 0;
myImage = e.target.content;
var loadedImage:Bitmap = Bitmap(myImage);
myCont.addChild(myImage);
//タイマー
timer = new Timer(4000,1);
timer.addEventListener(TimerEvent.TIMER, PhotoChangeFunc);
timer.start();
_mainstage.loadingimg.visible = false;
Tweener.addTween( myCont, { salpha:1, time:1, transition:"easeInQuart", onComplete:PhotoAlphaEnd} );
}
private function PhotoAlphaEnd():void
{
Tweener.removeTweens( myCont );
}private function PhotoChangeFunc( event:TimerEvent ):void
{
timer.removeEventListener(TimerEvent.TIMER, PhotoChangeFunc);
Tweener.addTween( myCont, { alpha:0, time:1, transition:"easeInQuart", onComplete:PhotoEnd} );
}
private function PhotoEnd():void
{
Tweener.removeTweens( myCont );
myCont.removeChild(myImage);
//ループ実行
if(loadcount < taotalmaxxx){
loadcount++;
}else{
loadcount = 1;
}
PhotoLoad(loadcount);
}
private function isError(e:IOErrorEvent):void{
trace("failed to Load photos info");
}
}
}
RA DIOHEA_D / HOU SE OF_C ARDS
July 23, 2010
http://www.youtube.com/watch?v=8nTFjVm9sTQ
The Making-of "House of Cards"
http://www.youtube.com/watch?v=cyQoTGdQywY
RA DIOHEA_D / HOU SE OF_C ARDS - Google Code
http://code.google.com/intl/ja-JP/creative/radiohead/
かなり前ですが、RA DIOHEA_D / HOU SE OF_C ARDSのPVでかっこいいのがありました。
レーザースキャニング技術を使った3Dデータ(CSV)を元に作られてます。
CSVも下記よりダウンロードできます。
http://code.google.com/p/radiohead/downloads/list
FLash版のサンプルも作っている人がいました。
http://as3s.org/2008/07/radiohead-google-code/
こんなん作りたいなと思って。。。
レーザースキャニング技術ってここ↓とかでレンタルすればいけるのかな？
http://www.geokosmos.jp/
いくらするんだろうね？
続きを読む "RA DIOHEA_D / HOU SE OF_C ARDS "
AS3：サーバー時間表示
July 20, 2010
phpを使ってサーバー時間を取得する方法。良く忘れるのでメモ。
ローカル時間だとユーザに変更される可能性があるので、サーバー時間を取得する機会がたまにあります。
Clock.as
package
{
import flash.display.*;
import flash.events.Event;
import flash.events.EventDispatcher;
import flash.net.URLLoader;
import flash.net.URLLoaderDataFormat;
import flash.net.URLRequest;
import flash.net.URLRequestMethod;
import flash.net.URLVariables;public class Clock extends Sprite
{
private var url:String = "clock.php";//-------------------------
// コンストラクタ
//-------------------------
public function Clock()
{
addEventListener( Event.ENTER_FRAME, onEnterFrameHandler );
}
private function onEnterFrameHandler(event:Event):void
{
if (url) getClock(url);
}
//-------------------------
// ロード
//-------------------------
public function getClock(url:String):void
{
var urlRequest:URLRequest = new URLRequest(url);
urlRequest.method = URLRequestMethod.GET;
var urlLoader:URLLoader = new URLLoader();
urlLoader.dataFormat = URLLoaderDataFormat.VARIABLES;
urlLoader.addEventListener(Event.COMPLETE, completeHandler);
urlLoader.load(urlRequest);
}//-------------------------
// ロード完了
//-------------------------
private function completeHandler(e:Event):void
{
var urlVariables:URLVariables = new URLVariables(e.target.data);
_clocktxt.text = urlVariables.year +"/"+ urlVariables.month +"/"+ urlVariables.day +"/"+
urlVariables.week +"/"+ urlVariables.hour +":"+ urlVariables.minutes +":"+ urlVariables.seconds;
}
}
}
clock.php
＜?php
$year = date("Y"); //年（4ケタ）
$month = date("n"); //月（1ケタ）
$day = date("j"); //日（1ケタ）
$week = date("w"); //曜日（0～6）
$hour = date("G"); //24時間表記
$minutes = date("i"); //分（2ケタ）
$seconds = date("s"); //秒（2ケタ）
switch ($week) {
case 0:
$week = "日曜";
break;
case 1:
$week = "月曜";
break;
case 2:
$week = "火曜";
break;
case 3:
$week = "水曜";
break;
case 4:
$week = "木曜";
break;
case 5:
$week = "金曜";
break;
case 6:
$week = "土曜";
break;
default:
break;
}
//出力
echo "year=".$year."&month=".$month."&day=".$day."&week=".$week."
&hour=".$hour."&minutes=".$minutes."&seconds=".$seconds;
?＞
AS3 : MCに枠線つけるスクリプト
July 16, 2010
import flash.filters.GlowFilter;
〜
onSetFilterglow();
function onSetFilterglow():void {
//---枠線設定（グロー）
var c:uint=0xFFFFFF;
var a:Number=1;
var bX:Number=6;
var bY:Number=6;
var st:Number=10;
var filterglow:GlowFilter=new GlowFilter(c,a,bX,bY,st);
//枠線適用
mymc.filters = [filterglow];
}
何気にできると思ってたのに、意外に知らなかったのでメモ。
参考サイト
http://www.c-geru.com/as_blind_side/2010/03/post-2.html
Toyota iQ Font - The Making
July 14, 2010
http://www.youtube.com/watch?v=Vwp4iOCECS8
Cannes Lions International Advertising Festival
http://www.canneslions.com/work/cyber/
カンヌで受賞した作品をいろいろ見てるけど、
やっぱり僕的には一番これが好きかな。
広告のあり方もかなり変わって来てる気がするね。
WEB単体ではもう物足りない気がします。
あと日本と海外の文化的な違いもあるので難しいなあ。。。
Frocessingでランダムな円を描く
Frocessingで簡単な円をランダムに描いてみる。
Frocessingはちょっとした演出とかで使えると便利かも。
メインで使用するのはまだちょっと無理かな。
package
{
import flash.events.*;
import flash.display.*;
import flash.net.*;
import frocessing.display.F5MovieClip2D;
public class frocessing2 extends F5MovieClip2D
{
private var count:int = 1000;
private var addNum:int = 1;
//画面サイズ
private var _mainWidth:Number = 664;
private var _mainHeight:Number = 664;
private var randWidth:Array;
private var randHeight :Array;public function frocessing2()
{
stage.frameRate = 30;
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;randWidth = new Array();
randHeight = new Array();PictureFunc();
}//draw()にすればループ演出
public function PictureFunc():void
{
clear();
size(_mainWidth, _mainHeight);
colorMode("RGB", 255, 255, 255, 100);
background(255);//0
noStroke();//枠なしfor(var i:int = 0; i < count; i++){
var ellipse_size:int;randWidth[i] = random(_mainWidth);
randHeight[i] = random(_mainWidth);
fill(random(100,255), random(100,255), random(100,255), random(0,50));//10
ellipse_size = random(0,100);
ellipse(Number(randWidth[i]), Number(randHeight[i]), ellipse_size, ellipse_size);
}
}
}
}
Processingのライブラリー
http://processing.org/reference/libraries/
ここを見ればいろいろできる。
