Partty!.orgのしくみ - みんなでペアプロできるサービス

今操作しているターミナルを共有できるサービスPartty!.orgを公開しました。

Partty!.orgソフトウェアの中に入っているpartty.orgコマンドを使うと、今操作しているターミナルの画面を、他の人に見せたり、操作してもらったりすることができます。

共有されているターミナルを見る側は、ブラウザさえあればFlash製のターミナルエミュレータを使って接続することができます。使い慣れたターミナルエミュレータが使いたいと思ったら、telnetクライアントも使えます。

↓こんな仕組みになっています。

partty.orgコマンドを起動すると、シェル（bash, zsh, ...）が起動し、その出力がPartty!.orgサーバーに送られます。そこからFlash製のターミナルエミュレータや、telnetクライアントに配信されます。

※ターミナルの画面は暗号化もされずにwww.partty.orgに送られるので注意が必要です

Partty!.orgサーバーでターミナルの画面を録画しているので、あとから再生することができます。録画データはGoogle Gadgetを使ってブログに貼り付けられるようになっています。↓こんな感じです。

ターミナルの画面は見てもらうだけでなく、操作してもらうこともできます。（操作するにはパスワードが必要です）

というわけで、ペアプログラミングにはぴったりです。ネットワーク越しに、1つのエディタを操作したり、シェルを操作したりできます。

書かれたコードだけでなく、コードを書く過程まで共有できるのがいい感じです。

実装でも書きたいことがいろいろあるので、そのあたりもまた書きます。

Flex SDKをインストールしてHello, World!するデモ

人気急上昇かもしれないFlexを、ゼロから始めてみるデモです。

お品書き：

1. AdobeのサイトからFlex SDKをダウンロードする
2. Flex SDKをインストールする
3. rascutをインストールする
4. Hello, World!なインターフェイスを書く
5. ActionScriptを書いてアクションを加える

というわけで、Party!.orgで作成した動画が↓コレです。

※アクションを追加したコードで、にclick="helloClicked(event)"が抜けていました＞＜

最初にFlex SDKをダウンロードしているサイトは、ここです。「flex_sdk_3.zip」というファイルがダウンロードできるので、これを適当なところに展開しています。
展開したあと「${適当なところ}/bin」にPATHを通すと、コンパイラ（mxmlc）など各種ツールが使えるようになります。

rascutについては、ActionScript開発者必須「rascut」 - MONNGIFTやActionScript やるなら入れとけ。rascut 導入と使い方。 - てっく煮ブログが分かりやすいです。

最初に書いているhello.mxmlは、↓こんな感じです。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
        <mx:Button label="Hello, Wrold!"/>
</mx:Application>

Hello, World!と書かれたボタンが出てくるだけです。

続いてアクションを設定した後のhello.mxmlは、↓これです。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
	<mx:Button id="a" click="helloClicked(event)" label="Hello, World!" />
	<mx:TextArea id="log" text="log:  "/>
	<mx:Script source="action.as"/>
	<!-- ボタンを追加する箱 -->
	<mx:HBox id="yokoNarabi"/>
</mx:Application>

※デモの動画ではにclick="helloClicked(event)"が抜けていました。 ↑これが正しいです。

↓action.as

// 他のクラスを使うときは
// 忘れずにimport
import mx.controls.Button;

// Eventクラスの引数を取るhelloClickedメソッド
// 返り値はvoid
private function helloClicked(event:Event):void
{
	// ボタンが押されたときに
	// TextArea id="log"にテキストを追加
	log.text += "clicked!";
	// 新しいボタンを作成してみる
	var button:Button = new Button();
	// Button label="clicked"
	button.label = "clicked!";
	// HBox id="yokoNarabi" の中にボタンを追加
	yokoNarabi.addChild(button);
}

↓これが完成したFlashです。

ここから先はComponent ExplorerやLiveDocsを見つつ、Let's Flex！