zadam/trilium
1
1
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-01-16 20:21:43 +08:00
Code Issues Projects Releases Packages Wiki Activity

refactored tab activation

Browse source
This commit is contained in:
zadam 2020-01-19 21:12:53 +01:00
parent 1098d75ce0
commit 0760dc742b
8 changed files with 79 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

51
src/public/javascripts/services/app_context.js
View file

@ -30,6 +30,7 @@ import ProtectedNoteSwitchWidget from "../widgets/protected_note_switch.js";
import NoteTypeWidget from "../widgets/note_type.js";
import NoteActionsWidget from "../widgets/note_actions.js";
import protectedSessionHolder from "./protected_session_holder.js";
import bundleService from "./bundle.js";
class AppContext {
constructor() {
@ -39,6 +40,7 @@ class AppContext {
this.tabsChangedTaskId = null;
/** @type {TabRowWidget} */
this.tabRow = null;
this.activeTabId = null;
}
showWidgets() {
@ -180,9 +182,7 @@ class AppContext {
/** @returns {TabContext} */
getActiveTabContext() {
const tabId = this.tabRow.activeTabId;
return this.tabContexts.find(tc => tc.tabId === tabId);
return this.tabContexts.find(tc => tc.tabId === this.activeTabId);
}
/** @returns {string|null} */
@ -268,10 +268,10 @@ class AppContext {
}
async openEmptyTab() {
const ctx = new TabContext(this, this.tabRow);
this.tabContexts.push(ctx);
const tabContext = new TabContext(this, this.tabRow);
this.tabContexts.push(tabContext);
await this.tabRow.activateTab(ctx.$tab[0]);
await this.activateTab(tabContext.tabId);
}
async filterTabs(noteId) {
@ -291,8 +291,7 @@ class AppContext {
async saveOpenTabs() {
const openTabs = [];
for (const tabEl of this.tabRow.tabEls) {
const tabId = tabEl.getAttribute('data-tab-id');
for (const tabId of this.tabRow.getTabIdsInOrder()) {
const tabContext = appContext.getTabContexts().find(tc => tc.tabId === tabId);
if (tabContext) {
@ -324,23 +323,42 @@ class AppContext {
this.tabsChangedTaskId = setTimeout(() => this.saveOpenTabs(), 1000);
}
async activateTab(tabContext) {
return this.tabRow.activateTab(tabContext.$tab[0]);
async activateTab(tabId) {
this.activeTabId = tabId;
this.trigger('activeTabChanged', { tabId: this.activeTabId });
}
newTabListener() {
this.openEmptyTab();
}
async tabRemoveListener({tabId}) {
this.tabContexts.filter(nc => nc.tabId === tabId)
.forEach(tc => tc.remove());
async removeTab(tabId) {
const tabContextToRemove = this.tabContexts.find(tc => tc.tabId === tabId);
const tabIdsInOrder = this.tabRow.getTabIdsInOrder();
this.tabContexts = this.tabContexts.filter(nc => nc.tabId !== tabId);
if (!tabContextToRemove) {
return;
}
if (this.tabContexts.length === 0) {
this.openEmptyTab();
}
else {
const oldIdx = tabIdsInOrder.findIndex(tid => tid === tabId);
const newActiveTabId = tabIdsInOrder[oldIdx === tabIdsInOrder.length ? oldIdx - 1 : oldIdx + 1];
if (newActiveTabId) {
this.activateTab(newActiveTabId);
}
else {
console.log("Failed to find next tabcontext to activate");
}
}
await tabContextToRemove.remove();
this.tabContexts = this.tabContexts.filter(tc => tc.tabId === tabId);
this.openTabsChanged();
}
@ -359,6 +377,9 @@ class AppContext {
if (activeTabContext.note.isProtected && protectedSessionHolder.isProtectedSessionAvailable()) {
protectedSessionHolder.touchProtectedSession();
}
// run async
bundleService.executeRelationBundles(activeTabContext.note, 'runOnNoteChange', activeTabContext);
}
}
@ -378,6 +399,7 @@ keyboardActionService.setGlobalActionHandler('ActivateNextTab', () => {
const nextTab = this.tabRow.nextTabEl;
if (nextTab) {
// FIXME
this.tabRow.activateTab(nextTab);
}
});
@ -386,6 +408,7 @@ keyboardActionService.setGlobalActionHandler('ActivatePreviousTab', () => {
const prevTab = this.tabRow.previousTabEl;
if (prevTab) {
// FIXME
this.tabRow.activateTab(prevTab);
}
});

2
src/public/javascripts/services/note_detail.js
View file

@ -113,7 +113,7 @@ async function loadNoteDetail(origNotePath, options = {}) {
const loadPromise = loadNoteDetailToContext(ctx, notePath).then(() => {
if (activate) {
return appContext.activateTab(ctx);
return appContext.activateTab(ctx.tabId);
}
else {
return Promise.resolve();

9
src/public/javascripts/services/tab_context.js
View file

@ -81,6 +81,12 @@ class TabContext extends Component {
return this.tabId === this.tabRow.activeTabId;
}
async remove() {
await this.trigger('beforeTabRemove', {tabId: this.tabId}, true);
this.trigger('tabRemoved', {tabId: this.tabId});
}
setupClasses() {
for (const clazz of Array.from(this.$tab[0].classList)) { // create copy to safely iterate over while removing classes
if (clazz !== 'note-tab') {
@ -123,8 +129,7 @@ class TabContext extends Component {
// FIXME trigger "noteSaved" event so that title indicator is triggered
this.eventReceived('noteSaved');
// run async
bundleService.executeRelationBundles(this.note, 'runOnNoteChange', this);
}
async saveNoteIfChanged() {

6
src/public/javascripts/widgets/basic_widget.js
View file

@ -18,6 +18,12 @@ class BasicWidget extends Component {
this.$widget.toggle(show);
}
remove() {
if (this.$widget) {
this.$widget.remove();
}
}
cleanup() {}
}

8
src/public/javascripts/widgets/note_title.js
View file

@ -132,7 +132,13 @@ export default class NoteTitleWidget extends TabAwareWidget {
}
}
async beforeNoteSwitch({tabId}) {
async beforeNoteSwitchListener({tabId}) {
if (this.isTab(tabId)) {
await this.spacedUpdate.updateNowIfNecessary();
}
}
async beforeTabRemoveListener({tabId}) {
if (this.isTab(tabId)) {
await this.spacedUpdate.updateNowIfNecessary();
}

1
src/public/javascripts/widgets/note_tree.js
View file

@ -408,6 +408,7 @@ export default class NoteTreeWidget extends TabAwareWidget {
if (oldActiveNode) {
oldActiveNode.setActive(false);
oldActiveNode.setFocus(false);
}
if (this.tabContext && this.tabContext.notePath) {

8
src/public/javascripts/widgets/tab_caching_widget.js
View file

@ -35,6 +35,14 @@ export default class TabCachingWidget extends TabAwareWidget {
return false; // stop propagation to children
}
tabRemovedListener({tabId}) {
const widget = this.widgets[tabId];
if (widget) {
widget.remove();
}
}
toggle(show) {
for (const tabId in this.widgets) {
this.widgets[tabId].toggle(show && this.tabContext && tabId === this.tabContext.tabId);

38
src/public/javascripts/widgets/tab_row.js
View file

@ -399,11 +399,11 @@ export default class TabRowWidget extends BasicWidget {
setTabCloseEventListener(tabEl) {
tabEl.querySelector('.note-tab-close')
.addEventListener('click', _ => this.removeTab(tabEl.getAttribute('data-tab-id')));
.addEventListener('click', _ => this.appContext.removeTab(tabEl.getAttribute('data-tab-id')));
tabEl.addEventListener('mousedown', e => {
if (e.which === 2) {
this.removeTab(tabEl.getAttribute('data-tab-id'));
this.appContext.removeTab(tabEl.getAttribute('data-tab-id'));
return true; // event has been handled
}
@ -464,44 +464,26 @@ export default class TabRowWidget extends BasicWidget {
return !!this.activeTabEl;
}
activateTab(tabEl) {
activeTabChangedListener({tabId}) {
const tabEl = this.getTabById(tabId)[0];
const activeTabEl = this.activeTabEl;
if (activeTabEl === tabEl) return;
if (activeTabEl) activeTabEl.removeAttribute('active');
tabEl.setAttribute('active', '');
this.trigger('activeTabChanged', { tabId: tabEl.getAttribute('data-tab-id') });
}
removeTab(tabId) {
const tabEl = this.$widget.find(`[data-tab-id='${tabId}']`)[0];
const tabEl = this.getTabById(tabId)[0];
if (tabEl === this.activeTabEl) {
if (tabEl.nextElementSibling && tabEl.nextElementSibling.classList.contains("note-tab")) {
this.activateTab(tabEl.nextElementSibling)
} else if (tabEl.previousElementSibling && tabEl.previousElementSibling.classList.contains("note-tab")) {
this.activateTab(tabEl.previousElementSibling)
}
}
tabEl.parentNode.removeChild(tabEl);
this.trigger('tabRemove', { tabId: tabEl.getAttribute('data-tab-id') });
this.cleanUpPreviouslyDraggedTabs();
this.layoutTabs();
this.setupDraggabilly();
this.setVisibility();
}
removeAllTabs() {
for (const tabEl of this.tabEls) {
this.removeTab(tabEl.getAttribute('data-tab-id'));
}
}
removeAllTabsExceptForThis(remainingTabEl) {
for (const tabEl of this.tabEls) {
if (remainingTabEl !== tabEl) {
this.removeTab(tabEl.getAttribute('data-tab-id'));
}
}
getTabIdsInOrder() {
return this.tabEls.map(el => el.getAttribute('data-tab-id'));
}
updateTab(tabEl, tabProperties) {
@ -519,6 +501,10 @@ export default class TabRowWidget extends BasicWidget {
.forEach($el => $el.find('.note-tab-title').text(title));
}
tabRemovedListener({tabId}) {
this.removeTab(tabId);
}
cleanUpPreviouslyDraggedTabs() {
this.tabEls.forEach((tabEl) => tabEl.classList.remove('note-tab-was-just-dragged'));
}
@ -552,7 +538,7 @@ export default class TabRowWidget extends BasicWidget {
this.draggabillies.push(draggabilly);
draggabilly.on('pointerDown', _ => {
this.activateTab(tabEl)
this.appContext.activateTab(tabEl.getAttribute('data-tab-id'));
});
draggabilly.on('dragStart', _ => {