info

category : Flash DEMO
[twitter]friends visualizer on GoogleMap  @ Twitter , FlashAS3 , Flash DEMO 2010年3月31日

追記
※このコンテンツは2010年6月30日のTwitterのBASIC認証廃止と同時に使用不可になります。
TwitterのBASIC認証廃止、企業ユーザーが知っておくべきこと

前回エントリーしたflashをグレードアップしました。
といってもGoogleMap上にアイコン置いてるだけなんですが。
twitterのプロフィールの現在地の設定から緯度経度を取得し、
GoogleMap上にアイコンを表示します。
緯度経度が取得出来なかった時は、太平洋上に表示されます。
前回と同様にtwitterでフォローしあってる人を次々に表示していきます。
1人から出てくる人物は5名までに制限しています。
twitterAPIを使用しない方法に変更しました。
レスポンスは悪くなりましたが、pc負荷に耐えられる限り
twitterの輪を広げていけます。

ちなみに、現在地の設定によっては
予想外の場所に配置されるのでおもしろいです。
「地球」→オーストラリアのウルル-カタジュタ国立公園
「雲の上」→上海
「Koube」→アフリカのど真ん中
「南の島」→アメリカのノースマニトゥー島

ステージドラッグ:全体移動
サムネクリック:対象のtwitterページを開く
マウスホイール:ズームインアウト

friends visualizer on GoogleMap


さて、次は何を作ろうか。

[twitter]friends visualizer  @ Twitter , FlashAS3 , Flash DEMO 2010年3月29日

追記
※このコンテンツは2010年6月30日のTwitterのBASIC認証廃止と同時に使用不可になります。
TwitterのBASIC認証廃止、企業ユーザーが知っておくべきこと

久々にflashです。
twitterでフォローしあってる人をクモの巣状に表示していきます。
百聞は一見に如かず。とりあえずtwitterのIDを入力してスタートを押してください。
1人から出てくる人物は5名までに制限しています。

ステージドラッグ:全体移動
サムネドラッグ:サムネ移動
サムネダブルクリック:対象のtwitterページを開く
マウスホイール:ズームインアウト

friends visualizer

さて、次の更新は水曜日です。

[Box2D]LocoRoco風 public alpha  @ FlashAS3 , Box2D , Flash DEMO 2009年12月21日

Box2DでLocoRoco風public alphaです。

PSPで出ているLocoRocoというゲームのパクり オマージュです。
Box2Dの魔改造を繰り返し、やっとここまで出来ましたが
まだ色々と調整しきれていないところや構想まで至っていないところがあるので
とりあえずpublic alpha版ということにしておきます。
BGMは「音の葉っぱ」様からお借りしました。

マウスホイール:ズームイン・アウト
ステージドラッグ:世界を傾ける
ステージダブルクリック:つぶれたキャラを元に戻す


スクリーンショット1



スクリーンショット1

LocoRoco風 public alpha

[flash]twitter on flash #1  @ Twitter , PHP , FlashAS3 , Flash DEMO 2009年11月9日

おつかれさまです。

追記
※このコンテンツは2010年6月30日のTwitterのBASIC認証廃止と同時に使用不可になります。
TwitterのBASIC認証廃止、企業ユーザーが知っておくべきこと

twitterAPIを使ったtwitter on flashをつくりました。
flashからtwitterを見たり投稿したりできるというものです。
今はつぶやきを見る、投稿するの2つの機能しかありません。これから改良を続けるかどうかは未定です。
twitterみたいな文字主体のものをわざわざflashにする意味はあるのかと言われれば、
そんなものは無いのですが、おもしろければついやっちゃうよね。

スクリーンショット1

twitter on flash

ソースの話
flashは違うドメインにアクセスしようとするとセキュリティエラーが出てアクセスできません。
そこで実際のtwitterの処理はPHPで行っています。今回のflashでは下記のような処理をしています。
それぞれflashからPOSTでtwitterのid, pass及びtwitterAPIのurlを送信しています。

ログイン処理
urlはhttp://twitter.com/account/verify_credentials.xml

$url = $_POST['url'];
$id = $_POST['id'];
$pass = $_POST['pass'];
$ch=curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, 3);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_USERPWD, $id.":".$pass);
$result=curl_exec($ch);
curl_close($ch);
echo $result;

つぶやき取得
urlはhttp://twitter.com/statuses/friends_timeline.rss

