diff --git a/public/sprites/SpriteSheet.js b/public/sprites/SpriteSheet.js index 76c2272..cc7fd7b 100644 --- a/public/sprites/SpriteSheet.js +++ b/public/sprites/SpriteSheet.js @@ -12,7 +12,6 @@ export default class SpriteSheet extends Hooks { previewCtx = []; history = []; ctx = null; - _undoPtr = 0; _current = 0; length = 0; clipboard = null; @@ -106,20 +105,13 @@ export default class SpriteSheet extends Hooks { } set(data, offset = this._current * pixelLength) { - // FIXME support partial paste + // note: does not support partial paste this.snapshot(); this.data.set(data, offset); this.rebuild(this._current); this.paint(); } - snapshot() { - this.history.splice(this._undoPtr + 1); - this.history.push(new Uint8Array(this.data)); - this._undoPtr = this.history.length - 1; - this.trigger(); - } - async rotate() { this.snapshot(); await this.sprite.rotate(); @@ -134,28 +126,35 @@ export default class SpriteSheet extends Hooks { this.paint(); } + snapshot() { + // this.history.splice(this._undoPtr + 1); + // this._undoPtr = this.history.length - 1; + this.history.push(new Uint8Array(this.data)); + this.trigger(); + } + undo() { - const data = this.history[this._undoPtr]; + const data = this.history.pop(); if (!data) { console.log('undo: no data'); return; } - this._undoPtr--; + // this._undoPtr--; + // if (this._undoPtr < 0) this._undoPtr = -1; this.data = data; const subSprite = this.sprite.subSprite; - const toggle = this.sprite.scale === 8; for (let i = 0; i < this.length; i++) { this.rebuild(i); } - if (toggle) this.sprite.toggleScale(); + this.sprite.subSprite = subSprite; this.trigger(); + this.paint(this._current, true); this.sprite.subSprite = subSprite; - this.paint(); } rebuild(i) { diff --git a/public/sprites/Tool.js b/public/sprites/Tool.js index 6eae344..a49a64a 100644 --- a/public/sprites/Tool.js +++ b/public/sprites/Tool.js @@ -2,6 +2,10 @@ import { $ } from '../lib/$.js'; import { getCoords } from './sprite-tools.js'; import palette from './Palette.js'; +/** + * @typedef { import("./SpriteSheet").default } SpriteSheet + */ + export default class Tool { types = ['brush', 'fill', 'erase', 'pan']; _selected = 'brush'; @@ -127,13 +131,18 @@ export default class Tool { return sprites.pset(coords, target); } - start(event) { + start(event, sprites) { const coords = getCoords(event, 64); // FIXME this._coords = coords; + sprites.snapshot(); } end() {} + /** + * @param {Event} event + * @param {SpriteSheet} sprites + */ apply(event, sprites) { const coords = getCoords( event, @@ -163,7 +172,7 @@ export default class Tool { if (event.type === 'click' && this._coords.index !== coords.index) { // this is a release // read from the canvas and put into pixels - sprites.snapshot(); + // sprites.snapshot(); sprites.canvasToPixels(); sprites.rebuild(sprites.current); sprites.paint(); @@ -186,8 +195,6 @@ export default class Tool { this.paint(sprites, coords, target); } - // update canvas - if (event.type === 'click') sprites.snapshot(); sprites.paint(); } } diff --git a/public/sprites/index.js b/public/sprites/index.js index 01d270a..2b52fa8 100644 --- a/public/sprites/index.js +++ b/public/sprites/index.js @@ -89,7 +89,11 @@ function generateNewSpriteSheet({ if (!data) { const restored = restoreState(); - if (!check && restored.lastSaved > Date.now() - ONE_WEEK) { + if ( + !check && + restored.lastSaved > Date.now() - ONE_WEEK && + restored.spriteSheet + ) { spriteData = Uint8Array.from(restored.spriteSheet.data); sprites = newSpriteSheet(spriteData); @@ -432,8 +436,8 @@ const drawHandler = (e) => { trackDown(container, { handler: drawHandler, - start() { - tool.start(event); + start(event) { + tool.start(event, sprites); }, end() { tool.end();