diff options
| -rw-r--r-- | index.html | 8 | ||||
| -rw-r--r-- | js/clipboard.js | 17 | ||||
| -rw-r--r-- | js/draw.js | 22 | ||||
| -rw-r--r-- | js/lex.js | 4 | ||||
| -rw-r--r-- | js/matrix.js | 23 | ||||
| -rw-r--r-- | js/shader.js | 10 | ||||
| -rw-r--r-- | js/ui/brush.js | 44 | ||||
| -rw-r--r-- | js/ui/canvas.js | 71 | ||||
| -rw-r--r-- | js/ui/controls.js | 60 | ||||
| -rw-r--r-- | js/ui/keys.js | 72 | ||||
| -rw-r--r-- | js/ui/selection.js | 2 | ||||
| -rw-r--r-- | js/undo.js | 76 |
12 files changed, 289 insertions, 120 deletions
@@ -33,12 +33,15 @@ <span id="fill_el" class="tool">fill</span><br> <span id="select_el" class="tool">select</span><br> <br> + <span id="undo_el" class="tool hidden">undo</span><br> + <span id="redo_el" class="tool hidden">redo</span><br> + <br> <span id="grid_el" class="tool">_ grid</span><br> <span id="rotate_checkbox" class="tool">_ rotate</span><br> <span id="vertical_checkbox" class="tool">_ vertical</span><br> <br> - brush size: <span id="width_el" class="ed">5</span> x <span id="height_el" class="ed">5</span><br> - canvas size: <span id="canvas_width_el" class="ed">100</span> x <span id="canvas_height_el" class="ed">30</span><br> + brush size: <span id="brush_w_el" class="ed">5</span> x <span id="brush_h_el" class="ed">5</span><br> + canvas size: <span id="canvas_w_el" class="ed">100</span> x <span id="canvas_h_el" class="ed">30</span><br> </div> <div id="textarea_mode" style="float: left;"> @@ -97,6 +100,7 @@ <script src="js/png.js"></script> <script src="js/unicode.js"></script> <script src="js/color.js"></script> +<script src="js/undo.js"></script> <script src="js/clipboard.js"></script> <script src="js/upload.js"></script> <script src="js/user.js"></script> diff --git a/js/clipboard.js b/js/clipboard.js index ee79320..0ac2150 100644 --- a/js/clipboard.js +++ b/js/clipboard.js @@ -81,6 +81,7 @@ var clipboard = (function () { var rapper = document.createElement("div") rapper.innerHTML = import_textarea.value var y = 0; + undo.new() toArray(rapper.childNodes).forEach(function(span){ if (span.nodeName !== "SPAN") { return } var x = 0; @@ -106,6 +107,7 @@ var clipboard = (function () { for (var i = 0; i < line.length; i++, x++) { var lex = row[x] + undo.save_lex(x, y, lex) if (! lex) return lex.char = line[i] lex.fg = alphabet[ colorcode[1] ] @@ -141,9 +143,12 @@ var clipboard = (function () { var json = colorcode.to_json(data, {fg:0, bg:1}) - canvas_width_el.innerHTML = json.w - canvas_height_el.innerHTML = json.h - canvas.resize(json.w, json.h) + undo.new() + undo.save_rect(0,0, canvas.w, canvas.h) + if (json.w !== canvas.w || json.h !== canvas.h){ + undo.save_size(canvas.w, canvas.h) + canvas.resize(json.w, json.h, true) + } canvas.clear() for (var y = 0, line; line = json.lines[y]; y++){ @@ -165,12 +170,14 @@ var clipboard = (function () { var lines = data.split("\n") var width = lines.reduce(function(a,b){ console.log(a,b); return Math.max(a, b.length) }, 0) var height = lines.length - if (width > 200) { + if (width > canvas.max) { return alert("input too wide") } - if (height > 200) { + if (height > canvas.max) { return alert("input too tall") } + undo.new() + undo.save_rect(0,0, canvas.w, canvas.h) canvas.clear() lines.forEach(function(line, y){ var row = canvas.aa[y] @@ -48,11 +48,13 @@ var draw = (function(){ s = round( s + x-hh ) t = round( t + y-hh ) if (lex.opacity > 0 && s >= 0 && s < canvas.w && t >= 0 && t < canvas.h) { + var aa = canvas.aa[t][s] + undo.save_lex(s, t, aa) if (erasing) { - canvas.aa[t][s].erase(lex) + aa.erase(lex) } else { - canvas.aa[t][s].paint(lex) + aa.paint(lex) } } }) @@ -60,20 +62,21 @@ var draw = (function(){ function fill (lex, x, y) { var q = [ [x,y] ] - var target = canvas.aa[y][x].clone() + var aa = canvas.aa + var target = aa[y][x].clone() var n, w = 0, e = 0, j = 0 var kk = 0 // gets into a weird infinite loop if we don't break here.. :\ if (target.eq(lex)) { return } LOOP: while (q.length) { n = q.shift() - if (canvas.aa[n[1]][n[0]].ne(target)) { + if (aa[n[1]][n[0]].ne(target)) { continue LOOP } w = e = n[0] j = n[1] WEST: while (w > 0) { - if (canvas.aa[j][w-1].eq(target)) { + if (aa[j][w-1].eq(target)) { w = w-1 } else { @@ -81,7 +84,7 @@ var draw = (function(){ } } EAST: while (e < canvas.w-1) { - if (canvas.aa[j][e+1].eq(target)) { + if (aa[j][e+1].eq(target)) { e = e+1 } else { @@ -89,11 +92,12 @@ var draw = (function(){ } } for (var i = w; i <= e; i++) { - canvas.aa[j][i].assign(lex) - if (j > 0 && canvas.aa[j-1][i].eq(target)) { + undo.save_lex(i, j, aa[j][i]) + aa[j][i].assign(lex) + if (j > 0 && aa[j-1][i].eq(target)) { q.push([ i, j-1 ]) } - if (j < canvas.h-1 && canvas.aa[j+1][i].eq(target)) { + if (j < canvas.h-1 && aa[j+1][i].eq(target)) { q.push([ i, j+1 ]) } } @@ -118,9 +118,9 @@ Lex.prototype.focus = function(){ focused = this } Lex.prototype.blur = function(){ - this.span.classList.remove('focused') - this.focused = false focused = null + this.span && this.span.classList.remove('focused') + this.focused = false this.onBlur && this.onBlur() } Lex.prototype.demolish = function(){ diff --git a/js/matrix.js b/js/matrix.js index 5c56bd4..6994327 100644 --- a/js/matrix.js +++ b/js/matrix.js @@ -4,6 +4,8 @@ function Matrix (w,h,f){ this.w = w this.h = h this.f = f + this.focus_x = 0 + this.focus_y = 0 this.initialize() } Matrix.prototype.initialize = function(f){ @@ -23,6 +25,7 @@ Matrix.prototype.rebuild = function (){ this.append() this.bind() this.generate && this.generate() + this.focus_clamp() check_if_lost_focus() } Matrix.prototype.clone = function () { @@ -70,6 +73,24 @@ Matrix.prototype.forEach = function(f){ }) }) } +Matrix.prototype.focus_clamp = function(){ + this.focus_x = clamp(this.focus_x, 0, this.w - 1) + this.focus_y = clamp(this.focus_y, 0, this.h - 1) +} +Matrix.prototype.focus_add = function(x, y){ + this.focus(this.focus_x + x, this.focus_y + y) +} +Matrix.prototype.focus = function(x, y){ + if (x === undefined) x = this.focus_x + if (y === undefined) y = this.focus_y + x = mod(x, this.w) + y = mod(y, this.h) + this.focus_x = x + this.focus_y = y + + //focused_input = this + this.aa[y][x].focus() +} Matrix.prototype.focusLex = function(y,x){ if (x < 0) { y -= 1 @@ -181,7 +202,7 @@ Matrix.prototype.resize = function(w,h){ this.w = w this.h = h this.bind && this.bind() - + this.focus_clamp() if (this.rapper && this.rapper.parentNode != document.body) { this.resize_rapper() } diff --git a/js/shader.js b/js/shader.js index 1418805..2e59ea3 100644 --- a/js/shader.js +++ b/js/shader.js @@ -20,7 +20,8 @@ var shader = (function(){ } exports.run = function(canvas){ var t = +new Date - var shader_canvas = selection.hidden ? canvas : selection.canvas; + // var shader_canvas = brush + selection.hidden ? canvas : selection.canvas; var w = shader_canvas.w, h = shader_canvas.h shader_canvas.forEach(function(lex, x, y){ fn(lex, x, y, w, h, t) @@ -38,9 +39,14 @@ var shader = (function(){ animating = true } exports.animate = function (t){ + // requestAnimationFrame(exports.animate) + if (! animating) { + requestAnimationFrame(exports.animate) - if (! animating) { return } + return } else { exports.run(canvas) + requestAnimationFrame(exports.animate) + } } return exports diff --git a/js/ui/brush.js b/js/ui/brush.js index e1d140d..90422b7 100644 --- a/js/ui/brush.js +++ b/js/ui/brush.js @@ -43,7 +43,8 @@ var brush = (function(){ fillColor = brush.bg lex.fill(brush) } - lex.focus() + brush.focus(x, y) + // lex.focus() }) lex.span.addEventListener('mousemove', function(e){ e.preventDefault() @@ -57,7 +58,8 @@ var brush = (function(){ else { lex.fill(brush) } - lex.focus() + brush.focus(x, y) + //lex.focus() }) }) window.addEventListener('mouseup', function(e){ @@ -65,16 +67,35 @@ var brush = (function(){ }) } - brush.expand = function(i){ - var w = this.w = clamp(this.w+i, 1, 9), h = this.h = clamp(this.h+i, 1, 9) - controls.width.char = ""+w - controls.width.build() - controls.height.char = ""+h - controls.height.build() + brush.resize = function(w, h, min, max){ + this.w = clamp(w, this.min, this.max) + this.h = clamp(h, this.min, this.max) + // brush.__proto__.resize.call(brush, w, h) + // this.w = w + // this.h = h this.rebuild() + //brush.__proto__.rebuild.call(brush, w, h) + controls.brush_w.char = ""+this.w + controls.brush_w.build() + controls.brush_h.char = ""+this.h + controls.brush_h.build() + } + brush.size_add = function(w, h){ + brush.resize(brush.w + w, brush.h + h) + } + + brush.expand = function(i){ + brush.size_add(i, i) + // var w = this.w = clamp(this.w+i, 1, 9), h = this.h = clamp(this.h+i, 1, 9) + // controls.width.char = ""+w + // controls.width.build() + // controls.height.char = ""+h + // controls.height.build() + // this.rebuild() } brush.contract = function(i){ - this.expand(-i) + brush.size_add(-i, -i) + // this.expand(-i) } brush.load = function(lex){ @@ -84,6 +105,9 @@ var brush = (function(){ brush.opacity = 1 } + brush.min = 1 + brush.max = 100 + brush.char = " " brush.fg = 0 brush.bg = 1 @@ -95,4 +119,4 @@ var brush = (function(){ return brush -})()
\ No newline at end of file +})() diff --git a/js/ui/canvas.js b/js/ui/canvas.js index 4822527..e241fd1 100644 --- a/js/ui/canvas.js +++ b/js/ui/canvas.js @@ -3,15 +3,15 @@ var canvas = current_canvas = (function(){ var cols = 100 var rows = 30 - var exports = new Matrix (cols, rows, function(x,y){ + var canvas = new Matrix (cols, rows, function(x,y){ var lex = new Lex (x,y) lex.build() return lex }) - exports.bind = function(){ + canvas.bind = function(){ - exports.forEach(function(lex, x, y){ + canvas.forEach(function(lex, x, y){ if (lex.bound) return lex.bound = true @@ -27,7 +27,7 @@ var canvas = current_canvas = (function(){ if (e.altKey) { if (e.shiftKey) { blit.copy_from(canvas, brush, floor(x-brush.w/2), floor(y-brush.h/2)) - brush.mask(brush) + brush.mask(brush) draw.set_last_point(e, point) } else { @@ -38,15 +38,17 @@ var canvas = current_canvas = (function(){ return } else if (drawing) { + undo.new() draw.down(e, lex, point) } else if (selecting) { selection.down(e, lex, point) } else if (filling) { + undo.new() draw.fill(brush, x, y) } - lex.focus() + canvas.focus(x, y) }) lex.span.addEventListener("mousemove", function(e){ @@ -58,50 +60,77 @@ var canvas = current_canvas = (function(){ else if (selecting) { selection.move(e, lex, point) } - lex.focus() + canvas.focus(x, y) }) }) if (is_mobile) { - exports.rapper.addEventListener('touchstart', function(e){ + canvas.rapper.addEventListener('touchstart', function(e){ e.preventDefault() var x, y, point, lex - x = (e.touches[0].pageX - exports.rapper.offsetTop) / exports.aa[0][0].span.offsetWidth - y = (e.touches[0].pageY - exports.rapper.offsetTop) / exports.aa[0][0].span.offsetHeight - x = ~~clamp(x, 0, exports.aa[0].length-1) - y = ~~clamp(y, 0, exports.aa.length-1) + x = (e.touches[0].pageX - canvas.rapper.offsetTop) / canvas.aa[0][0].span.offsetWidth + y = (e.touches[0].pageY - canvas.rapper.offsetTop) / canvas.aa[0][0].span.offsetHeight + x = ~~clamp(x, 0, canvas.aa[0].length-1) + y = ~~clamp(y, 0, canvas.aa.length-1) point = [x,y] - lex = exports.aa[y][x] + lex = canvas.aa[y][x] dragging = true if (drawing) { + undo.new() draw.down(e, lex, point) } else if (filling) { + undo.new() draw.fill(brush, x, y) } - lex.focus() + canvas.focus(x, y) }) - exports.rapper.addEventListener("touchmove", function(e){ + canvas.rapper.addEventListener("touchmove", function(e){ e.preventDefault() var x, y, point, lex - x = (e.touches[0].pageX - exports.rapper.offsetTop) / exports.aa[0][0].span.offsetWidth - y = (e.touches[0].pageY - exports.rapper.offsetTop) / exports.aa[0][0].span.offsetHeight - x = ~~clamp(x, 0, exports.aa[0].length-1) - y = ~~clamp(y, 0, exports.aa.length-1) + x = (e.touches[0].pageX - canvas.rapper.offsetTop) / canvas.aa[0][0].span.offsetWidth + y = (e.touches[0].pageY - canvas.rapper.offsetTop) / canvas.aa[0][0].span.offsetHeight + x = ~~clamp(x, 0, canvas.aa[0].length-1) + y = ~~clamp(y, 0, canvas.aa.length-1) point = [x,y] - lex = exports.aa[y][x] + lex = canvas.aa[y][x] if (! dragging) return shader_el.innerHTML = point.join(",") if (drawing) { draw.move(e, lex, point) } - lex.focus() + canvas.focus(x, y) }) } } - return exports + canvas.min = 1 + canvas.max = 999 + + // canvas.resize(1, 1, true) // wont create undo state + canvas.resize = function(w, h, no_undo){ + var old_w = this.w, old_h = this.h + w = this.w = clamp(w, this.min, this.max) + h = this.h = clamp(h, this.min, this.max) + if (old_w === w && old_h === h) return; + + if (!no_undo){ + undo.new() + undo.save_resize(w, h, old_w, old_h) + } + + canvas.__proto__.resize.call(canvas, w, h) + controls.canvas_w.char = "" + w + controls.canvas_w.build() + controls.canvas_h.char = "" + h + controls.canvas_h.build() + } + canvas.size_add = function(w, h){ + canvas.resize(canvas.w + w, canvas.h + h) + } + + return canvas })() diff --git a/js/ui/controls.js b/js/ui/controls.js index a0a7268..84a9d9b 100644 --- a/js/ui/controls.js +++ b/js/ui/controls.js @@ -4,7 +4,7 @@ var controls = (function(){ controls.cross = new Tool (cross_el) controls.cross.use = function(){ - brush.mask = blit.cross + brush.mask = blit.cross brush.generate() drawing = true brush.modified = false @@ -15,7 +15,7 @@ var controls = (function(){ controls.circle = new Tool (circle_el) controls.circle.use = function(){ - brush.mask = blit.circle + brush.mask = blit.circle brush.generate() drawing = true brush.modified = false @@ -26,7 +26,7 @@ var controls = (function(){ controls.square = new Tool (square_el) controls.square.use = function(){ - brush.mask = blit.square + brush.mask = blit.square brush.generate() brush.modified = false drawing = true @@ -56,7 +56,17 @@ var controls = (function(){ filling = false document.body.classList.remove("bucket") } - + + controls.undo = new BlurredTool (undo_el) + controls.undo.use = function(){ + undo.undo() + } + + controls.redo = new BlurredTool (redo_el) + controls.redo.use = function(){ + undo.redo() + } + controls.clear = new BlurredTool (clear_el) controls.clear.use = function(){ if (confirm("really delete this colorcode?")) { @@ -208,19 +218,19 @@ var controls = (function(){ // - 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.brush_w = new Lex (brush_w_el) + controls.brush_h = new Lex (brush_h_el) + controls.canvas_w = new Lex (canvas_w_el) + controls.canvas_h = new Lex (canvas_h_el) // bind controls.bind = function(){ [ - controls.width, - controls.height, - controls.canvas_width, - controls.canvas_height + controls.brush_w, + controls.brush_h, + controls.canvas_w, + controls.canvas_h ].forEach(function(lex){ lex.span.addEventListener('mousedown', function(e){ lex.focus() @@ -234,6 +244,8 @@ var controls = (function(){ controls.text, controls.fill, controls.select, + controls.undo, + controls.redo, controls.clear, controls.grid, controls.webcam, @@ -256,21 +268,21 @@ var controls = (function(){ tool.use( localStorage.getItem("ascii.tools." + tool.name) == "true" ) } }) - - controls.width.key = keys.single_numeral_key(controls.width, brush, "w", 1, 10) - controls.width.raw_key = keys.arrow_key(controls.width, brush, "w", "rebuild", 1, 100) - controls.height.key = keys.single_numeral_key(controls.height, brush, "h", 1, 10) - controls.height.raw_key = keys.arrow_key(controls.height, brush, "h", "rebuild", 1, 100) + controls.brush_w.key = keys.single_numeral_key(controls.brush_w, function(w){ brush.resize(w, brush.h) }) + controls.brush_w.raw_key = keys.arrow_key(function(w){ brush.size_add(w, 0) }) - controls.canvas_width.raw_key = keys.arrow_key(controls.canvas_width, canvas, "w", "resize", 1, 999) - controls.canvas_width.key = keys.multi_numeral_key(controls.canvas_width, 3) - controls.canvas_width.onBlur = keys.multi_numeral_blur(controls.canvas_width, canvas, "w", 1, 999) + controls.brush_h.key = keys.single_numeral_key(controls.brush_h, function(h){ brush.resize(brush.w, h) }) + controls.brush_h.raw_key = keys.arrow_key(function(h){ brush.size_add(0, h) }) + + controls.canvas_w.key = keys.multi_numeral_key(controls.canvas_w, 3) + controls.canvas_w.onBlur = keys.multi_numeral_blur(controls.canvas_w, function(w){ canvas.resize(w, canvas.h) }) + controls.canvas_w.raw_key = keys.arrow_key(function(w){ canvas.size_add(w, 0) }) - controls.canvas_height.raw_key = keys.arrow_key(controls.canvas_height, canvas, "h", "resize", 1, 999) - controls.canvas_height.key = keys.multi_numeral_key(controls.canvas_height, 3) - controls.canvas_height.onBlur = keys.multi_numeral_blur(controls.canvas_height, canvas, "h", 1, 999) - + controls.canvas_h.key = keys.multi_numeral_key(controls.canvas_h, 3) + controls.canvas_h.onBlur = keys.multi_numeral_blur(controls.canvas_h, function(h){ canvas.resize(canvas.w, h) }) + controls.canvas_h.raw_key = keys.arrow_key(function(h){ canvas.size_add(0, h) }) + add_custom_el.addEventListener("click", function(){ custom.clone() }) diff --git a/js/ui/keys.js b/js/ui/keys.js index 2ce681e..6dc013f 100644 --- a/js/ui/keys.js +++ b/js/ui/keys.js @@ -1,7 +1,6 @@ var keys = (function(){ var keys = {} - var direction = [0,1] keys.bind = function(){ cursor_input.addEventListener('keydown', function(e){ @@ -42,9 +41,13 @@ var keys = (function(){ brush.modified = false } break - case 8: + case 8: // backspace e.preventDefault() - current_canvas.focusLex(focused.y, focused.x - 1) + if (current_canvas === canvas) + undo.new() + current_canvas.focus_add(-1, 0) + if (current_canvas === canvas) + undo.save_focused_lex() focused.char = " " focused.build() return @@ -54,19 +57,35 @@ var keys = (function(){ return case 38: // up e.preventDefault() - current_canvas.focusLex(focused.y - 1, focused.x + 0) + current_canvas.focus_add(0, -1) break case 40: // down e.preventDefault() - current_canvas.focusLex(focused.y + 1, focused.x + 0) + current_canvas.focus_add(0, 1) break case 37: // left e.preventDefault() - current_canvas.focusLex(focused.y + 0, focused.x - 1) + current_canvas.focus_add(-1, 0) break case 39: // right e.preventDefault() - current_canvas.focusLex(focused.y + 0, focused.x + 1) + current_canvas.focus_add(1, 0) + break + // use typical windows and os x shortcuts + // undo: ctrl-z or cmd-z + // redo: ctrl-y or shift-cmd-z + case 89: // y + if (!e.ctrlKey && !e.metaKey) break; + e.preventDefault(); + undo.redo(); + break + case 90: // z + if (!e.ctrlKey && !e.metaKey) break; + e.preventDefault(); + if (e.shiftKey) + undo.redo(); + else + undo.undo(); break // default: // if (focused) { focused.key(undefined, e.keyCode) } @@ -102,10 +121,13 @@ var keys = (function(){ if (focused && char) { var y = focused.y, x = focused.x + if (current_canvas === canvas){ + undo.new() + undo.save_focused_lex() + } var moving = focused.key(char, e.keyCode) if ( ! moving || ! ('y' in focused && 'x' in focused) ) { return } - // console.log(y, direction[0], x, direction[1]) - current_canvas.focusLex(y + direction[0], x + direction[1]) + current_canvas.focus_add(1, 0) } }) @@ -122,35 +144,26 @@ var keys = (function(){ ! isNaN(n) && f(n) } } - - keys.arrow_key = function (lex, canvas, prop, rebuild_prop, min, max) { + + keys.arrow_key = function (fn) { return function (e){ switch (e.keyCode) { case 38: // up e.preventDefault() - canvas[prop] = Math.min(canvas[prop]+1, max) - lex.char = "" + canvas[prop] - lex.build() - canvas[rebuild_prop]() + fn(1) break case 40: // down e.preventDefault() - canvas[prop] = Math.max(canvas[prop]-1, min) - lex.char = "" + canvas[prop] - lex.build() - canvas[rebuild_prop]() + fn(-1) break } } } - keys.single_numeral_key = function (lex, canvas, prop, min, max) { + keys.single_numeral_key = function (lex, fn) { return keys.int_key(function(n, keyCode){ if (n == 0) n = 10 lex.blur() - lex.char = ""+n - lex.build() - canvas[prop] = n - canvas.rebuild() + fn(n) }) } keys.multi_numeral_key = function (lex, digits){ @@ -163,18 +176,13 @@ var keys = (function(){ lex.build() }) } - keys.multi_numeral_blur = function (lex, canvas, prop, min, max){ + keys.multi_numeral_blur = function (lex, fn){ return function(){ var current = parseInt(lex.char) - var n = clamp(current, min, max) - if (! n || isNaN(current)) return - lex.char = n+"" - lex.build() - canvas[prop] = n - canvas.resize(canvas.w, canvas.h) + fn(current) } } - + return keys })() diff --git a/js/ui/selection.js b/js/ui/selection.js index fe0c943..a2720cb 100644 --- a/js/ui/selection.js +++ b/js/ui/selection.js @@ -121,6 +121,8 @@ var selection = (function(){ a[1] += dy b[0] += dx b[1] += dy + undo.new() + undo.save_rect(a[0], a[1], b[0] - a[0] + 1, b[1] - a[1] + 1) blit.copy_to( canvas, selection_canvas, a[0], a[1] ) } if (copying) { @@ -78,16 +78,44 @@ var save_focused_lex = function(state){ save_lex(x, y, canvas.aa[y][x], state) } var save_rect = function(xpos, ypos, w, h, state){ + if (w === 0 || h === 0) return; state = state || current_undo; + state.rects = state.rects || [] var aa = canvas.aa; + var rect = {x: xpos, y: ypos, w: w, h: h, lexs: []} + var lexs = rect.lexs + var xlen = xpos + w var ylen = ypos + h - for (var x = xpos; x < xlen; x++){ - for (var y = ypos; y < ylen; y++){ - save_lex(x, y, aa[y][x], state) + for (var y = ypos; y < ylen; y++){ + var aay = aa[y] + for (var x = xpos; x < xlen; x++){ + lexs.push(new LexState(aay[x])) + } + } + state.rects.push(rect) +} +var save_resize = function(w, h, old_w, old_h, state){ + state = state || current_undo + save_size(old_w, old_h, state) + if (old_w > w){ + // .----. + // | XX + // |___XX + save_rect(w, 0, old_w - w, old_h, state) + if (old_h > h){ + // .----. + // | | + // |XXX_| + save_rect(0, h, w, old_h - h, state) } + } else if (old_h > h){ + // .----. + // | | + // |XXXX| + save_rect(0, h, old_w, old_h - h, state) } } @@ -97,26 +125,46 @@ var restore_state = function(state){ // if it doesn't have one, generate one var make_redo = ! ('redo' in state || 'undo' in state); var aa = canvas.aa - var lexs = state.lexs + var lex, lexs; // = state.lexs if (make_redo){ state.redo = new_redo() } + // copy saved rects that intersect with current canvas size + // important to do this before resizing canvas + if (make_redo && 'rects' in state){ + for (var ri=0, rect; rect=state.rects[ri]; ri++){ + if (rect.x >= canvas.w || + rect.y >= canvas.h) continue; + var w = Math.min(rect.w, canvas.w - rect.x) + var h = Math.min(rect.h, canvas.h - rect.y) + save_rect(rect.x, rect.y, w, h, state.redo) + } + } + if ('size' in state){ if (make_redo){ - save_size(canvas.w, canvas.h, state.redo) - // note that resizing canvas redo saves the whole canvas instead of - // just the changed part which is inefficient... - save_rect(0,0, canvas.w, canvas.h, state.redo) - make_redo = false // already saved whole canvas, skip lexs below + save_resize(state.size.w, state.size.h, canvas.w, canvas.h, state.redo) + } + canvas.resize(state.size.w, state.size.h, true); + } + + if ('rects' in state){ + for (var ri=0, rect; rect=state.rects[ri]; ri++){ + lexs = rect.lexs + for (var li=0; lex=lexs[li]; li++){ + var x = (li % rect.w) + rect.x + var y = ((li / rect.w)|0) + rect.y + aa[y][x].assign(lex) + } } - canvas.resize(state.size.w, state.size.h); } + lexs = state.lexs for (var key in lexs){ var xy = key.split(','); - var lex = aa[xy[1]][xy[0]] + lex = aa[xy[1]][xy[0]] if (make_redo) save_lex(xy[0], xy[1], lex, state.redo) lex.assign(lexs[key]) @@ -125,7 +173,10 @@ var restore_state = function(state){ if ('focus' in state){ canvas.focus_x = state.focus.x canvas.focus_y = state.focus.y - if (focused_input === canvas) canvas.focus() + if (current_canvas === canvas){ // &&) + canvas.focus() + } + // if (focused_input === canvas) canvas.focus() } } @@ -166,6 +217,7 @@ return { save_lex: save_lex, save_focused_lex: save_focused_lex, save_rect: save_rect, + save_resize: save_resize, undo: undo, redo: redo } |