From 366f14ef289673ca702befaaf92195cce3b9178a Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Wed, 18 May 2016 23:37:51 +0200 Subject: [PATCH] Refactor CodeManager --- src/code_manager/main.js | 325 ++++++++----------- src/code_manager/model/CodeMirrorEditor.js | 6 - src/code_manager/model/CssGenerator.js | 6 - src/code_manager/model/EditorInterface.js | 31 -- src/code_manager/model/GeneratorInterface.js | 26 -- src/code_manager/model/HtmlGenerator.js | 5 - src/code_manager/model/JsonGenerator.js | 6 - src/commands/view/ExportTemplate.js | 2 +- src/editor/model/Editor.js | 2 +- 9 files changed, 137 insertions(+), 272 deletions(-) delete mode 100644 src/code_manager/model/EditorInterface.js delete mode 100644 src/code_manager/model/GeneratorInterface.js diff --git a/src/code_manager/main.js b/src/code_manager/main.js index a7a9c4d4f..a826651a4 100644 --- a/src/code_manager/main.js +++ b/src/code_manager/main.js @@ -1,254 +1,199 @@ +/** + * - [addGenerator](#addgenerator) + * - [getGenerator](#getgenerator) + * - [getGenerators](#getgenerators) + * - [addViewer](#addviewer) + * - [getViewer](#getviewer) + * - [getViewers](#getviewers) + * - [updateViewer](#updateviewer) + * - [getCode](#getcode) + * + * + * Before using methods you should get first the module from the editor instance, in this way: + * + * ```js + * var codeManager = editor.get('CodeManager'); + * ``` + * + * @module CodeManager + */ define(function(require) { - /** - * @class CodeManager - * @param {Object} Configurations - * - * @return {Object} - * */ - function CodeManager(config) - { - var c = config || {}, - defaults = require('./config/config'), - gInterface = require('./model/GeneratorInterface'), - gHtml = require('./model/HtmlGenerator'), - gCss = require('./model/CssGenerator'), - gJson = require('./model/JsonGenerator'), - eInterface = require('./model/EditorInterface'), - eCM = require('./model/CodeMirrorEditor'), - editorView = require('./view/EditorView'); + + var CodeManager = function(config) { + + var c = config || {}, + defaults = require('./config/config'), + gHtml = require('./model/HtmlGenerator'), + gCss = require('./model/CssGenerator'), + gJson = require('./model/JsonGenerator'), + eCM = require('./model/CodeMirrorEditor'), + editorView = require('./view/EditorView'); for (var name in defaults) { if (!(name in c)) c[name] = defaults[name]; } - this.gi = new gInterface(); - this.generators = {}; - this.defaultGenerators = {}; - this.currentGenerator = null; + var generators = {}, + defGenerators = {}, + viewers = {}, + defViewers = {}, + geHtml = new gHtml(), + geCss = new gCss(), + geJson = new gJson(), + edCM = new eCM(); - this.ei = new eInterface(); - this.editors = {}; - this.defaultEditors = {}; - this.currentEditor = null; + defGenerators.html = geHtml; + defGenerators.css = geCss; + defGenerators.json = geJson; - var geHtml = new gHtml(), - geCss = new gCss(), - geJson = new gJson(), - edCM = new eCM(); + defViewers.CodeMirror = edCM; - this.defaultGenerators[geHtml.getId()] = geHtml; - this.defaultGenerators[geCss.getId()] = geCss; - this.defaultGenerators[geJson.getId()] = geJson; + return { - this.defaultEditors[edCM.getId()] = edCM; + config: c, - this.EditorView = editorView; - this.config = c; - } - - CodeManager.prototype = { + EditorView: editorView, /** - * Add new code generator - * @param {GeneratorInterface} generator - * - * @return this + * Add new code generator to the collection + * @param {string} id Code generator ID + * @param {Object} generator Code generator wrapper + * @param {Function} generator.build Function that builds the code + * @return {this} + * @example + * codeManager.addGenerator('html7',{ + * build: function(model){ + * return 'myCode'; + * } + * }); * */ - addGenerator : function(generator) - { - // Check interface implementation - for (var method in this.gi) - if(!generator[method]){ - console.warn("addGenerator: method '"+ method +"' was not found"); - return; - } - - var id = generator.getId(); - this.generators[id] = generator; - - if(!this.currentGenerator) - this.currentGenerator = id; - + addGenerator: function(id, generator) { + generators[id] = generator; return this; }, /** - * Returns generator - * @param {String}|{Integer} id Generator ID - * - * @return {GeneratorInterface}|null + * Get code generator by id + * @param {string} id Code generator ID + * @return {Object|null} + * @example + * var generator = codeManager.getGenerator('html7'); + * generator.build = function(model){ + * //extend + * }; * */ - getGenerator : function(id) - { - if(id && this.generators[id]) - generator = this.generators[id]; - - return generator ? generator : null; + getGenerator: function(id) { + return generators[id] || null; }, /** - * Returns generators - * - * @return {Array} + * Returns all code generators + * @return {Array} * */ - getGenerators : function() - { - return this.generators; + getGenerators: function() { + return generators; }, /** - * Get current generator - * - * @return {GeneratorInterface} + * Add new code viewer + * @param {string} id Code viewer ID + * @param {Object} viewer Code viewer wrapper + * @param {Function} viewer.init Set element on which viewer will be displayed + * @param {Function} viewer.setContent Set content to the viewer + * @return {this} + * @example + * codeManager.addViewer('ace',{ + * init: function(el){ + * var ace = require('ace-editor'); + * this.editor = ace.edit(el.id); + * }, + * setContent: function(code){ + * this.editor.setValue(code); + * } + * }); * */ - getCurrentGenerator : function() - { - if(!this.currentGenerator) - this.loadDefaultGenerators(); - return this.getGenerator(this.currentGenerator); - }, - - /** - * Set current generator - * @param {Integer} id Generator ID - * - * @return this - * */ - setCurrentGenerator : function(id) - { - this.currentGenerator = id; + addViewer: function(id, viewer) { + viewers[id] = viewer; return this; }, /** - * Load default generators - * - * @return this + * Get code viewer by id + * @param {string} id Code viewer ID + * @return {Object|null} + * @example + * var viewer = codeManager.getViewer('ace'); * */ - loadDefaultGenerators : function() - { - for (var id in this.defaultGenerators) { - this.addGenerator(this.defaultGenerators[id]); - } - - return this; + getViewer: function(id) { + return viewers[id] || null; }, /** - * Add new editor - * @param {EditorInterface} editor - * - * @return this + * Returns all code viewers + * @return {Array} * */ - addEditor : function(editor) - { - // Check interface implementation - for (var method in this.ei) - if(!editor[method]){ - console.warn("addEditor: method '"+ method +"' was not found"); - return; - } - - var id = editor.getId(); - this.editors[id] = editor; - - if(!this.currentEditor) - this.currentEditor = id; - - return this; + getViewers: function() { + return viewers; }, /** - * Returns editor - * @param {String}|{Integer} id Editor ID - * - * @return {EditorInterface}|null + * Update code viewer content + * @param {Object} viewer Viewer instance + * @param {string} code Code string + * @example + * var AceViewer = codeManager.getViewer('ace'); + * // ... + * var viewer = AceViewer.init(el); + * // ... + * codeManager.updateViewer(AceViewer, 'code'); * */ - getEditor : function(id) - { - if(id && this.editors[id]) - editor = this.editors[id]; - - return editor ? editor : null; + updateViewer: function(viewer, code) { + viewer.setContent(code); }, /** - * Returns editors - * - * @return {Array} + * Get code from model + * @param {Object} model Any kind of model that will be passed to the build method of generator + * @param {string} genId Code generator id + * @param {Object} [opt] Options + * @return {string} + * @example + * var codeStr = codeManager.getCode(model, 'html'); * */ - getEditors : function() - { - return this.editors; + getCode: function(model, genId, opt) { + var generator = this.getGenerator(genId); + return generator ? generator.build(model, opt) : ''; }, /** - * Get current editor - * - * @return {EditorInterface} + * Load default code generators + * @return {this} + * @private * */ - getCurrentEditor : function() - { - if(!this.currentEditor) - this.loadDefaultEditors(); - return this.getEditor(this.currentEditor); - }, + loadDefaultGenerators: function() { + for (var id in defGenerators) + this.addGenerator(id, defGenerators[id]); - /** - * Set current editor - * @param {Integer} id Editor ID - * - * @return this - * */ - setCurrentEditor : function(id) - { - this.currentEditor = id; return this; }, /** - * Load default editors - * - * @return this + * Load default code viewers + * @return {this} + * @private * */ - loadDefaultEditors : function() - { - for (var id in this.defaultEditors) { - this.addEditor(this.defaultEditors[id]); - } + loadDefaultViewers: function() { + for (var id in defViewers) + this.addViewer(id, defViewers[id]); return this; }, - /** - * Get code by name - * @param {Backbone.Model} model Model - * @param {String}|{Integer} v Id of code generator - * - * @return {String}|null - * */ - getCode : function(model, v, em) - { - var id = v || this.currentGenerator, - generator = this.generators[id]; - return generator ? generator.build(model, em) : null; - }, - - /** - * Update editor content - * @param {EditorInteface} editor Editor - * @param {String} code Code value - * - * @return void - * */ - updateEditor : function(editor, code) - { - editor.setContent(code); - }, - + }; }; return CodeManager; + }); \ No newline at end of file diff --git a/src/code_manager/model/CodeMirrorEditor.js b/src/code_manager/model/CodeMirrorEditor.js index cd8201bbb..3ea2fda9c 100644 --- a/src/code_manager/model/CodeMirrorEditor.js +++ b/src/code_manager/model/CodeMirrorEditor.js @@ -19,12 +19,6 @@ define(['backbone', lineNumbers : true, }, - /** @inheritdoc */ - getId : function() - { - return 'CodeMirror'; - }, - /** @inheritdoc */ init: function(el) { diff --git a/src/code_manager/model/CssGenerator.js b/src/code_manager/model/CssGenerator.js index 1a6b73f9f..44c1cd639 100644 --- a/src/code_manager/model/CssGenerator.js +++ b/src/code_manager/model/CssGenerator.js @@ -9,12 +9,6 @@ define(['backbone'], this.compCls = []; }, - /** @inheritdoc */ - getId : function() - { - return 'css'; - }, - /** * Get CSS from components * @return {String} diff --git a/src/code_manager/model/EditorInterface.js b/src/code_manager/model/EditorInterface.js deleted file mode 100644 index a47a6b3e2..000000000 --- a/src/code_manager/model/EditorInterface.js +++ /dev/null @@ -1,31 +0,0 @@ -define(function() { - /** - * @class EditorInterface - * */ - function EditorInterface() {} - - EditorInterface.prototype = { - - /** - * Get id - * - * @return {String}|{Integer} - * */ - getId : function(){}, - - /** - * Set content - * @param {String} str - * - * */ - setContent : function(str){}, - - /** - * Init editor - * @param {Object} el DOM element - * */ - init : function(el){}, - }; - - return EditorInterface; -}); \ No newline at end of file diff --git a/src/code_manager/model/GeneratorInterface.js b/src/code_manager/model/GeneratorInterface.js deleted file mode 100644 index 91cee0ebe..000000000 --- a/src/code_manager/model/GeneratorInterface.js +++ /dev/null @@ -1,26 +0,0 @@ -define(function() { - /** - * @class GeneratorInterface - * */ - function GeneratorInterface() {} - - GeneratorInterface.prototype = { - - /** - * Get id - * - * @return {String}|{Integer} - * */ - getId : function(){}, - - /** - * Generate code from model - * @param {Backbone.Model} model - * - * @return {String} - * */ - build : function(model){}, - }; - - return GeneratorInterface; -}); \ No newline at end of file diff --git a/src/code_manager/model/HtmlGenerator.js b/src/code_manager/model/HtmlGenerator.js index acd1c89b2..9c35c5a4b 100644 --- a/src/code_manager/model/HtmlGenerator.js +++ b/src/code_manager/model/HtmlGenerator.js @@ -5,11 +5,6 @@ define(['backbone'], * */ return Backbone.Model.extend({ - /** @inheritdoc */ - getId : function(){ - return 'html'; - }, - /** @inheritdoc */ build: function(model){ var coll = model.get('components') || model, diff --git a/src/code_manager/model/JsonGenerator.js b/src/code_manager/model/JsonGenerator.js index 67c2e5f61..d048fbae8 100644 --- a/src/code_manager/model/JsonGenerator.js +++ b/src/code_manager/model/JsonGenerator.js @@ -5,12 +5,6 @@ define(['backbone'], * */ return Backbone.Model.extend({ - /** @inheritdoc */ - getId : function() - { - return 'json'; - }, - /** @inheritdoc */ build: function(model) { diff --git a/src/commands/view/ExportTemplate.js b/src/commands/view/ExportTemplate.js index 61162411b..33d36522b 100644 --- a/src/commands/view/ExportTemplate.js +++ b/src/commands/view/ExportTemplate.js @@ -26,7 +26,7 @@ define(function() { buildEditor: function(codeName, theme, label) { if(!this.codeMirror) - this.codeMirror = this.cm.getEditor('CodeMirror'); + this.codeMirror = this.cm.getViewer('CodeMirror'); var $input = $('