GWT (昨日の続き)
とゆー事で、プロジェクトを実行するを見つつ試験。
rails ってカテゴリ付いてるんですが、いつになるのかは不明だなぁ。とりあえずプロジェクトを作成した時点でサンプルが動作可能な状態になっているとの事にて動かしてみる。
メニューバーの Run → Run を選択。Create, manage, and run configuration という標題の付いたダイアログが出現。左側の一覧から「Gwt Application」を選択しておいて、その上部にあるアイコン群の一番左の「New launch configuration」をクリック、と。
画面右側に出てきた Project および Module をボタンを使って選択、との事。Project は Browse ボタンでプロジェクトの一覧が出てくるので選択して OK クリック。Module も同様に一覧が出てくるので選択後に OK か。ダブルクリックでも良いようだ。
で、Apply して Run すれば良いとの事にて、えいや、っと実行。
なんかウィンドウが出てきた。タイトルバーには Google Web Toolkit Development SHell / Port 8888 となってて、次にブラウザっぽいナニが出現。タイトルバーは Wrapper HTML for MyGWT ってなってますな。ハードコピィ取ってここにのっけりゃ良いのでしょうが、試験してる端末が別なんで略。(を
Click me というボタンがありますがクリックしたら何か出てくるんだろな。資料によるとボタン右に文字が出てくるとの事。一応正常動作している模様。
html ソースは以下のような感じ。
<html>
<head>
<!-- -->
<!-- Any title is fine -->
<!-- -->
<title>Wrapper HTML for MyGWT</title>
<!-- -->
<!-- Use normal html, such as style -->
<!-- -->
<style>
body,td,a,div,.p{font-family:arial,sans-serif}
div,td{color:#000000}
a:link,.w,.w a:link{color:#0000cc}
a:visited{color:#551a8b}
a:active{color:#ff0000}
</style>
<!-- -->
<!-- The module reference below is the link -->
<!-- between html and your Web Toolkit module -->
<!-- -->
<meta name='gwt:module' content='jp.yamanetoshi.MyGWT'>
</head>
<!-- -->
<!-- The body can have arbitrary html, or -->
<!-- you can leave the body empty if you want -->
<!-- to create a completely dynamic ui -->
<!-- -->
<body>
<!-- -->
<!-- This script is required bootstrap stuff. -->
<!-- You can put it in the HEAD, but startup -->
<!-- is slightly faster if you include it here. -->
<!-- -->
<script language="javascript" src="gwt.js"></script>
<!-- OPTIONAL: include this if you want history support -->
<iframe id="__gwt_historyFrame" style="width:0;height:0;border:0"></iframe>
<h1>MyGWT</h1>
<p>
This is an example of a host page for the MyGWT application.
You can attach a Web Toolkit module to any HTML page you like,
making it easy to add bits of AJAX functionality to existing pages
without starting from scratch.
</p>
<table align=center>
<tr>
<td id="slot1"></td><td id="slot2"></td>
</tr>
</table>
</body>
</html>slot1 がボタンで slot2 がクリックした後に出てくるテキストかな。基本的にこのサンプルはサーバとの通信はしていない、と見た (類推
あと、ポイント高そうな箇所は
head ん中の
<meta name='gwt:module' content='jp.yamanetoshi.MyGWT'>
と
body の最初らへんの
<script language="javascript" src="gwt.js"></script>
<!-- OPTIONAL: include this if you want history support -->
<iframe id="__gwt_historyFrame" style="width:0;height:0;border:0"></iframe>か。下の方はコメントにもある通り、戻るだ進むだ、なナニっぽい。(類推
で、試験の終了は出てきた二つのウィンドウを閉じれば良いのかなぁ。
続き
動作を確認した後に、Project Explorer をほぢくり回したのですが、どこを見ても js なナニが無い。しかもこのエントリで使ってるコンテンツはサーバとのやりとりにまでは至っていない (紹介記事なんで仕方無し)、ってコトで @IT の記事 (JavaをJavaScriptに変換するグーグルのツールを使ってみよう) を開いて見回しておりますと、GWT の動作環境とゆーか_実行形態_に関する記述が。
その1つは“ホステッドモード”です。製品構成で触れましたが、GWTにはホステッドWebブラウザというツールが含まれており、これを使用してJavaバイトコードの状態でアプリケーションを実行するモードがホステッドモードです。
もう1つは“Webモード”です。こちらは、GWTコンパイラにより翻訳された状態、ピュアなJavaScriptアプリケーションとして実行することを意味します。なお、GWTコンパイラが出力するJavaScriptアプリケーションは、JavaScriptファイル（*.js）ではなく、HTML ファイルとXMLファイルの姿に変換されます。
eclipse 上では_ホステッドモード_で動作してるんだろな、多分。記事に目を通すのも、ですが GWT の中にあるサンプル
- DynaTable
- Hello
- I18N
- JSON
- KitchenSink
- SimpleXML
の中身をほぢくり返す方が早そげ。
追記
rails ってカテゴリは微妙だなぁ。
