nitro api

man/nitro.htm

@@ -35,7 +35,7 @@
         <h3>API</h3>
         <h4>q(atom()) -> term().</h4>
         <p>Retrieves from process dictionary by atom-key the value of client DOM element
-           passed by over the network as <b>#ev</b> parameter</p>
+           passed by over the network in <b>#ev</b> record as a part of <b>#pickle</b> message.</p>
         <figure><code> event(click) -> io:format("~p~n",[nitro:q(:name)]);</code></figure>
         <h4>jse([] | binary()) -> [] | binary().</h4>
         <p>Performs JavaScript escaping for eval compatibility.</p>
@@ -87,20 +87,67 @@
  &gt; iolist_to_binary(nitro:render(setelement(1,#element{},tag))).
  &lt;&lt;"&lt;tag&gt;&lt;/tag&gt;"&gt;&gt;</code></figure>
         <h4>insert_top(atom(), list(#element{})) -> [].</h4>
+        <p>Wires a JavaScript for adding the NITRO element as a first child of a given DOM id at the client.</p>
+        <figure><code> > nitro:insert_top(panel,#button{}).
+ []
+ > nitro:actions().
+ [#wire{ancestor = action,trigger = [],target = [],
+        module = action_wire,
+        actions = "qi('panel').insertBefore((function(){var div = qn('div');
+                   div.innerHTML = '&lt;button type=\"button\"&gt;&lt;/button&gt;';
+                   return div.firstChild; })(),qi('panel').firstChild);",
+        source = []}]
+ > rp(iolist_to_binary(nitro:render(nitro:actions()))).
+ &lt;&lt;"qi('panel').insertBefore((function(){var div
+ = qn('div'); div.innerHTML = '&lt;button type=\"button\"&gt;&lt;/button&gt;';
+ return div.firstChild; })(),qi('panel').firstChild);"&gt;&gt;
+ ok</code></figure>
         <h4>insert_bottom(atom(), list(#element{})) -> [].</h4>
+        <p>Wires a JavaScript for adding the NITRO element as a last child of a given DOM id at the client.</p>
+        <figure><code> > nitro:insert_bottom(panel,#button{}).
+ > rp(iolist_to_binary(nitro:render(nitro:actions()))).
+ &lt;&lt;"(function(){ var div = qn('div'); div.innerHTML =
+ '&lt;button type=\"button\"&gt;&lt;/button&gt;';qi('panel')
+ .appendChild(div.firstChild); })();"&gt;&gt;
+ ok</code></figure>
         <h4>update(atom(), list(#element{})) -> [].</h4>
+        <p>Wires a JavaScript for updating the DOM element at the client by the render of a given NITRO element.</p>
+        <figure><code> > nitro:update(panel,#button{}).
+ []
+ > rp(iolist_to_binary(nitro:render(nitro:actions()))).
+ &lt;&lt;"qi('panel').outerHTML='&lt;button type=\"button\"&lt;&gt;/button>';"&gt;&gt;
+ ok</code></figure>
         <h4>clear(atom()) -> [].</h4>
+        <p>Wires a JavaScript that clear at the client all the children of a given DOM element id.</p>
+        <figure><code> > nitro:clear(panel).
+ []
+ > rp(iolist_to_binary(nitro:render(nitro:actions()))).
+ &lt;&lt;"var x = qi('panel'); while (x.firstChild) x.removeChild(x.firstChild);""&gt;&gt;
+ ok</code></figure>
         <h4>remove(atom()) -> [].</h4>
-         <p>Wires a JavaScript to the process dictionary that manipulate
-            DOM elements tree directly on a client side.</p>
+        <p>Wires a JavaScript that remove particular DOM element from the tree at the client.</p>
+        <figure><code> > nitro:remove(panel).
+ []
+ > rp(iolist_to_binary(nitro:render(nitro:actions()))).
+ &lt;&lt;"var x=qi('panel'); x && x.parentNode.removeChild(x);"&gt;&gt;
+ ok</code></figure>
         <h4>display(atom(),atom()) -> [].</h4>
+        <p>Wires a JavaScript that remove particular DOM element from the tree at the client.</p>
+        <figure><code> > nitro:display(panel,none).
+ []
+ > rp(iolist_to_binary(nitro:render(nitro:actions()))).
+ &lt;&lt;"{ var x = qi('panel'); if (x) x.style.display = 'none'; }"&gt;&gt;
+ ok</code></figure>
          <p>Wires a JavaScript that manipulate <b>style</b> field of a given DOM element.</p>
         <h4>compact(term()) -> binary().</h4>
          <p>Pretty-prints the term into more compact format to display by a recursive cut
             the tuples with no more that 9 elements width.</p>
         <figure><code> &gt; iolist_to_binary(nitro:compact({1,2,3,4,5,{1,2,3,4},7,8,9,10,11})).
- &lt;&lt;"{1,2,3,4,5,{1,2,3,4},7,8,9}"&gt;&gt;</code></section>
+ &lt;&lt;"{1,2,3,4,5,{1,2,3,4},7,8,9}"&gt;&gt;</code>
+ <br/>
+ <br/>
     </section>
+    
 </main>
 <footer> 2005—2019 © Synrc Research Center </footer>
 <script>function drop(){document.getElementById("dropdown").classList.toggle("show");}</script>