diff options
| -rw-r--r-- | index.html | 2 | ||||
| -rw-r--r-- | js/app.js | 2 | ||||
| -rw-r--r-- | js/draw.js | 15 | ||||
| -rw-r--r-- | js/lex.js | 4 | ||||
| -rw-r--r-- | js/ui/canvas.js | 11 | ||||
| -rw-r--r-- | js/ui/palette.js | 3 |
6 files changed, 26 insertions, 11 deletions
@@ -41,7 +41,7 @@ body.grid .focused { box-shadow: inset 0 0 2px white, inset 0 0 2px white, inset <input type="text" id="cursor_input"> </body> <script type="text/javascript-shader" id="demo_shader"> - lex.bg = colors[color_hue_order[Math.floor((x+y*y+t)/20)%16]] + lex.bg = hue((x+y*y+t/10)/20) lex.fg = (x+y)%16 lex.char = (y%2) ? ":" : "%" @@ -12,7 +12,7 @@ function init () { } function build () { shader.init() - shader.run(canvas) +// shader.run(canvas) shader.animate() canvas.append(canvas_rapper) @@ -4,11 +4,22 @@ function draw (lex, x, y, erasing) { stamp (canvas, brush, x, y, erasing) } +function line (lex, a, b, erasing) { + var len = dist(a[0], a[1], b[0], b[1]) + var bw = 1 + var x, y, i; + for (var i = 0; i < len; i += bw) { + x = lerp(i / len, a[0], b[0]) + y = lerp(i / len, a[1], b[1]) + stamp (canvas, brush, x, y, erasing) + } +} + function stamp (canvas, brush, x, y, erasing) { hh = brush.w/2|0 brush.forEach(function(lex, s, t){ - s += x-hh - t += y-hh + s = round( s + x-hh ) + t = round( t + y-hh ) if (s >= 0 && s < canvas.w && t >= 0 && t < canvas.h) { if (erasing) { canvas.aa[t][s].erase(lex) @@ -35,14 +35,14 @@ Lex.prototype.irc = function(){ } } Lex.prototype.clone = function (lex){ - if (lex.isClear()) return + if (lex.opacity == 0) return this.fg = lex.fg this.bg = lex.bg this.char = lex.char this.build() } Lex.prototype.erase = function (lex){ - if (lex.isClear()) return + if (lex.opacity == 0) return this.fg = colors.white this.bg = colors.black this.char = " " diff --git a/js/ui/canvas.js b/js/ui/canvas.js index 7e85fcf..1ee6e1c 100644 --- a/js/ui/canvas.js +++ b/js/ui/canvas.js @@ -5,15 +5,16 @@ var canvas = (function(){ var exports = new Matrix (cols, rows, function(x,y){ var lex = new Lex (x,y) -// lex.build() + lex.build() return lex }) exports.bind = function(){ + var last_point = [0,0] exports.forEach(function(lex, x, y){ if (lex.bound) return lex.bound = true - + var point = [x,y] lex.span.addEventListener('contextmenu', function(e){ e.preventDefault() }) @@ -23,13 +24,17 @@ var canvas = (function(){ if (drawing) { erasing = (e.which == "3" || e.ctrlKey) draw(lex, x, y, erasing) + last_point[0] = x + last_point[1] = y } lex.focus() }) lex.span.addEventListener("mousemove", function(){ if (! dragging) return if (drawing) { - draw(lex, x, y, erasing) + line(lex, last_point, point, erasing) + last_point[0] = x + last_point[1] = y } lex.focus() }) diff --git a/js/ui/palette.js b/js/ui/palette.js index 605c08b..2a648a8 100644 --- a/js/ui/palette.js +++ b/js/ui/palette.js @@ -1,10 +1,9 @@ var palette = (function(){ -console.log("hi") + var palette = new Matrix (32, 2, function(x,y){ var lex = new Lex (x,y) lex.bg = hue(x>>1) lex.build() - console.log(lex.bg, lex.css()) return lex }) |