diff --git a/index.html b/index.html
index d6d4439..7b0365b 100644
--- a/index.html
+++ b/index.html
@@ -7,7 +7,7 @@
json as html
-
+
diff --git a/js/demo.mjs b/js/demo.mjs
new file mode 100644
index 0000000..43ad7ff
--- /dev/null
+++ b/js/demo.mjs
@@ -0,0 +1,32 @@
+import { json_as_html } from "/js/export.mjs";
+
+
+
+const demo = [
+ "div",
+ [
+ ["id", "wrapper"],
+ ["class", "demo_div"],
+ ],
+ [
+ ["h1", [], "header :)"],
+ ["p", [], "paragraph! meow"],
+ ["p", [], "another paragraph!! this is so cool"],
+ state => ["button", [
+ ["onclick", _ => {
+ state.set("clicked", true);
+ render();
+ }]
+ ], "it can even do buttons!"],
+ state => ["p", [], state.get("clicked") ? "clicked" : "not clicked"],
+ ],
+];
+
+const state = new Map();
+
+function render () {
+ document.body.innerHTML = "";
+ document.body.appendChild(json_as_html(demo, state));
+}
+
+render();
diff --git a/js/main.mjs b/js/export.mjs
similarity index 60%
rename from js/main.mjs
rename to js/export.mjs
index 1b1c0c6..1db5160 100644
--- a/js/main.mjs
+++ b/js/export.mjs
@@ -2,7 +2,7 @@ function use_as_array (val) {
return Array.isArray(val) ? val : [val];
}
-function json_as_html (json, state = new Map()) {
+export function json_as_html (json, state = new Map()) {
if (json instanceof Node) {
return json;
}
@@ -32,34 +32,3 @@ function json_as_html (json, state = new Map()) {
return elem;
}
-
-
-
-const demo = [
- "div",
- [
- ["id", "wrapper"],
- ["class", "demo_div"],
- ],
- [
- ["h1", [], "header :)"],
- ["p", [], "paragraph! meow"],
- ["p", [], "another paragraph!! this is so cool"],
- state => ["button", [
- ["onclick", _ => {
- state.set("clicked", true);
- render();
- }]
- ], "it can even do buttons!"],
- state => ["p", [], state.get("clicked") ? "clicked" : "not clicked"],
- ],
-];
-
-const state = new Map();
-
-function render () {
- document.body.innerHTML = "";
- document.body.appendChild(json_as_html(demo, state));
-}
-
-render();