zadam/trilium
1
1
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2024-09-20 15:45:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

note list is now separate widget which allows more flexibility in its usage

Browse source
This commit is contained in:
zadam 2020-11-25 23:18:30 +01:00
parent b9c0823abf
commit 02043d9109
4 changed files with 62 additions and 69 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/public/app/layouts/desktop_main_window_layout.js
View file

@ -27,6 +27,7 @@ import EditedNotesWidget from "../widgets/collapsible_widgets/edited_notes.js";
import CollapsibleSectionContainer from "../widgets/collapsible_section_container.js";
import PromotedAttributesWidget from "../widgets/promoted_attributes.js";
import InheritedAttributesWidget from "../widgets/inherited_attribute_list.js";
import NoteListWidget from "../widgets/note_list.js";
const RIGHT_PANE_CSS = `
<style>
@ -164,6 +165,7 @@ export default class DesktopMainWindowLayout {
)
)
.child(new TabCachingWidget(() => new NoteDetailWidget()))
.child(new TabCachingWidget(() => new NoteListWidget()))
.child(new TabCachingWidget(() => new SimilarNotesWidget()))
.child(...this.customWidgets.get('center-pane'))
)

3
src/public/app/widgets/note_detail.js
View file

@ -25,8 +25,8 @@ const TPL = `
<div class="note-detail">
<style>
.note-detail {
height: 100%;
min-height: 0;
flex-grow: 1;
font-family: var(--detail-font-family);
font-size: var(--detail-font-size);
}
@ -75,6 +75,7 @@ export default class NoteDetailWidget extends TabAwareWidget {
doRender() {
this.$widget = $(TPL);
this.contentSized();
this.$widget.on("dragover", e => e.preventDefault());

39
src/public/app/widgets/note_list.js Normal file
View file

@ -0,0 +1,39 @@
import TabAwareWidget from "./tab_aware_widget.js";
import NoteListRenderer from "../services/note_list_renderer.js";
const TPL = `
<div class="note-list-widget">
<style>
.note-list-widget {
flex-grow: 100000;
padding: 0 10px 10px 10px;
}
</style>
</div>`;
export default class NoteListWidget extends TabAwareWidget {
isEnabled() {
return super.isEnabled() && !this.tabContext.autoBookDisabled && (
['book', 'search'].includes(this.note.type)
|| (this.note.type === 'text' && this.note.hasChildren())
);
}
doRender() {
this.$widget = $(TPL);
this.contentSized();
}
async refreshWithNote(note) {
const noteListRenderer = new NoteListRenderer(note, note.getChildNoteIds());
this.$widget.empty().append(await noteListRenderer.renderList());
}
autoBookDisabledEvent({tabContext}) {
if (this.isTab(tabContext.tabId)) {
this.refresh();
}
}
}

87
src/public/app/widgets/type_widgets/book.js
View file

@ -4,34 +4,23 @@ import TypeWidget from "./type_widget.js";
const TPL = `
<div class="note-detail-book note-detail-printable">
<style>
.note-detail-book {
height: 100%;
padding: 0 10px 10px 10px;
position: relative;
display: flex;
flex-direction: column;
}
.note-book-auto-message {
.note-detail-book-auto-help {
background-color: var(--accented-background-color);
text-align: center;
width: 100%;
border-radius: 10px;
padding: 5px;
margin-top: 5px;
}
.note-detail-book-content {
flex-grow: 1;
min-height: 0;
margin: 0 10px 10px 10px;
}
</style>
<div class="note-detail-book-help alert alert-warning" style="margin: 50px; padding: 20px;">
<div class="note-detail-book-empty-help alert alert-warning" style="margin: 50px; padding: 20px;">
This note of type Book doesn't have any child notes so there's nothing to display. See <a href="https://github.com/zadam/trilium/wiki/Book-note">wiki</a> for details.
</div>
<div class="note-detail-book-content"></div>
<div class="note-detail-book-auto-help">
This note doesn't have any content so we display its children.
<br> Click <a href="javascript:">here</a> if you want to add some text.
</div>
</div>`;
export default class BookTypeWidget extends TypeWidget {
@ -39,57 +28,19 @@ export default class BookTypeWidget extends TypeWidget {
doRender() {
this.$widget = $(TPL);
this.$content = this.$widget.find('.note-detail-book-content');
this.$help = this.$widget.find('.note-detail-book-help');
this.contentSized();
this.$helpNoChildren = this.$widget.find('.note-detail-book-empty-help');
this.$helpAutoBook = this.$widget.find('.note-detail-book-auto-help');
this.$helpAutoBook.find('a').on('click', () => {
this.tabContext.autoBookDisabled = true;
this.triggerEvent('autoBookDisabled', {tabContext: this.tabContext});
});
}
async doRefresh(note) {
this.$content.empty();
this.$help.hide();
if (this.isAutoBook()) {
const $addTextLink = $('<a href="javascript:">here</a>').on('click', () => {
this.tabContext.autoBookDisabled = true;
this.triggerEvent('autoBookDisabled', {tabContext: this.tabContext});
});
this.$content.append($('<div class="note-book-auto-message"></div>')
.append(`This note doesn't have any content so we display its children. <br> Click `)
.append($addTextLink)
.append(' if you want to add some text.'));
}
const noteListRenderer = new NoteListRenderer(note, note.getChildNoteIds());
this.$content.append(await noteListRenderer.renderList());
}
/** @return {boolean} true if this is "auto book" activated (empty text note) and not explicit book note */
isAutoBook() {
return this.note.type !== 'book';
}
getDefaultZoomLevel() {
if (this.isAutoBook()) {
const w = this.$widget.width();
if (w <= 600) {
return 1;
} else if (w <= 900) {
return 2;
} else if (w <= 1300) {
return 3;
} else {
return 4;
}
}
else {
return 1;
}
}
cleanup() {
this.$content.empty();
this.$helpNoChildren.toggle(!this.note.hasChildren());
this.$helpAutoBook.toggle(this.note.type !== 'book');
}
}