mirror of
				https://github.com/zadam/trilium.git
				synced 2025-11-04 05:28:59 +01:00 
			
		
		
		
	more tab row refactoring
This commit is contained in:
		
							parent
							
								
									1552c3804d
								
							
						
					
					
						commit
						cc138ef9f8
					
				@ -161,13 +161,7 @@ class AppContext {
 | 
			
		||||
 | 
			
		||||
    /** @returns {TabContext} */
 | 
			
		||||
    getActiveTabContext() {
 | 
			
		||||
        const activeTabEl = this.tabRow.activeTabEl;
 | 
			
		||||
 | 
			
		||||
        if (!activeTabEl) {
 | 
			
		||||
            return null;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        const tabId = activeTabEl.getAttribute('data-tab-id');
 | 
			
		||||
        const tabId = this.tabRow.activeTabId;
 | 
			
		||||
 | 
			
		||||
        return this.tabContexts.find(tc => tc.tabId === tabId);
 | 
			
		||||
    }
 | 
			
		||||
@ -294,7 +288,7 @@ class AppContext {
 | 
			
		||||
    async filterTabs(noteId) {
 | 
			
		||||
        for (const tc of this.tabContexts) {
 | 
			
		||||
            if (tc.notePath && !tc.notePath.split("/").includes(noteId)) {
 | 
			
		||||
                await this.tabRow.removeTab(tc.$tab[0]);
 | 
			
		||||
                this.tabRow.removeTab(tc.tabId);
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
@ -349,15 +343,11 @@ class AppContext {
 | 
			
		||||
        this.openEmptyTab();
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    async activeTabChangedListener({tabEl}) {
 | 
			
		||||
        const tabId = tabEl.getAttribute('data-tab-id');
 | 
			
		||||
 | 
			
		||||
    async activeTabChangedListener({tabId}) {
 | 
			
		||||
        await this.showTab(tabId);
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    async tabRemoveListener({tabEl}) {
 | 
			
		||||
        const tabId = tabEl.getAttribute('data-tab-id');
 | 
			
		||||
 | 
			
		||||
    async tabRemoveListener({tabId}) {
 | 
			
		||||
        this.tabContexts.filter(nc => nc.tabId === tabId)
 | 
			
		||||
            .forEach(tc => tc.remove());
 | 
			
		||||
 | 
			
		||||
@ -383,7 +373,7 @@ keyboardActionService.setGlobalActionHandler('OpenNewTab', () => {
 | 
			
		||||
 | 
			
		||||
keyboardActionService.setGlobalActionHandler('CloseActiveTab', () => {
 | 
			
		||||
    if (this.tabRow.activeTabEl) {
 | 
			
		||||
        this.tabRow.removeTab(this.tabRow.activeTabEl);
 | 
			
		||||
        this.tabRow.removeTab(this.tabRow.activeTabId);
 | 
			
		||||
    }
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -139,7 +139,7 @@ async function noteDeleted(noteId) {
 | 
			
		||||
        // not removing active even if it contains deleted note since that one will move to another note (handled by deletion logic)
 | 
			
		||||
        // and we would lose tab context state (e.g. sidebar visibility)
 | 
			
		||||
        if (!tc.isActive() && tc.notePath && tc.notePath.split("/").includes(noteId)) {
 | 
			
		||||
            await tabRow.removeTab(tc.$tab[0]);
 | 
			
		||||
            tabRow.removeTab(tc.tabId);
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@ -109,7 +109,7 @@ class TabContext extends Component {
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    isActive() {
 | 
			
		||||
        return this.$tab[0] === this.tabRow.activeTabEl;
 | 
			
		||||
        return this.tabId === this.tabRow.activeTabId;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    setupClasses() {
 | 
			
		||||
@ -213,7 +213,7 @@ class TabContext extends Component {
 | 
			
		||||
        return {
 | 
			
		||||
            tabId: this.tabId,
 | 
			
		||||
            notePath: this.notePath,
 | 
			
		||||
            active: this.tabRow.activeTabEl === this.$tab[0]
 | 
			
		||||
            active: this.tabRow.activeTabId === this.tabId
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -399,17 +399,23 @@ export default class TabRowWidget extends BasicWidget {
 | 
			
		||||
 | 
			
		||||
    setTabCloseEventListener(tabEl) {
 | 
			
		||||
        tabEl.querySelector('.note-tab-close')
 | 
			
		||||
            .addEventListener('click', _ => this.removeTab(tabEl));
 | 
			
		||||
            .addEventListener('click', _ => this.removeTab(tabEl.getAttribute('data-tab-id')));
 | 
			
		||||
 | 
			
		||||
        tabEl.addEventListener('mousedown', e => {
 | 
			
		||||
            if (e.which === 2) {
 | 
			
		||||
                this.removeTab(tabEl);
 | 
			
		||||
                this.removeTab(tabEl.getAttribute('data-tab-id'));
 | 
			
		||||
 | 
			
		||||
                return true; // event has been handled
 | 
			
		||||
            }
 | 
			
		||||
        });
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    get activeTabId() {
 | 
			
		||||
        const tabEl = this.activeTabEl;
 | 
			
		||||
 | 
			
		||||
        return tabEl ? tabEl.getAttribute('data-tab-id') : null;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    get activeTabEl() {
 | 
			
		||||
        return this.$widget.find('.note-tab[active]')[0];
 | 
			
		||||
    }
 | 
			
		||||
@ -458,40 +464,42 @@ export default class TabRowWidget extends BasicWidget {
 | 
			
		||||
        return !!this.activeTabEl;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    async activateTab(tabEl) {
 | 
			
		||||
    activateTab(tabEl) {
 | 
			
		||||
        const activeTabEl = this.activeTabEl;
 | 
			
		||||
        if (activeTabEl === tabEl) return;
 | 
			
		||||
        if (activeTabEl) activeTabEl.removeAttribute('active');
 | 
			
		||||
        tabEl.setAttribute('active', '');
 | 
			
		||||
        await this.trigger('activeTabChanged', { tabEl });
 | 
			
		||||
        this.trigger('activeTabChanged', { tabId: tabEl.getAttribute('data-tab-id') });
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    async removeTab(tabEl) {
 | 
			
		||||
    removeTab(tabId) {
 | 
			
		||||
        const tabEl = this.$widget.find(`[data-tab-id='${tabId}']`)[0];
 | 
			
		||||
 | 
			
		||||
        if (tabEl === this.activeTabEl) {
 | 
			
		||||
            if (tabEl.nextElementSibling && tabEl.nextElementSibling.classList.contains("note-tab")) {
 | 
			
		||||
                await this.activateTab(tabEl.nextElementSibling)
 | 
			
		||||
                this.activateTab(tabEl.nextElementSibling)
 | 
			
		||||
            } else if (tabEl.previousElementSibling && tabEl.previousElementSibling.classList.contains("note-tab")) {
 | 
			
		||||
                await this.activateTab(tabEl.previousElementSibling)
 | 
			
		||||
                this.activateTab(tabEl.previousElementSibling)
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
        tabEl.parentNode.removeChild(tabEl);
 | 
			
		||||
        await this.trigger('tabRemove', { tabEl });
 | 
			
		||||
        this.trigger('tabRemove', { tabId: tabEl.getAttribute('data-tab-id') });
 | 
			
		||||
        this.cleanUpPreviouslyDraggedTabs();
 | 
			
		||||
        this.layoutTabs();
 | 
			
		||||
        this.setupDraggabilly();
 | 
			
		||||
        this.setVisibility();
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    async removeAllTabs() {
 | 
			
		||||
    removeAllTabs() {
 | 
			
		||||
        for (const tabEl of this.tabEls) {
 | 
			
		||||
            await this.removeTab(tabEl);
 | 
			
		||||
            this.removeTab(tabEl.getAttribute('data-tab-id'));
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    async removeAllTabsExceptForThis(remainingTabEl) {
 | 
			
		||||
    removeAllTabsExceptForThis(remainingTabEl) {
 | 
			
		||||
        for (const tabEl of this.tabEls) {
 | 
			
		||||
            if (remainingTabEl !== tabEl) {
 | 
			
		||||
                await this.removeTab(tabEl);
 | 
			
		||||
                this.removeTab(tabEl.getAttribute('data-tab-id'));
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
@ -585,7 +593,7 @@ export default class TabRowWidget extends BasicWidget {
 | 
			
		||||
        })
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    async animateTabMove(tabEl, originIndex, destinationIndex) {
 | 
			
		||||
    animateTabMove(tabEl, originIndex, destinationIndex) {
 | 
			
		||||
        if (destinationIndex < originIndex) {
 | 
			
		||||
            tabEl.parentNode.insertBefore(tabEl, this.tabEls[destinationIndex]);
 | 
			
		||||
        } else {
 | 
			
		||||
@ -593,7 +601,7 @@ export default class TabRowWidget extends BasicWidget {
 | 
			
		||||
 | 
			
		||||
            tabEl.parentNode.insertBefore(tabEl, beforeEl);
 | 
			
		||||
        }
 | 
			
		||||
        await this.trigger('tabReorder', { tabEl, originIndex, destinationIndex });
 | 
			
		||||
        this.trigger('tabReorder');
 | 
			
		||||
        this.layoutTabs();
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user