split window WIP

src/public/app/services/tab_manager.js

@@ -100,6 +100,8 @@ export default class TabManager extends Component {
             filteredTabs[0].active = true;
         }
 
+        console.log("filteredTabs", filteredTabs);
+
         await this.tabsUpdate.allowUpdateWithoutChange(async () => {
             for (const tab of filteredTabs) {
                 await this.openTabWithNote(tab.notePath, tab.active, tab.tabId, tab.hoistedNoteId, tab.parentTabId);
@@ -201,8 +203,15 @@ export default class TabManager extends Component {
         await tabContext.setEmpty();
     }
 
-    async openEmptyTab(tabId, hoistedNoteId, parentTabId = null) {
+    async openEmptyTab(tabId, hoistedNoteId = 'root', parentTabId = null) {
         const tabContext = new TabContext(tabId, hoistedNoteId, parentTabId);
+
+        const existingTabContext = this.children.find(tc => tc.tabId === tabContext.tabId);
+
+        if (existingTabContext) {
+            return existingTabContext;
+        }
+
         this.child(tabContext);
 
         await this.triggerEvent('newTabOpened', {tabContext});
@@ -228,7 +237,7 @@ export default class TabManager extends Component {
         return this.openTabWithNote(notePath, false, null, hoistedNoteId);
     }
 
-    async openTabWithNote(notePath, activate, tabId, hoistedNoteId, parentTabId = null) {
+    async openTabWithNote(notePath, activate, tabId, hoistedNoteId = 'root', parentTabId = null) {
         const tabContext = await this.openEmptyTab(tabId, hoistedNoteId, parentTabId);
 
         if (notePath) {
@@ -280,15 +289,7 @@ export default class TabManager extends Component {
     }
 
     async removeTab(tabId) {
-        let mainTabContextToRemove = this.getTabContextById(tabId);
+        const mainTabContextToRemove = this.getTabContextById(tabId).getMainTabContext();
-
-        if (!mainTabContextToRemove) {
-            return;
-        }
-
-        if (mainTabContextToRemove.parentTabId) {
-            mainTabContextToRemove = this.getTabContextById(mainTabContextToRemove.parentTabId);
-        }
 
         // close dangling autocompletes after closing the tab
         $(".aa-input").autocomplete("close");

src/public/app/widgets/containers/pane_container.js

@@ -14,51 +14,55 @@ export default class PaneContainer extends FlexContainer {
         this.css('flex-grow', '1');
     }
 
-    setTabContextEvent({tabContext}) {
-        /** @var {TabContext} */
-        this.tabContext = tabContext;
-    }
-
     async newTabOpenedEvent({tabContext}) {
         const widget = this.widgetFactory();
 
         const $renderedWidget = widget.render();
 
-        $renderedWidget.on('click', () => {
+        $renderedWidget.attr("data-main-tab-id", tabContext.tabId);
-            appContext.tabManager.activateTab(tabContext.tabId);
-        });
 
-        let $parent;
+        $renderedWidget.on('click', () => appContext.tabManager.activateTab(tabContext.tabId));
 
-        if (!tabContext.parentTabId) {
+        this.$widget.append($renderedWidget);
-            $parent = $("<div>")
-                .attr("data-main-tab-id", tabContext.tabId)
-                .css("display", "flex")
-                .css("flex-grow", "1");
-
-            this.$widget.append($parent);
-        }
-        else {
-            $parent = this.$widget.find(`[data-main-tab-id="${tabContext.parentTabId}"]`);
-        }
-
-        $parent.append($renderedWidget);
 
         this.widgets[tabContext.tabId] = widget;
 
         await widget.handleEvent('setTabContext', { tabContext });
 
         this.child(widget);
+
+        this.refresh();
     }
 
     async openNewPaneCommand() {
-        const tabContext = await appContext.tabManager.openEmptyTab(null, null, appContext.tabManager.getActiveTabContext().tabId);
+        const tabContext = await appContext.tabManager.openEmptyTab(null, 'root', appContext.tabManager.getActiveTabContext().tabId);
 
         await appContext.tabManager.activateTab(tabContext.tabId);
 
         await tabContext.setEmpty();
     }
 
+    async refresh() {
+        this.toggleExt(true);
+    }
+
+    toggleInt(show) {} // not needed
+
+    toggleExt(show) {
+        const activeTabId = appContext.tabManager.getActiveTabContext().getMainTabContext().tabId;
+
+        for (const tabId in this.widgets) {
+            const tabContext = appContext.tabManager.getTabContextById(tabId);
+
+            const widget = this.widgets[tabId];
+            widget.toggleExt(show && activeTabId && [tabContext.tabId, tabContext.parentTabId].includes(activeTabId));
+
+            if (!widget.hasBeenAlreadyShown) {
+                widget.handleEvent('activeTabChanged', {tabContext});
+            }
+        }
+    }
+
     /**
      * widget.hasBeenAlreadyShown is intended for lazy loading of cached tabs - initial note switches of new tabs
      * are not executed, we're waiting for the first tab activation and then we update the tab. After this initial
@@ -69,27 +73,56 @@ export default class PaneContainer extends FlexContainer {
             // this event is propagated only to the widgets of a particular tab
             const widget = this.widgets[data.tabContext.tabId];
 
-            if (widget && (widget.hasBeenAlreadyShown || name === 'tabNoteSwitchedAndActivated')) {
+            if (!widget) {
-                widget.hasBeenAlreadyShown = true;
-
-                return widget.handleEvent('tabNoteSwitched', data);
-            }
-            else {
                 return Promise.resolve();
             }
+
+            const promises = [];
+
+            for (const subTabContext of data.tabContext.getMainTabContext().getAllSubTabContexts()) {
+                const subWidget = this.widgets[subTabContext.tabId];
+
+                if (!subWidget) {
+                    continue;
+                }
+
+                if (subTabContext !== data.tabContext && !subWidget.hasBeenAlreadyShown) {
+                    promises.push(widget.handleEvent('activeTabChanged', {tabContext: subTabContext}));
+                    continue;
+                }
+
+                if (subTabContext === data.tabContext && (subWidget.hasBeenAlreadyShown || name === 'tabNoteSwitchedAndActivated')) {
+                    subWidget.hasBeenAlreadyShown = true;
+
+                    promises.push(widget.handleEvent('tabNoteSwitched', data));
+                }
+            }
+
+            if (name === 'tabNoteSwitchedAndActivated') {
+                this.toggleExt(true);
+            }
+
+            return Promise.all(promises);
         }
 
         if (name === 'activeTabChanged') {
-            const widget = this.widgets[data.tabContext.tabId];
+            const promises = [];
 
-            if (widget.hasBeenAlreadyShown) {
+            for (const subTabContext of data.tabContext.getMainTabContext().getAllSubTabContexts()) {
-                return Promise.resolve();
+                console.log("subTabContext", subTabContext);
-            }
-            else {
-                widget.hasBeenAlreadyShown = true;
 
-                return widget.handleEvent(name, data);
+                const widget = this.widgets[subTabContext.tabId];
+
+                if (!widget.hasBeenAlreadyShown) {
+                    widget.hasBeenAlreadyShown = true;
+
+                    promises.push(widget.handleEvent(name, {tabContext: subTabContext}));
+                }
             }
+
+            this.toggleExt(true);
+
+            return Promise.all(promises);
         } else {
             return super.handleEventInChildren(name, data);
         }

src/public/app/widgets/tab_caching_widget.js

@@ -55,7 +55,7 @@ export default class TabCachingWidget extends TabAwareWidget {
 
     toggleExt(show) {
         for (const tabId in this.widgets) {
-            this.widgets[tabId].toggleExt(show && this.isTabOrParent(tabId));
+            this.widgets[tabId].toggleExt(show && this.isTab(tabId));
         }
     }
 

src/public/app/widgets/type_widgets/empty.js

@@ -2,7 +2,6 @@ import noteAutocompleteService from '../../services/note_autocomplete.js';
 import TypeWidget from "./type_widget.js";
 import appContext from "../../services/app_context.js";
 import searchService from "../../services/search.js";
-import linkService from "../../services/link.js";
 
 const TPL = `
 <div class="note-detail-empty note-detail-printable">