diff options
| -rw-r--r-- | index.html | 13 | ||||
| -rw-r--r-- | js/app.js | 31 | ||||
| -rw-r--r-- | js/shader.js | 7 |
3 files changed, 41 insertions, 10 deletions
@@ -24,12 +24,23 @@ body.grid .focused { box-shadow: inset 0 0 2px white, inset 0 0 2px white, inset <span id="text_el" class="tool">text</span> brush size: <span id="width_el" class="ed">5</span> x <span id="height_el" class="ed">5</span> + canvas size: <span id="canvas_width_el" class="ed">5</span> x <span id="canvas_height_el" class="ed">5</span> </div> </div> </body> - +<script type="text/javascript-shader" id="demo_shader"> + if (x > y || y > x + 20 || x > y / 4 + 10) { + lex.clear() + } + else { + lex.bg = x+y*y + lex.fg = (x+y)%2 + lex.char = ":" + } +</script> <script src="js/lex.js"></script> <script src="js/matrix.js"></script> <script src="js/tool.js"></script> +<script src="js/shader.js"></script> <script src="js/app.js"></script> @@ -22,14 +22,9 @@ function init () { function build () { canvas = new Matrix (cols, rows, function(x,y){ var lex = new Lex (x,y) - if (x > y || y > x + 20 || x > y / 4 + 10) { - lex.clear() - } - else { - lex.bg = x+y*y - lex.fg = (x+y)%2 - lex.char = ":" - } + // + shader(lex, x, y) + // lex.build() return lex }) @@ -90,6 +85,8 @@ function build () { controls.width = new Lex (width_el) controls.height = new Lex (height_el) + controls.canvas_width = new Lex (canvas_width_el) + controls.canvas_height = new Lex (canvas_height_el) controls.circle.focus() @@ -144,7 +141,7 @@ function bind () { dragging = erasing = false }); - [controls.width, controls.height].forEach(function(lex){ + [controls.width, controls.height, controls.canvas_width, controls.canvas_height].forEach(function(lex){ lex.span.addEventListener('mousedown', function(e){ lex.focus() }) @@ -170,6 +167,22 @@ function bind () { brush.h = n brush.rebuild() }) + + controls.canvas_width.key = int_key(function(n, keyCode){ + controls.canvas_width.blur() + controls.canvas_width.char = ""+n + controls.canvas_width.build() + brush.w = n + brush.rebuild() + }) + controls.canvas_height.key = int_key(function(n, keyCode){ + controls.canvas_height.blur() + controls.canvas_height.char = ""+n + controls.canvas_height.build() + brush.h = n + brush.rebuild() + }) + window.addEventListener('keydown', function(e){ if (! e.metaKey && ! e.ctrlKey && ! e.altKey) { e.preventDefault() diff --git a/js/shader.js b/js/shader.js new file mode 100644 index 0000000..a6937b7 --- /dev/null +++ b/js/shader.js @@ -0,0 +1,7 @@ +(function(){ + + var fn_str = demo_shader.innerHTML + var shader = new Function('lex', 'x', 'y', fn_str) + + window.shader = shader +})()
\ No newline at end of file |