gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-03-01 14:22:32 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

added TabCachingWidget

Browse Source
This commit is contained in:
zadam 2020-01-14 20:27:40 +01:00
parent c9bc4ad108
commit 23701219e1
4 changed files with 74 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/public/javascripts/services/app_context.js
View File

@ -11,6 +11,7 @@ import TabRowWidget from "./tab_row.js";
import NoteTitleWidget from "../widgets/note_title.js"; import NoteTitleWidget from "../widgets/note_title.js";
import PromotedAttributesWidget from "../widgets/promoted_attributes.js"; import PromotedAttributesWidget from "../widgets/promoted_attributes.js";
import NoteDetailWidget from "../widgets/note_detail.js"; import NoteDetailWidget from "../widgets/note_detail.js";
import TabCachingWidget from "../widgets/tab_caching_widget.js";
class AppContext { class AppContext {
constructor() { constructor() {
@ -40,23 +41,19 @@ class AppContext {
]; ];
for (const widget of leftPaneWidgets) { for (const widget of leftPaneWidgets) {
const $widget = widget.render(); widget.renderTo($leftPane);
$leftPane.append($widget);
} }
const $centerPane = $("#center-pane"); const $centerPane = $("#center-pane");
const centerPaneWidgets = [ const centerPaneWidgets = [
new NoteTitleWidget(this), new TabCachingWidget(this, () => new NoteTitleWidget(this)),
new PromotedAttributesWidget(this), new TabCachingWidget(this, () => new PromotedAttributesWidget(this)),
new NoteDetailWidget(this) new TabCachingWidget(this, () => new NoteDetailWidget(this))
]; ];
for (const widget of centerPaneWidgets) { for (const widget of centerPaneWidgets) {
const $widget = widget.render(); widget.renderTo($centerPane);
$centerPane.append($widget);
} }
this.widgets = [ this.widgets = [

12
src/public/javascripts/widgets/basic_widget.js
View File

@ -7,13 +7,17 @@ class BasicWidget {
this.widgetId = `widget-${this.constructor.name}`; this.widgetId = `widget-${this.constructor.name}`;
} }
renderTo($parent) {
$parent.append(this.render());
}
render() { render() {
// actual rendering is async // actual rendering is async
const $widget = this.doRender(); this.$widget = this.doRender();
// $widget.attr('id', this.widgetId); // $widget.attr('id', this.widgetId);
return $widget; return this.$widget;
} }
/** /**
@ -33,6 +37,10 @@ class BasicWidget {
this.appContext.trigger(name, data); this.appContext.trigger(name, data);
} }
toggle(show) {
this.$widget.toggle(show);
}
cleanup() {} cleanup() {}
} }

20
src/public/javascripts/widgets/note_title.js
View File

@ -8,6 +8,7 @@ import protectedSessionHolder from "../services/protected_session_holder.js";
import NoteTypeWidget from "./note_type.js"; import NoteTypeWidget from "./note_type.js";
const TPL = ` const TPL = `
<div class="note-title-row">
<style> <style>
.note-title-row { .note-title-row {
flex-grow: 0; flex-grow: 0;
@ -25,7 +26,6 @@ const TPL = `
} }
</style> </style>
<div class="note-title-row">
<div style="display: flex; align-items: center;"> <div style="display: flex; align-items: center;">
<div class="dropdown hide-in-zen-mode"> <div class="dropdown hide-in-zen-mode">
<button class="btn btn-sm dropdown-toggle note-path-list-button" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <button class="btn btn-sm dropdown-toggle note-path-list-button" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
@ -99,20 +99,20 @@ export default class NoteTitleWidget extends TabAwareWidget {
} }
doRender() { doRender() {
const $widget = $(TPL); this.$widget = $(TPL);
this.$noteTitle = $widget.find(".note-title"); this.$noteTitle = this.$widget.find(".note-title");
this.$noteTitleRow = $widget.find(".note-title-row"); this.$noteTitleRow = this.$widget.find(".note-title-row");
this.$notePathList = $widget.find(".note-path-list"); this.$notePathList = this.$widget.find(".note-path-list");
this.$notePathCount = $widget.find(".note-path-count"); this.$notePathCount = this.$widget.find(".note-path-count");
this.$protectButton = $widget.find(".protect-button"); this.$protectButton = this.$widget.find(".protect-button");
this.$protectButton.on('click', protectedSessionService.protectNoteAndSendToServer); this.$protectButton.on('click', protectedSessionService.protectNoteAndSendToServer);
this.$unprotectButton = $widget.find(".unprotect-button"); this.$unprotectButton = this.$widget.find(".unprotect-button");
this.$unprotectButton.on('click', protectedSessionService.unprotectNoteAndSendToServer); this.$unprotectButton.on('click', protectedSessionService.unprotectNoteAndSendToServer);
this.$savedIndicator = $widget.find(".saved-indicator"); this.$savedIndicator = this.$widget.find(".saved-indicator");
this.noteType = new NoteTypeWidget(this); this.noteType = new NoteTypeWidget(this);
@ -141,7 +141,7 @@ export default class NoteTitleWidget extends TabAwareWidget {
}); });
} }
return $widget; return this.$widget;
} }
async activeTabChanged() { async activeTabChanged() {

32
src/public/javascripts/widgets/tab_caching_widget.js Normal file
View File

@ -0,0 +1,32 @@
import TabAwareWidget from "./tab_aware_widget.js";
export default class TabCachingWidget extends TabAwareWidget {
constructor(appContext, widgetFactory) {
super(appContext);
this.widgetFactory = widgetFactory;
/** @type {JQuery} */
this.$parent = null;
this.widgets = {};
}
renderTo($parent) {
this.$parent = $parent;
}
activeTabChanged() {
for (const widget of Object.values(this.widgets)) {
widget.toggle(false);
}
let widget = this.widgets[this.tabContext.tabId];
if (!widget) {
widget = this.widgets[this.tabContext.tabId] = this.widgetFactory();
widget.renderTo(this.$parent);
widget.activeTabChangedListener();
}
widget.toggle(true);
}
}