mirror of
https://github.com/zadam/trilium.git
synced 2025-06-05 17:38:47 +02: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