various widget optimizations for faster note switching

This commit is contained in:
zadam
2020-02-03 21:16:33 +01:00
parent 66204811cf
commit 44ddcdd852
13 changed files with 111 additions and 96 deletions

View File

@@ -24,46 +24,44 @@ export default class AttributesWidget extends CollapsibleWidget {
}
async refreshWithNote(note) {
const attributes = await note.getAttributes();
const ownedAttributes = note.getOwnedAttributes();
if (attributes.length === 0) {
this.$body.text("No attributes yet...");
return;
}
const $attributesContainer = $("<div>");
await this.renderAttributes(ownedAttributes, $attributesContainer);
const inheritedAttributes = attributes.filter(attr => attr.noteId !== this.tabContext.note.noteId);
const $inheritedAttrs = $("<span>").append($("<strong>").text("Inherited: "));
const $showInheritedAttributes = $("<a>")
.attr("href", "javascript:")
.text("+show inherited")
.on('click', async () => {
const attributes = await note.getAttributes();
const inheritedAttributes = attributes.filter(attr => attr.noteId !== this.tabContext.note.noteId);
if (inheritedAttributes.length > 0) {
const $inheritedAttrs = $("<span>").append($("<strong>").text("Inherited: "));
const $showInheritedAttributes = $("<a>")
.attr("href", "javascript:")
.text("+show inherited")
.on('click', () => {
$showInheritedAttributes.hide();
$inheritedAttrs.show();
});
if (inheritedAttributes.length === 0) {
$inheritedAttrs.text("No inherited attributes yet...");
}
else {
await this.renderAttributes(inheritedAttributes, $inheritedAttrs);
}
const $hideInheritedAttributes = $("<a>")
.attr("href", "javascript:")
.text("-hide inherited")
.on('click', () => {
$showInheritedAttributes.show();
$inheritedAttrs.hide();
});
$inheritedAttrs.show();
$showInheritedAttributes.hide();
$hideInheritedAttributes.show();
});
$attributesContainer.append($showInheritedAttributes);
$attributesContainer.append($inheritedAttrs);
const $hideInheritedAttributes = $("<a>")
.attr("href", "javascript:")
.text("-hide inherited")
.on('click', () => {
$showInheritedAttributes.show();
$hideInheritedAttributes.hide();
$inheritedAttrs.empty().hide();
});
await this.renderAttributes(inheritedAttributes, $inheritedAttrs);
$attributesContainer.append($showInheritedAttributes, $inheritedAttrs, $hideInheritedAttributes);
$inheritedAttrs.append($hideInheritedAttributes);
$inheritedAttrs.hide();
}
$inheritedAttrs.hide();
$hideInheritedAttributes.hide();
this.$body.empty().append($attributesContainer);
}

View File

