From 0a602fc145476f91c8581bc0d025ae82ada6a99d Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Fri, 1 Apr 2022 17:59:20 +0200 Subject: [PATCH] More refactor of files to classes --- src/index.js | 15 ++-- src/rich_text_editor/index.js | 2 +- src/rich_text_editor/model/RichTextEditor.js | 2 +- src/selector_manager/index.js | 5 +- src/selector_manager/model/Selector.js | 8 +- src/selector_manager/model/Selectors.js | 11 +-- src/selector_manager/model/State.js | 4 +- src/selector_manager/view/ClassTagView.js | 36 ++++---- src/selector_manager/view/ClassTagsView.js | 88 ++++++++++---------- src/storage_manager/index.js | 2 +- src/storage_manager/model/LocalStorage.js | 2 +- src/storage_manager/model/RemoteStorage.js | 2 +- src/style_manager/index.js | 5 +- src/style_manager/model/Layer.js | 4 +- src/style_manager/model/Layers.js | 2 +- src/style_manager/model/Property.js | 4 +- src/style_manager/model/PropertyNumber.js | 4 +- src/style_manager/model/PropertySelect.js | 4 +- src/style_manager/model/PropertyStack.js | 2 +- src/style_manager/model/Sector.js | 4 +- src/style_manager/model/Sectors.js | 2 +- src/style_manager/view/LayerView.js | 2 +- src/style_manager/view/LayersView.js | 2 +- src/style_manager/view/PropertiesView.js | 4 +- src/style_manager/view/PropertyColorView.js | 2 +- src/style_manager/view/PropertyView.js | 4 +- src/style_manager/view/SectorView.js | 4 +- src/style_manager/view/SectorsView.js | 4 +- src/trait_manager/index.js | 2 +- src/trait_manager/model/Trait.js | 2 +- src/trait_manager/model/Traits.js | 2 +- src/trait_manager/view/TraitColorView.js | 2 +- src/trait_manager/view/TraitNumberView.js | 4 +- src/trait_manager/view/TraitsView.js | 2 +- src/utils/ColorPicker.js | 2 +- src/utils/Dragger.js | 26 +++--- src/utils/Droppable.js | 20 ++--- src/utils/Resizer.js | 39 ++++----- src/utils/extender.js | 34 ++++---- src/utils/fetch.js | 4 +- 40 files changed, 177 insertions(+), 192 deletions(-) diff --git a/src/index.js b/src/index.js index 6fa13e930..4b92d2cbb 100644 --- a/src/index.js +++ b/src/index.js @@ -1,8 +1,8 @@ import { isElement, isFunction } from 'underscore'; -import $ from 'utils/cash-dom'; +import $ from './utils/cash-dom'; import Editor from './editor'; -import polyfills from 'utils/polyfills'; -import { getGlobal } from 'utils/mixins'; +import polyfills from './utils/polyfills'; +import { getGlobal } from './utils/mixins'; import PluginManager from './plugin_manager'; polyfills(); @@ -17,7 +17,7 @@ const defaultConfig = { plugins: [], // Custom options for plugins - pluginsOpts: {} + pluginsOpts: {}, }; export default { @@ -51,8 +51,7 @@ export default { const els = config.container; if (!els && !headless) throw new Error("'container' is required"); config = { ...defaultConfig, ...config, grapesjs: this }; - config.el = - !headless && (isElement(els) ? els : document.querySelector(els)); + config.el = !headless && (isElement(els) ? els : document.querySelector(els)); const editor = new Editor(config, { $ }).init(); const em = editor.getModel(); @@ -74,7 +73,7 @@ export default { } else { em.logWarning(`Plugin ${pluginId} not found`, { context: 'plugins', - plugin: pluginId + plugin: pluginId, }); } }); @@ -87,5 +86,5 @@ export default { editors.push(editor); return editor; - } + }, }; diff --git a/src/rich_text_editor/index.js b/src/rich_text_editor/index.js index 4af3e4860..1f54bf8f7 100644 --- a/src/rich_text_editor/index.js +++ b/src/rich_text_editor/index.js @@ -36,8 +36,8 @@ * @module RichTextEditor */ +import { on, hasWin } from '../utils/mixins'; import RichTextEditor from './model/RichTextEditor'; -import { on, hasWin } from 'utils/mixins'; import defaults from './config/config'; const eventsUp = 'change:canvasOffset frame:scroll component:update'; diff --git a/src/rich_text_editor/model/RichTextEditor.js b/src/rich_text_editor/model/RichTextEditor.js index ea2031e51..a8d13ac76 100644 --- a/src/rich_text_editor/model/RichTextEditor.js +++ b/src/rich_text_editor/model/RichTextEditor.js @@ -2,7 +2,7 @@ // and adapted to the GrapesJS's need import { isString } from 'underscore'; -import { on, off, getPointerEvent, getModel } from 'utils/mixins'; +import { on, off, getPointerEvent, getModel } from '../../utils/mixins'; const RTE_KEY = '_rte'; diff --git a/src/selector_manager/index.js b/src/selector_manager/index.js index 41307a525..bae352a2e 100644 --- a/src/selector_manager/index.js +++ b/src/selector_manager/index.js @@ -73,9 +73,8 @@ */ import { isString, debounce, isObject, isArray } from 'underscore'; -import { isComponent, isRule } from 'utils/mixins'; -import { Model, Collection } from 'common'; -import Module from 'common/module'; +import { isComponent, isRule } from '../utils/mixins'; +import { Model, Collection, Module } from '../common'; import defaults from './config/config'; import Selector from './model/Selector'; import Selectors from './model/Selectors'; diff --git a/src/selector_manager/model/Selector.js b/src/selector_manager/model/Selector.js index f99438e49..b4e44b757 100644 --- a/src/selector_manager/model/Selector.js +++ b/src/selector_manager/model/Selector.js @@ -1,5 +1,5 @@ -import { Model } from 'common'; import { result, forEach, keys } from 'underscore'; +import { Model } from '../../common'; const TYPE_CLASS = 1; const TYPE_ID = 2; @@ -22,7 +22,7 @@ export default class Selector extends Model { active: true, private: false, protected: false, - _undo: true + _undo: true, }; } @@ -39,9 +39,7 @@ export default class Selector extends Model { const namePreEsc = this.get('name'); const { escapeName } = config; - const nameEsc = escapeName - ? escapeName(namePreEsc) - : Selector.escapeName(namePreEsc); + const nameEsc = escapeName ? escapeName(namePreEsc) : Selector.escapeName(namePreEsc); this.set('name', nameEsc); this.em = config.em; } diff --git a/src/selector_manager/model/Selectors.js b/src/selector_manager/model/Selectors.js index 98143525b..e00617b8b 100644 --- a/src/selector_manager/model/Selectors.js +++ b/src/selector_manager/model/Selectors.js @@ -1,5 +1,5 @@ import { filter } from 'underscore'; -import { Collection } from 'common'; +import { Collection } from '../../common'; import Selector from './Selector'; const combine = (tail, curr) => { @@ -17,16 +17,11 @@ export default class Selectors extends Collection { } getStyleable() { - return filter( - this.models, - item => item.get('active') && !item.get('private') - ); + return filter(this.models, item => item.get('active') && !item.get('private')); } getValid({ noDisabled } = {}) { - return filter(this.models, item => !item.get('private')).filter(item => - noDisabled ? item.get('active') : 1 - ); + return filter(this.models, item => !item.get('private')).filter(item => (noDisabled ? item.get('active') : 1)); } getFullString(collection, opts = {}) { diff --git a/src/selector_manager/model/State.js b/src/selector_manager/model/State.js index c7512401c..0669a1349 100644 --- a/src/selector_manager/model/State.js +++ b/src/selector_manager/model/State.js @@ -1,4 +1,4 @@ -import { Model } from 'common'; +import { Model } from '../../common'; /** * @typedef State @@ -9,7 +9,7 @@ export default class State extends Model { defaults() { return { name: '', - label: '' + label: '', }; } diff --git a/src/selector_manager/view/ClassTagView.js b/src/selector_manager/view/ClassTagView.js index c72e8dd4c..b5d9af49f 100644 --- a/src/selector_manager/view/ClassTagView.js +++ b/src/selector_manager/view/ClassTagView.js @@ -1,8 +1,8 @@ -import Backbone from 'backbone'; +import { View } from '../../common'; const inputProp = 'contentEditable'; -export default Backbone.View.extend({ +export default class ClassTagView extends View { template() { const { pfx, model, config } = this; const label = model.get('label') || ''; @@ -14,14 +14,16 @@ export default Backbone.View.extend({ ${config.iconTagRemove} `; - }, + } - events: { - 'click [data-tag-remove]': 'removeTag', - 'click [data-tag-status]': 'changeStatus', - 'dblclick [data-tag-name]': 'startEditTag', - 'focusout [data-tag-name]': 'endEditTag' - }, + events() { + return { + 'click [data-tag-remove]': 'removeTag', + 'click [data-tag-status]': 'changeStatus', + 'dblclick [data-tag-name]': 'startEditTag', + 'focusout [data-tag-name]': 'endEditTag', + }; + } initialize(o = {}) { const config = o.config || {}; @@ -32,7 +34,7 @@ export default Backbone.View.extend({ this.ppfx = config.pStylePrefix || ''; this.em = config.em; this.listenTo(this.model, 'change:active', this.updateStatus); - }, + } /** * Returns the element which containes the anme of the tag @@ -44,7 +46,7 @@ export default Backbone.View.extend({ } return this.inputEl; - }, + } /** * Start editing tag @@ -56,7 +58,7 @@ export default Backbone.View.extend({ inputEl[inputProp] = true; inputEl.focus(); em && em.setEditing(1); - }, + } /** * End editing tag. If the class typed already exists the @@ -81,7 +83,7 @@ export default Backbone.View.extend({ model.set({ name, label }); } } - }, + } /** * Update status of the tag @@ -90,7 +92,7 @@ export default Backbone.View.extend({ changeStatus() { const { model } = this; model.set('active', !model.get('active')); - }, + } /** * Remove tag from the selected component @@ -99,7 +101,7 @@ export default Backbone.View.extend({ */ removeTag() { this.module.removeSelected(this.model); - }, + } /** * Update status of the checkbox @@ -117,7 +119,7 @@ export default Backbone.View.extend({ $chk.html(iconTagOff); $el.addClass('opac50'); } - }, + } render() { const pfx = this.pfx; @@ -127,4 +129,4 @@ export default Backbone.View.extend({ this.updateStatus(); return this; } -}); +} diff --git a/src/selector_manager/view/ClassTagsView.js b/src/selector_manager/view/ClassTagsView.js index ec54090b6..f3e7596b1 100644 --- a/src/selector_manager/view/ClassTagsView.js +++ b/src/selector_manager/view/ClassTagsView.js @@ -1,9 +1,9 @@ import { isEmpty, isArray, isString, debounce } from 'underscore'; -import Backbone from 'backbone'; +import { View } from '../../common'; import ClassTagView from './ClassTagView'; import html from 'utils/html'; -export default Backbone.View.extend({ +export default class ClassTagsView extends View { template({ labelInfo, labelHead, iconSync, iconAdd, pfx, ppfx }) { return `
@@ -35,15 +35,17 @@ export default Backbone.View.extend({
${labelInfo}:
`; - }, - - events: { - 'change [data-states]': 'stateChanged', - 'click [data-add]': 'startNewTag', - 'focusout [data-input]': 'endNewTag', - 'keyup [data-input]': 'onInputKeyUp', - 'click [data-sync-style]': 'syncStyle', - }, + } + + events() { + return { + 'change [data-states]': 'stateChanged', + 'click [data-add]': 'startNewTag', + 'focusout [data-input]': 'endNewTag', + 'keyup [data-input]': 'onInputKeyUp', + 'click [data-sync-style]': 'syncStyle', + }; + } initialize(o = {}) { this.config = o.config || {}; @@ -59,6 +61,8 @@ export default Backbone.View.extend({ const md = o.module; this.module = md; this.em = em; + this.componentChanged = debounce(this.componentChanged.bind(this)); + this.checkSync = debounce(this.checkSync.bind(this)); const toList = 'component:toggled component:update:classes'; const toListCls = 'component:update:classes change:state'; this.listenTo(em, toList, this.componentChanged); @@ -74,7 +78,7 @@ export default Backbone.View.extend({ debounce(() => this.renderStates()) ); this.delegateEvents(); - }, + } syncStyle() { const { em } = this; @@ -108,7 +112,7 @@ export default Backbone.View.extend({ ruleComponents, state, }); - }, + } /** * Triggered when a tag is removed from collection @@ -117,7 +121,7 @@ export default Backbone.View.extend({ */ tagRemoved(model) { this.updateStateVis(); - }, + } /** * Add new model @@ -126,7 +130,7 @@ export default Backbone.View.extend({ */ addNew(model) { this.addToClasses(model); - }, + } /** * Start tag creation @@ -136,7 +140,7 @@ export default Backbone.View.extend({ startNewTag() { this.$addBtn.css({ display: 'none' }); this.$input.show().focus(); - }, + } /** * End tag creation @@ -146,7 +150,7 @@ export default Backbone.View.extend({ endNewTag() { this.$addBtn.css({ display: '' }); this.$input.hide().val(''); - }, + } /** * Checks what to do on keyup event @@ -160,22 +164,22 @@ export default Backbone.View.extend({ } else if (e.keyCode === 27) { this.endNewTag(); } - }, + } checkStates() { const state = this.em.getState(); const statesEl = this.getStates(); statesEl && statesEl.val(state); - }, + } /** * Triggered when component is changed * @param {Object} e * @private */ - componentChanged: debounce(function ({ targets } = {}) { + componentChanged({ targets } = {}) { this.updateSelection(targets); - }), + } updateSelection(targets) { let trgs = targets || this.getTargets(); @@ -191,18 +195,18 @@ export default Backbone.View.extend({ this.updateStateVis(trgs); this.module.__trgCustom(); return selectors; - }, + } getCommonSelectors({ targets, opts = {} } = {}) { const trgs = targets || this.getTargets(); return this.module.__getCommonSelectors(trgs, opts); - }, + } _commonSelectors(...args) { return this.module.__common(...args); - }, + } - checkSync: debounce(function () { + checkSync() { const { $btnSyncEl, config, collection } = this; const target = this.getTarget(); let hasStyle; @@ -213,15 +217,15 @@ export default Backbone.View.extend({ } $btnSyncEl && $btnSyncEl[hasStyle ? 'show' : 'hide'](); - }), + } getTarget() { return this.target.getSelected(); - }, + } getTargets() { return this.target.getSelectedAll(); - }, + } /** * Update states visibility. Hides states in case there is no tags @@ -234,11 +238,11 @@ export default Backbone.View.extend({ const display = this.collection.length || avoidInline ? '' : 'none'; this.getStatesC().css('display', display); this.updateSelector(target); - }, + } __handleStateChange() { this.updateSelector(this.getTargets()); - }, + } /** * Update selector helper @@ -254,7 +258,7 @@ export default Backbone.View.extend({ trgs.forEach(target => result.push(this.__getName(target))); elSel && (elSel.innerHTML = result.join(', ')); this.checkStates(); - }, + } __getName(target) { const { pfx, config, em } = this; @@ -280,7 +284,7 @@ export default Backbone.View.extend({ } return result && `${result}`; - }, + } /** * Triggered when the select with states is changed @@ -291,7 +295,7 @@ export default Backbone.View.extend({ const { em } = this; const { value } = ev.target; em.set('state', value); - }, + } /** * Add new tag to collection, if possible, and to the component @@ -304,7 +308,7 @@ export default Backbone.View.extend({ this.module.addSelected({ label }); this.endNewTag(); // this.updateStateVis(); // Check if required - }, + } /** * Add new object to collection @@ -326,7 +330,7 @@ export default Backbone.View.extend({ fragment ? fragment.appendChild(rendered) : classes.append(rendered); return rendered; - }, + } /** * Render the collection of classes @@ -338,7 +342,7 @@ export default Backbone.View.extend({ classes.empty(); this.collection.each(model => this.addToClasses(model, frag)); classes.append(frag); - }, + } /** * Return classes element @@ -347,7 +351,7 @@ export default Backbone.View.extend({ */ getClasses() { return this.$el.find('[data-selectors]'); - }, + } /** * Return states element @@ -360,7 +364,7 @@ export default Backbone.View.extend({ this.$states = el[0] && el; } return this.$states; - }, + } /** * Return states container element @@ -370,7 +374,7 @@ export default Backbone.View.extend({ getStatesC() { if (!this.$statesC) this.$statesC = this.$el.find('#' + this.stateInputC); return this.$statesC; - }, + } renderStates() { const { module, em } = this; @@ -386,7 +390,7 @@ export default Backbone.View.extend({ const statesEl = this.getStates(); statesEl && statesEl.html(`${options}`); this.checkStates(); - }, + } render() { const { em, pfx, ppfx, config, $el, el } = this; @@ -412,5 +416,5 @@ export default Backbone.View.extend({ this.renderClasses(); $el.attr('class', `${this.className} ${ppfx}one-bg ${ppfx}two-color`); return this; - }, -}); + } +} diff --git a/src/storage_manager/index.js b/src/storage_manager/index.js index 2a402b5ab..48d8f5bf8 100644 --- a/src/storage_manager/index.js +++ b/src/storage_manager/index.js @@ -51,10 +51,10 @@ * @module StorageManager */ +import Module from '../common/module'; import defaults from './config/config'; import LocalStorage from './model/LocalStorage'; import RemoteStorage from './model/RemoteStorage'; -import Module from 'common/module'; import { isEmpty, isFunction } from 'underscore'; const eventStart = 'storage:start'; diff --git a/src/storage_manager/model/LocalStorage.js b/src/storage_manager/model/LocalStorage.js index dd70a6235..4f5420747 100644 --- a/src/storage_manager/model/LocalStorage.js +++ b/src/storage_manager/model/LocalStorage.js @@ -1,4 +1,4 @@ -import { hasWin } from 'utils/mixins'; +import { hasWin } from '../../utils/mixins'; export default class LocalStorage { async store(data, opts = {}) { diff --git a/src/storage_manager/model/RemoteStorage.js b/src/storage_manager/model/RemoteStorage.js index d4c6b4f0a..a9fca76b0 100644 --- a/src/storage_manager/model/RemoteStorage.js +++ b/src/storage_manager/model/RemoteStorage.js @@ -1,5 +1,5 @@ -import fetch from 'utils/fetch'; import { isUndefined, isFunction, isString } from 'underscore'; +import fetch from '../../utils/fetch'; export default class RemoteStorage { async store(data, opts = {}) { diff --git a/src/style_manager/index.js b/src/style_manager/index.js index 1da1d7ffb..89b0911aa 100644 --- a/src/style_manager/index.js +++ b/src/style_manager/index.js @@ -64,9 +64,8 @@ */ import { isUndefined, isArray, isString, debounce, bindAll } from 'underscore'; -import { isComponent } from 'utils/mixins'; -import Module from 'common/module'; -import { Model } from 'common'; +import { isComponent } from '../utils/mixins'; +import { Model, Module } from '../common'; import defaults from './config/config'; import Sector from './model/Sector'; import Sectors from './model/Sectors'; diff --git a/src/style_manager/model/Layer.js b/src/style_manager/model/Layer.js index 37148bff5..7b2ee3299 100644 --- a/src/style_manager/model/Layer.js +++ b/src/style_manager/model/Layer.js @@ -1,5 +1,5 @@ -import { Model } from 'common'; -import { camelCase } from 'utils/mixins'; +import { Model } from '../../common'; +import { camelCase } from '../../utils/mixins'; export default class Layer extends Model { defaults() { diff --git a/src/style_manager/model/Layers.js b/src/style_manager/model/Layers.js index 2c57463ca..952e1589b 100644 --- a/src/style_manager/model/Layers.js +++ b/src/style_manager/model/Layers.js @@ -1,4 +1,4 @@ -import { Collection } from 'common'; +import { Collection } from '../../common'; import Layer from './Layer'; export default class Layers extends Collection { diff --git a/src/style_manager/model/Property.js b/src/style_manager/model/Property.js index fb0afbc31..06a1fe897 100644 --- a/src/style_manager/model/Property.js +++ b/src/style_manager/model/Property.js @@ -1,6 +1,6 @@ -import { Model } from 'common'; import { isUndefined, isString, isArray, result, keys, each, includes } from 'underscore'; -import { capitalize, camelCase, hasWin } from 'utils/mixins'; +import { Model } from '../../common'; +import { capitalize, camelCase, hasWin } from '../../utils/mixins'; /** * @typedef Property diff --git a/src/style_manager/model/PropertyNumber.js b/src/style_manager/model/PropertyNumber.js index e5e7ef8a1..b6efc0423 100644 --- a/src/style_manager/model/PropertyNumber.js +++ b/src/style_manager/model/PropertyNumber.js @@ -1,7 +1,7 @@ import { isUndefined } from 'underscore'; import Property from './Property'; -import InputNumber from 'domain_abstract/ui/InputNumber'; -import { hasWin } from 'utils/mixins'; +import InputNumber from '../../domain_abstract/ui/InputNumber'; +import { hasWin } from '../../utils/mixins'; /** * @typedef PropertyNumber diff --git a/src/style_manager/model/PropertySelect.js b/src/style_manager/model/PropertySelect.js index 69faa9a2e..440c5a11e 100644 --- a/src/style_manager/model/PropertySelect.js +++ b/src/style_manager/model/PropertySelect.js @@ -1,6 +1,6 @@ -import Property from './Property'; -import { isDef } from 'utils/mixins'; import { isString } from 'underscore'; +import { isDef } from '../../utils/mixins'; +import Property from './Property'; /** * @typedef PropertySelect diff --git a/src/style_manager/model/PropertyStack.js b/src/style_manager/model/PropertyStack.js index e8ed74ccb..44c908734 100644 --- a/src/style_manager/model/PropertyStack.js +++ b/src/style_manager/model/PropertyStack.js @@ -1,8 +1,8 @@ import { keys, isUndefined, isArray, isString, isNumber } from 'underscore'; +import { camelCase } from '../../utils/mixins'; import PropertyComposite, { isNumberType } from './PropertyComposite'; import PropertyBase from './Property'; import Layers from './Layers'; -import { camelCase } from 'utils/mixins'; const VALUES_REG = /,(?![^\(]*\))/; const PARTS_REG = /\s(?![^(]*\))/; diff --git a/src/style_manager/model/Sector.js b/src/style_manager/model/Sector.js index 562c9dacc..e18c22780 100644 --- a/src/style_manager/model/Sector.js +++ b/src/style_manager/model/Sector.js @@ -1,5 +1,5 @@ -import { Model } from 'common'; -import { extend, isString, isArray } from 'underscore'; +import { extend, isString } from 'underscore'; +import { Model } from '../../common'; import Properties from './Properties'; /** diff --git a/src/style_manager/model/Sectors.js b/src/style_manager/model/Sectors.js index f7e1f5336..a26057b40 100644 --- a/src/style_manager/model/Sectors.js +++ b/src/style_manager/model/Sectors.js @@ -1,4 +1,4 @@ -import { Collection } from 'common'; +import { Collection } from '../../common'; import Sector from './Sector'; export default class Sectors extends Collection { diff --git a/src/style_manager/view/LayerView.js b/src/style_manager/view/LayerView.js index 4274c1e5d..f3aca438e 100644 --- a/src/style_manager/view/LayerView.js +++ b/src/style_manager/view/LayerView.js @@ -1,4 +1,4 @@ -import { View } from 'backbone'; +import { View } from '../../common'; import { keys } from 'underscore'; export default class LayerView extends View { diff --git a/src/style_manager/view/LayersView.js b/src/style_manager/view/LayersView.js index b7747575f..88861058e 100644 --- a/src/style_manager/view/LayersView.js +++ b/src/style_manager/view/LayersView.js @@ -1,4 +1,4 @@ -import { View } from 'common'; +import { View } from '../../common'; import LayerView from './LayerView'; export default class LayersView extends View { diff --git a/src/style_manager/view/PropertiesView.js b/src/style_manager/view/PropertiesView.js index 6429d84bf..f99fb6936 100644 --- a/src/style_manager/view/PropertiesView.js +++ b/src/style_manager/view/PropertiesView.js @@ -1,5 +1,5 @@ -import { View } from 'common'; -import { appendAtIndex } from 'utils/dom'; +import { View } from '../../common'; +import { appendAtIndex } from '../../utils/dom'; export default class PropertiesView extends View { initialize(o) { diff --git a/src/style_manager/view/PropertyColorView.js b/src/style_manager/view/PropertyColorView.js index c31606fd8..820b37e69 100644 --- a/src/style_manager/view/PropertyColorView.js +++ b/src/style_manager/view/PropertyColorView.js @@ -1,5 +1,5 @@ import PropertyNumberView from './PropertyNumberView'; -import InputColor from 'domain_abstract/ui/InputColor'; +import InputColor from '../../domain_abstract/ui/InputColor'; export default class PropertyColorView extends PropertyNumberView { setValue(value) { diff --git a/src/style_manager/view/PropertyView.js b/src/style_manager/view/PropertyView.js index 12c71207b..bf554005b 100644 --- a/src/style_manager/view/PropertyView.js +++ b/src/style_manager/view/PropertyView.js @@ -1,6 +1,6 @@ -import { View } from 'common'; import { bindAll, isUndefined, debounce } from 'underscore'; -import { isObject } from 'utils/mixins'; +import { View } from '../../common'; +import { isObject } from '../../utils/mixins'; const clearProp = 'data-clear-style'; diff --git a/src/style_manager/view/SectorView.js b/src/style_manager/view/SectorView.js index f98da412c..7afc7f512 100644 --- a/src/style_manager/view/SectorView.js +++ b/src/style_manager/view/SectorView.js @@ -1,5 +1,5 @@ -import { View } from 'common'; -import html from 'utils/html'; +import { View } from '../../common'; +import html from '../../utils/html'; import PropertiesView from './PropertiesView'; export default class SectorView extends View { diff --git a/src/style_manager/view/SectorsView.js b/src/style_manager/view/SectorsView.js index fae25824c..7bbf91590 100644 --- a/src/style_manager/view/SectorsView.js +++ b/src/style_manager/view/SectorsView.js @@ -1,5 +1,5 @@ -import { View } from 'common'; -import { appendAtIndex } from 'utils/dom'; +import { View } from '../../common'; +import { appendAtIndex } from '../../utils/dom'; import SectorView from './SectorView'; export default class SectorsView extends View { diff --git a/src/trait_manager/index.js b/src/trait_manager/index.js index 39e760385..108fe3472 100644 --- a/src/trait_manager/index.js +++ b/src/trait_manager/index.js @@ -1,4 +1,5 @@ import { debounce } from 'underscore'; +import { Model, Module } from '../common'; import defaults from './config/config'; import TraitsView from './view/TraitsView'; import TraitView from './view/TraitView'; @@ -7,7 +8,6 @@ import TraitCheckboxView from './view/TraitCheckboxView'; import TraitNumberView from './view/TraitNumberView'; import TraitColorView from './view/TraitColorView'; import TraitButtonView from './view/TraitButtonView'; -import { Model, Module } from 'common'; export const evAll = 'trait'; export const evPfx = `${evAll}:`; diff --git a/src/trait_manager/model/Trait.js b/src/trait_manager/model/Trait.js index 098523eb2..bfd3c7dce 100644 --- a/src/trait_manager/model/Trait.js +++ b/src/trait_manager/model/Trait.js @@ -1,5 +1,5 @@ -import { Model } from 'common'; import { isUndefined } from 'underscore'; +import { Model } from '../../common'; /** * @typedef Trait diff --git a/src/trait_manager/model/Traits.js b/src/trait_manager/model/Traits.js index e206dd82b..dbecb3504 100644 --- a/src/trait_manager/model/Traits.js +++ b/src/trait_manager/model/Traits.js @@ -1,5 +1,5 @@ -import { Collection } from 'common'; import { isString, isArray } from 'underscore'; +import { Collection } from '../../common'; import Trait from './Trait'; import TraitFactory from './TraitFactory'; diff --git a/src/trait_manager/view/TraitColorView.js b/src/trait_manager/view/TraitColorView.js index 21acbf743..5890eeddd 100644 --- a/src/trait_manager/view/TraitColorView.js +++ b/src/trait_manager/view/TraitColorView.js @@ -1,5 +1,5 @@ import TraitView from './TraitView'; -import InputColor from 'domain_abstract/ui/InputColor'; +import InputColor from '../../domain_abstract/ui/InputColor'; export default class TraitColorView extends TraitView { templateInput = ''; diff --git a/src/trait_manager/view/TraitNumberView.js b/src/trait_manager/view/TraitNumberView.js index c6d45c12f..598bcf1b2 100644 --- a/src/trait_manager/view/TraitNumberView.js +++ b/src/trait_manager/view/TraitNumberView.js @@ -1,6 +1,6 @@ -import TraitView from './TraitView'; import { isUndefined } from 'underscore'; -import InputNumber from 'domain_abstract/ui/InputNumber'; +import InputNumber from '../../domain_abstract/ui/InputNumber'; +import TraitView from './TraitView'; export default class TraitNumberView extends TraitView { getValueForTarget() { diff --git a/src/trait_manager/view/TraitsView.js b/src/trait_manager/view/TraitsView.js index 9d02b13c7..9ded83487 100644 --- a/src/trait_manager/view/TraitsView.js +++ b/src/trait_manager/view/TraitsView.js @@ -1,4 +1,4 @@ -import DomainViews from 'domain_abstract/view/DomainViews'; +import DomainViews from '../../domain_abstract/view/DomainViews'; import TraitView from './TraitView'; export default class TraitsView extends DomainViews { diff --git a/src/utils/ColorPicker.js b/src/utils/ColorPicker.js index d6881f2f4..543483c0c 100644 --- a/src/utils/ColorPicker.js +++ b/src/utils/ColorPicker.js @@ -4,7 +4,7 @@ // https://github.com/bgrins/spectrum // Author: Brian Grinstead // License: MIT -import { hasWin } from 'utils/mixins'; +import { hasWin } from './mixins'; export default function ($, undefined) { 'use strict'; diff --git a/src/utils/Dragger.js b/src/utils/Dragger.js index b01f0d801..c0efc8331 100644 --- a/src/utils/Dragger.js +++ b/src/utils/Dragger.js @@ -1,5 +1,5 @@ import { bindAll, isFunction, result, isUndefined } from 'underscore'; -import { on, off, isEscKey, getPointerEvent } from 'utils/mixins'; +import { on, off, isEscKey, getPointerEvent } from './mixins'; const resetPos = () => ({ x: 0, y: 0 }); @@ -61,7 +61,7 @@ export default class Dragger { doc: 0, // Scale result points, can also be a function - scale: 1 + scale: 1, }; bindAll(this, 'drag', 'stop', 'keyHandle', 'handleScroll'); this.setOptions(opts); @@ -76,7 +76,7 @@ export default class Dragger { setOptions(opts = {}) { this.opts = { ...this.opts, - ...opts + ...opts, }; } @@ -97,7 +97,7 @@ export default class Dragger { const actualScroll = this.getScrollInfo(); const scrollDiff = { x: actualScroll.x - lastScroll.x, - y: actualScroll.y - lastScroll.y + y: actualScroll.y - lastScroll.y, }; this.move(delta.x + scrollDiff.x, delta.y + scrollDiff.y); this.lastScrollDiff = scrollDiff; @@ -132,12 +132,12 @@ export default class Dragger { const currentPos = this.getPointerPos(ev); const glDiff = { x: globScrollDiff.x + lastScrollDiff.x, - y: globScrollDiff.y + lastScrollDiff.y + y: globScrollDiff.y + lastScrollDiff.y, }; this.globScrollDiff = glDiff; const delta = { x: currentPos.x - startPointer.x + glDiff.x, - y: currentPos.y - startPointer.y + glDiff.y + y: currentPos.y - startPointer.y + glDiff.y, }; this.lastScrollDiff = resetPos(); let { lockedAxis } = this; @@ -226,15 +226,13 @@ export default class Dragger { return { newDelta, trgX: this.trgX, - trgY: this.trgY + trgY: this.trgY, }; } isPointIn(src, trg, { offset } = {}) { const ofst = offset || this.opts.snapOffset; - return ( - (src >= trg && src <= trg + ofst) || (src <= trg && src >= trg - ofst) - ); + return (src >= trg && src <= trg + ofst) || (src <= trg && src >= trg - ofst); } setGuideLock(guide, value) { @@ -290,7 +288,7 @@ export default class Dragger { this.position = { x: xPos, y: yPos, - end + end, }; isFunction(setPosition) && setPosition(this.position); @@ -344,7 +342,7 @@ export default class Dragger { ? getPos(ev) : { x: pEv.clientX, - y: pEv.clientY + y: pEv.clientY, }; } @@ -358,7 +356,7 @@ export default class Dragger { } else if (el) { result = { x: parseFloat(el.style.left), - y: parseFloat(el.style.top) + y: parseFloat(el.style.top), }; } @@ -371,7 +369,7 @@ export default class Dragger { return { y: body ? body.scrollTop : 0, - x: body ? body.scrollLeft : 0 + x: body ? body.scrollLeft : 0, }; } diff --git a/src/utils/Droppable.js b/src/utils/Droppable.js index 11b92a1f6..9a13f178d 100644 --- a/src/utils/Droppable.js +++ b/src/utils/Droppable.js @@ -2,8 +2,8 @@ This class makes the canvas droppable */ -import { on, off } from 'utils/mixins'; import { bindAll, indexOf } from 'underscore'; +import { on, off } from './mixins'; export default class Droppable { constructor(em, rootEl) { @@ -17,13 +17,7 @@ export default class Droppable { const els = Array.isArray(el) ? el : [el]; this.el = el; this.counter = 0; - bindAll( - this, - 'handleDragEnter', - 'handleDragOver', - 'handleDrop', - 'handleDragLeave' - ); + bindAll(this, 'handleDragEnter', 'handleDragOver', 'handleDrop', 'handleDragLeave'); els.forEach(el => this.toggleEffects(el, 1)); return this; @@ -52,7 +46,7 @@ export default class Droppable { }, customTarget({ event }) { return doc.elementFromPoint(event.clientX, event.clientY); - } + }, } : null; method(frameEl, 'pointerenter', this.handleDragEnter); @@ -123,7 +117,7 @@ export default class Droppable { } this.handleDragEnd(comp, dt); target.remove(); - } + }, }); dragStop = cancel => dragger.stop(ev, { cancel }); dragContent = cnt => (content = cnt); @@ -141,7 +135,7 @@ export default class Droppable { pfx: 'gjs-', onEndMove: model => this.handleDragEnd(model, dt), document: this.el.ownerDocument, - ...(this.sortOpts || {}) + ...(this.sortOpts || {}), }); sorter.setDropContent(content); sorter.startSort(); @@ -208,7 +202,7 @@ export default class Droppable { content.push({ type, file, - attributes: { alt: file.name } + attributes: { alt: file.name }, }); } } @@ -220,7 +214,7 @@ export default class Droppable { content = { type: 'link', attributes: { href: content }, - content: content + content: content, }; } else if (indexOf(types, 'text/json') >= 0) { const json = dt && dt.getData('text/json'); diff --git a/src/utils/Resizer.js b/src/utils/Resizer.js index 23a2d7353..079934c60 100644 --- a/src/utils/Resizer.js +++ b/src/utils/Resizer.js @@ -1,5 +1,5 @@ import { bindAll, defaults, isFunction, each } from 'underscore'; -import { on, off, normalizeFloat } from 'utils/mixins'; +import { on, off, normalizeFloat } from './mixins'; var defaultOpts = { // Function which returns custom X and Y coordinates of the mouse @@ -66,7 +66,7 @@ var defaultOpts = { cr: 1, // Center right bl: 1, // Bottom left bc: 1, // Bottom center - br: 1 // Bottom right + br: 1, // Bottom right }; var createHandler = (name, opts) => { @@ -84,7 +84,7 @@ var getBoundingRect = (el, win) => { left: rect.left + w.pageXOffset, top: rect.top + w.pageYOffset, width: rect.width, - height: rect.height + height: rect.height, }; }; @@ -267,23 +267,23 @@ class Resizer { t: rect.top, l: rect.left, w: rect.width, - h: rect.height + h: rect.height, }; this.rectDim = { t: rect.top, l: rect.left, w: rect.width, - h: rect.height + h: rect.height, }; this.startPos = { x: e.clientX, - y: e.clientY + y: e.clientY, }; this.parentDim = { t: parentRect.top, l: parentRect.left, w: parentRect.width, - h: parentRect.height + h: parentRect.height, }; // Listen events @@ -291,8 +291,7 @@ class Resizer { on(doc, 'mousemove', this.move); on(doc, 'keydown', this.handleKeyDown); on(doc, 'mouseup', this.stop); - isFunction(this.onStart) && - this.onStart(e, { docs: doc, config, el, resizer }); + isFunction(this.onStart) && this.onStart(e, { docs: doc, config, el, resizer }); this.toggleFrames(1); this.move(e); } @@ -308,18 +307,18 @@ class Resizer { ? mouseFetch(e) : { x: e.clientX, - y: e.clientY + y: e.clientY, }; this.currentPos = currentPos; this.delta = { x: currentPos.x - this.startPos.x, - y: currentPos.y - this.startPos.y + y: currentPos.y - this.startPos.y, }; this.keys = { shift: e.shiftKey, ctrl: e.ctrlKey, - alt: e.altKey + alt: e.altKey, }; this.rectDim = this.calc(this); @@ -367,7 +366,7 @@ class Resizer { store, selectedHandler, resizer, - config + config, }); } else { const elStyle = el.style; @@ -396,8 +395,8 @@ class Resizer { resizer: this, opts: { ...opts, - ...opt - } + ...opt, + }, }); } @@ -461,15 +460,13 @@ class Resizer { const parentH = this.parentDim.h; const unitWidth = this.opts.unitWidth; const unitHeight = this.opts.unitHeight; - const startW = - unitWidth === '%' ? (startDim.w / 100) * parentW : startDim.w; - const startH = - unitHeight === '%' ? (startDim.h / 100) * parentH : startDim.h; + const startW = unitWidth === '%' ? (startDim.w / 100) * parentW : startDim.w; + const startH = unitHeight === '%' ? (startDim.h / 100) * parentH : startDim.h; var box = { t: 0, l: 0, w: startW, - h: startH + h: startH, }; if (!data) return; @@ -537,5 +534,5 @@ class Resizer { export default { init(opts) { return new Resizer(opts); - } + }, }; diff --git a/src/utils/extender.js b/src/utils/extender.js index 7e4fcb777..1bd7cdcf0 100644 --- a/src/utils/extender.js +++ b/src/utils/extender.js @@ -1,4 +1,4 @@ -import { isObject, isString, each, isUndefined } from 'underscore'; +import { isObject } from 'underscore'; export default ({ $ }) => { if ($ && $.prototype && $.prototype.constructor.name !== 'jQuery') { @@ -6,15 +6,15 @@ export default ({ $ }) => { // Additional helpers - fn.hide = function() { + fn.hide = function () { return this.css('display', 'none'); }; - fn.show = function() { + fn.show = function () { return this.css('display', 'block'); }; - fn.focus = function() { + fn.focus = function () { const el = this.get(0); el && el.focus(); return this; @@ -53,11 +53,11 @@ export default ({ $ }) => { // For spectrum compatibility - fn.bind = function(ev, h) { + fn.bind = function (ev, h) { return this.on(ev, h); }; - fn.unbind = function(ev, h) { + fn.unbind = function (ev, h) { if (isObject(ev)) { for (let name in ev) { ev.hasOwnProperty(name) && this.off(name, ev[name]); @@ -69,37 +69,37 @@ export default ({ $ }) => { } }; - fn.click = function(h) { + fn.click = function (h) { return h ? this.on('click', h) : this.trigger('click'); }; - fn.change = function(h) { + fn.change = function (h) { return h ? this.on('change', h) : this.trigger('change'); }; - fn.keydown = function(h) { + fn.keydown = function (h) { return h ? this.on('keydown', h) : this.trigger('keydown'); }; - fn.delegate = function(selector, events, data, handler) { + fn.delegate = function (selector, events, data, handler) { if (!handler) { handler = data; } - return this.on(events, selector, function(e) { + return this.on(events, selector, function (e) { e.data = data; handler(e); }); }; - fn.scrollLeft = function() { + fn.scrollLeft = function () { let el = this.get(0); el = el.nodeType == 9 ? el.defaultView : el; let win = el instanceof Window ? el : null; return win ? win.pageXOffset : el.scrollLeft || 0; }; - fn.scrollTop = function() { + fn.scrollTop = function () { let el = this.get(0); el = el.nodeType == 9 ? el.defaultView : el; let win = el instanceof Window ? el : null; @@ -107,7 +107,7 @@ export default ({ $ }) => { }; const offset = $.prototype.offset; - fn.offset = function(coords) { + fn.offset = function (coords) { let top, left; if (coords) { @@ -125,7 +125,7 @@ export default ({ $ }) => { return offset.call(this); }; - $.map = function(items, clb) { + $.map = function (items, clb) { const ar = []; for (var i = 0; i < items.length; i++) { @@ -137,11 +137,11 @@ export default ({ $ }) => { const indexOf = Array.prototype.indexOf; - $.inArray = function(val, arr, i) { + $.inArray = function (val, arr, i) { return arr == null ? -1 : indexOf.call(arr, val, i); }; - $.Event = function(src, props) { + $.Event = function (src, props) { if (!(this instanceof $.Event)) { return new $.Event(src, props); } diff --git a/src/utils/fetch.js b/src/utils/fetch.js index 951b369c1..f506b1d73 100644 --- a/src/utils/fetch.js +++ b/src/utils/fetch.js @@ -1,5 +1,5 @@ import Promise from 'promise-polyfill'; -import { hasWin } from 'utils/mixins'; +import { hasWin } from './mixins'; if (hasWin()) { window.Promise = window.Promise || Promise; @@ -21,7 +21,7 @@ export default typeof fetch == 'function' res({ status: req.status, statusText: req.statusText, - text: () => Promise.resolve(req.responseText) + text: () => Promise.resolve(req.responseText), }); req.onerror = rej;