From dde00d93a8c288c2deafb3e2bc0f2cc837f47b0e Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Sun, 10 Dec 2017 23:12:34 +0100 Subject: [PATCH] Start UndoManager --- src/editor/model/Editor.js | 16 ++- src/undo_manager/index.js | 207 +++++++++++++++++++++++++++++++++++++ 2 files changed, 213 insertions(+), 10 deletions(-) create mode 100644 src/undo_manager/index.js diff --git a/src/editor/model/Editor.js b/src/editor/model/Editor.js index 5924e7172..8e53e51c2 100644 --- a/src/editor/model/Editor.js +++ b/src/editor/model/Editor.js @@ -57,9 +57,7 @@ module.exports = Backbone.Model.extend({ this.config.components = c.el.innerHTML; // Load modules - deps.forEach(function(name){ - this.loadModule(name); - }, this); + deps.forEach(name => this.loadModule(name)); this.initUndoManager(); @@ -151,22 +149,20 @@ module.exports = Backbone.Model.extend({ // Check if module is storable var sm = this.get('StorageManager'); - if(Mod.storageKey && Mod.store && Mod.load && sm){ + + if (Mod.storageKey && Mod.store && Mod.load && sm) { cfg.stm = sm; var storables = this.get('storables'); storables.push(Mod); this.set('storables', storables); } + cfg.em = this; Mod.init({ ...cfg }); // Bind the module to the editor model if public - if(!Mod.private) - this.set(Mod.name, Mod); - - if(Mod.onLoad) - this.get('toLoad').push(Mod); - + !Mod.private && this.set(Mod.name, Mod); + Mod.onLoad && this.get('toLoad').push(Mod); this.get('modules').push(Mod); return this; }, diff --git a/src/undo_manager/index.js b/src/undo_manager/index.js new file mode 100644 index 000000000..7fd5a431c --- /dev/null +++ b/src/undo_manager/index.js @@ -0,0 +1,207 @@ +/** + * This module allows to create shortcuts for functions and commands (via command id) + * + * You can access the module in this way + * ```js + * const undoManager = editor.UndoManager; + * ``` + * + */ +import UndoManager from 'backbone-undo'; + +module.exports = () => { + let config; + let um; + const configDef = {}; + const keymaps = {}; + + /* + const canvas = this.get('Canvas'); + + if (this.um) { + return; + } + + var cmp = this.get('DomComponents'); + if(cmp && this.config.undoManager) { + var that = this; + this.um = new UndoManager({ + register: [cmp.getComponents(), this.get('CssComposer').getAll()], + track: true + }); + this.UndoManager = this.um; + this.set('UndoManager', this.um); + + key('⌘+z, ctrl+z', () => { + if (canvas.isInputFocused()) { + return; + } + + that.um.undo(true); + that.trigger('component:update'); + }); + + key('⌘+shift+z, ctrl+shift+z', () => { + if (canvas.isInputFocused()) { + return; + } + that.um.redo(true); + that.trigger('component:update'); + }); + + var beforeCache; + const customUndoType = { + on: function (model, value, opts) { + var opt = opts || {}; + if(!beforeCache){ + beforeCache = model.previousAttributes(); + } + if (opt && opt.avoidStore) { + return; + } else { + var obj = { + object: model, + before: beforeCache, + after: model.toJSON() + }; + beforeCache = null; + return obj; + } + }, + undo: function (model, bf, af, opt) { + model.set(bf); + // Update also inputs inside Style Manager + that.trigger('change:selectedComponent'); + }, + redo: function (model, bf, af, opt) { + model.set(af); + // Update also inputs inside Style Manager + that.trigger('change:selectedComponent'); + } + }; + + UndoManager.removeUndoType("change"); + UndoManager.addUndoType("change:style", customUndoType); + UndoManager.addUndoType("change:attributes", customUndoType); + UndoManager.addUndoType("change:content", customUndoType); + UndoManager.addUndoType("change:src", customUndoType); + } + */ + + return { + + name: 'UndoManager', + + + /** + * Initialize module + * @param {Object} config Configurations + * @private + */ + init(opts = {}) { + config = { ...opts, ...configDef }; + this.em = config.em; + um = new UndoManager({ track: true, register: [] }); + return this; + }, + + + /** + * Get module configurations + * @return {Object} Configuration object + */ + getConfig() { + return config; + }, + + + /** + * Add an entity (Model/Collection) to track changes + * @param {Model|Collection} entity Entity to track + */ + add(entity) { + um.register(entity); + }, + + + /** + * Remove and stop tracking the entity (Model/Collection) + * @param {Model|Collection} entity Entity to remove + */ + remove(entity) { + um.unregister(entity); + }, + + + /** + * Remove all entities + */ + removeAll() { + um.unregisterAll() + }, + + + /** + * Start/resume tracking changes + */ + start() { + em.startTracking(); + }, + + + /** + * Stop tracking changes + */ + stop() { + em.stopTracking(); + }, + + + /** + * Undo last change + */ + undo() { + em.undo(1); + }, + + + /** + * Undo all changes + */ + undoAll() { + em.undoAll(); + }, + + + /** + * Redo last change + */ + redo() { + em.redo(1); + }, + + + /** + * Redo all changes + */ + redoAll() { + em.redoAll(); + }, + + + /** + * Get stack of changes + * @return {Array} + */ + getStack() { + + }, + + /** + * Clear the stack + */ + clear() { + + } + }; +};