2014年10月26日日曜日

Dragomeをちょっと使ってみました

なんだか面白そうなDragomeというライブラリを発見したのでちょっと試してみました。

Dragome Web SDK


Takes your Java code to the web
http://www.dragome.com/


なんでもJavaでフロントエンドもかけるらしいのです。

サーバーサイドをJavaで書いている方々から
よくJavaScript書きたくないと言われるので...(ToT)

JSF以外の選択肢として使えるものかちょっと調べてみました。

プロジェクトの雛形を生成


$ mvn archetype:generate -DarchetypeGroupId=com.dragome -DarchetypeArtifactId=simple-webapp-archetype -DarchetypeVersion=1.0 -DgroupId=com.example -DartifactId=hello 
$ cd hello
$ ls
pom.xml src

そのままをコンパイルして実行


$ mvn compile
$ mvn jetty:run
ブラウザで http://localhost:8080/hello/hello-world.html を実行
おお何かでました。

Say hello!のボタンを押下すると

POSTが発生して text/plainのメッセージが帰って来ました。

どんな感じでコーディングするのでしょうか。。

htmlみると...


<html>
<head>
<script type="text/javascript" src="dragome/dragome.js"></script>
</head>

<body>
 Message:
 <b data-template="message">...</b>
 <br>
 <button data-template="button">Say hello!</button>
</body>

</html>
おおお、スッキリしてますね。
ボタンのイベントとその結果の貼り付けはJavaの方に書いてあるんでしょうね。

Javaのソースは..


$ cd src/main/java

$ tree
.
└── com
    └── example
        ├── gui
        │   └── HelloWorldPage.java
        └── service
            ├── HelloWorldService.java
            └── serverside
                └── HelloWolrdServiceImpl.java
↑Javaのソースは3つありますね。

com.example.service



HelloWorldServiceインターフェースを

package com.example.service;

import ... 省略 ...; @ServiceImplementation(HelloWolrdServiceImpl.class)
public interface HelloWorldService {
    public abstract String getGreetingsFor(String name);
}

serverside.HelloWolrdServiceImplで実装してるみたい

package com.example.service.serverside;

import java.util.Date;
import com.example.service.HelloWorldService;

public class HelloWolrdServiceImpl implements HelloWorldService {
    public String getGreetingsFor(String name) {
        return "Hello " + name + "! (" + new Date() + ")";
    }
}

@PageAliasをつけるのがhtml(View)に対応したcontroller(?)なのかな

aliasでhtmlファイル名を指定するみたい。
package com.example.gui;

import ... 省略 ...;

@PageAlias(alias = "hello-world")
public class HelloWorldPage extends DragomeVisualActivity {
    HelloWorldService helloWorldService = serviceFactory.createSyncService(HelloWorldService.class);

    public void build() {

        // <b data-template="message">
        final VisualLabel<String> label = new VisualLabelImpl<String>("message");

        // <button data-template="button">
        final VisualButton button = new VisualButtonImpl("button", new ClickListener() {
            public void clickPerformed(
          VisualComponent aVisualComponent) {

                label.setValue(
     helloWorldService.getGreetingsFor("World"));
            }
        });

        mainPanel.addChild(label);
        mainPanel.addChild(button);
    }
}

data-templateで与えた名前を...

<b data-template="message">...</b>

下記のように紐付けるみたい

final VisualLabel<String> label
    = new VisualLabelImpl<String>("message")

ボタンのイベントリスナーでサービスからの値を取得すると


final VisualButton button = new VisualButtonImpl("button", new ClickListener() {
 public void clickPerformed(VisualComponent aVisualComponent) {
  label.setValue(helloWorldService.getGreetingsFor("World"));
  }
});

AJaxになってサーバから値を取得してくれるみたいです。


すごいなぁ。

0 件のコメント:

コメントを投稿