diff --git a/common/modules/mixly-modules/common/component.js b/common/modules/mixly-modules/common/component.js index 12b57cbd..49de1fd8 100644 --- a/common/modules/mixly-modules/common/component.js +++ b/common/modules/mixly-modules/common/component.js @@ -20,10 +20,18 @@ class Component { constructor() {} mountOn($container) { - $container.append(this.getContent()); + if (this.#mounted_) { + this.unmount(); + } + $container.append(this.#$content_); this.onMounted(); } + unmount() { + this.#$content_ && this.#$content_.detach(); + this.onUnmounted(); + } + onMounted() { this.#mounted_ = true; } @@ -64,9 +72,12 @@ class Component { dispose() { this.#$content_.remove(); - this.resetEvent(); - this.#disposed_ = true; + this.#$content_ = null; this.runEvent('destroyed'); + this.resetEvent(); + this.#events_ = null; + this.#disposed_ = true; + this.#mounted_ = false; } bind(type, func) { diff --git a/common/modules/mixly-modules/common/pages-manager.js b/common/modules/mixly-modules/common/pages-manager.js index 0ec2c666..aaecf27a 100644 --- a/common/modules/mixly-modules/common/pages-manager.js +++ b/common/modules/mixly-modules/common/pages-manager.js @@ -16,6 +16,7 @@ class PagesManager extends Component { #welcomePage_ = null; #$editorContainer_ = null; #$tabsContainer_ = null; + #$parentContainer_ = null; #pagesRegistry_ = new Registry(); #page_ = 'welcome'; #activeId_ = null; @@ -33,7 +34,7 @@ class PagesManager extends Component { **/ constructor(config) { super(); - const $parentContainer = $(config.parentElem); + this.#$parentContainer_ = $(config.parentElem); const $content = $(config.managerContentElem); this.#typesRegistry_ = config.typesRegistry; this.#$tabsContainer_ = $(config.tabElem); @@ -44,7 +45,7 @@ class PagesManager extends Component { }); $content.append(this.#$editorContainer_); this.setContent($content); - this.mountOn($parentContainer); + this.mountOn(this.#$parentContainer_); let PageType = this.#typesRegistry_.getItem('#welcome'); if (PageType) { this.#welcomePage_ = new PageType(); @@ -67,8 +68,7 @@ class PagesManager extends Component { if (prevEditor) { const $prevTab = prevEditor.getTab(); $prevTab.find('.chrome-tab-favicon').removeClass('active'); - prevEditor.getContent().detach(); - prevEditor.onUnmounted(); + prevEditor.unmount(); } this.#$editorContainer_.empty(); this.#$editorContainer_.append(page.getContent()); @@ -115,19 +115,14 @@ class PagesManager extends Component { } #showWelcomePage_() { - const $parent = this.getContent().parent(); - this.getContent().detach(); - $parent.append(this.#welcomePage_.getContent()); - this.#welcomePage_.onMounted(); + this.unmount(); + this.#welcomePage_.mountOn(this.#$parentContainer_); this.#page_ = 'welcome'; } #hideWelcomePage_() { - const $page = this.#welcomePage_.getContent(); - const $parent = $page.parent(); - $page.detach(); - this.#welcomePage_.onUnmounted(); - $parent.append(this.getContent()); + this.#welcomePage_.unmount(); + this.mountOn(this.#$parentContainer_); this.#page_ = 'editor'; }