JSDT jQuery 開発環境

先日さすらいの Web サーフィンをしていたら、JSDT (JavaScript Developer Tool)の jQuery サポートをみつけたのでちょっと試してみました。 たぶん前からあったものだと思うのですがなかなか良さそうな雰囲気であります。

とりあえずインストールより。

最近、Eclipse PDT(PDT Developer Tool)のオールインワン的なリリースがないのですが、とりあえず PDT に入れています。 Eclipse Classic に PDT プラグインを追加すれば PDT になります。

Eclipse 3.7 / Indigo / PDT 3.0

  • Installed and running Eclipse Classic 3.7

これに JSDT jQuery を追加で入れます。 eclipse.org から for JavaScript Developer のパッケージもでていますので、JS しかやらないかたはこちらでもいいかもしれません。 PDT を追加することもできるでしょう。

Market Client が入っていないと JSDT jQuery が入れにくいので追加します。

jQuery10

で、Eclipse Market から JSDT jQuery を追加。

jQuery11

JavaScript プロジェクトをつくって右クリックからプロジェクトの設定。 JS のライブラリを選んであげます。 jQuery が追加されているはずです。

jQuery13

こんな感じに。

jQuery14

ではやってみましょう。 🙂

jQuery 補完機能。

jQuery15

[tegaki]うん!よい![/tegaki]

JSDoc(?) もちゃんとみれます。 メソッド名と引数わかればこちらのものです(笑)

jQuery16

ちなみに、jQuery と関係ないですが、JSDT のリファクタリング機能も試してみましょう。

変数名リファクタリング。 下に別スコープの同名変数があることに注目してください。

変数 hoge を moge にリファクタリング。

jQuery30

jQuery31

ちゃんとスコープみて test1 の中だけ変えてくれています。

また初期化警告もでています。 ただのテキストエディタと違ってプログラムを読んでいてくれるからできる実装です。

jQuery32

JavaScript は動的型付言語ですので、IDE サポートも限界がありますがなかなか動くようですね!

また Web Developer 系の Eclipse には HTML のリアルタイムバリデータとか、PDT には PHP のリアルタイム警告サポートもあります。

閉じタグ忘れ。

jQuery33

閉じ括弧忘れ。

jQuery34

Eclipse メインじゃなくても既存のファイルをワークスペースにもってこれますので、使うときだけという運用も可能です。

jQuery20

プロジェクト作成時に form exsisting source にすればOKです。 あと、JS/PHP サポートをプロジェクト右クリックからつけてあげられます。

jQuery35

てな感じなのでつかわにゃそんそん。  🙂

ぐるぐる Groovy。。

記事書いていませんでしたが、最近も Groovy くんにはだいぶお世話になっております。

テストデータ作成や小物ツールをつくるのに非常に便利な Groovy。

開発環境も Eclipse にプラグイン入れるだけでフルセットそろいますし、テキストエディタだけでも jar ひとつでいけますし、実行環境も Java が入っていればいいだけなので、人にも渡しやすく非常に重宝しております。

ということで、ちょこちょこいじっている訳なんですが最近気がついたこと。

ふと Groovy 1.8 系で下のコードを。

import org.codehaus.groovy.runtime.NullObject

// Groovy だとどちらも普通(Java だと上だけ通る)
assert(Integer.valueOf(127) == Integer.valueOf(127));
assert(Integer.valueOf(128) == Integer.valueOf(128));

// なるほど
assert(null == null)
assert(null.equals(null))
// なんとなく Groovy が不思議
assert(null != new NullObject())
assert(!null.equals(new NullObject()))

Groovy の == は equals の演算子オーバーロード。

というわけで、上の2つの assert は普通に通ります。 ちなみに Java だと両方通らない感じですが、上は通ります。 結構謎ですね(笑)

で、したの null のほう。 null もオブジェクトっぽいのですが、最後の2つの assert が不思議な感じ。

なんとなく別件ですが、このパッチがそれっぽい…。

[#GROOVY-4985] null and .with{} – jira.codehaus.org

Currently this fails:

null.with { assert it == null }

単純にぼくがなんかぼけてるのか、、、まぁなんだってわけでもないのですがふと(笑)

あ、そうそう、壁紙変えました。 🙂

Screenshot20111210

[tegaki]は、張る画像がなかったわけじゃないんだからね![/tegaki]

textile 文書をつくる

なにか文書をつくるとき、、まぁ普通は Microsoft Word とかワープロになると思うのですが、操作が煩わしかったり、バージョン管理できなかったり、なんとかテキストに近い形で書きたいことっていうのは結構あると思います。

docbook や XHTML を直書きするのはあまりにも冗長、tex は環境つくるの大変だしそこまで大がかりでなくてもよい、、なんてとき Eclipse Mylyn の WikiText モジュールが良いかもしれません。 実は Eclipse のリッチテキストエディタのキャレット制御も優秀でなかなか使えます。 🙂

Eclipse 上で動きますので統合環境のバージョン管理やローカルヒストリーも使えますし、各種キーボード操作、増分検索やカーソル飛ばしも同じ。 Eclipse 使っている方はお試しを。 J2EE 版をお使いならスタートは簡単。 .textile 拡張子のファイルをつくってダブルクリックするだけです。

エディタはこのような感じです。 たとえば textile 記法で文書をつくります。 設定により他の wiki 記法にも切り替えられます。 ヘッダとかはリアルタイムで表示変換されます。

textile10

ちゃんと word-warp ・折り返しするエディタです。簡単あるね。

Eclipse 上ですので当然(?) CTRL + SPACE とか ALT + \ とかの補完機能も使えますので wiki 記法分からなくても大丈夫。 ぼくもよく知りません(笑)

textile15

画面下タブに Preview がありますので、CTRL + PageUP とかで切り替えると画像展開を含むプレビューをすることができます。

ちなみに、ここで使われているインターナルブラウザは Eclipse Indigo からは標準で WebKit になるはずです。スクリーンショットは Ubuntu の Eclipse/SWT の WebKit です。

Windows だと iTunes か Safari が入っていないと Gecko になるのかな。(SWT のソース確認していませんが C:\Program Files\Common Files\Apple\Apple Application Support\webkit.dll を見ている気がします)

textile11

脚注利用時に存在しない番号を指定してしまった場合等、リアルタイム警告などもるようです。

アウトラインビューをだせばアウトラインだせます。

textile12

編集時のフォントはいつもの設定画面より WikiText 部分。 Text Font をプロポーショナルフォントで設定すればさながらワープロです。

textile14

ちなみに、この SWT のエディタはちゃんとオンザスポット入力で、文字列の途中挿入でも横の文字をずらすキャレット制御タイプなので文書入力も違和感ありません。(確定後ちょっとばたつきますが)

Windows のテキストエディタでも、この動作ができないのありますので優秀です。 Linux のテキストエディタだと、Eclipse と gedit くらいしか出来るのをみたことがありません。。

プレビュー部分は CSS で表示制御できます。 フォントなど気に入らなければ body タグとかに font-famiry を追加して設定しちゃうとよいでしょう。 また画像も展開しますので img に width きっておくと、ブラウザ縮小ではありますがいい感じで表示できます。

textile13

できた文書は docbook や HTML にコンバートすることもできます。 docbook のほうが素直そうな感じでした。 残念ながら脚注とかは正確な docbook タグにはなっていないようでしたが XML ですので別系で加工すると面白いことが出来るかもです。

てなわけで、お手軽に wiki 記法でテキスト文書つくれてバージョン管理できますので、そんな環境をお探しの方は試してみるといいかもしれません。 😀