Revise

Author: Tao-VanJS

demo.html

@@ -693,7 +693,7 @@ <h1 class="w3-padding-16 w3-xxxlarge">
     () =&gt; div(pre(code({class: "language-js"}, domCode.val))),
   )
 }
-</code></pre><p>You can try it out with <a href="/convert" class="w3-hover-opacity">this link</a>.</p><h2 class="w3-xxlarge w3-text-red" id="jupyter-like-javascript-console"><a class="self-link" href="#jupyter-like-javascript-console">Jupyter-like JavaScript Console</a></h2><hr style="width:50px;border:5px solid red" class="w3-round"><p>Next up, we're going to demonstrate a simplified Jupyter-like JavaScript console implemented in <b>~100 lines</b> of code with <b>VanJS</b>. The JavaScript console supports drawing tables (with the technique similar to <a href="#table-viewer" class="w3-hover-opacity">Table Viewer</a>), inspecting objects in a tree view (with the technique similar to <a href="#json-inspector" class="w3-hover-opacity">Json Inspector</a>) and plotting (with the integration of <a href="https://developers.google.com/chart" class="w3-hover-opacity">Google Charts</a>).</p><p>Here is the implementation:</p><pre><code class="language-js">const toDataArray = data =&gt; {
+</code></pre><p>You can try it out <a href="/convert" class="w3-hover-opacity">here</a>.</p><h2 class="w3-xxlarge w3-text-red" id="jupyter-like-javascript-console"><a class="self-link" href="#jupyter-like-javascript-console">Jupyter-like JavaScript Console</a></h2><hr style="width:50px;border:5px solid red" class="w3-round"><p>Next up, we're going to demonstrate a simplified Jupyter-like JavaScript console implemented in <b>~100 lines</b> of code with <b>VanJS</b>. The JavaScript console supports drawing tables (with the technique similar to <a href="#table-viewer" class="w3-hover-opacity">Table Viewer</a>), inspecting objects in a tree view (with the technique similar to <a href="#json-inspector" class="w3-hover-opacity">Json Inspector</a>) and plotting (with the integration of <a href="https://developers.google.com/chart" class="w3-hover-opacity">Google Charts</a>).</p><p>Here is the implementation:</p><pre><code class="language-js">const toDataArray = data =&gt; {
   const hasPrimitive = !data.every(r =&gt; typeof r === "object")
   const keys = [...new Set(
     data.flatMap(r =&gt; typeof r === "object" ? Object.keys(r) : []))]

demo/index.html

@@ -693,7 +693,7 @@ <h1 class="w3-padding-16 w3-xxxlarge">
     () =&gt; div(pre(code({class: "language-js"}, domCode.val))),
   )
 }
-</code></pre><p>You can try it out with <a href="/convert" class="w3-hover-opacity">this link</a>.</p><h2 class="w3-xxlarge w3-text-red" id="jupyter-like-javascript-console"><a class="self-link" href="#jupyter-like-javascript-console">Jupyter-like JavaScript Console</a></h2><hr style="width:50px;border:5px solid red" class="w3-round"><p>Next up, we're going to demonstrate a simplified Jupyter-like JavaScript console implemented in <b>~100 lines</b> of code with <b>VanJS</b>. The JavaScript console supports drawing tables (with the technique similar to <a href="#table-viewer" class="w3-hover-opacity">Table Viewer</a>), inspecting objects in a tree view (with the technique similar to <a href="#json-inspector" class="w3-hover-opacity">Json Inspector</a>) and plotting (with the integration of <a href="https://developers.google.com/chart" class="w3-hover-opacity">Google Charts</a>).</p><p>Here is the implementation:</p><pre><code class="language-js">const toDataArray = data =&gt; {
+</code></pre><p>You can try it out <a href="/convert" class="w3-hover-opacity">here</a>.</p><h2 class="w3-xxlarge w3-text-red" id="jupyter-like-javascript-console"><a class="self-link" href="#jupyter-like-javascript-console">Jupyter-like JavaScript Console</a></h2><hr style="width:50px;border:5px solid red" class="w3-round"><p>Next up, we're going to demonstrate a simplified Jupyter-like JavaScript console implemented in <b>~100 lines</b> of code with <b>VanJS</b>. The JavaScript console supports drawing tables (with the technique similar to <a href="#table-viewer" class="w3-hover-opacity">Table Viewer</a>), inspecting objects in a tree view (with the technique similar to <a href="#json-inspector" class="w3-hover-opacity">Json Inspector</a>) and plotting (with the integration of <a href="https://developers.google.com/chart" class="w3-hover-opacity">Google Charts</a>).</p><p>Here is the implementation:</p><pre><code class="language-js">const toDataArray = data =&gt; {
   const hasPrimitive = !data.every(r =&gt; typeof r === "object")
   const keys = [...new Set(
     data.flatMap(r =&gt; typeof r === "object" ? Object.keys(r) : []))]

sitegen/demo.ts

@@ -364,7 +364,7 @@ const TodoList = () => {
     H2("HTML to VanJS Code Converter"),
     p("The converter that converts HTML snippet to ", VanJS(), " code, is also implemented with ", VanJS(), ":"),
     JsFile("convert.code.js"),
-    p("You can try it out with ", Link("this link", "/convert"), "."),
+    p("You can try it out ", Link("here", "/convert"), "."),
     H2("Jupyter-like JavaScript Console"),
     p("Next up, we're going to demonstrate a simplified Jupyter-like JavaScript console implemented in ", b("~100 lines"), " of code with ", VanJS(), ". The JavaScript console supports drawing tables (with the technique similar to ", Link("Table Viewer", "#table-viewer"), "), inspecting objects in a tree view (with the technique similar to ", Link("Json Inspector", "#json-inspector") , ") and plotting (with the integration of ", Link("Google Charts", "https://developers.google.com/chart"), ")."),
     p("Here is the implementation:"),