diff --git a/css/main.css b/css/main.css
new file mode 100644
index 0000000..a050a20
--- /dev/null
+++ b/css/main.css
@@ -0,0 +1,34 @@
+:root {
+ font-family: sans-serif;
+}
+
+.block {
+ padding: 2px;
+ margin: 2px;
+ display: flex;
+ flex-wrap: wrap;
+ max-width: 250px;
+ align-items: center;
+ border: solid rgba(32,32,32,0.5) 2px;
+ background: rgb(200,200,200);
+}
+
+.op-40 {
+ margin-top: 0;
+ margin-bottom: 0;
+}
+
+.op-91 {
+ border-radius: 10px;
+}
+
+.op-123 {
+ display: block;
+ background: rgb(225,225,225);
+}
+
+.op-nil {
+ font-family: monospace;
+ background: rgb(255,255,255);
+ max-width: none;
+}
\ No newline at end of file
diff --git a/index.html b/index.html
index 689e2bb..e1df2a7 100644
--- a/index.html
+++ b/index.html
@@ -2,6 +2,7 @@
+
diff --git a/js/index.mjs b/js/index.mjs
index 8e98135..6874e25 100644
--- a/js/index.mjs
+++ b/js/index.mjs
@@ -1,5 +1,6 @@
import { unparser } from "./unparser.mjs";
-import { parser, runner } from "./parser.mjs";
+import { parser, runner, openers } from "./parser.mjs";
+import objs from "./objs.mjs";
let data = parser(`
on(
@@ -13,16 +14,35 @@ let data = parser(`
)
`);
-console.log(unparser(data));
-console.log(unparser(parser(unparser(data))));
-
(async function () {
await runner(data, objs);
- let ev = new Event('start');
+ let ev = new Event('start'); // TODO: more events
objs.events.dispatchEvent(ev);
+
+ createBlocks(data);
})()
-function createBlock() {
+async function createBlocks(dat) {
+ let args = dat.args;
+ if (!args || !args[0]) args = [dat.args];
+ if (!args || !args[0]) args = [];
+ for (let i in args) {
+ args[i] = await createBlocks(args[i])
+ }
-}
\ No newline at end of file
+ let o = dat.op ? dat.op.charCodeAt() : 'nil';
+
+ let div = document.createElement('div');
+ div.classList.add(`op-${o}`)
+ div.classList.add(`block-${dat.context}`)
+ div.classList.add(`block`)
+ div.textContent = dat.str || dat.context;
+ document.body.appendChild(div);
+
+ for (let arg of args) {
+ if (arg) div.appendChild(arg);
+ }
+
+ return div;
+}
diff --git a/js/objs.mjs b/js/objs.mjs
index ada1c55..f1f8669 100644
--- a/js/objs.mjs
+++ b/js/objs.mjs
@@ -13,7 +13,7 @@ let add = async function (input, objects) {
let events = new EventTarget();
-export {
+export default {
on,
events,
echo,
diff --git a/js/parser.mjs b/js/parser.mjs
index 6e2ad7a..8028499 100644
--- a/js/parser.mjs
+++ b/js/parser.mjs
@@ -1,9 +1,11 @@
//import objs from './objs.mjs';
let openers = {
- '{': '}',
- '[': ']',
- '(': ')'
+ '{': '}', // function
+ '[': ']', // string
+ '(': ')', // group
+
+ // TODO: dropdowns, custom blocks
};
function parser(str, context = '(') {