@@ -28,6 +28,18 @@ export default class LinkMapWidget extends CollapsibleWidget {
return [$showFullButton];
}
noteSwitched() {
const noteId = this.noteId;
// avoid executing this expensive operation multiple times when just going through notes (with keyboard especially)
// until the users settles on a note
setTimeout(() => {
if (this.noteId === noteId) {
this.refresh();
}
}, 1000);
}
async refreshWithNote(note) {
this.$body.css('opacity', 0);
this.$body.html(TPL);

View File

@@ -26,47 +26,48 @@ export default class NotePathsWidget extends TabAwareWidget {
this.$notePathList = this.$widget.find(".note-path-list");
this.$notePathCount = this.$widget.find(".note-path-count");
this.$widget.on('show.bs.dropdown', () => this.renderDropdown());
return this.$widget;
}
async refreshWithNote(note, notePath) {
if (note.noteId === 'root') {
// root doesn't have any parent, but it's still technically 1 path
const pathCount = note.noteId === 'root'
? 1 // root doesn't have any parent, but it's still technically 1 path
: note.getBranchIds().length;
this.$notePathCount.html("1 path");
this.$notePathCount.html(pathCount + " path" + (pathCount > 1 ? "s" : ""));
}
this.$notePathList.empty();
async renderDropdown() {
this.$notePathList.empty();
if (this.noteId === 'root') {
await this.addPath('root', true);
return;
}
else {
const parents = await note.getParentNotes();
this.$notePathCount.html(parents.length + " path" + (parents.length > 1 ? "s" : ""));
this.$notePathList.empty();
const pathSegments = this.notePath.split("/");
const activeNoteParentNoteId = pathSegments[pathSegments.length - 2]; // we know this is not root so there must be a parent
const pathSegments = notePath.split("/");
const activeNoteParentNoteId = pathSegments[pathSegments.length - 2]; // we know this is not root so there must be a parent
for (const parentNote of await this.note.getParentNotes()) {
const parentNotePath = await treeService.getSomeNotePath(parentNote);
// this is to avoid having root notes leading '/'
const notePath = parentNotePath ? (parentNotePath + '/' + this.noteId) : this.noteId;
const isCurrent = activeNoteParentNoteId === parentNote.noteId;
for (const parentNote of parents) {
const parentNotePath = await treeService.getSomeNotePath(parentNote);
// this is to avoid having root notes leading '/'
const notePath = parentNotePath ? (parentNotePath + '/' + note.noteId) : note.noteId;
const isCurrent = activeNoteParentNoteId === parentNote.noteId;
await this.addPath(notePath, isCurrent);
}
const cloneLink = $("<div>")
.addClass("dropdown-item")
.append(
$('<button class="btn btn-sm">')
.text('Clone note to new location...')
.on('click', () => import("../dialogs/clone_to.js").then(d => d.showDialog([note.noteId])))
);
this.$notePathList.append(cloneLink);
await this.addPath(notePath, isCurrent);
}
const cloneLink = $("<div>")
.addClass("dropdown-item")
.append(
$('<button class="btn btn-sm">')
.text('Clone note to new location...')
.on('click', () => import("../dialogs/clone_to.js").then(d => d.showDialog([this.noteId])))
);
this.$notePathList.append(cloneLink);
}
async addPath(notePath, isCurrent) {
@@ -75,9 +76,12 @@ export default class NotePathsWidget extends TabAwareWidget {
const noteLink = await linkService.createNoteLink(notePath, {title});
noteLink
.addClass("no-tooltip-preview")
.addClass("dropdown-item");
noteLink
.find('a')
.addClass("no-tooltip-preview");
if (isCurrent) {
noteLink.addClass("current");
}

View File

@@ -26,6 +26,18 @@ class NoteRevisionsWidget extends CollapsibleWidget {
return [$showFullButton];
}
noteSwitched() {
const noteId = this.noteId;
// avoid executing this expensive operation multiple times when just going through notes (with keyboard especially)
// until the users settles on a note
setTimeout(() => {
if (this.noteId === noteId) {
this.refresh();
}
}, 1000);
}
async refreshWithNote(note) {
const revisionItems = await server.get(`notes/${note.noteId}/revisions`);

View File

@@ -52,7 +52,7 @@ export default class NoteTypeWidget extends TabAwareWidget {
}
/** actual body is rendered lazily on note-type button click */
async renderDropdown() {console.log("AAAAAAAAAAAAAAAAAAA");
async renderDropdown() {
this.$noteTypeDropdown.empty();
for (const noteType of NOTE_TYPES.filter(nt => nt.selectable)) {
@@ -130,6 +130,7 @@ export default class NoteTypeWidget extends TabAwareWidget {
}
async confirmChangeIfContent() {
// FIXME
if (!this.tabContext.getComponent().getContent()) {
return true;
}

View File

@@ -14,6 +14,20 @@ export default class SimilarNotesWidget extends CollapsibleWidget {
getMaxHeight() { return "200px"; }
noteSwitched() {
const noteId = this.noteId;
this.$body.empty();
// avoid executing this expensive operation multiple times when just going through notes (with keyboard especially)
// until the users settles on a note
setTimeout(() => {
if (this.noteId === noteId) {
this.refresh();
}
}, 1000);
}
async refreshWithNote(note) {
// remember which title was when we found the similar notes
this.title = note.title;