NITRO

ELEMENTS

Nitrogen Elements – це двигун шаблонів HTML для мови Erlang, у якому всі HTML теги рендеряться з Erlang рекордів.

Працюючи з N2O вам взагалі не потрібно користуватись HTML. Натомість ви визначаєте вашу сторінку у вигляді Erlang рекордів, відповідно сторінка генерується, з перевіркою типів, під час компіляції. Це класичний підхід CGI для компільованих сторінок, який надає всі переваги перевірки помилок під час компіляції, та визначає DSL для клієнт- та серверного рендерингу.

Nitrogen Elements, за своєю природою, є примітивними UI елементами управління, які можуть бути використані для побудови Nitrogen сторінок з внутрішнім DSL Erlang-а. Вони компілюються в HTML та JavaScript. Поведінка всіх елементів контролюється на стороні сервера, а весь зв'язок між веб-переглядачем та сервером здійснюється за допомогою WebSocket каналів. Отже, вам не потрібно використовувати POST запити чи HTML форми. Тобто:

#textbox { id=userName, body= <<"Anonymous">> }, #panel { id=chatHistory, class=chat_history }

згенерує наступний html

<input value="Anonymous" id="userName" type="text"/> <div id="chatHistory" class="chat_history"></div>

Події

Nitrogen Actions – це двигун шаблонів JavaScript подій для мови Erlang, у якому всі події та обробники кнопок рендеряться з мови Erlang.

nitro:update(loginButton, #button{id=loginButton, body="Login",postback=login,source=[user,pass]});

Це згенерує наступний HTML:

<input value="Login" id="loginButton" type="button"/>

та JavaScript код:

qi('loginButton').outerHTML='<button id=\"loginButton\" type=\"button\">Login</button>';{var x=qi('loginButton'); x && x.addEventListener('click',function (event){ event.preventDefault(); { if (validateSources(['user','pass'])) { ws.send(enc(tuple(atom('pickle'),bin('loginButton'), bin('b840bca20b3295619d1157105e355880f850bf0223f2f081549dc 8934ecbcd3653f617bd96cc9b36b2e7a19d2d47fb8f9fbe32d3c768866 cb9d6d85700416edf47b9b90742b0632c750a4240a62dfc56789e0f5d8 590f9afdfb31f35fbab1563ec54fcb17a8e3bad463218d6402f1304'), [tuple(tuple(string('loginButton'),bin('detail')),[]), tuple(atom('user'),querySource('user')), tuple(atom('pass'),querySource('pass'))]))); } else console.log('Validation Error'); }});};

РЕНДЕРИНГ

  • wf_render — Render двигун для елементів та подій
  • wf_event — Рендерер для JavaScript подій postback
  • wf_tags — Рендерер HTML5 XML

СПЕЦИФІКАЦІЯ

NITRO підтримує стрімінг попередньо відрендерених форм через WebSocket та MQTT, та надає JavaScript бібліотеку невеличкого розміру для роботи з моделлю документа. Ця бібліотека зберігає сумістність для різних імплементацій.

NITRO:
-spec render(list(#element{})) -> binary(). -spec wire(list(#action{})) -> []. -spec insert_top(atom(), list(#element{})) -> []. -spec insert_bottom(atom(), list(#element{})) -> []. -spec update(atom(), list(#element{})) -> []. -spec clear(atom()) -> []. -spec remove(atom()) -> []. -record(init, { token = [] :: [] | binary() }). -record(pickle, { source = [], pickled=[], args=[] }). -record(flush, { data = [] :: [] | term() }). -record(direct, { data = [] :: [] | term() }). -record(ev, { module = [] :: [] | atom(), msg = [] :: [] | term(), trigger= [] :: [] | atom() | binary(), name = [] :: [] | atom() | binary() }).