<script type="module"><![CDATA[
import Bedstead from './bedstead.js';
function update_glyph() {
+ var args = [];
+ for (var row of document.getElementById("pixels").rows) {
+ var arg = 0;
+ for (var pixel of row.getElementsByTagName('input')) {
+ arg *= 2;
+ if (pixel.checked) {
+ arg += 1
+ }
+ }
+ args.push(arg.toString())
+ }
Bedstead({
- arguments: document.getElementById("input").value.split(" "),
+ arguments: args,
print: function(charstring) {
document.getElementById("output").textContent = charstring;
document.getElementById("rendered")
}
});
}
- document.getElementById("run").onclick = update_glyph;
+ for (var e of document.getElementsByTagName('input')) {
+ e.onchange = update_glyph;
+ }
]]>
</script>
</head>
<body>
<form>
- <label for="input">Input</label>
- <input type="text" id="input"/>
- <input type="button" id="run" value="Run!"/>
+ <table id="pixels">
+ <tr>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ <td><input type="checkbox"/></td>
+ </tr>
+ </table>
</form>
<p><code id="output"></code></p>
<div>