12月 2011

Node.js[2]-EaselJSとsoket.ioでタッチ共有

前回のエントリでsoket.ioにだいたい慣れたので、次は以前作ったEaselJSのスタディを少しいじって、soket.ioでつなぎタッチの可視化共有してみた。
今回作ってみた物を以下に置いておく。ただVPSサーバーの構成変更を行う予定なので、いつまでこの形でおいておくかは分からない。

co-touch

できればiPhoneとmacとかiPhoneとiPadとかで見ていただけると、一方のタッチがリアルタイムに伝わる様が見えるだろう。もちろんブラウザウィンドウ2枚立ち上げでも何が起きるか把握できる。

Read more »

Node.js[1]-soket.io v0.7以降の記述方

インストール作業と基本理解を終えて放置していたNode.jsだが、もう少しちゃんと触ってみた。
socket.ioはNode.jsでリアルタイム通信を実現するモジュールで、websocketはもちろん、それが使えない環境でもFlash Socket等を通じて通信を成り立たせている。
Node.jsを始める気になった決定打は、これがとても楽しそうだったからだ。

http://socket.io/
http://jxck.github.com/socket.io/ 日本語

Read more »

EaselJS[1]-iPhone/iPad対応や画像など

今回はEaselJSをある程度いろいろといじってみた。
以下に作ってみた物を置いてある。
EaselJS Study 01
EaselJS Study 02

Read more »

EaselJS[0]-スタートポイント作成

EaselJSはCANVASをactionscriptに似た感じで扱えるようにするjavascriptライブラリだ。
ライブラリの作者はフラッシュ開発者として有名なGrant Skinner氏である。またadobeのFlashプロダクトマネージャで、最近モバイルブラウザー向けFlash Player開発中止についての詳細説明をしていたMike Chambers氏も、その開発に協力しており、将来的にはフラッシュとの連携がありそうだと言われている。
つい先ごろ0.4が公開された。ここのところバージョンアップが無かったので開発が続くのか少々不安だったのだけど、これで継続することがはっきりとしたので、いじりはじめてみることにした。
今回はhello worldとプロジェクトのスタートポイント作成を行った。

Read more »

Sencha Touch2[5]-MVC[1]-構築とlocalstorageのバグ

引き続きMVCパターンで具体的なアプリ構築に入っていく。
それと構築途中で判明したlocalstorageのバグにも触れる。
今回作成した物とそのソースファイルを以下に置いておく。
MemoApp
memoMVC.zip

Read more »

Sencha Touch2[4]-MVC[0]-パターンとスタートポイント

ドキュメントにあるExamplesのApplication ExamplesあたりはMVCパターンに沿って作られている。
今回はこのSencha Touch 2でのMVCパターンを調べてみた結果を書いていく。

Read more »

Sencha Touch2[3]-イベント関連、あと開発ツール[2]

前回のエントリで、困ったらインスペクタのConsoleでオブジェクトダンプして色々と取ればなんとなく大丈夫そうだと分かった。今回は、それも使いつつイベントの書き方色々を説明していくことにする。

Read more »

Sencha Touch2[2]-イベント関連、あと開発ツール[1]

引き続きSencha Touch2、今回は本題であるイベント周りを記述する。
前回使っていたevent 01だと3ページ分のスクリプトが入り交じっていて少しゴチャッとしているので、各ページごとに3つに分けて説明をしていくことにする。
またしても長くなったので、もう1エントリ続ける。

Read more »

Sencha Touch2[1]-イベント関連、あと開発ツール[0]

Sencha Touch2を引き続きで、今回はイベント周りを調査した。
イベント関連はコンフィグオプションでhandlerとして設定する方法や、リスナー登録する方法、コントローラで処理する方法など、色々と出てきた。
今回作成分はWebKitの開発ツールであるWeb InspectorのConsoleで見ることが前提となっており、ドキュメントに載っていない情報や取得したいプロパティなどの確認方法も解説していく。
まず今回はWeb Inspectorの使い方、次回にイベント周りの説明とする。

Read more »