From f592e71096d76522db0e5a2ca9909d2e50525052 Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Thu, 9 Jun 2016 22:16:15 +0200 Subject: [PATCH] Add and test plugin system --- src/editor/main.js | 58 ++++++++++++++++++-- src/editor/model/Editor.js | 9 +-- src/grapesjs/config/config.js | 15 +---- src/grapesjs/main.js | 16 ++++-- src/storage_manager/config/config.js | 2 +- src/storage_manager/main.js | 6 +- test/specs/class_manager/e2e/ClassManager.js | 3 +- test/specs/css_composer/e2e/CssComposer.js | 6 +- test/specs/grapesjs/main.js | 30 +++++++++- test/specs/storage_manager/main.js | 2 +- 10 files changed, 108 insertions(+), 39 deletions(-) diff --git a/src/editor/main.js b/src/editor/main.js index 963d66ad9..29dce336c 100644 --- a/src/editor/main.js +++ b/src/editor/main.js @@ -38,7 +38,50 @@ define(function (require){ */ CssComposer: editorModel.get('CssComposer'), - // AssetManager, Canvas, ClassManager, CodeManager, Commands, Dialog, Panels, StoragManager, StyleManager + /** + * @property {StorageManager} + */ + StorageManager: editorModel.get('StorageManager'), + + /** + * @property {AssetManager} + */ + AssetManager: editorModel.get('AssetManager'), + + /** + * @property {ClassManager} + */ + ClassManager: editorModel.get('ClassManager'), + + /** + * @property {CodeManager} + */ + CodeManager: editorModel.get('CodeManager'), + + /** + * @property {Commands} + */ + Commands: editorModel.get('Commands'), + + /** + * @property {Dialog} + */ + Dialog: editorModel.get('Modal'), + + /** + * @property {Panels} + */ + Panels: editorModel.get('Panels'), + + /** + * @property {StyleManager} + */ + StyleManager: editorModel.get('StyleManager'), + + /** + * @property {StyleManager} + */ + Canvas: editorModel.get('Canvas'), /** * Returns configuration object @@ -110,11 +153,18 @@ define(function (require){ /** * Store data to the current storage - * @return {this} + * @return {Object} Stored data */ store: function(){ - editorModel.store(); - return this; + return editorModel.store(); + }, + + /** + * Store data to the current storage + * @return {Object} Stored data + */ + load: function(){ + return editorModel.load(); }, /** diff --git a/src/editor/model/Editor.js b/src/editor/model/Editor.js index 53f6eb4c6..6b9ef7196 100644 --- a/src/editor/model/Editor.js +++ b/src/editor/model/Editor.js @@ -252,7 +252,7 @@ define([ initStorage: function() { this.stm = new StorageManager(this.config.storage || this.config.storageManager); this.StorageManager = this.stm; - this.stm.loadDefaultProviders().setCurrent(this.config.storageType); + this.stm.loadDefaultProviders().setCurrent(this.stm.getConfig().type); this.set('StorageManager', this.stm); }, @@ -621,6 +621,7 @@ define([ /** * Store data to the current storage + * @return {Object} Stored data */ store: function(){ var sm = this.StorageManager; @@ -646,18 +647,18 @@ define([ console.log('Store'); console.log(store); sm.store(store); + return store; }, /** * Load data from the current storage + * @return {Object} Loaded data */ load: function(){ var result = this.getCacheLoad(1); - var comps = []; - - console.log(result); //this.setComponents(result.components || result.html); //this.setStyle(result.styles || result.css); + return result; }, /** diff --git a/src/grapesjs/config/config.js b/src/grapesjs/config/config.js index 97401526e..716f709d4 100644 --- a/src/grapesjs/config/config.js +++ b/src/grapesjs/config/config.js @@ -22,19 +22,8 @@ define(function () { // Enable/Disable undo manager undoManager: true, - storageId: '', // (!) - - //Indicates which storage to use. Available: local | remote | none - storageType: 'local', // (!) - - // More correct - storage:{ - id: '', - type: '', - - // Indicates if load data inside editor after init - autoload: 1, - }, + // Storage Manager + storage: {}, // Array of plugins to init plugins: [], diff --git a/src/grapesjs/main.js b/src/grapesjs/main.js index b44f41854..a581be2ac 100644 --- a/src/grapesjs/main.js +++ b/src/grapesjs/main.js @@ -7,12 +7,6 @@ define(function (require) { Editor = require('editor/main'), PluginManager = require('PluginManager'); - // Set default options - for (var name in defaults) { - if (!(name in c)) - c[name] = defaults[name]; - } - var plugins = new PluginManager(); var editors = []; @@ -35,6 +29,12 @@ define(function (require) { var c = config || {}; var els = c.container; + // Set default options + for (var name in defaults) { + if (!(name in c)) + c[name] = defaults[name]; + } + if(!els) throw new Error("'container' is required"); @@ -44,6 +44,10 @@ define(function (require) { // Execute all plugins var plugs = plugins.getAll(); for (var id in plugs){ + // Check if plugin is requested + if(c.plugins.indexOf(id) < 0) + continue; + var plug = plugins.get(id); plug(editor); } diff --git a/src/storage_manager/config/config.js b/src/storage_manager/config/config.js index 1b02d99a9..391e472ef 100644 --- a/src/storage_manager/config/config.js +++ b/src/storage_manager/config/config.js @@ -11,7 +11,7 @@ define(function () { autoload: 1, // Indicates which storage to use. Available: local | remote - storageType: 'local', + type: 'local', // If autosave enabled, indicates how many steps (general changes to structure) // need to be done before save. Useful with remoteStorage to reduce remote calls diff --git a/src/storage_manager/main.js b/src/storage_manager/main.js index 9d638abc3..12ed776b1 100644 --- a/src/storage_manager/main.js +++ b/src/storage_manager/main.js @@ -25,12 +25,12 @@ * @param {Boolean} [config.autosave=true] Indicates if autosave mode is enabled, works in conjunction with stepsBeforeSave * @param {number} [config.stepsBeforeSave=1] If autosave enabled, indicates how many steps/changes are necessary * before autosave is triggered - * @param {string} [config.storageType='local'] Default storage type. Available: 'local' | 'remote' | ''(do not store) + * @param {string} [config.type='local'] Default storage type. Available: 'local' | 'remote' | ''(do not store) * @example * ... * storageManager: { * autosave: false, - * storageType: 'remote', + * type: 'remote', * } * ... */ @@ -53,7 +53,7 @@ define(function(require) { defaultStorages.remote = new RemoteStorage(c); defaultStorages.local = new LocalStorage(c); - c.currentStorage = c.storageType; + c.currentStorage = c.type; return { diff --git a/test/specs/class_manager/e2e/ClassManager.js b/test/specs/class_manager/e2e/ClassManager.js index 4ff1d6eaa..34a831223 100644 --- a/test/specs/class_manager/e2e/ClassManager.js +++ b/test/specs/class_manager/e2e/ClassManager.js @@ -33,9 +33,8 @@ define( var Grapes = require('editor/main'); this.gjs = new Grapes({ stylePrefix: '', - storageType: 'none', storageManager: { - storageType: 'none', + type: 'none', }, assetManager: { storageType: 'none', diff --git a/test/specs/css_composer/e2e/CssComposer.js b/test/specs/css_composer/e2e/CssComposer.js index 83b4c829e..e65b21ff6 100644 --- a/test/specs/css_composer/e2e/CssComposer.js +++ b/test/specs/css_composer/e2e/CssComposer.js @@ -14,8 +14,7 @@ define(function(require) { this.Grapes = require('editor/main'); this.gjs = new this.Grapes({ stylePrefix: '', - storageType: 'none', - storageManager: { storageType: 'none', }, + storageManager: { type: 'none', }, assetManager: { storageType: 'none', }, container: 'csscomposer-fixture', }); @@ -45,8 +44,7 @@ define(function(require) { it('Rules are correctly imported from default property', function() { var gj = new this.Grapes({ stylePrefix: '', - storageType: 'none', - storageManager: { storageType: 'none', }, + storageManager: { type: 'none', }, assetManager: { storageType: 'none', }, cssComposer: { defaults: this.rulesSet}, container: 'csscomposer-fixture', diff --git a/test/specs/grapesjs/main.js b/test/specs/grapesjs/main.js index 5e9333693..39b3ad7c2 100644 --- a/test/specs/grapesjs/main.js +++ b/test/specs/grapesjs/main.js @@ -12,6 +12,17 @@ define(['GrapesJS', 'PluginManager', 'chai'], var htmlString; var config; + var storage; + var storageId = 'testStorage'; + var storageMock = { + store: function(data){ + storage = data; + }, + load: function(keys){ + return storage; + }, + }; + before(function () { editorName = 'editor-fixture'; fixtures = $("#fixtures"); @@ -23,7 +34,10 @@ define(['GrapesJS', 'PluginManager', 'chai'], documentEl = '' + htmlString; config = { container: '#' + editorName, - storage: { autoload: 0 }, + storage: { + autoload: 0, + type:'none' + }, } obj = new GrapesJS(); fixture = $('
'); @@ -115,6 +129,20 @@ define(['GrapesJS', 'PluginManager', 'chai'], styles.at(1).get('selectors').at(0).get('name').should.equal('test5'); }); + it('Adds new storage as plugin and store data there', function() { + var pluginName = storageId + '-plugin'; + obj.plugins.add(pluginName, function(edt){ + edt.StorageManager.add(storageId, storageMock); + }); + config.storage.type = storageId; + config.plugins = [pluginName]; + var editor = obj.init(config); + editor.setComponents(htmlString); + editor.store(); + var data = editor.load(); + data.html.should.equal(htmlString); + }); + }); }); diff --git a/test/specs/storage_manager/main.js b/test/specs/storage_manager/main.js index 1825fe552..9424193a0 100644 --- a/test/specs/storage_manager/main.js +++ b/test/specs/storage_manager/main.js @@ -94,7 +94,7 @@ define([ beforeEach(function () { storeValue = []; obj = new StorageManager({ - storageType: storageId, + type: storageId, }); obj.add(storageId, storage); });