diff --git a/src/common/module.js b/src/common/module.js index 0dc72f99e..8794a0542 100644 --- a/src/common/module.js +++ b/src/common/module.js @@ -28,6 +28,7 @@ export default { ...conf, }; this.em = this.config.em; + this.cls = []; }, __initListen(opts = {}) { @@ -116,5 +117,8 @@ export default { coll.reset(); }); this.em = 0; + this.config = 0; + this.view?.remove(); + this.view = 0; }, }; diff --git a/src/trait_manager/index.js b/src/trait_manager/index.js index f9752cc9b..544a859ba 100644 --- a/src/trait_manager/index.js +++ b/src/trait_manager/index.js @@ -1,5 +1,4 @@ -import { defaults, isElement } from 'underscore'; -import defaultOpts from './config/config'; +import defaults from './config/config'; import TraitsView from './view/TraitsView'; import TraitView from './view/TraitView'; import TraitSelectView from './view/TraitSelectView'; @@ -7,22 +6,32 @@ import TraitCheckboxView from './view/TraitCheckboxView'; import TraitNumberView from './view/TraitNumberView'; import TraitColorView from './view/TraitColorView'; import TraitButtonView from './view/TraitButtonView'; +import Module from 'common/module'; + +export const evAll = 'trait'; +export const evPfx = `${evAll}:`; +export const evCustom = `${evPfx}custom`; export default () => { - let c = {}; - let TraitsViewer; const typesDef = { text: TraitView, number: TraitNumberView, select: TraitSelectView, checkbox: TraitCheckboxView, color: TraitColorView, - button: TraitButtonView + button: TraitButtonView, }; return { + ...Module, + TraitsView, + events: { + all: evAll, + custom: evCustom, + }, + /** * Name of the module * @type {String} @@ -32,20 +41,19 @@ export default () => { /** * Get configuration object + * @name getConfig + * @function * @return {Object} - * @private */ - getConfig() { - return c; - }, /** * Initialize module. Automatically called with a new instance of the editor * @param {Object} config Configurations + * @private */ init(config = {}) { - c = config; - defaults(c, defaultOpts); + this.__initConfig(defaults, config); + const c = this.config; const ppfx = c.pStylePrefix; this.types = { ...typesDef }; ppfx && (c.stylePrefix = `${ppfx}${c.stylePrefix}`); @@ -53,12 +61,7 @@ export default () => { }, postRender() { - const elTo = this.getConfig().appendTo; - - if (elTo) { - const el = isElement(elTo) ? elTo : document.querySelector(elTo); - el.appendChild(this.render()); - } + this.__appendTo(); }, /** @@ -67,7 +70,7 @@ export default () => { * @private */ getTraitsViewer() { - return TraitsViewer; + return this.view; }, /** @@ -98,21 +101,23 @@ export default () => { }, render() { - const el = TraitsViewer && TraitsViewer.el; - TraitsViewer = new TraitsView({ + let { view } = this; + const config = this.getConfig(); + const el = view && view.el; + view = new TraitsView({ el, collection: [], - editor: c.em, - config: c + editor: config.em, + config, }); - TraitsViewer.itemsView = this.getTypes(); - TraitsViewer.updatedCollection(); - return TraitsViewer.el; + view.itemsView = this.getTypes(); + view.updatedCollection(); + this.view = view; + return view.el; }, destroy() { - TraitsViewer && TraitsViewer.remove(); - [c, TraitsViewer].forEach(i => (i = {})); - } + this.__destroy(); + }, }; };