enhance Flex Builder – part 2

今回はEclipse環境をJavaScriptで拡張することができるEclipse Monkeyを利用します。

実はこのEclipse Monkeyを使ったActionScriptのコード補間はFlex2の頃からあったようで、
海外サイトを巡ればたくさん情報が手に入りました。
今のFlex(AS3.0)人口はあの頃と比べて増えてると思うので、ここで情報を簡単に整理しておこうかと。

環境はEclipse 3.4.1(Pleiadesで日本語化済み)、Flex Builder Plugin 3.0.2。
まず、[ヘルプ] > [ソフトウェア更新] > [サイトの追加] から
http://download.eclipse.org/technology/dash/update
を追加、Eclipse Monkeyをダウンロード・インストールします。
Eclipseを再起動するとメニューに 'スクリプト' という項目が新しく出来ているはず。
次に、任意のプロジェクトのルート直下に 'scripts' フォルダを作成し、そこに .jsファイルを追加していきます。

Eclipse Monkey入門編ということで、今回はAS3.0におけるgetter/setterを自動生成するスクリプトを書きます。

・Eclipse Monkeyスクリプト

/*
 * Menu: ActionScript > Generate getters/setters
 * Key: M3+1
 * License: EPL 1.0
 * DOM: http://download.eclipse.org/technology/dash/update/org.eclipse.eclipsemonkey.lang.javascript
 */
function main() {
	var editor = editors.activeEditor; // アクティブなエディタを取得
	if(editor.selectionRange) {
		var range = editor.selectionRange; // 選択範囲を取得
		var text = editor.source.substring(range.startingOffset, range.endingOffset); // 選択範囲内のテキストを取得
		var lines = text.match(/(\w+:(\w|\*)+)/g);  // a:int, b:Number 等の文字列をmatch
		var o = ""; // 出力テキスト
		for(var i = 0, n = lines.length; i < n; ++i) {
			o += getvar(lines[i]);
		}
		for(var i = 0, n = lines.length; i < n; ++i) {
			o += generate(lines[i]);
		}
		o += "\n";
		//debug(o)	
		editor.applyEdit(range.startingOffset, range.endingOffset - range.startingOffset, o)
	}
}

//メンバ変数の生成
function getvar(s) {
	if (s.length < 1) {
		return "";
	}
	return "\n\t\tprivate var _" + s + ";";
}

// getter/setterの生成
function generate(s) {
	var parts = s.split(":"); // コロン(:)で分ける
	if (parts.length != 2) {
		return "";
	}
	// この部分は各自のコーディングルールで自由に変更できます.
	// 例えば仮引数名の変更や、中括弧を改行後に入れる等.
	var s = "\n\t\tpublic function get " + parts[0] + "():" + parts[1] + " {";
	s += "\n\t\t\treturn _" + parts[0] + ";" ;
	s += "\n\t\t}\n";
	s += "\n\t\tpublic function set " + parts[0] + "(value:" + parts[1] + "):void {";
	s += "\n\t\t\t_" + parts[0] + " = value;" ;
	s += "\n\t\t}\n";
	return s;
}
// デバッグ用
function debug(s) {
	Packages.org.eclipse.jface.dialogs.MessageDialog.openInformation(window.getShell(), "Monkey Debugging", s);
}

* Menu: ActionScript > Generate getters/setters

* Key: M3+1

* License: EPL 1.0

* DOM: http://download.eclipse.org/technology/dash/update/org.eclipse.eclipsemonkey.lang.javascript

function main() {

var editor = editors.activeEditor; // アクティブなエディタを取得

if(editor.selectionRange) {

var range = editor.selectionRange; // 選択範囲を取得

var text = editor.source.substring(range.startingOffset, range.endingOffset); // 選択範囲内のテキストを取得

var lines = text.match(/(\w+:(\w|\*)+)/g); // a:int, b:Number 等の文字列をmatch

var o = ""; // 出力テキスト

for(var i = 0, n = lines.length; i < n; ++i) {

o += getvar(lines[i]);

}

for(var i = 0, n = lines.length; i < n; ++i) {

o += generate(lines[i]);

}

o += "\n";

//debug(o)

editor.applyEdit(range.startingOffset, range.endingOffset - range.startingOffset, o)

}

//メンバ変数の生成

function getvar(s) {

if (s.length < 1) {

return "";

}

return "\n\t\tprivate var _" + s + ";";

}

// getter/setterの生成

function generate(s) {

var parts = s.split(":"); // コロン(:)で分ける

if (parts.length != 2) {

return "";

}

// この部分は各自のコーディングルールで自由に変更できます.

// 例えば仮引数名の変更や、中括弧を改行後に入れる等.

var s = "\n\t\tpublic function get " + parts[0] + "():" + parts[1] + " {";

s += "\n\t\t\treturn _" + parts[0] + ";" ;

s += "\n\t\t}\n";

s += "\n\t\tpublic function set " + parts[0] + "(value:" + parts[1] + "):void {";

s += "\n\t\t\t_" + parts[0] + " = value;" ;

s += "\n\t\t}\n";

return s;

}

// デバッグ用

function debug(s) {

Packages.org.eclipse.jface.dialogs.MessageDialog.openInformation(window.getShell(), "Monkey Debugging", s);

}

コード生成処理そのものについては特に難しい部分はないかと。
editors オブジェクトはEclipse Monkeyが提供しているDOMオブジェクトです。
DOMといってもXMLなどを操作するためのDOM APIではなく、Domain Object Model の略で、
これは特定の目的に特化したインタフェースを提供するものになります。

ソースコード先頭にあるコメント部分について
ここには
・メニューに表示する名称
・メニュー階層
・ライセンス情報
・ショートカットキー
・DOM情報
などのメタデータを記述し、実際の処理はmain関数内に記述することになります。

上のEclipse Monkeyスクリプトを使うには、エディタ上で

例）
type:int
color:uint
text:String
|←カーソル位置

または、

type:int, color:uint, text:String
|←カーソル位置

例）

type:int

color:uint

text:String

|←カーソル位置

または、

type:int, color:uint, text:String

|←カーソル位置

と入力、Shift + ↑ でこの三行(または一行)を選択してから Alt + 1 を押すと
('スクリプト' メニューからマウスで選択してもOK)

private var _type:int;
private var _color:uint;
private var _text:String;
public function get type():int {
	return _type;
}

public function set type(value:int):void {
	_type = value;
}

public function get color():uint {
	return _color;
}

public function set color(value:uint):void {
	_color = value;
}

public function get text():String {
	return _text;
}

public function set text(value:String):void {
	_text = value;
}

private var _type:int;

private var _color:uint;

private var _text:String;

public function get type():int {

return _type;

}

public function set type(value:int):void {

_type = value;

}

public function get color():uint {

return _color;

}

public function set color(value:uint):void {

_color = value;

}

public function get text():String {

return _text;

}

public function set text(value:String):void {

_text = value;

}

のようなコードが自動生成されます。

基本的なことはこれくらい。
海外ではより高度なEclipse Monkeyスクリプトがたくさん出回っているようです。
最後に実際に操作している動画を紹介しておきます。これはすごい。。
YouTube - Genrate Actionscript 3 Code with Eclipse Monkey

・参考
【コラム】イマドキのIDE事情 (31) 退屈な作業を自動化! Eclipse Monkeyを使ってみる
Eclipse Monkeyを使おうと思って調べたときのメモです

Rest Term

enhance Flex Builder – part 2

あわせて読む:

Comments: 2

Leave a reply »