Show/allow editing of "Logo" program in a textarea.
Chris Pressey
2 years ago
| 3 | 3 | */ |
| 4 | 4 | |
| 5 | 5 | function launch(config) { |
| 6 | var div=DAM.maker('div'), button=DAM.maker('button'), canvas=DAM.maker('canvas'); | |
| 6 | var div=DAM.maker('div'), button=DAM.maker('button'), textarea=DAM.maker('textarea'), canvas=DAM.maker('canvas'); | |
| 7 | 7 | |
| 8 | 8 | var can = canvas({ width: 1000, height: 400 }); |
| 9 | 9 | config.container.appendChild(can); |
| 23 | 23 | value: "seterr 0 0 setxyp 0.125 0.5 lt 90 repeat 7 [ repeat 4500 [ fd 1.0 lt 4 ] shiftxyp 0.125 0.0 shifterr 0.00375 0.05 ]" |
| 24 | 24 | }, |
| 25 | 25 | { |
| 26 | text: 'Stars', | |
| 27 | value: "seterr 0 0 setxyp 0.125 0.666 lt 90 lt 18 repeat 7 [ repeat 500 [ fd 150 lt 144 ] shiftxyp 0.125 0.0 shifterr 0.00375 0.3 ]" | |
| 28 | }, | |
| 29 | { | |
| 26 | 30 | text: 'Circle Chain', |
| 27 | 31 | value: "seterr 0 0 setxyp 1.0 0.5 lt 90 repeat 7 [ repeat 1845 [ fd 2.0 lt 4 ] lt 180 shifterr 0.00375 0.225 ] repeat 7 [ repeat 1845 [ fd 2.0 lt 4 ] lt 180 shifterr -0.00375 -0.225 ]" |
| 28 | 32 | } |
| 37 | 41 | interpretInstrs(i, turtle); |
| 38 | 42 | } |
| 39 | 43 | |
| 40 | run(); | |
| 41 | ||
| 44 | var programTextarea = textarea({ rows: 4, cols: 80 }, program); | |
| 42 | 45 | var controlPanel = div( |
| 43 | 46 | div( |
| 44 | 47 | DAM.makeSelect({ |
| 46 | 49 | options: options, |
| 47 | 50 | onchange: function(option) { |
| 48 | 51 | program = option.value; |
| 52 | programTextarea.innerHTML = program; | |
| 49 | 53 | run(); |
| 50 | 54 | } |
| 51 | 55 | }) |
| 52 | 56 | ), |
| 53 | 57 | div( |
| 54 | button("Re-roll", { onclick: function() { run(); }}) | |
| 58 | programTextarea, | |
| 59 | ), | |
| 60 | div( | |
| 61 | button("Run", { | |
| 62 | onclick: function() { | |
| 63 | program = programTextarea.value; | |
| 64 | program = run(); | |
| 65 | } | |
| 66 | }) | |
| 55 | 67 | ) |
| 56 | 68 | ); |
| 57 | 69 | config.container.appendChild(controlPanel); |
| 70 | ||
| 71 | run(); | |
| 58 | 72 | } |