Nitrogen 学习过程实录（10）

 

5、动态网页的写法

写Nitrogen应用程序，主要的、甚至绝大部分的工作是写动态网页。

动态网页就是程序模块，即.erl文件。以下是一个例程（文件是/nitrogen/Quickstart/src/samples/web_samples_postback.erl）：

-module (web_samples_postback).

-include ("wf.inc").

-compile(export_all).

main() -> #template { file="./wwwroot/onecolumn.html", bindings=[

  {'Group', learn},

  {'Item', samples}

]}.

%% 本模块生成的动态内容，揉进模板file，生成网页。bindings的用途，没弄明白。

title() -> "Postbacks".

headline() -> "Postbacks".

right() -> linecount:render().

%% 这三个函数和下面的body()，是网页模板填空时用的，查看/wwwroot/onecolumn.html就全明白了。

body() -> [  

  #p{},

  #button { text="Press Me", postback=button_pressed },

  #p{},

  #link { text="Click Me", postback=link_clicked },

  #p{},  

  #label { text="Press enter in the textbox." },

  #textbox { text="This is a message...", postback=textbox_enterkey },

  #p{},

  #checkbox { text="Toggle Me", postback=checkbox_clicked },

  #p{},  

  #dropdown { postback=dropdown_changed, options=[

    #option { text="Option 1" },

    #option { text="Option 2" },

    #option { text="Option 3" }

  ]},

  #p{},  

  #span { text="Mouse Over Me", actions=#event { type=mouseover, postback=span_mousedover } }

].  

%% 这个函数返回一个列表，列表成员是记录，代表着HTML元素，如#p{}表示<p>。

%% 这些记录的定义，在wf.inc。

event(EventInfo) ->

  wf:wire(#alert { text=wf:f("~p", [EventInfo]) }),

  ok.

这是Nitrogen最难弄懂的东西。

查看文件/nitrogen/src/wf.erl

wire(Actions) -> wf_render:wire(Actions).

再查看文件/nitrogen/src/lib/wf_render.erl

wire(Actions) -> 

wire(me, me, Actions).

wire(TriggerPath, Actions) ->

wire(TriggerPath, TriggerPath, Actions).

wire(TriggerPath, TargetPath, Actions) ->

% Add to the queue of wired actions. These will be rendered in get_script().

ActionQueue = get(wf_action_queue),

put(wf_action_queue, [{TriggerPath, TargetPath, Actions}|ActionQueue]),

ok.

本例执行第3子句。从字面意思猜测，这个函数的任务是取得“事件队列”，并把新事件送入其中。

事件由系统自动处理。