31:[] 2f:{"title":"Basic calculator example","cells":[{"id":0,"value":"md`# Basic calculator example\n\nHow do you use multiple momentary inputs to create one output? Here's an example using a few tricks.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":5,"value":"viewof x = {\n let ui = html`${(new Array(10).fill(0).map((_, i) => ``)).join('')}`;\n ui.appendChild(html``);\n ui.appendChild(html``);\n ui.appendChild(html``);\n ui.appendChild(html``);\n ui.appendChild(html``);\n ui.addEventListener('click', e => {\n ui.value = e.target.value;\n ui.dispatchEvent(new CustomEvent('input'));\n })\n ui.appendChild(html``);\n return ui;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":53,"value":"{\n let stack = [''];\n for (let i of interactions) {\n if (i.match(/[0-9\\.]/)) {\n stack[stack.length - 1] += i;\n } else {\n stack.push(i, '');\n }\n }\n let res = 0;\n let op = '';\n let steps = [];\n for (let s of stack) {\n if (s.match(/[0-9\\.]/)) {\n let val = parseFloat(s);\n switch (op) {\n case '': res = parseFloat(val); break;\n case '+': res = res + val; break;\n case '-': res = res - parseFloat(val); break;\n }\n } else {\n op = s;\n }\n }\n return html`

${stack.map(s => s.padStart(10, ' ')).join('\\n')}\\n----------\\n${res.toString().padStart(10, ' ')}

`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":99,"value":"md`Authors note here:\n\n'this' holds the previous value of a cell. So how this one works is that, the first time it runs, this is undefined. The cell runs every time that the value of 'x' is updated by the generator above. So for each successive cell run, it appends x to the array - unless it sees a 'clear' value, in which case it clears the input.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"interactions = {\n let inputs = this || [];\n if (x === 'clear') return [];\n if (x === 'delete') return inputs.slice(0, -1);\n inputs.push(x);\n return inputs.filter(i => i !== undefined);\n}","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}