From eae6c944f014de1ab377833d3dcdbdc05472bed1 Mon Sep 17 00:00:00 2001 From: Tim Mickel Date: Wed, 13 Jan 2016 18:06:52 -0500 Subject: [PATCH] PaintUndo.js module --- src/painteditor/PaintUndo.js | 273 ++++++++++++++++++----------------- 1 file changed, 140 insertions(+), 133 deletions(-) diff --git a/src/painteditor/PaintUndo.js b/src/painteditor/PaintUndo.js index f158fcf..15f1f1b 100755 --- a/src/painteditor/PaintUndo.js +++ b/src/painteditor/PaintUndo.js @@ -1,149 +1,156 @@ +import ScratchJr from '../editor/ScratchJr'; +import Path from './Path'; +import Paint from './Paint'; +import Camera from './Camera'; +import SVGTools from './SVGTools'; +import {newHTML, gn, isTablet} from '../utils/lib'; +import ScratchAudio from '../utils/ScratchAudio'; ////////////////////////////////// // Undo / Redo Functions ////////////////////////////////// -var PaintUndo = function () {}; -PaintUndo.buffer = []; -PaintUndo.index = 0; +export let buffer = []; +export let index = 0; -//////////////////////////////////////// -// Undo Controls Setup -/////////////////////////////////////// - -PaintUndo.setup = function (p) { - var div = newHTML('div', 'paintundo', p); - div.setAttribute('id', 'paintundocontrols'); - var lib = [['undo', PaintUndo.undo], ['redo', PaintUndo.redo]]; - var dx = 20; - for (var i = 0; i < lib.length; i++) { - var bt = PaintUndo.newToggleClicky(div, 'id_p', lib[i][0], lib[i][1]); - dx += bt.offsetWidth; - dx += 20; - } - PaintUndo.updateActiveUndo(); -}; - -PaintUndo.newToggleClicky = function (p, prefix, key, fcn) { - var button = newHTML('div', 'undocircle', p); - newHTML('div', key + ' off', button); - button.setAttribute('type', 'toggleclicky'); - button.setAttribute('id', prefix + key); - if (fcn) { - if (isTablet) { - button.ontouchstart = function (evt) { - fcn(evt); - }; - } else { - button.onmousedown = function (evt) { - fcn(evt); - }; +export default class PaintUndo { + //////////////////////////////////////// + // Undo Controls Setup + /////////////////////////////////////// + static setup (p) { + var div = newHTML('div', 'paintundo', p); + div.setAttribute('id', 'paintundocontrols'); + var lib = [['undo', PaintUndo.undo], ['redo', PaintUndo.redo]]; + var dx = 20; + for (var i = 0; i < lib.length; i++) { + var bt = PaintUndo.newToggleClicky(div, 'id_p', lib[i][0], lib[i][1]); + dx += bt.offsetWidth; + dx += 20; } - } - return button; -}; - -PaintUndo.runUndo = function () { - Path.quitEditMode(); - Paint.root.removeChild(gn('layer1')); - Paint.root.appendChild(SVGTools.toObject(PaintUndo.buffer[PaintUndo.index])); - Paint.root.appendChild(gn('draglayer')); - Paint.root.appendChild(gn('paintgrid')); - Paint.setZoomTo(Paint.currentZoom); -}; - -// you record before introducing a change -PaintUndo.record = function (dontStartStories) { - if ((PaintUndo.index + 1) <= PaintUndo.buffer.length) { - PaintUndo.buffer.splice(PaintUndo.index + 1, PaintUndo.buffer.length); - } - PaintUndo.buffer.push(PaintUndo.getCanvas()); - PaintUndo.index++; - if (gn('id_pundo')) { PaintUndo.updateActiveUndo(); } - if (!dontStartStories) { - ScratchJr.storyStart('PaintUndo.record'); // Record a change for sample projects in story-starter mode - } -}; -PaintUndo.getCanvas = function () { - return SVGTools.svg2string(gn('layer1')); -}; - -////////////////////////////////// -// Control buttons callbacks -////////////////////////////////// - -PaintUndo.undo = function (e) { - if (e.touches && (e.touches.length > 1)) { - return; - } - e.preventDefault(); - e.stopPropagation(); - if (Camera.active) { - Camera.doAction('undo'); - } - while (PaintUndo.index >= PaintUndo.buffer.length) { - PaintUndo.index--; - } - PaintUndo.index--; - var snd = (PaintUndo.index < 0) ? 'boing.wav' : 'tap.wav'; - ScratchAudio.sndFX(snd); - if (PaintUndo.index < 0) { - PaintUndo.index = 0; - } else { - PaintUndo.runUndo(); - } - PaintUndo.updateActiveUndo(); -}; - -PaintUndo.redo = function (e) { - if (e.touches && (e.touches.length > 1)) { - return; - } - e.preventDefault(); - e.stopPropagation(); - if (Camera.active) { - Camera.doAction('undo'); - } - PaintUndo.index++; - var snd = (PaintUndo.index > PaintUndo.buffer.length - 1) ? 'boing.wav' : 'tap.wav'; - ScratchAudio.sndFX(snd); - if (PaintUndo.index > PaintUndo.buffer.length - 1) { - PaintUndo.index = PaintUndo.buffer.length - 1; - } else { - PaintUndo.runUndo(); - } - PaintUndo.updateActiveUndo(); -}; - -PaintUndo.updateActiveUndo = function () { - if (gn('id_pundo')) { - if (PaintUndo.buffer.length == 1) { - PaintUndo.tunOffButton(gn('id_pundo')); - } else { - if (PaintUndo.index < 1) { - PaintUndo.tunOffButton(gn('id_pundo')); + static newToggleClicky (p, prefix, key, fcn) { + var button = newHTML('div', 'undocircle', p); + newHTML('div', key + ' off', button); + button.setAttribute('type', 'toggleclicky'); + button.setAttribute('id', prefix + key); + if (fcn) { + if (isTablet) { + button.ontouchstart = function (evt) { + fcn(evt); + }; } else { - PaintUndo.tunOnButton(gn('id_pundo')); + button.onmousedown = function (evt) { + fcn(evt); + }; } } - if (PaintUndo.index >= PaintUndo.buffer.length - 1) { - PaintUndo.tunOffButton(gn('id_predo')); - } else { - PaintUndo.tunOnButton(gn('id_predo')); + return button; + } + + static runUndo () { + Path.quitEditMode(); + Paint.root.removeChild(gn('layer1')); + Paint.root.appendChild(SVGTools.toObject(buffer[index])); + Paint.root.appendChild(gn('draglayer')); + Paint.root.appendChild(gn('paintgrid')); + Paint.setZoomTo(Paint.currentZoom); + } + + // you record before introducing a change + static record (dontStartStories) { + if ((index + 1) <= buffer.length) { + buffer.splice(index + 1, buffer.length); + } + buffer.push(PaintUndo.getCanvas()); + index++; + if (gn('id_pundo')) { + PaintUndo.updateActiveUndo(); + } + if (!dontStartStories) { + ScratchJr.storyStart('PaintUndo.record'); // Record a change for sample projects in story-starter mode } } -}; -PaintUndo.tunOnButton = function (p) { - var kid = p.childNodes[0]; - var kclass = kid.getAttribute('class').split(' ')[0]; - kid.setAttribute('class', kclass + ' on'); -}; + static getCanvas () { + return SVGTools.svg2string(gn('layer1')); + } -PaintUndo.tunOffButton = function (p) { - var kid = p.childNodes[0]; - var kclass = kid.getAttribute('class').split(' ')[0]; - kid.setAttribute('class', kclass + ' off'); -}; + ////////////////////////////////// + // Control buttons callbacks + ////////////////////////////////// + + static undo (e) { + if (e.touches && (e.touches.length > 1)) { + return; + } + e.preventDefault(); + e.stopPropagation(); + if (Camera.active) { + Camera.doAction('undo'); + } + while (index >= buffer.length) { + index--; + } + index--; + var snd = (index < 0) ? 'boing.wav' : 'tap.wav'; + ScratchAudio.sndFX(snd); + if (index < 0) { + index = 0; + } else { + PaintUndo.runUndo(); + } + PaintUndo.updateActiveUndo(); + } + + static redo (e) { + if (e.touches && (e.touches.length > 1)) { + return; + } + e.preventDefault(); + e.stopPropagation(); + if (Camera.active) { + Camera.doAction('undo'); + } + index++; + var snd = (index > buffer.length - 1) ? 'boing.wav' : 'tap.wav'; + ScratchAudio.sndFX(snd); + if (index > buffer.length - 1) { + index = buffer.length - 1; + } else { + PaintUndo.runUndo(); + } + PaintUndo.updateActiveUndo(); + } + + static updateActiveUndo () { + if (gn('id_pundo')) { + if (buffer.length == 1) { + PaintUndo.tunOffButton(gn('id_pundo')); + } else { + if (index < 1) { + PaintUndo.tunOffButton(gn('id_pundo')); + } else { + PaintUndo.tunOnButton(gn('id_pundo')); + } + } + if (index >= buffer.length - 1) { + PaintUndo.tunOffButton(gn('id_predo')); + } else { + PaintUndo.tunOnButton(gn('id_predo')); + } + } + } + + static tunOnButton (p) { + var kid = p.childNodes[0]; + var kclass = kid.getAttribute('class').split(' ')[0]; + kid.setAttribute('class', kclass + ' on'); + } + + static tunOffButton (p) { + var kid = p.childNodes[0]; + var kclass = kid.getAttribute('class').split(' ')[0]; + kid.setAttribute('class', kclass + ' off'); + } +}