From 62e12847902e1f477f9ae7adfca12a0449665781 Mon Sep 17 00:00:00 2001 From: zadam Date: Thu, 6 Feb 2020 22:39:31 +0100 Subject: [PATCH] untangled tabrow dependencies --- .../javascripts/services/app_context.js | 60 ++++++++----------- .../javascripts/services/tab_context.js | 12 +--- src/public/javascripts/widgets/tab_row.js | 52 +--------------- 3 files changed, 29 insertions(+), 95 deletions(-) diff --git a/src/public/javascripts/services/app_context.js b/src/public/javascripts/services/app_context.js index 4b7571323..39b84c384 100644 --- a/src/public/javascripts/services/app_context.js +++ b/src/public/javascripts/services/app_context.js @@ -1,7 +1,6 @@ import NoteTreeWidget from "../widgets/note_tree.js"; import TabContext from "./tab_context.js"; import server from "./server.js"; -import TabRowWidget from "../widgets/tab_row.js"; import treeCache from "./tree_cache.js"; import bundleService from "./bundle.js"; import DialogEventComponent from "./dialog_events.js"; @@ -19,8 +18,6 @@ class AppContext { /** @type {TabContext[]} */ this.tabContexts = []; this.tabsChangedTaskId = null; - /** @type {TabRowWidget} */ - this.tabRow = null; this.activeTabId = null; } @@ -214,7 +211,7 @@ class AppContext { getTab(newTab, state) { if (!this.getActiveTabContext() || newTab) { // if it's a new tab explicitly by user then it's in background - const ctx = new TabContext(this, this.tabRow, state); + const ctx = new TabContext(this, state); this.tabContexts.push(ctx); this.components.push(ctx); @@ -231,7 +228,7 @@ class AppContext { } openEmptyTab() { - const tabContext = new TabContext(this, this.tabRow); + const tabContext = new TabContext(this); this.tabContexts.push(tabContext); this.components.push(tabContext); return tabContext; @@ -258,7 +255,7 @@ class AppContext { for (const tc of this.tabContexts) { if (tc.notePath && !tc.notePath.split("/").includes(hoistedNoteId)) { - this.tabRow.removeTab(tc.tabId); + this.removeTab(tc.tabId); } } @@ -272,15 +269,11 @@ class AppContext { async saveOpenTabs() { const openTabs = []; - for (const tabId of this.tabRow.getTabIdsInOrder()) { - const tabContext = appContext.getTabContexts().find(tc => tc.tabId === tabId); + for (const tabContext of this.tabContexts) { + const tabState = tabContext.getTabState(); - if (tabContext) { - const tabState = tabContext.getTabState(); - - if (tabState) { - openTabs.push(tabState); - } + if (tabState) { + openTabs.push(tabState); } } @@ -322,50 +315,49 @@ class AppContext { async removeTab(tabId) { const tabContextToRemove = this.tabContexts.find(tc => tc.tabId === tabId); - const tabIdsInOrder = this.tabRow.getTabIdsInOrder(); if (!tabContextToRemove) { return; } - if (this.tabContexts.length === 0) { + await this.trigger('beforeTabRemove', {tabId}, true); + + if (this.tabContexts.length === 1) { this.openAndActivateEmptyTab(); } else { - const oldIdx = tabIdsInOrder.findIndex(tid => tid === tabId); - const newActiveTabId = tabIdsInOrder[oldIdx === tabIdsInOrder.length - 1 ? oldIdx - 1 : oldIdx + 1]; - - if (newActiveTabId) { - this.activateTab(newActiveTabId); - } - else { - console.log("Failed to find next tabcontext to activate"); - } + this.activateNextTabListener(); } - await tabContextToRemove.remove(); - this.tabContexts = this.tabContexts.filter(tc => tc.tabId === tabId); + this.trigger('tabRemoved', {tabId}); + this.openTabsChangedListener(); } - tabReorderListener() { + tabReorderListener({tabIdsInOrder}) { + const order = {}; + + for (const i in tabIdsInOrder) { + order[tabIdsInOrder[i]] = i; + } + + this.tabContexts.sort((a, b) => order[a.tabId] < order[b.tabId] ? -1 : 1); + this.openTabsChangedListener(); } activateNextTabListener() { - const tabIdsInOrder = this.tabRow.getTabIdsInOrder(); - const oldIdx = tabIdsInOrder.findIndex(tid => tid === this.activeTabId); - const newActiveTabId = tabIdsInOrder[oldIdx === tabIdsInOrder.length - 1 ? 0 : oldIdx + 1]; + const oldIdx = this.tabContexts.findIndex(tc => tc.tabId === this.activeTabId); + const newActiveTabId = this.tabContexts[oldIdx === this.tabContexts.length - 1 ? 0 : oldIdx + 1].tabId; this.activateTab(newActiveTabId); } activatePreviousTabListener() { - const tabIdsInOrder = this.tabRow.getTabIdsInOrder(); - const oldIdx = tabIdsInOrder.findIndex(tid => tid === this.activeTabId); - const newActiveTabId = tabIdsInOrder[oldIdx === 0 ? tabIdsInOrder.length - 1 : oldIdx - 1]; + const oldIdx = this.tabContexts.findIndex(tc => tc.tabId === this.activeTabId); + const newActiveTabId = this.tabContexts[oldIdx === 0 ? this.tabContexts.length - 1 : oldIdx - 1].tabId; this.activateTab(newActiveTabId); } diff --git a/src/public/javascripts/services/tab_context.js b/src/public/javascripts/services/tab_context.js index 5a3709a69..5831d47ce 100644 --- a/src/public/javascripts/services/tab_context.js +++ b/src/public/javascripts/services/tab_context.js @@ -12,13 +12,11 @@ import hoistedNoteService from "./hoisted_note.js"; class TabContext extends Component { /** * @param {AppContext} appContext - * @param {TabRowWidget} tabRow * @param {object} state */ - constructor(appContext, tabRow, state = {}) { + constructor(appContext, state = {}) { super(appContext); - this.tabRow = tabRow; this.tabId = state.tabId || utils.randomString(4); this.state = state; @@ -89,12 +87,6 @@ class TabContext extends Component { return await treeCache.getNoteComplement(this.noteId); } - async remove() { - await this.trigger('beforeTabRemove', {tabId: this.tabId}, true); - - this.trigger('tabRemoved', {tabId: this.tabId}); - } - isActive() { return this.appContext.activeTabId === this.tabId; } @@ -107,7 +99,7 @@ class TabContext extends Component { return { tabId: this.tabId, notePath: this.notePath, - active: this.tabRow.activeTabId === this.tabId + active: this.appContext.activeTabId === this.tabId } } diff --git a/src/public/javascripts/widgets/tab_row.js b/src/public/javascripts/widgets/tab_row.js index db74b760d..5814853ad 100644 --- a/src/public/javascripts/widgets/tab_row.js +++ b/src/public/javascripts/widgets/tab_row.js @@ -234,12 +234,6 @@ const TAB_ROW_TPL = ` `; export default class TabRowWidget extends BasicWidget { - constructor(appContext) { - super(appContext); - - appContext.tabRow = this; - } - doRender() { this.$widget = $(TAB_ROW_TPL); @@ -425,50 +419,6 @@ export default class TabRowWidget extends BasicWidget { return this.$widget.find('.note-tab[active]')[0]; } - get previousTabEl() { - const tabEls = this.tabEls; - - if (tabEls.length <= 1) { - return null; - } - - let prev = tabEls[tabEls.length - 1]; - - for (const tabEl of tabEls) { - if (tabEl.hasAttribute("active")) { - return prev; - } - - prev = tabEl; - } - - return null; - } - - get nextTabEl() { - const tabEls = this.tabEls; - - if (tabEls.length <= 1) { - return null; - } - - let prev = tabEls[tabEls.length - 1]; - - for (const tabEl of tabEls) { - if (prev.hasAttribute("active")) { - return tabEl; - } - - prev = tabEl; - } - - return null; - } - - hasActiveTab() { - return !!this.activeTabEl; - } - activeTabChangedListener({newActiveTabId}) { const tabEl = this.getTabById(newActiveTabId)[0]; const activeTabEl = this.activeTabEl; @@ -600,7 +550,7 @@ export default class TabRowWidget extends BasicWidget { tabEl.parentNode.insertBefore(tabEl, beforeEl); } - this.trigger('tabReorder'); + this.trigger('tabReorder', {tabIdsInOrder: this.getTabIdsInOrder()}); this.layoutTabs(); }