diff --git a/src/block_manager/main.js b/src/block_manager/main.js index 55e392db6..0d6c1e24f 100644 --- a/src/block_manager/main.js +++ b/src/block_manager/main.js @@ -44,6 +44,7 @@ define(function(require) { * Initialize module. Automatically called with a new instance of the editor * @param {Object} config Configurations * @param {Array} [config.blocks=[]] Default blocks + * @return {this} * @example * ... * { @@ -53,7 +54,6 @@ define(function(require) { * ], * } * ... - * @return {this} */ init: function(config) { c = config || {}; diff --git a/src/canvas/view/CanvasView.js b/src/canvas/view/CanvasView.js index f140c6fad..a96c9bfae 100644 --- a/src/canvas/view/CanvasView.js +++ b/src/canvas/view/CanvasView.js @@ -121,7 +121,7 @@ function(Backbone, FrameView) { this.toolsEl.appendChild(this.placerEl); this.toolsEl.appendChild(this.ghostEl); this.$el.append(this.toolsEl); - var rte = this.em.get('RichTextEditor'); + var rte = this.em.get('rte'); if(rte) this.toolsEl.appendChild(rte.render()); diff --git a/src/code_manager/main.js b/src/code_manager/main.js index 72b51fef1..eff619d9a 100644 --- a/src/code_manager/main.js +++ b/src/code_manager/main.js @@ -19,9 +19,9 @@ */ define(function(require) { - var CodeManager = function(config) { + var CodeManager = function() { - var c = config || {}, + var c = {}, defaults = require('./config/config'), gHtml = require('./model/HtmlGenerator'), gCss = require('./model/CssGenerator'), @@ -29,28 +29,65 @@ define(function(require) { eCM = require('./model/CodeMirrorEditor'), editorView = require('./view/EditorView'); - for (var name in defaults) { - if (!(name in c)) - c[name] = defaults[name]; - } - var generators = {}, defGenerators = {}, viewers = {}, defViewers = {}; - defGenerators.html = new gHtml(); - defGenerators.css = new gCss(); - defGenerators.json = new gJson(); - - defViewers.CodeMirror = new eCM(); - return { + getConfig: function() { + return c; + }, + config: c, EditorView: editorView, + /** + * Name of the module + * @type {String} + * @private + */ + name: 'CodeManager', + + /** + * Indicates if module is public + * @type {Boolean} + * @private + */ + public: true, + + /** + * Initialize module. Automatically called with a new instance of the editor + * @param {Object} config Configurations + */ + init: function(config) { + c = config || {}; + for (var name in defaults) { + if (!(name in c)) + c[name] = defaults[name]; + } + + var ppfx = c.pStylePrefix; + if(ppfx) + c.stylePrefix = ppfx + c.stylePrefix; + + defGenerators.html = new gHtml(); + defGenerators.css = new gCss(); + defGenerators.json = new gJson(); + + defViewers.CodeMirror = new eCM(); + return this; + }, + + /** + * Callback on load + */ + onLoad: function(){ + this.loadDefaultGenerators().loadDefaultViewers(); + }, + /** * Add new code generator to the collection * @param {string} id Code generator ID diff --git a/src/commands/view/ExportTemplate.js b/src/commands/view/ExportTemplate.js index 10d8989cb..5eafadd8a 100644 --- a/src/commands/view/ExportTemplate.js +++ b/src/commands/view/ExportTemplate.js @@ -41,7 +41,7 @@ define(function() { $editor = new this.cm.EditorView({ model : editor, - config : this.cm.config + config : this.cm.getConfig() }).render().$el; editor.init( $input[0] ); diff --git a/src/commands/view/SelectPosition.js b/src/commands/view/SelectPosition.js index 603144bb3..afcbff1ad 100644 --- a/src/commands/view/SelectPosition.js +++ b/src/commands/view/SelectPosition.js @@ -9,7 +9,7 @@ define(function() { * */ startSelectPosition: function(trg, doc) { this.isPointed = false; - var utils = this.editorModel.Utils; + var utils = this.editorModel.get('Utils'); if(utils && !this.sorter) this.sorter = new utils.Sorter({ container: this.getCanvasBody(), diff --git a/src/css_composer/model/CssRules.js b/src/css_composer/model/CssRules.js index 0fede890a..4167e7199 100644 --- a/src/css_composer/model/CssRules.js +++ b/src/css_composer/model/CssRules.js @@ -29,7 +29,7 @@ define(['backbone','./CssRule'], add: function(models, opt){ if(typeof models === 'string') - models = this.editor.Parser.parseCss(models); + models = this.editor.get('Parser').parseCss(models); return Backbone.Collection.prototype.add.apply(this, [models, opt]); }, diff --git a/src/demo.js b/src/demo.js index f95d48c87..316faa697 100644 --- a/src/demo.js +++ b/src/demo.js @@ -10,7 +10,7 @@ require(['config/require-config'], function() { container : '#gjs', height: '100%', fromElement: true, - storage:{ autoload: 0 }, + storageManager:{ autoload: 0 }, commands: { defaults : [{ diff --git a/src/device_manager/config/config.js b/src/device_manager/config/config.js index 081d54aa4..3ed3913c2 100644 --- a/src/device_manager/config/config.js +++ b/src/device_manager/config/config.js @@ -1,7 +1,7 @@ define(function () { return { - 'devices': [], + devices: [], deviceLabel: 'Device', diff --git a/src/device_manager/main.js b/src/device_manager/main.js index 60af42a8d..979c29463 100644 --- a/src/device_manager/main.js +++ b/src/device_manager/main.js @@ -1,4 +1,5 @@ /** + * * [init](#init) * * [add](#add) * * [get](#get) * * [getAll](#getall) @@ -10,38 +11,61 @@ * ``` * * @module DeviceManager - * @param {Object} config Configurations - * @param {Array} [config.devices=[]] Default devices - * @example - * ... - * deviceManager: { - * devices: [ - * {name: 'Desktop', width: ''} - * {name: 'Tablet', width: '991px'} - * ], - * } - * ... */ define(function(require) { - return function(config) { - var c = config || {}, - defaults = require('./config/config'), - Devices = require('./model/Devices'), - DevicesView = require('./view/DevicesView'); + return function() { + var c = {}, + defaults = require('./config/config'), + Devices = require('./model/Devices'), + DevicesView = require('./view/DevicesView'); + var devices, view; - for (var name in defaults) { - if (!(name in c)) - c[name] = defaults[name]; - } + return { - var devices = new Devices(c.devices); - var view = new DevicesView({ - collection: devices, - config: c - }); + /** + * Name of the module + * @type {String} + * @private + */ + name: 'DeviceManager', - return { + /** + * Indicates if module is public + * @type {Boolean} + * @private + */ + public: true, + + /** + * Initialize module. Automatically called with a new instance of the editor + * @param {Object} config Configurations + * @param {Array} [config.devices=[]] Default devices + * @example + * ... + * { + * devices: [ + * {name: 'Desktop', width: ''} + * {name: 'Tablet', width: '991px'} + * ], + * } + * ... + * @return {this} + */ + init: function(config) { + c = config || {}; + for (var name in defaults) { + if (!(name in c)) + c[name] = defaults[name]; + } + + devices = new Devices(c.devices); + view = new DevicesView({ + collection: devices, + config: c + }); + return this; + }, /** * Add new device to the collection. URLs are supposed to be unique diff --git a/src/dom_components/model/Components.js b/src/dom_components/model/Components.js index d0a29174d..89fe1ea0c 100644 --- a/src/dom_components/model/Components.js +++ b/src/dom_components/model/Components.js @@ -50,7 +50,7 @@ define([ 'backbone', 'require'], add: function(models, opt){ if(typeof models === 'string'){ - var parsed = this.editor.Parser.parseHtml(models); + var parsed = this.editor.get('Parser').parseHtml(models); models = parsed.html; if(parsed.css) diff --git a/src/editor/model/Editor.js b/src/editor/model/Editor.js index 2d6d0c045..c2bd248a7 100644 --- a/src/editor/model/Editor.js +++ b/src/editor/model/Editor.js @@ -1,3 +1,11 @@ +var deps = ['backbone', 'backboneUndo', 'keymaster', 'Utils', 'StorageManager', 'DeviceManager', 'Parser', + 'SelectorManager', 'ModalDialog', 'AssetManager', 'CodeManager', 'Panels', 'RichTextEditor', + 'BlockManager', + 'CssComposer', + 'Commands', + 'Canvas', + 'DomComponents', + 'StyleManager']; define([ 'backbone', 'backboneUndo', @@ -60,23 +68,24 @@ define([ if(c.el && c.fromElement) this.config.components = c.el.innerHTML; - this.initDeviceManager(); - this.initParser(); - this.initStorage(); - this.loadModule('SelectorManager'); - this.initModal(); + this.loadModule('Utils'); // no dep + this.loadModule('StorageManager'); // No dep + this.loadModule('DeviceManager'); // No dep + this.loadModule('Parser'); // No dep + this.loadModule('SelectorManager'); // No dep + this.loadModule('ModalDialog'); // No dep this.loadModule('AssetManager'); // requires SelectorManager - this.initUtils(); - this.initCodeManager(); + this.loadModule('CodeManager'); // no deps + this.loadModule('Panels'); // no deps + this.loadModule('RichTextEditor'); // no deps this.initCommands(); - this.initPanels(); - this.initRichTextEditor(); + //this.initRichTextEditor(); this.initCssComposer(); - this.initComponents(); - this.initCanvas(); + this.initComponents(); // Requires AssetManager and Dialog for images components + this.initCanvas(); // Requires RTE this.initUndoManager(); this.initStyleManager(); - this.loadModule('BlockManager'); // Requres utils, canvas + this.loadModule('BlockManager'); // Requires utils, canvas this.on('change:selectedComponent', this.componentSelected, this); }, @@ -90,7 +99,7 @@ define([ var c = this.config; var M = new require(moduleName)(); var name = M.name.charAt(0).toLowerCase() + M.name.slice(1); - var cfg = c[name] || c[M.name]; + var cfg = c[name] || c[M.name] || {}; cfg.pStylePrefix = c.stylePrefix; // Check if module is storable @@ -104,6 +113,9 @@ define([ cfg.em = this; M.init(cfg); + if(M.onLoad) + M.onLoad(); + // Bind the module to the editor model if public if(M.public) this.set(M.name, M); @@ -120,36 +132,6 @@ define([ this.set('Editor', editor); }, - /** - * Initialize device manager - * @private - * */ - initDeviceManager: function(){ - var cfg = this.config.deviceManager; - cfg.em = this; - cfg.pStylePrefix = this.config.stylePrefix; - var dm = new DeviceManager(cfg); - this.set('DeviceManager', dm); - }, - - /** - * Initialize Parser - * @private - * */ - initParser: function() { - this.Parser = new Parser(); - this.set('parser', this.Parser); - }, - - /** - * Initialize Utils - * @private - * */ - initUtils: function() { - this.Utils = new Utils(); - this.set('Utils', this.Utils); - }, - /** * Initialize Style Manager * @private @@ -174,7 +156,7 @@ define([ pfx = cfg.stylePrefix || 'css-'; cfg.stylePrefix = this.config.stylePrefix + pfx; - if(this.StorageManager.getConfig().autoload) + if(this.get('StorageManager').getConfig().autoload) df = this.loadRules(); if(elStyle) @@ -187,7 +169,7 @@ define([ this.cssc = new CssComposer(cfg); this.CssComposer = this.cssc; this.set('CssComposer', this.cssc); - if(this.stm.isAutosave()) + if(this.get('StorageManager').isAutosave()) this.listenRules(this.cssc.getRules()); }, @@ -225,8 +207,8 @@ define([ var count = this.get('changesCount') + 1, avSt = opt ? opt.avoidStore : 0; this.set('changesCount', count); - - if(this.stm.isAutosave() && count < this.stm.getStepsBeforeSave()) + var stm = this.get('StorageManager'); + if(stm.isAutosave() && count < stm.getStepsBeforeSave()) return; if(!avSt){ @@ -245,7 +227,7 @@ define([ comp = '', cmpStylePfx = cfg.stylePrefix || 'comp-'; - if(this.StorageManager.getConfig().autoload) + if(this.get('StorageManager').getConfig().autoload) comp = this.loadComponents(); cfg.pStylePrefix = this.config.stylePrefix; @@ -254,11 +236,9 @@ define([ if(comp) cfg.components = comp; - if(this.rte) - cfg.rte = this.rte; + cfg.rte = this.get('rte') || ''; - if(this.modal) - cfg.modal = this.modal; + cfg.modal = this.get('Modal') || ''; cfg.am = this.get('AssetManager') || ''; @@ -267,7 +247,7 @@ define([ this.cmp = new DomComponents(cfg); this.Components = this.cmp; - if(this.stm.isAutosave()){ + if(this.get('StorageManager').isAutosave()){ // Call UndoManager here so it's possible to call it also for children inside this.initUndoManager(); this.initChildrenComp(this.cmp.getWrapper()); @@ -295,61 +275,6 @@ define([ this.set('Canvas', this.cv); }, - /** - * Initialize rich text editor - * @private - * */ - initRichTextEditor: function() { - var cfg = this.config.rte, - rteStylePfx = cfg.stylePrefix || 'rte-'; - cfg.pStylePrefix = this.config.stylePrefix; - cfg.stylePrefix = cfg.pStylePrefix + rteStylePfx; - cfg.em = this; - this.rte = new RichTextEditor(cfg); - this.set('RichTextEditor', this.rte); - }, - - /** - * Initialize storage - * @private - * */ - initStorage: function() { - this.stm = new StorageManager(this.config.storage || this.config.storageManager); - this.StorageManager = this.stm; - this.stm.loadDefaultProviders().setCurrent(this.stm.getConfig().type); - this.set('StorageManager', this.stm); - }, - - /** - * Initialize dialog - * @private - * */ - initModal: function() { - var cfg = this.config.modal, - pfx = cfg.stylePrefix || 'mdl-'; - cfg.stylePrefix = this.config.stylePrefix + pfx; - this.modal = new ModalDialog(cfg); - this.on('loaded', function(){ - this.modal.render().appendTo(this.config.el || 'body'); - }, this); - this.Dialog = this.modal; - this.set('Modal', this.modal); - }, - - /** - * Initialize Code Manager - * @private - * */ - initCodeManager: function() { - var cfg = this.config.codeManager, - pfx = cfg.stylePrefix || 'cm-'; - cfg.stylePrefix = this.config.stylePrefix + pfx; - this.cm = new CodeManager(cfg); - this.CodeManager = this.cm; - this.cm.loadDefaultGenerators().loadDefaultViewers(); - this.set('CodeManager', this.cm); - }, - /** * Initialize Commands * @private @@ -368,22 +293,6 @@ define([ this.set('Commands', this.com); }, - /** - * Initialize Panels - * @private - * */ - initPanels: function() { - var cfg = this.config.panels, - pfx = cfg.stylePrefix || 'pn-'; - cfg.pStylePrefix = this.config.stylePrefix; - cfg.stylePrefix = this.config.stylePrefix + pfx; - cfg.em = this; - this.pn = new Panels(cfg); - //this.pn.addPanel({ id: 'views-container'}); - this.Panels = this.pn; - this.set('Panels', this.pn); - }, - /** * Initialize Undo manager * @private @@ -445,7 +354,8 @@ define([ var updatedCount = this.get('changesCount') + 1, avSt = opt ? opt.avoidStore : 0; this.set('changesCount', updatedCount); - if(this.stm.isAutosave() && updatedCount < this.stm.getStepsBeforeSave()){ + var stm = this.get('StorageManager'); + if(stm.isAutosave() && updatedCount < stm.getStepsBeforeSave()){ return; } @@ -510,7 +420,7 @@ define([ comps = JSON.parse(result.style); }catch(err){} }else if(result.css) - comps = this.Parser.parseCss(result.css); + comps = this.get('Parser').parseCss(result.css); return comps; }, @@ -610,8 +520,8 @@ define([ * @private */ getComponents: function(){ - var cmp = this.Components; - var cm = this.CodeManager; + var cmp = this.get('Components'); + var cm = this.get('CodeManager'); if(!cmp || !cm) return; @@ -649,8 +559,8 @@ define([ * @private */ getHtml: function(){ - var cmp = this.Components; - var cm = this.CodeManager; + var cmp = this.get('Components'); + var cm = this.get('CodeManager'); if(!cmp || !cm) return; @@ -665,9 +575,9 @@ define([ * @private */ getCss: function(){ - var cmp = this.Components; - var cm = this.CodeManager; - var cssc = this.CssComposer; + var cmp = this.get('Components'); + var cm = this.get('CodeManager'); + var cssc = this.get('CssComposer'); if(!cmp || !cm || !cssc) return; @@ -682,7 +592,7 @@ define([ * @private */ store: function(){ - var sm = this.StorageManager; + var sm = this.get('StorageManager'); if(!sm) return; @@ -739,7 +649,7 @@ define([ if(this.cacheLoad && !f) return this.cacheLoad; - var sm = this.StorageManager; + var sm = this.get('StorageManager'); var load = []; if(!sm) diff --git a/src/grapesjs/config/config.js b/src/grapesjs/config/config.js index 13d1e1876..c80276e71 100644 --- a/src/grapesjs/config/config.js +++ b/src/grapesjs/config/config.js @@ -26,7 +26,7 @@ define(function () { noticeOnUnload: true, // Storage Manager - storage: {}, + storageManager: {}, // Array of plugins to init plugins: [], diff --git a/src/modal_dialog/main.js b/src/modal_dialog/main.js index ead34e8f0..a286df6d1 100644 --- a/src/modal_dialog/main.js +++ b/src/modal_dialog/main.js @@ -1,55 +1,78 @@ +/** + * @class Modal + * */ define(function(require) { - /** - * @class Modal - * @param {Object} Configurations - * - * @return {Object} - * */ - function Modal(config) - { - var c = config || {}, - defaults = require('./config/config'), - ModalM = require('./model/Modal'), - ModalView = require('./view/ModalView'); + return function() { + var c = {}, + defaults = require('./config/config'), + ModalM = require('./model/Modal'), + ModalView = require('./view/ModalView'); + var model, modal; - for (var name in defaults) { - if (!(name in c)) - c[name] = defaults[name]; - } + return { - this.model = new ModalM(c); - var obj = { - model : this.model, - config : c, - }; + /** + * Name of the module + * @type {String} + * @private + */ + name: 'Modal', + + /** + * Indicates if module is public + * @type {Boolean} + * @private + */ + public: true, + + /** + * Initialize module. Automatically called with a new instance of the editor + * @param {Object} config Configurations + */ + init: function(config) { + c = config || {}; + for (var name in defaults) { + if (!(name in c)) + c[name] = defaults[name]; + } - this.modal = new ModalView(obj); - } + var ppfx = c.pStylePrefix; + if(ppfx) + c.stylePrefix = ppfx + c.stylePrefix; - Modal.prototype = { + model = new ModalM(c); + modal = new ModalView({ + model: model, + config: c, + }); + c.em.on('loaded', function(){ + this.render().appendTo(c.em.config.el || 'body'); + }, this); + return this; + }, - getModel : function(){ - return this.model; + getModel: function(){ + return model; }, - render : function(){ - return this.modal.render().$el; + render: function(){ + return modal.render().$el; }, - show : function(){ - return this.modal.show(); + show: function(){ + return modal.show(); }, - hide : function(){ - return this.modal.hide(); + hide: function(){ + return modal.hide(); }, - setTitle : function(v){ - return this.modal.setTitle(v); + setTitle: function(v){ + return modal.setTitle(v); }, - setContent : function(v){ - return this.modal.setContent(v); + setContent: function(v){ + return modal.setContent(v); }, /** @@ -57,9 +80,8 @@ define(function(require) { * @return {HTMLElement} */ getContentEl: function(){ - return this.modal.getContent(); + return modal.getContent(); } + }; }; - - return Modal; }); \ No newline at end of file diff --git a/src/panels/main.js b/src/panels/main.js index f7e4af390..df75a4498 100644 --- a/src/panels/main.js +++ b/src/panels/main.js @@ -46,30 +46,53 @@ */ define(function(require) { - var Panels = function(config){ + return function(){ + var c = {}, + defaults = require('./config/config'), + Panel = require('./model/Panel'), + Panels = require('./model/Panels'), + PanelView = require('./view/PanelView'), + PanelsView = require('./view/PanelsView'); + var panels, PanelsViewObj; - var c = config || {}, - defaults = require('./config/config'), - Panel = require('./model/Panel'), - Panels = require('./model/Panels'), - PanelView = require('./view/PanelView'), - PanelsView = require('./view/PanelsView'); - - // Set default options - for (var name in defaults) { - if (!(name in c)) - c[name] = defaults[name]; - } + return { - var panels = new Panels(c.defaults); - var obj = { - collection : panels, - config : c, - }; + /** + * Name of the module + * @type {String} + * @private + */ + name: 'Panels', + + /** + * Indicates if module is public + * @type {Boolean} + * @private + */ + public: true, + + /** + * Initialize module. Automatically called with a new instance of the editor + * @param {Object} config Configurations + */ + init: function(config) { + c = config || {}; + for (var name in defaults) { + if (!(name in c)) + c[name] = defaults[name]; + } - var PanelsViewObj = new PanelsView(obj); + var ppfx = c.pStylePrefix; + if(ppfx) + c.stylePrefix = ppfx + c.stylePrefix; - return { + panels = new Panels(c.defaults); + PanelsViewObj = new PanelsView({ + collection : panels, + config : c, + }); + return this; + }, /** * Returns the collection of panels @@ -175,6 +198,4 @@ define(function(require) { }; }; - - return Panels; }); \ No newline at end of file diff --git a/src/parser/main.js b/src/parser/main.js index 6a81929eb..b45f65690 100644 --- a/src/parser/main.js +++ b/src/parser/main.js @@ -1,22 +1,53 @@ define(function(require) { - var Parser = function(config) { - - var c = config || {}, + var Parser = function() { + var c = {}, defaults = require('./config/config'), parserCss = require('./model/ParserCss'), parserHtml = require('./model/ParserHtml'); + var pHtml, pCss; - // Set default options - for (var name in defaults) { - if (!(name in c)) - c[name] = defaults[name]; - } + return { - var pHtml = new parserHtml(c); - var pCss = new parserCss(c); + /** + * Name of the module + * @type {String} + * @private + */ + name: 'Parser', - return { + /** + * Indicates if module is public + * @type {Boolean} + * @private + */ + public: true, + + /** + * Initialize module. Automatically called with a new instance of the editor + * @param {Object} config Configurations + * @param {Array} [config.blocks=[]] Default blocks + * @return {this} + * @example + * ... + * { + * blocks: [ + * {id:'h1-block' label: 'Heading', content:'

...

'}, + * ... + * ], + * } + * ... + */ + init: function(config) { + c = config || {}; + for (var name in defaults) { + if (!(name in c)) + c[name] = defaults[name]; + } + pHtml = new parserHtml(c); + pCss = new parserCss(c); + return this; + }, /** * Parse HTML string and return valid model diff --git a/src/rich_text_editor/main.js b/src/rich_text_editor/main.js index 6d513c211..8323d879a 100644 --- a/src/rich_text_editor/main.js +++ b/src/rich_text_editor/main.js @@ -1,25 +1,52 @@ define(function(require) { - return function(config) { - var c = config || {}, - defaults = require('./config/config'), - rte = require('./view/TextEditorView'), - CommandButtons = require('./model/CommandButtons'), - CommandButtonsView = require('./view/CommandButtonsView'); - - for (var name in defaults) { - if (!(name in c)) - c[name] = defaults[name]; - } - - var tlbPfx = c.stylePrefix; - var toolbar = new CommandButtonsView({ - collection: new CommandButtons(c.commands), - config: c, - }); + return function() { + var c = {}, + defaults = require('./config/config'), + rte = require('./view/TextEditorView'), + CommandButtons = require('./model/CommandButtons'), + CommandButtonsView = require('./view/CommandButtonsView'); + var tlbPfx, toolbar; return { + /** + * Name of the module + * @type {String} + * @private + */ + name: 'rte', + + /** + * Indicates if module is public + * @type {Boolean} + * @private + */ + public: true, + + /** + * Initialize module. Automatically called with a new instance of the editor + * @param {Object} config Configurations + */ + init: function(config) { + c = config || {}; + for (var name in defaults) { + if (!(name in c)) + c[name] = defaults[name]; + } + + var ppfx = c.pStylePrefix; + if(ppfx) + c.stylePrefix = ppfx + c.stylePrefix; + + tlbPfx = c.stylePrefix; + toolbar = new CommandButtonsView({ + collection: new CommandButtons(c.commands), + config: c, + }); + return this; + }, + /** * Triggered when the offset of the editro is changed * @private @@ -42,6 +69,7 @@ define(function(require) { * @param {View} view * */ attach: function(view){ + console.log('attatch'); view.$el.wysiwyg({}).focus(); this.lastEl = view.el; diff --git a/src/storage_manager/main.js b/src/storage_manager/main.js index 6af8e6b2a..943ce69f9 100644 --- a/src/storage_manager/main.js +++ b/src/storage_manager/main.js @@ -19,45 +19,73 @@ * ``` * * @module StorageManager - * @param {Object} config Configurations - * @param {string} [config.id='gjs-'] The prefix for the fields, useful to differentiate storing/loading - * with multiple editors on the same page. For example, in local storage, the item of HTML will be saved like 'gjs-html' - * @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.type='local'] Default storage type. Available: 'local' | 'remote' | ''(do not store) - * @example - * ... - * storageManager: { - * autosave: false, - * type: 'remote', - * } - * ... */ define(function(require) { - var StorageManager = function(config) { - - var c = config || {}, + var StorageManager = function() { + var c = {}, defaults = require('./config/config'), LocalStorage = require('./model/LocalStorage'), RemoteStorage = require('./model/RemoteStorage'); - for (var name in defaults){ - if (!(name in c)) - c[name] = defaults[name]; - } - var storages = {}; var defaultStorages = {}; - defaultStorages.remote = new RemoteStorage(c); - defaultStorages.local = new LocalStorage(c); - c.currentStorage = c.type; - return { /** + * Name of the module + * @type {String} + * @private + */ + name: 'StorageManager', + + /** + * Indicates if module is public + * @type {Boolean} + * @private + */ + public: true, + + /** + * Initialize module. Automatically called with a new instance of the editor + * @param {Object} config Configurations + * @param {string} [config.id='gjs-'] The prefix for the fields, useful to differentiate storing/loading + * with multiple editors on the same page. For example, in local storage, the item of HTML will be saved like 'gjs-html' + * @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.type='local'] Default storage type. Available: 'local' | 'remote' | ''(do not store) + * @example + * ... + * { + * autosave: false, + * type: 'remote', + * } + * ... + */ + init: function(config) { + c = config || {}; + for (var name in defaults){ + if (!(name in c)) + c[name] = defaults[name]; + } + + defaultStorages.remote = new RemoteStorage(c); + defaultStorages.local = new LocalStorage(c); + c.currentStorage = c.type; + return this; + }, + + /** + * Callback executed after the module is loaded + * @private + */ + onLoad: function(){ + this.loadDefaultProviders().setCurrent(c.type); + }, + + /** * Checks if autosave is enabled * @return {Boolean} * */ diff --git a/src/utils/main.js b/src/utils/main.js index b23bc9054..dc973dbdc 100644 --- a/src/utils/main.js +++ b/src/utils/main.js @@ -5,6 +5,27 @@ define(function(require) { var Sorter = require('./Sorter'); return { + /** + * Name of the module + * @type {String} + * @private + */ + name: 'Utils', + + /** + * Indicates if module is public + * @type {Boolean} + * @private + */ + public: true, + + /** + * Initialize module + */ + init: function() { + return this; + }, + Sorter: Sorter, }; }; diff --git a/test/specs/asset_manager/main.js b/test/specs/asset_manager/main.js index 812c6433f..e4b42c2c5 100644 --- a/test/specs/asset_manager/main.js +++ b/test/specs/asset_manager/main.js @@ -101,7 +101,7 @@ define(['StorageManager','AssetManager', var storageManager; beforeEach(function () { - storageManager = new StorageManager({ + storageManager = new StorageManager().init({ autoload: 0, type: storageId }) diff --git a/test/specs/css_composer/e2e/CssComposer.js b/test/specs/css_composer/e2e/CssComposer.js index b319f59fd..bbd1d8317 100644 --- a/test/specs/css_composer/e2e/CssComposer.js +++ b/test/specs/css_composer/e2e/CssComposer.js @@ -14,7 +14,7 @@ define(['GrapesJS'],function(Grapes) { Grapes = Grapes; this.gjs = Grapes.init({ stylePrefix: '', - storage: { autoload: 0, type:'none' }, + storageManager: { autoload: 0, type:'none' }, assetManager: { storageType: 'none', }, container: 'csscomposer-fixture', }); @@ -44,7 +44,7 @@ define(['GrapesJS'],function(Grapes) { it('Rules are correctly imported from default property', function() { var gj = new Grapes.init({ stylePrefix: '', - storage: { autoload: 0, type:'none' }, + storageManager: { autoload: 0, type:'none' }, assetManager: { storageType: 'none', }, cssComposer: { defaults: this.rulesSet}, container: 'csscomposer-fixture', diff --git a/test/specs/device_manager/main.js b/test/specs/device_manager/main.js index b976afe94..0c9db3b4e 100644 --- a/test/specs/device_manager/main.js +++ b/test/specs/device_manager/main.js @@ -16,7 +16,7 @@ define([ 'DeviceManager', beforeEach(function () { testNameDevice = 'Tablet'; testWidthDevice = '100px'; - obj = new DeviceManager(); + obj = new DeviceManager().init(); }); afterEach(function () { diff --git a/test/specs/grapesjs/main.js b/test/specs/grapesjs/main.js index 304ec8265..00573b5ef 100644 --- a/test/specs/grapesjs/main.js +++ b/test/specs/grapesjs/main.js @@ -34,7 +34,7 @@ define(['GrapesJS', 'PluginManager', 'chai'], documentEl = '' + htmlString; config = { container: '#' + editorName, - storage: { + storageManager: { autoload: 0, type:'none' }, @@ -134,7 +134,7 @@ define(['GrapesJS', 'PluginManager', 'chai'], obj.plugins.add(pluginName, function(edt){ edt.StorageManager.add(storageId, storageMock); }); - config.storage.type = storageId; + config.storageManager.type = storageId; config.plugins = [pluginName]; var editor = obj.init(config); editor.setComponents(htmlString); diff --git a/test/specs/panels/main.js b/test/specs/panels/main.js index b1aece998..df8abc3fe 100644 --- a/test/specs/panels/main.js +++ b/test/specs/panels/main.js @@ -26,7 +26,7 @@ define([ var obj; beforeEach(function () { - obj = new Panels(); + obj = new Panels().init(); }); afterEach(function () { diff --git a/test/specs/selector_manager/e2e/ClassManager.js b/test/specs/selector_manager/e2e/ClassManager.js index 9487755b3..64a918362 100644 --- a/test/specs/selector_manager/e2e/ClassManager.js +++ b/test/specs/selector_manager/e2e/ClassManager.js @@ -33,7 +33,7 @@ define(['GrapesJS', 'SelectorManager/model/Selectors', 'SelectorManager/view/Cla beforeEach(function () { this.gjs = GrapesJS.init({ stylePrefix: '', - storage: { autoload: 0, type:'none' }, + storageManager: { autoload: 0, type:'none' }, assetManager: { storageType: 'none', }, diff --git a/test/specs/storage_manager/main.js b/test/specs/storage_manager/main.js index 9424193a0..bf66a60fb 100644 --- a/test/specs/storage_manager/main.js +++ b/test/specs/storage_manager/main.js @@ -16,7 +16,7 @@ define([ var obj; beforeEach(function () { - obj = new StorageManager(); + obj = new StorageManager().init(); }); afterEach(function () { @@ -93,7 +93,7 @@ define([ beforeEach(function () { storeValue = []; - obj = new StorageManager({ + obj = new StorageManager().init({ type: storageId, }); obj.add(storageId, storage);