derw-lang/js/index.mjs

import { unparser } from "./unparser.mjs";
import { parser, runner, openers } from "./parser.mjs";
import objsI from "./objs.mjs";

let data = parser(`
    on(
        [compile]
        {   
            echo(add([2][3]))
            echo([Hello World!])
            echo(add([2][3]))
            echo([Hello World!])
        }
    )
`);

async function runWrap() {
    let objs = Object.assign({}, objsI);
    objs.events = new EventTarget();
    await runner(data, objs);
    let ev = new Event('compile'); // TODO: more events

    objs.events.dispatchEvent(ev);
}

let clickedBlock = false;
let clickedArea = false;
let bodyThing = document.body;

async function createBlocks(dat, parent = bodyThing) {
    let args = Object.assign([], 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])
    }

    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;
    parent.appendChild(div);

    if (dat.op == '{') {
        //todo: clean
        let button = document.createElement('div');
        button.classList.add(`block`)
        button.classList.add(`block-push`)
        button.textContent = 'push a block';
        div.appendChild(button)

        button.onclick = function() {
            dat.args.push(parser(`comment([placeholder])`));
            bodyThing.innerHTML = '';

            createBlocks(data);
        }

        button = document.createElement('div');
        button.classList.add(`block`)
        button.classList.add(`block-pop`)
        button.textContent = 'pop a block';
        div.appendChild(button)

        button.onclick = function() {
            dat.args.pop();

            bodyThing.innerHTML = '';

            createBlocks(data);
        }
    }

    for (let arg of args) {
        if (arg) div.appendChild(arg);
    }

    div.onclick = function (e) {
        if (clickedBlock) {
            if (clickedArea != dat) {
                let next1 = clickedBlock.nextSibling;
                let next2 = div.nextSibling;

                let p = clickedBlock.parentElement;
                div.parentElement.insertBefore(clickedBlock, next2);
                p.insertBefore(div, next1);

                let swap = {};
                console.log(clickedArea, dat)
                Object.assign(swap, clickedArea);
                Object.assign(clickedArea, dat);
                Object.assign(dat, swap);
            }

            runWrap();

            clickedBlock = false;
            clickedArea = false;
        } else {
            clickedBlock = div;
            clickedArea = dat;
        }
        e.stopPropagation();
    }

    return div;
}

runWrap();
createBlocks(data);