Browse Source

Refactor CodeManager

pull/36/head
Artur Arseniev 10 years ago
parent
commit
366f14ef28
  1. 325
      src/code_manager/main.js
  2. 6
      src/code_manager/model/CodeMirrorEditor.js
  3. 6
      src/code_manager/model/CssGenerator.js
  4. 31
      src/code_manager/model/EditorInterface.js
  5. 26
      src/code_manager/model/GeneratorInterface.js
  6. 5
      src/code_manager/model/HtmlGenerator.js
  7. 6
      src/code_manager/model/JsonGenerator.js
  8. 2
      src/commands/view/ExportTemplate.js
  9. 2
      src/editor/model/Editor.js

325
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<Object>}
* */
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<Object>}
* */
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;
});

6
src/code_manager/model/CodeMirrorEditor.js

@ -19,12 +19,6 @@ define(['backbone',
lineNumbers : true,
},
/** @inheritdoc */
getId : function()
{
return 'CodeMirror';
},
/** @inheritdoc */
init: function(el)
{

6
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}

31
src/code_manager/model/EditorInterface.js

@ -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;
});

26
src/code_manager/model/GeneratorInterface.js

@ -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;
});

5
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,

6
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)
{

2
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 = $('<textarea>'),

2
src/editor/model/Editor.js

@ -261,7 +261,7 @@ define([
pfx = cfg.stylePrefix || 'cm-';
cfg.stylePrefix = this.config.stylePrefix + pfx;
this.cm = new CodeManager(cfg);
this.cm.loadDefaultGenerators().loadDefaultEditors();
this.cm.loadDefaultGenerators().loadDefaultViewers();
this.set('CodeManager', this.cm);
},

Loading…
Cancel
Save