gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-06-05 01:18:44 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

moved similar notes from sidebar to the center pane

Browse Source
This commit is contained in:
zadam 2020-09-07 23:35:41 +02:00
parent 75c9db6432
commit 80f269d844
10 changed files with 174 additions and 105 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/public/app/layouts/desktop_main_window_layout.js
View File

@ -20,7 +20,7 @@ import NoteInfoWidget from "../widgets/collapsible_widgets/note_info.js";
import CalendarWidget from "../widgets/collapsible_widgets/calendar.js";
import LinkMapWidget from "../widgets/collapsible_widgets/link_map.js";
import NoteRevisionsWidget from "../widgets/collapsible_widgets/note_revisions.js";
import SimilarNotesWidget from "../widgets/collapsible_widgets/similar_notes.js";
import SimilarNotesWidget from "../widgets/similar_notes.js";
import WhatLinksHereWidget from "../widgets/collapsible_widgets/what_links_here.js";
import SidePaneToggles from "../widgets/side_pane_toggles.js";
import EditedNotesWidget from "../widgets/collapsible_widgets/edited_notes.js";
@ -138,6 +138,7 @@ export default class DesktopMainWindowLayout {
)
.child(new TabCachingWidget(() => new AttributeListWidget()))
.child(new TabCachingWidget(() => new NoteDetailWidget()))
.child(new TabCachingWidget(() => new SimilarNotesWidget()))
.child(...this.customWidgets.get('center-pane'))
)
.child(new SidePaneContainer('right')
@ -148,7 +149,6 @@ export default class DesktopMainWindowLayout {
.child(new TabCachingWidget(() => new EditedNotesWidget()))
.child(new TabCachingWidget(() => new LinkMapWidget()))
.child(new TabCachingWidget(() => new NoteRevisionsWidget()))
.child(new TabCachingWidget(() => new SimilarNotesWidget()))
.child(new TabCachingWidget(() => new WhatLinksHereWidget()))
.child(...this.customWidgets.get('right-pane'))
)

2
src/public/app/widgets/attribute_list.js
View File

@ -56,7 +56,7 @@ const TPL = `
cursor: pointer;
}
.attr-expander:not(.error):hover hr {
.attr-expander:hover hr {
border-color: var(--main-text-color);
}

96
src/public/app/widgets/collapsible_widgets/similar_notes.js
View File

@ -1,96 +0,0 @@
import CollapsibleWidget from "../collapsible_widget.js";
import linkService from "../../services/link.js";
import server from "../../services/server.js";
import treeCache from "../../services/tree_cache.js";
const TPL = `
<div>
<style>
.similar-notes-content a {
display: inline-block;
border: 1px dotted var(--main-border-color);
border-radius: 20px;
background-color: var(--accented-background-color);
padding: 0 10px 0 10px;
margin: 3px;
max-width: 10em;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
</style>
<div class="similar-notes-content"></div>
</div>
`;
export default class SimilarNotesWidget extends CollapsibleWidget {
get widgetTitle() { return "Similar notes"; }
async doRenderBody() {
this.$body.html(TPL);
this.$similarNotesContent = this.$body.find(".similar-notes-content");
}
get help() {
return {
title: "This list contains notes which might be similar to the current note based on textual similarity of note title."
};
}
noteSwitched() {
const noteId = this.noteId;
this.$similarNotesContent.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;
const similarNotes = await server.get('similar-notes/' + this.noteId);
if (similarNotes.length === 0) {
this.$similarNotesContent.text("No similar notes found ...");
return;
}
const noteIds = similarNotes.flatMap(note => note.notePath);
await treeCache.getNotes(noteIds, true); // preload all at once
const $list = $('<div>');
for (const similarNote of similarNotes) {
const note = await treeCache.getNote(similarNote.noteId, true);
if (!note) {
continue;
}
const $item = (await linkService.createNoteLink(similarNote.notePath.join("/")))
.css("font-size", 24 * similarNote.coeff);
$list.append($item);
}
this.$similarNotesContent.empty().append($list);
}
entitiesReloadedEvent({loadResults}) {
if (this.note && this.title !== this.note.title) {
this.rendered = false;
this.refresh();
}
}
}

2
src/public/app/widgets/note_tree.js
View File

@ -51,7 +51,7 @@ const TPL = `
.tree-settings-button {
position: absolute;
top: 10px;
right: 20px;
right: 10px;
z-index: 100;
}

163
src/public/app/widgets/similar_notes.js Normal file
View File

@ -0,0 +1,163 @@
import linkService from "../services/link.js";
import server from "../services/server.js";
import treeCache from "../services/tree_cache.js";
import TabAwareWidget from "./tab_aware_widget.js";
import options from "../services/options.js";
const TPL = `
<div class="similar-notes-widget hide-in-zen-mode">
<style>
.similar-notes-wrapper {
max-height: 100px;
overflow: auto;
}
.similar-notes-wrapper a {
display: inline-block;
border: 1px dotted var(--main-border-color);
border-radius: 20px;
background-color: var(--accented-background-color);
padding: 0 10px 0 10px;
margin: 0 3px 0 3px;
max-width: 10em;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.similar-notes-expander {
display: flex;
flex-direction: row;
color: var(--muted-text-color);
font-size: 90%;
margin: 0;
align-items: center;
}
.similar-notes-expander-text {
padding-left: 20px;
padding-right: 20px;
white-space: nowrap;
}
.similar-notes-expander:hover {
cursor: pointer;
}
.similar-notes-expander:hover hr {
border-color: var(--main-text-color);
}
.similar-notes-expander:hover .similar-notes-expander-text {
color: var(--main-text-color);
}
</style>
<div class="similar-notes-expander">
<hr class="w-100">
<div class="similar-notes-expander-text"
title="This list contains notes which might be similar to the current note based on textual similarity of note title, its labels and relations."></div>
<hr class="w-100">
</div>
<div class="similar-notes-wrapper"></div>
</div>
`;
export default class SimilarNotesWidget extends TabAwareWidget {
doRender() {
this.$widget = $(TPL);
this.overflowing();
this.$similarNotesWrapper = this.$widget.find(".similar-notes-wrapper");
this.$similarNotesExpanderText = this.$widget.find(".similar-notes-expander-text");
this.$expander = this.$widget.find('.similar-notes-expander');
this.$expander.on('click', async () => {
const collapse = this.$similarNotesWrapper.is(":visible");
await options.save('similarNotesExpanded', !collapse);
this.triggerEvent(`similarNotesCollapsedStateChanged`, {collapse});
});
return this.$widget;
}
noteSwitched() {
const noteId = this.noteId;
this.toggleInt(false);
this.$similarNotesWrapper.hide(); // we'll open it in refresh() if needed
// 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;
const similarNotes = await server.get('similar-notes/' + this.noteId);
this.toggleInt(similarNotes.length > 0);
if (similarNotes.length === 0) {
return;
}
if (options.is('similarNotesExpanded')) {
this.$similarNotesWrapper.show();
}
this.$similarNotesExpanderText.text(`${similarNotes.length} similar note${similarNotes.length === 1 ? '': "s"}`);
const noteIds = similarNotes.flatMap(note => note.notePath);
await treeCache.getNotes(noteIds, true); // preload all at once
const $list = $('<div>');
for (const similarNote of similarNotes) {
const note = await treeCache.getNote(similarNote.noteId, true);
if (!note) {
continue;
}
const $item = (await linkService.createNoteLink(similarNote.notePath.join("/")))
.css("font-size", 24 * similarNote.coeff);
$list.append($item);
}
this.$similarNotesWrapper.empty().append($list);
}
entitiesReloadedEvent({loadResults}) {
if (this.note && this.title !== this.note.title) {
this.rendered = false;
this.refresh();
}
}
/**
* This event is used to synchronize collapsed state of all the tab-cached widgets since they are all rendered
* separately but should behave uniformly for the user.
*/
similarNotesCollapsedStateChangedEvent({collapse}) {
if (collapse) {
this.$similarNotesWrapper.slideUp(200);
} else {
this.$similarNotesWrapper.slideDown(200);
}
}
}

2
src/public/app/widgets/standard_top_widget.js
View File

@ -82,7 +82,7 @@ export default class StandardTopWidget extends BasicWidget {
this.$leaveProtectedSessionButton = this.$widget.find(".leave-protected-session-button");
this.$leaveProtectedSessionButton.on('click', protectedSessionService.leaveProtectedSession);
return this.$widget
return this.$widget;
}
protectedSessionStartedEvent() {

3
src/routes/api/options.js
View File

@ -39,7 +39,8 @@ const ALLOWED_OPTIONS = new Set([
'rightPaneVisible',
'nativeTitleBarVisible',
'attributeListExpanded',
'promotedAttributesExpanded'
'promotedAttributesExpanded',
'similarNotesExpanded'
]);
function getOptions() {

2
src/services/note_cache/note_cache_service.js
View File

@ -229,7 +229,7 @@ function findSimilarNotes(noteId) {
results.sort((a, b) => a.coeff > b.coeff ? -1 : 1);
return results.length > 50 ? results.slice(0, 50) : results;
return results.length > 50 ? results.slice(0, 200) : results;
}
/**

3
src/services/options_init.js
View File

@ -86,7 +86,8 @@ const defaultOptions = [
{ name: 'hideArchivedNotes_main', value: 'false', isSynced: false },
{ name: 'hideIncludedImages_main', value: 'true', isSynced: false },
{ name: 'attributeListExpanded', value: 'false', isSynced: false },
{ name: 'promotedAttributesExpanded', value: 'false', isSynced: true }
{ name: 'promotedAttributesExpanded', value: 'true', isSynced: true },
{ name: 'similarNotesExpanded', value: 'true', isSynced: true }
];
function initStartupOptions() {

2
src/services/search/services/search.js
View File

@ -102,7 +102,7 @@ function searchNotesForAutocomplete(query) {
fuzzyAttributeSearch: true
});
const results = searchTrimmedNotes(query, parsingContext);
const {results} = searchTrimmedNotes(query, parsingContext);
highlightSearchResults(results, parsingContext.highlightedTokens);