client: Add basic mindmap integration

This commit is contained in:
Elian Doran 2024-09-01 15:04:47 +03:00
parent e39dd1525d
commit 594f816702
No known key found for this signature in database
6 changed files with 43 additions and 7 deletions

6
package-lock.json generated
View File

@ -66,6 +66,7 @@
"marked": "^13.0.2",
"mermaid": "^10.9.1",
"mime-types": "2.1.35",
"mind-elixir": "^4.0.5",
"multer": "1.4.5-lts.1",
"node-abi": "^3.65.0",
"normalize-strings": "1.1.1",
@ -13002,6 +13003,11 @@
"dom-walk": "^0.1.0"
}
},
"node_modules/mind-elixir": {
"version": "4.0.5",
"resolved": "https://registry.npmjs.org/mind-elixir/-/mind-elixir-4.0.5.tgz",
"integrity": "sha512-zFYNabpchCY468d/vqo68hnhP+VDN47uPyJJ4dYlkqvL7fomRlo/WJinYgH+Rjt5vFJVLEMBtFsv5fizAC4ZYg=="
},
"node_modules/minimalistic-assert": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",

View File

@ -106,6 +106,7 @@
"marked": "^13.0.2",
"mermaid": "^10.9.1",
"mime-types": "2.1.35",
"mind-elixir": "^4.0.5",
"multer": "1.4.5-lts.1",
"node-abi": "^3.65.0",
"normalize-strings": "1.1.1",

View File

@ -79,6 +79,12 @@ const I18NEXT = {
]
};
const MIND_ELIXIR = {
js: [
"node_modules/mind-elixir/dist/MindElixir.iife.js"
]
};
async function requireLibrary(library) {
if (library.css) {
library.css.map(cssUrl => requireCss(cssUrl));
@ -137,5 +143,6 @@ export default {
MERMAID,
EXCALIDRAW,
MARKJS,
I18NEXT
I18NEXT,
MIND_ELIXIR
}

View File

@ -146,7 +146,7 @@ export default class NoteDetailWidget extends NoteContextAwareWidget {
this.$widget.toggleClass("full-height",
(
!this.noteContext.hasNoteList()
&& ['canvas', 'webView', 'noteMap'].includes(this.type)
&& ['canvas', 'webView', 'noteMap', 'mindMap'].includes(this.type)
&& this.mime !== 'text/x-sqlite;schema=trilium'
)
|| this.noteContext.viewScope.viewMode === 'attachments'

View File

@ -1,7 +1,21 @@
import libraryLoader from "../../services/library_loader.js";
import TypeWidget from "./type_widget.js";
const TPL = `
<div class="note-detail-mind-map note-detail-printable">
<div class="mind-map-container">
</div>
<style>
.note-detail-mind-map {
height: 100%;
overflow: hidden !important;
}
.note-detail-mind-map .mind-map-container {
height: 100%;
}
</style>
</div>
`;
@ -10,15 +24,21 @@ export default class MindMapWidget extends TypeWidget {
doRender() {
this.$widget = $(TPL);
this.$content = this.$widget.find(".mind-map-container");
libraryLoader
.requireLibrary(libraryLoader.MIND_ELIXIR)
.then(() => {
const mind = new MindElixir({
el: this.$content[0],
direction: MindElixir.LEFT
});
mind.init(MindElixir.new("hello"));
});
super.doRender();
}
async doRefresh(note) {
this.$widget.html("<p>Hello</p>");
this.$widget.show();
}
cleanup() {
this.$widget.empty();
}

View File

@ -100,6 +100,8 @@ function register(app: express.Application) {
app.use(`/${assetPath}/node_modules/codemirror/addon/`, persistentCacheStatic(path.join(srcRoot, '..', 'node_modules/codemirror/addon/')));
app.use(`/${assetPath}/node_modules/codemirror/mode/`, persistentCacheStatic(path.join(srcRoot, '..', 'node_modules/codemirror/mode/')));
app.use(`/${assetPath}/node_modules/codemirror/keymap/`, persistentCacheStatic(path.join(srcRoot, '..', 'node_modules/codemirror/keymap/')));
app.use(`/${assetPath}/node_modules/mind-elixir/dist/`, persistentCacheStatic(path.join(srcRoot, "..", "node_modules/mind-elixir/dist/")));
}
export default {