From 1da4729142ba03882aaa0116881878ddb062adc2 Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Fri, 1 Apr 2022 16:40:00 +0200 Subject: [PATCH] Refactor code manager files to classes --- src/code_manager/model/CodeMirrorEditor.js | 49 +++++++++++----------- src/code_manager/model/CssGenerator.js | 26 ++++++------ src/code_manager/model/HtmlGenerator.js | 2 +- src/code_manager/model/JsGenerator.js | 10 ++--- src/code_manager/model/JsonGenerator.js | 17 ++++---- src/code_manager/view/EditorView.js | 4 +- 6 files changed, 54 insertions(+), 54 deletions(-) diff --git a/src/code_manager/model/CodeMirrorEditor.js b/src/code_manager/model/CodeMirrorEditor.js index 6ecd89b3c..aaa8dc86f 100644 --- a/src/code_manager/model/CodeMirrorEditor.js +++ b/src/code_manager/model/CodeMirrorEditor.js @@ -1,6 +1,6 @@ import { bindAll } from 'underscore'; -import Backbone from 'backbone'; -import { hasWin } from 'utils/mixins'; +import { Model } from '../../common'; +import { hasWin } from '../../utils/mixins'; let CodeMirror; @@ -11,40 +11,39 @@ if (hasWin()) { require('codemirror-formatting'); } -export default Backbone.Model.extend({ - CodeMirror, - - defaults: { - input: '', - label: '', - codeName: '', - theme: 'hopscotch', - readOnly: true, - lineNumbers: true - }, +export default class CodeMirrorEditor extends Model { + defaults() { + return { + input: '', + label: '', + codeName: '', + theme: 'hopscotch', + readOnly: true, + lineNumbers: true, + }; + } - /** @inheritdoc */ init(el) { bindAll(this, 'onChange'); this.editor = CodeMirror.fromTextArea(el, { dragDrop: false, lineWrapping: true, mode: this.get('codeName'), - ...this.attributes + ...this.attributes, }); this.element = el; this.editor.on('change', this.onChange); return this; - }, + } onChange() { this.trigger('update', this); - }, + } getEditor() { return this.editor; - }, + } /** * The element where the viewer is attached @@ -52,7 +51,7 @@ export default Backbone.Model.extend({ */ getElement() { return this.element; - }, + } /** * Set the element which contains the viewer attached. @@ -64,7 +63,7 @@ export default Backbone.Model.extend({ setElement(el) { this.element = el; return this; - }, + } /** * Refresh the viewer @@ -73,7 +72,7 @@ export default Backbone.Model.extend({ refresh() { this.getEditor().refresh(); return this; - }, + } /** * Focus the viewer @@ -82,12 +81,12 @@ export default Backbone.Model.extend({ focus() { this.getEditor().focus(); return this; - }, + } getContent() { const ed = this.getEditor(); return ed && ed.getValue(); - }, + } /** @inheritdoc */ setContent(v, opts = {}) { @@ -103,4 +102,6 @@ export default Backbone.Model.extend({ !opts.noRefresh && setTimeout(() => this.refresh()); } -}); +} + +CodeMirrorEditor.prototype.CodeMirror = CodeMirror; diff --git a/src/code_manager/model/CssGenerator.js b/src/code_manager/model/CssGenerator.js index 46a3f8cb0..82ddc03d2 100644 --- a/src/code_manager/model/CssGenerator.js +++ b/src/code_manager/model/CssGenerator.js @@ -1,6 +1,6 @@ -import Backbone from 'backbone'; import { bindAll, isUndefined, each } from 'underscore'; -import { hasWin } from 'utils/mixins'; +import { Model } from '../../common'; +import { hasWin } from '../../utils/mixins'; const maxValue = Number.MAX_VALUE; @@ -9,12 +9,12 @@ export const getMediaLength = mediaQuery => { return !length ? '' : length[0]; }; -export default Backbone.Model.extend({ +export default class CssGenerator extends Model { initialize() { bindAll(this, 'sortRules'); this.compCls = []; this.ids = []; - }, + } /** * Get CSS from a component @@ -39,7 +39,7 @@ export default Backbone.Model.extend({ const components = model.components(); components.each(model => (code += this.buildFromModel(model, opts))); return code; - }, + } build(model, opts = {}) { const { json } = opts; @@ -110,7 +110,7 @@ export default Backbone.Model.extend({ } return json ? codeJson.filter(r => r) : code; - }, + } /** * Get CSS from the rule model @@ -141,7 +141,7 @@ export default Backbone.Model.extend({ } return result; - }, + } /** * Get matched rules of a component @@ -174,7 +174,7 @@ export default Backbone.Model.extend({ result = result.filter((rule, i) => result.indexOf(rule) === i); return result; - }, + } /** * Get the numeric length of the media query string @@ -186,7 +186,7 @@ export default Backbone.Model.extend({ if (!length) return maxValue; return parseFloat(length[1]); - }, + } /** * Return a sorted array from media query object @@ -202,7 +202,7 @@ export default Backbone.Model.extend({ const right = isMobFirst ? b.key : a.key; return this.getQueryLength(left) - this.getQueryLength(right); }); - }, + } sortRules(a, b) { const getKey = rule => rule.get('mediaText'); @@ -210,7 +210,7 @@ export default Backbone.Model.extend({ const left = isMobFirst ? getKey(a) : getKey(b); const right = isMobFirst ? getKey(b) : getKey(a); return this.getQueryLength(left) - this.getQueryLength(right); - }, + } /** * Return passed selector without states @@ -223,5 +223,5 @@ export default Backbone.Model.extend({ .split(' ') .map(item => item.split(':')[0]) .join(' '); - }, -}); + } +} diff --git a/src/code_manager/model/HtmlGenerator.js b/src/code_manager/model/HtmlGenerator.js index 83bf63cef..e8e728502 100644 --- a/src/code_manager/model/HtmlGenerator.js +++ b/src/code_manager/model/HtmlGenerator.js @@ -1,4 +1,4 @@ -import { Model } from 'backbone'; +import { Model } from '../../common'; export default class HTMLGenerator extends Model { build(model, opts = {}) { diff --git a/src/code_manager/model/JsGenerator.js b/src/code_manager/model/JsGenerator.js index 8a1753466..162e4e520 100644 --- a/src/code_manager/model/JsGenerator.js +++ b/src/code_manager/model/JsGenerator.js @@ -1,12 +1,12 @@ import { extend } from 'underscore'; -import Backbone from 'backbone'; +import { Model } from '../../common'; function isFunctionEmpty(fn) { const content = fn.toString().match(/\{([\s\S]*)\}/m)[1]; // content between first and last { } return content.replace(/^\s*\/\/.*$/gm, '').trim().length === 0; // remove comments } -export default Backbone.Model.extend({ +export default class JsGenerator extends Model { mapModel(model) { var code = ''; var script = model.get('script-export') || model.get('script'); @@ -49,7 +49,7 @@ export default Backbone.Model.extend({ }, this); return code; - }, + } build(model) { this.mapJs = {}; @@ -88,5 +88,5 @@ export default Backbone.Model.extend({ } return code; - }, -}); + } +} diff --git a/src/code_manager/model/JsonGenerator.js b/src/code_manager/model/JsonGenerator.js index 26c0cdad6..302e0d7ba 100644 --- a/src/code_manager/model/JsonGenerator.js +++ b/src/code_manager/model/JsonGenerator.js @@ -1,23 +1,22 @@ import { each } from 'underscore'; -import Backbone from 'backbone'; +import { Model, Collection } from '../../common'; -export default Backbone.Model.extend({ - /** @inheritdoc */ +export default class JsonGenerator extends Model { build(model) { var json = model.toJSON(); this.beforeEach(json); each( json, - function(v, attr) { + function (v, attr) { var obj = json[attr]; - if (obj instanceof Backbone.Model) { + if (obj instanceof Model) { json[attr] = this.build(obj); - } else if (obj instanceof Backbone.Collection) { + } else if (obj instanceof Collection) { var coll = obj; json[attr] = []; if (coll.length) { - coll.each(function(el, index) { + coll.each(function (el, index) { json[attr][index] = this.build(el); }, this); } @@ -27,7 +26,7 @@ export default Backbone.Model.extend({ ); return json; - }, + } /** * Execute on each object @@ -36,4 +35,4 @@ export default Backbone.Model.extend({ beforeEach(obj) { delete obj.status; } -}); +} diff --git a/src/code_manager/view/EditorView.js b/src/code_manager/view/EditorView.js index d25571b1a..7e7e27b16 100644 --- a/src/code_manager/view/EditorView.js +++ b/src/code_manager/view/EditorView.js @@ -1,5 +1,5 @@ -import html from 'utils/html'; -import { View } from 'backbone'; +import { View } from '../../common'; +import html from '../../utils/html'; export default class EditorView extends View { template({ pfx, codeName, label }) {