HTML
リソース(/WEB-INF/html/tutorial3.html)
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns:java="http://hoeppe.the-ninja.jp/">
<body>
<div>hello world</div>
<div java:canvas="canvas"></div>
</body>
</html>
Java
package org.ruler.markup.tutorial;
import org.ruler.markup.api.Canvas;
import org.ruler.markup.api.Http;
import org.ruler.markup.api.Mount;
import org.ruler.markup.api.Page;
import org.ruler.markup.api.Source;
@Mount(path="/tutorial3.html")
@Source(file="/WEB-INF/html/tutorial3.html")
public class Tutorial3 extends Page {
//@Source(id="canvas") // if class field name is not same HTML id.
@Source
Canvas canvas = (node) -> {
node.attr("style", "color:ff0000;");
node.text("this node was rewrited");
};
@Override
public void action(Http http) {
http.GET = (e) -> {
Page page = this;
page.draw(e);
};
}
}
実行
出力[結果]
<?xml version="1.0" encoding="UTF-8"?>
<html>
<body>
<div>hello world</div>
<div java:canvas="canvas" style="color:ff0000;">this node was rewrited</div>
<body>
</html>
説明
HTMLの一部(<div id="canvas"></div>)を動的に生成します。
Canvasクラスのフィールドに添付されたアノテーション@Source(id="xxx")と、
HTMLの属性(id)が一致するXML/HTMLタグが動的に生成される領域となります。
イベントリスナー(Canvas)に引数として渡されるNodeインスタンスをDOM Treeとして
操作することで、タグ・属性・子ノードを変更・追加することができます。