diff --git a/3x5.js b/3x5.js index e64d133..d4f8d04 100644 --- a/3x5.js +++ b/3x5.js @@ -1,4 +1,35 @@ -const h1 = document.createElement("h1"); -h1.textContent = "Hello, World!"; +/** + * @typedef {object} Card - Basic unit of information, also an "actor" in the programming system + * @property {number} id Unique identifier + * @property {Record} fields Key-value properties on the card + * @property {string} code Eventually: a markdown string containing code, but for now, just code + */ -document.body.append(h1); +/** + * Global state: a single card + * @type {Card} + */ +let theCard = { + id: 100, + fields: {}, + code: ` + h1 Hello, World! + para [2 + 2] + block { + This is a paragraph of text, with one [b bold] word. Yes, this means there has to be some magic in text processing... + } + block -red "Beware!" + block Wait, how do we distinguish a \{\} long string (text to put in a block) from a code block (with commands whose output goes in a block?) + `, +}; + +const state = document.createElement("pre"); +const display = document.createElement("blockquote"); + +function render() { + state.textContent = JSON.stringify(theCard, null, 2); + display.innerHTML = "Rendering not implemented"; +} + +render(); +document.body.append(state, display);