頭の中を整理と言いながら、また新しいものに手を出していたり(^_^;)
会社も自宅も「Subversion」を使ってるけど、最近良く目にする「Git」を試してみようかと。 分散バージョン管理Git/Mercurial/Bazaar徹底比較
・サーバリポジトリ(中央)からは、完全履歴を含んだリポジトリの複製を取得 ・ローカル環境ごとにリポジトリがあり管理する
うーん。何かメリットあるのかなぁ?と考えてた結果、
■メリット・デメリット 自分のローカルでバージョン戻したりできる!
細かい修正でいちいち、サーバにコミットするのも煩わしいからねえ。
ただ、これにどっぷり漬かると、サーバにアップするタイミングがかなり遅れないか? つまり自分のマシンがあぼーんしたら、状況によっては目もあてれあれないw
ローカル同士でコミットし合えるのも魅力だけど、 ちゃんとパートナーと話し合って開発しないと、訳わからなくなりそう。
とは言え、評価はしてみないと。
■セットアップ情報 Githubを試してみる。
その前に、SubversionのTracを構築しないと(汗)
あぁ、SyntaxHighlighterの弊害。 preタグを使うから、ブラウザによってズレまくりますorz これだから、HTML嫌い。。。CSS3はノータッチだけど、改善されるのかなぁ?
さて、勉強がたらAirでTwitterツール作ってるんだけど、リファクタリングついでに Twitterライブラリ「YTwitterLib.swc」も自作してみる。
残念ながら、セキュリティサンドボックス(crossdomain.xml制限)でFlashでは使えません。 (サーバサイドでPHPプロキシかませばできますが・・・) その他の手法としては、JavaScriptのJSONPと連動でいけるかなぁ?
ライブラリ作成にいたっては、Twitter API 仕様書まとめサイトでAPI調べる。 返ってくるデータはFlexのデバッガーで直接を見て調べる。
「YTwitterLib.swc」の最低限の機能として、タイムライン・フォロワー・友人取得、ツィート投稿を実装 で、「YTwitterLib.swc」使った試作アプリ(デザインそっちのけw)
AirがiPhoneにのらないのが悔やまれるなぁw
■「YTwitterLib.swc」メソッド一覧(未実装含む) まだ、命名や仕様が練れてませんが。。。
- getUserTimeline(id:String):void - tweet(message:String, handler:Function=null, isGetHomeTimeline:Boolean=true):void - deleteTweet(id:Number, handler:Function=null, isGetHomeTimeline:Boolean=true):void - getHomeTimeline():void - getFriendTimeline(id:String):void - getFriends():void - searchFriends(id:String):void - getFollowers():void - getPublicTimeline():void - searchWordTimeline(word:String):void - searchUsers(screenName:String):void - reply(id:Number, handler:Function=null, isGetHomeTimeline:Boolean=true):void - retweet(id:Number, handler:Function=null, isGetHomeTimeline:Boolean=true):void
■このライブラリ使って、タイムラインとる例 [as3] public function onCreationComplete(event:Event):void { twitter = new Twitter(); twitter.userName = userName; //Twitterのユーザ名 twitter.password = password; //Twitterのパスワード twitter.getHomeTimeline(); } [/as3]
たった、4行でObject化されたタイムラインが取得できる。シンプルじゃね?
getHomeTimeline()がvoidなのは、非同期通信だから。 getHomeTimeline()で、Basic認証してtwitter.comからリクエスト(JSON)が返ってくる。 JSONを「userTimelines:ArrayCollection」に変換して自動的にバインド。
userTimelinesは、アクセスしやすいようにUserTimeline型オブジェクトでの配列です。
■今後の宿題 ▽未実装機能の調査・着手 ・reply(返信) ・retweet(リツィート) ・個人設定 とかモロモロの機能も設計しないといけない。
▽認証系 Basic認証経由なので、将来的にはOAuth認証も対応する予定
その場合、Twitter Developerでconsumer key と consumer secretを登録・作成が必要。 Flexのサンプルだと、<a href="http://www.coderanger.com/blog/?p=59 target="_blank">OAuth Class for Flexがソースで載ってる。
▽その他API調査 TwitterのAPIにはstreaming APIってのもある。 Socket通信でストリーミングするので、超リアルタイムだけど、データをどう使うか?が難しい。
とりあえず、こんな感じでストリーミングできるが、根本的にどうしたらいいかがわからないw
■簡易PHPサンプル
$user = 'xxxx';
$password = 'xxxx';
$stream = fopen("http://{$user}:{$password}@stream.twitter.com/1/statuses/sample.json?delimited=20", "r");
while ($json = fgets($stream)) {
$twitter= json_decode($json,true);
if(preg_match('/[ァ-ヶーぁ-ん]/u',$twitter['text']))
echo $twitter['user']['name'].':'.$twitter['text'] . PHP_EOL;
}
これ抽出によっては、ブラウザが死にます。。。
http://stream.twitter.com/1/statuses/firehose.json に関しては現在、法人向けで申請しないと使えないとのこと。
うわー Flash Player10.1 betaにしたら、Matrix3Dの処理が思わぬ動きにw クロスドメイン問題と言い、色々と面倒だ。
Youtubeストリーミングは、Flashで直接できないから(プロキシかましたり、Airではできる)し、このサイトもHTML出力にするかな?と思うこのごろ。 とは言え悔しいので、先日発売になったFlex4でAirアプリ作ってます(^_^)
iPhoneじゃ動かないけど、ニュースになったWePad(Andoroid)で動いたら面白いな。 てか、iPhone、Andoroidも頑張んないといかんが、時間が皆無。。。
さてFlex4は、まだ会社でアップグレードしてもらってないので、体験版で。 SVNのリポジトリ作成は、Linuxサーバ上で手動で作ってます。 SVNリポジトリの作成
実際にFlexBuilderでSVNを利用してみる。 ■subsclipseインストール Flex4はEclipse3.6だけど、subsclipse1.4.xが入れられない。 (Graphのライブラリが必要?)
調べるのがめんどいので、1.2.x(非安定板)をとりあえずインストール。
http://subclipse.tigris.org/update_1.2.x
■初期コミット (1) チーム>プロジェクトの共有>SVN (2) ロケーション情報作成(ディレクトリ作成)
http://yoo-s.com/svn/YTwitter/flex4/air/trunk/
(3) 【次へ】で全て進む
(4) 作成が完了すると、コミット画面が出てくるのであれこれしてコミット
ライブラリはここにアップ http://yoo-s.com/svn/YTwitter/flex4/swc/trunk/
HTML版用に、SyntaxHighlighterを使ってみた。
SyntaxHighlighter 2.0 -ソースコードを素敵に表示するを参考
こういうのは、Ajaxはすごい便利だ。 Flash10.0系のhtmlTextだと、できないだろうからなぁ。 てか、wonderflでソースのswf表示してるやつあるから、それを調査すればいいか。
■準備 (1) SyntaxHighlighterパッケージを任意に配置 (2) HTMLで、JavaScriptとCSSのパスを通す(shCore.js、shCore.cssは必須) (3) SyntaxHighlighter.all();
こんだけ。
■ソースの記述 (1) ソースコードは「pre」タグで囲む
(2) 対応言語表記に沿って記述
as3, actionscript3, bash, cf, coldfusion, c-sharp, csharp, cpp, c, css, delphi, diff, erl, erlang, groovy, html, js, jscript, javascript, java, jfx, javafx, pas, pascal, patch, perl, pl, php, plain, ps, powershell, py, python, rails, ror, ruby, scala, shell, sql, text, vb, vbnet, xml, xhtml, xslt, xhtml
例) pre class="brush:as3;"
■ActionScript3のソースの場合 [as3] /** * Copyright 2010 * Author: Yohei Yoshikawa **/ package com.yoos.app.controllers {
import com.yoos.app.views.TwitterFriendListView;
import com.yoos.app.views.TwitterTimelineView;
import com.yoos.app.views.TwitterView;
import com.yoos.libs.PageController;
import com.yoos.libs.twitter.controllers.Twitter;
import flash.events.Event;
import mx.collections.ArrayCollection;
[Bindable]
public class TwitterController extends PageController
{
private static var instance:TwitterController;
public static function getInstance():TwitterController {
if (instance == null) {
new TwitterController();
}
return instance;
}
public function TwitterController()
{
if (instance == null) {
instance = this;
}
}
override public function initialized(document:Object, id:String):void
{
view = document as TwitterView;
}
//view
public var view:TwitterView;
public var twitterTimelineView:TwitterTimelineView;
public var twitterFriendListView:TwitterFriendListView;
private var currentFuncion:Function;
public var twitter:Twitter;
private var topMargin:Number = 0;
private var delay:uint = 15000;
public var userName:String = 'xxxxxx';
public var password:String = 'xxxxxx';
public function onCreationComplete(event:Event):void
{
twitter = new Twitter();
twitter.userName = userName;
twitter.password = password;
generatePages();
pageTwitterTimeline();
}
public function onTimelineCreationComplete(event:Event):void
{
}
private function autoLoad():void
{
var timer:Timer = new Timer(delay);
timer.addEventListener(TimerEvent.TIMER, onTimer);
timer.start();
function onTimer(event:TimerEvent):void
{
if (currentFuncion != null) {
//currentFuncion(currentParams);
}
}
}
private function generatePages():void
{
baseView = view;
baseGroup = view.container;
twitterTimelineView = new TwitterTimelineView();
twitterFriendListView = new TwitterFriendListView();
addPage(twitterTimelineView);
addPage(twitterFriendListView);
}
public function tweet(message:String):void
{
twitter.tweet(message, onComplete);
function onComplete(event:Event):void
{
view.messageField.text = '';
}
}
public function deleteTweet(id:Number):void
{
var handler:Function = onComplete;
twitter.deleteTweet(id, onComplete);
function onComplete(event:Event):void
{
}
}
public function retweet(id:Number):void
{
var handler:Function = onComplete;
twitter.retweet(id, onComplete);
function onComplete(event:Event):void
{
}
}
public function reply(id:Number):void
{
var handler:Function = onComplete;
twitter.reply(id, onComplete);
function onComplete(event:Event):void
{
}
}
public function pageTwitterTimeline():void
{
page(twitterTimelineView);
twitter.getHomeTimeline();
}
public function pageTwitterFridnedList():void
{
page(twitterFriendListView);
twitter.getFriends();
}
}
} [/as3]
現状、mixiボイスはAPI化されていない為、htmlパースするしか方法がありません。 つまり、現状のiPhoneアプリや「twitter2mixi」を始めとする連動サービスは全滅ですw
夕方に仕様変更があったのを気づいて、mixi & twitter取得・投稿機能を修正。 修正自体はたいした事がないけど、変更がある度に修正が入るかも知れない。
しかし今回みたいな変更だと、他のライブラリに依存しない路線は正解だった。 他のライブラリ待ちだとその間サービスが止まるから・・・
修正的にはhtmlパースなので超力技だけど、 極力次回影響が少ないように「id」と「class」等のアトリビュートでパース。 しかし今回、無茶苦茶嫌らしいhtmlタグになっているw
■ボイスコメント ・HTMLタグから「コメント」と「post_time」を取得
<div class="voiced"> <p>コメント・・・・<span><a href="view_voice.pl?post_time=20100414231014&owner_id=xxxxxxx">(46分前)</a></span></p>
■ボイス投稿 ・各アドレスの文字列「echo」→「voice」と変更となった。 ・「post_key」のHTMLタグも変更
<input type="hidden" name="post_key" id="post_key" value="xxxxxxxxxxxxxxxxxxxxxxx" />
夜に更新されたPHPライブラリが更新されて、ソースを見てみたが 「<div class="voiced">」とあからさまな修正なんで、多分次回の修正もダメでしょう。 せめて「class="voiced"」でパースすべきだと思うが、大きく変わったら同じ事だから何ともw
API公開しないのはmixi社の方針なので、文句を言っても仕方がないけど、 日記等は公開してなぜボイスは公開しないんだろう?
あと、twitterとデータ構造を統一した方がいいと思う。
iPhoneOS 4.0が発表されて、ようやくマルチタスクに対応する事に。 これで相当便利なアプリが登場することに。
しかしその裏側で、Flash CS5発売目の前にこんな規約ができてしまったw http://japanese.engadget.com/2010/04/09/iphone-flash/
これでiPhoneアプリ開発は「ObjectiveC」「WebKit + JavaScript」になってしまった。 つうことで、Adobeの生きる道は「AndroidでAirアプリ」の一本になってしまった。
しかしJavaScriptは開発者からしたら、現状では非常に非効率な言語に思える。 クラス定義・継承がprototypeで対応するってのは、どうも強引過ぎる。。。
ECMAScriptをwikiで調べたら、
「ECMAScript 4 は過去2回仕様作成が挑戦されたが、仕様がまとまらず、失敗に終わっている」
・JavaScript:ECMA-262 3rd edition ・ActionScript:ECMA-262 4th草案、ECMA-357
■鍵を握る「ECMAScript」基準 ECMAScript 5 ECMAScript 5の"Object"
・オブジェクトの操作拡張 (Object.create、Object.seal、Object.freezeなど) ・JSON ・Strict Mode
Strict Modeってよくわからないと思ったら、警告モード有無の事ねw
Strict = 厳格な
普段何気なく使ってても、用語知らなかったりすのはちと恥ずかしいw こんなんじゃコンサルできないな。
かなり頭悩ましてますw
このサイトのYootubeは、一般的なYoutube再生(swf再生)じゃなくて、 flvやmp4を直接ストリーミングしてます。 が・・・何か3月末から拒否されてるっぽい(T_T)
実はこのサイトのようにFlashからの外部アクセス(今回で言うYoutube)は、 セキュリティ的に無茶苦茶やっかいで、直接アクセスできません。
苦肉の策で、こんな感じでPHP経由(proxyプログラム)で取得してました。 ■フロー (1) swfからyoo-s.comのAPIへYoutube動画URLリクエスト http://www.youtube.com/watch?v=ビデオID
(2) URLを解析し、ビデオIDを取得
(3) yoo-s.comからYoutubeに動画情報をリクエスト http://www.youtube.com/get_video_info?&video_id=ビデオID
(4) テキストデータがかえってくるので、解析してtokenを取得
(5) ビデオIDとtokenを利用して、yoo-s.comからYoutubeへ動画リクエスト http://youtube.com/get_video.php?video_id=ビデオID&t=token
(6) 303 See Otherが返る クライアント直接型専用アプリ(C#やAir等)なら、この時点で動画をダウンロードできる ここがやっかい。。。
(7) ヘッダを解析してLocationから真の動画URLを取得 例) http://v8.lscache8.c.youtube.com/videoplayback?ip=72.0.0.0&..........
(8) yoo-s.comからswfへ動画URLを返信
しかし、冒頭にも記した通り、最近(7)のURLがyoo-s.comでは拒否されてしまう。。。 ローカル環境ならOKってことは、やっぱIPで制御されてる可能性大。 100%拒否されたとは断定できないけど「token発行がyoo-s.com」「動画再生がswfクライアント」 ってのが問題かな?
結局、クライアントから直接リクエストしないとダメかも。 とは言えswfからは直接アクセス不能なので、swf←→JavaScriptになるのか? てかJavaScriptでも拒否されるかも知れん。。。
ちなみにAirアプリで作ったら、あっさりyoutubeから直接動画ダウンロードできたけど(^^;) うーん、誰か助けてw
iPhoneアプリはトーシロで、OSXアプリの講習会にも行った事あるけど、すっかり忘れてしまった。 「Cocoa/Objective-C」プログラム本を捨ててしまったので、基礎的な参考本がないw
ってことで、ネットで調べたらこのページがわかりやすい。 iPhone App Docs
Objective-Cは抜きにして、非常によくまとまっていると思う。 しかし「Interface Builder」は素晴らしいね。 アプリによっては、ほぼノンコーディングで作成できてしまうw
結局は「WebObjects」同様、プログラムをがりがりしないといけない&「Objective-C」の作法が壁だなぁ。 若ければ時間もあるし吸収力早いんだけど、年はとりたくないもんだ。。。
■メモ ▽view作成時のイベント ・viewDidLoad:インスタンス化したときに呼ばれる ・viewWillAppear:View表示直前に呼ばれる ・viewDidAppear:View表示直後に呼ばれる
▽touchイベント - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event - (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event - (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event - (void)touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event
▽AVFoundation.frameworkのパス /Developer/Platforms/iPhoneSimulator.platform/ Developer/SDKs/iPhoneSimulatior2.2sdk/System/Library/Framework
オブジェクトを中心で回転させるプログラムに完全にハマりました(T_T) とりあえず、このサイトのヘッダーメニューとBlog画面に実装しましています。
昔からベクトル大嫌い! でも、3Dやるには切っても切れないから勉強しないと、この先思いやられるなぁ。
てか、中心の回転はFlex4で簡単にできるようになるんだっけ?(^^;)
とりあえず、サンプルコードを抜粋 [as3] var matrix:Matrix3D = new Matrix3D();
matrix.appendTranslation(-target.width/2, -target.height/2, 0); if (_params.rotationX > 0) { matrix.appendRotation(nRotationX, Vector3D.X_AXIS, new Vector3D(defaultX, defaultY)); } if (_params.rotationY > 0) { matrix.appendRotation(nRotationY, Vector3D.Y_AXIS, new Vector3D(defaultX, defaultY)); } matrix.appendTranslation(target.width/2, target.height/2, 0); target.transform.matrix3D = matrix; [/as3]
オブジェクトを中心に回すには、基軸をオブジェクトの中心にずらさなくてはいけない。 肝は、pivotPointでした。
(1) appendTranslationでオブジェクトの幅、高さの半分平行移動
(2) appendRotationで各軸で回転させるが、第3引数のpivotPointで基軸を設定する
(3) appendTranslationで(1)で平行移動した分を戻す
今日は全く仕事をせずに、Ustreamでセッションをずっと見てました(-_-) 会社では音が聴けなかったので、家でもう一回観ようと思います。
Ustream「Adobe FLASH PLATFORM CAMP Tokyo」
「Flash CS5」の宣伝てことで、デザイナーよりのFlasher向けのセッションでした。
抜粋 ■Flash CSS と Flex Builder4の新機能 一番観たいのを見逃したw あとで・・・。
■Flash CS5のiPhoneアプリ開発 「Objective-C」は習得がとにかく難しい言語なので、Flasherさんが一番気になる技術ですよね。
前にFlexUGでデモをちょっと見たので、まぁこんなもんか?という感じ? OpenGLに変換する為のラッパークラスをかますのが肝。 あと、メモリ管理を視野に入れないと大変そう。
これからAppStoreが無尽蔵に増えそうだなw てか、Flexにつけてよ!>Adobe
■スカンクワークス(特命チーム) 個人的には、一番刺激を受けたセッション。 Papervision3Dの開発者Ralph Hauwertのデモがクールだった。 Pixcel Benderのデモは前に見ていたが、もしかしたらWebGL、OpenGLが 常識の3Dの世界に風穴あけちゃうのかな?ってくらいリアルタイムレンダリングが速い気がした。
■サイドショーへようこそ Mario Klingemann氏のピクセルとベクトルとActionScriptを数学と科学で創造するアートワーク。 Twitterでは数学の芸術家と絶賛されてました!
■アート・オブ・プレイ Erik Natzke氏のデモはTwitterで評判が良かったようです。 PCアートって無機質っぽいけど、それをあまり感じさせない凄さ。
もちろん感性が一番重要なんだけど、MarioもErikもちゃんと数学の基礎ができている。 映像と数式がリンクしていて、まさにマトリックスの世界。
自分は幾何学がすげぇ苦手なんで、今悪戦苦闘(って程やってないけどw) 最終的に僕らは賢い人のライブラリを使うのが一番だと思うけど、物事の本質は知らないとね!