$url = $_POST['url'];
$id = $_POST['id'];
$pass = $_POST['pass'];
if($id=="" || $pass==""){
	echo file_get_contents($url);
}else{
	$url=get_url_with_idpass($url, $id, $pass);
	echo file_get_contents($url);
}
function get_url_with_idpass($a, $b, $c){
	$a=str_replace("http://", "", $a);
	$a="http://".$b.":".$c."@".$a;
	return $a;
}

投稿
urlはhttp://twitter.com/statuses/update.xml

$url = $_POST['url'];
$id = $_POST['id'];
$pass = $_POST['pass'];
$message = $_POST['status'];
$url = $url."?status=". rawurlencode($message);

$opts = array("http" => array(
"method" => "POST",
"header" => "Authorization: Basic ". base64_encode($id. ":". $pass)
)
);
$context = stream_context_create($opts);
$result = file_get_contents($url , false, $context);
echo $result;
[FLAR]試作  @ FlashAS3 , FLAR , Flash DEMO , Papervision3D 2009年5月22日

今巷でウワサのFLARです。
このpdfを印刷してウェブカムで写せば赤緑青の立方体が現れます。それだけです。
ARはGPLというライセンスでソースコードを公開しなくてはならないらしいので
クソ汚いソースファイルを載せておきます。基本的に動けばいいぐらいで作っているので
中は大変なことになっています。
これを作るにあたってSaqooshaさんのサイトを参考にしました。この方すごいです。
http://saqoosha.net/flartoolkit/start-up-guide/
また、マーカーデータをつくるときはタロタローグさんのサイトを使用しました。
http://flash.tarotaro.org/ar/MarkerGeneratorOnline.html

スクリーンショット1

AR試作

[Papervision3D]triangle3D  @ FlashAS3 , Flash DEMO , Papervision3D 2009年5月20日

久々にPapervision3Dでtriangle3Dです。
三角形ポリゴンにバラバラになって別の形にトランスフォーム!

スクリーンショット1

triangle3D

追記:すこし自分のためにコードのおさらい

Papervision3Dの三角形ポリゴンひとつだけつかうにはTriangleMesh3Dを使う。
毎回使い方わすれるのでメモ。

import org.papervision3d.core.geom.TriangleMesh3D;
import org.papervision3d.core.geom.renderables.Triangle3D;
import org.papervision3d.core.geom.renderables.Vertex3D;
import org.papervision3d.core.math.NumberUV;
var mesh:TriangleMesh3D = new TriangleMesh3D(mat, new Array(), new Array(), null );
var v0:Vertex3D= new Vertex3D( -10, -10, 0 );
var v1:Vertex3D= new Vertex3D( 10, -10, 0 );
var v2:Vertex3D= new Vertex3D( 0, 10, 0 );
mesh.geometry.vertices.push( v0 );
mesh.geometry.vertices.push( v1 );
mesh.geometry.vertices.push( v2 );
var uvA:NumberUV= new NumberUV( 0, 0 );
var uvC:NumberUV= new NumberUV( 1, 0 );
var uvB:NumberUV= new NumberUV( 0, 1 );
mesh.geometry.faces.push( new Triangle3D( mesh, new Array(v0,v1,v2), null, new Array(uvA,uvC,uvB) ));
mesh.geometry.ready = true;
scene.addChild(mesh);

DisplayObject3Dの面はgeometry.facesに格納されている。
アクセスするときはこんな感じ。

var meshface:Triangle3D=item.geometry.faces[0];

そしてこのDisplayObject3Dの面であるTriangle3Dには頂点が定義されている。
その頂点の情報はverticesに格納されておりx,y,zプロパティがある。
アクセスするときはこんな感じ。

var meshface:Triangle3D=item.geometry.faces[0];
var vx:Number=meshface.vertices[0].x;
var vy:Number=meshface.vertices[0].y;
var vz:Number=meshface.vertices[0].z;
//三角形ポリゴンなのでお察しの通りverticesはvertices[2]まである。

DisplayObject3Dの面Triangle3D(以下モデルMesh)に
外部のTriangleMesh3D(以下外部Mesh)及び外部Meshの面Triangle3Dをぴったし合わせるには
・モデルMeshの頂点定義から三角形の中心点の座標を計算して出す。
・その座標に外部Meshを移動させる。
・モデルMeshの頂点座標から外部Meshの座標を引く。
・出てきた値を外部Meshの面の各頂点座標に適応する。
という処理が必要です。
別にむずかしいことではないですね。
足し算して割り算して代入して引き算して代入って感じです。
ただこれだとモデルMeshが座標(0,0,0)にありrotationXYZが0の状態しか
形作ることができないので今後の課題にしておこう。