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

client: Implement SVG export button for mindmap

Browse Source
This commit is contained in:
Elian Doran 2024-09-01 23:10:58 +03:00
parent 27a287f8ea
commit 61e0678af4
No known key found for this signature in database
3 changed files with 32 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/public/app/widgets/floating_buttons/svg_export_button.js
View File

@ -3,7 +3,7 @@ import NoteContextAwareWidget from "../note_context_aware_widget.js";
const TPL = ` const TPL = `
<button type="button" <button type="button"
class="export-mermaid-button" class="export-svg-button"
title="${t('svg_export_button.button_title')}"> title="${t('svg_export_button.button_title')}">
<span class="bx bx-export"></span> <span class="bx bx-export"></span>
</button> </button>
@ -12,7 +12,7 @@ const TPL = `
export default class SvgExportButton extends NoteContextAwareWidget { export default class SvgExportButton extends NoteContextAwareWidget {
isEnabled() { isEnabled() {
return super.isEnabled() return super.isEnabled()
&& this.note?.type === 'mermaid' && [ "mermaid", "mindMap" ].includes(this.note?.type)
&& this.note.isContentAvailable() && this.note.isContentAvailable()
&& this.noteContext?.viewScope.viewMode === 'default'; && this.noteContext?.viewScope.viewMode === 'default';
} }
@ -21,7 +21,7 @@ export default class SvgExportButton extends NoteContextAwareWidget {
super.doRender(); super.doRender();
this.$widget = $(TPL); this.$widget = $(TPL);
this.$widget.on('click', () => this.triggerEvent('exportMermaid', {ntxId: this.ntxId})); this.$widget.on('click', () => this.triggerEvent('exportSvg', {ntxId: this.ntxId}));
this.contentSized(); this.contentSized();
} }
} }

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

@ -132,7 +132,7 @@ export default class MermaidWidget extends NoteContextAwareWidget {
} }
} }
async exportMermaidEvent({ntxId}) { async exportSvgEvent({ntxId}) {
if (!this.isNoteContext(ntxId)) { if (!this.isNoteContext(ntxId)) {
return; return;
} }

29
src/public/app/widgets/type_widgets/mind_map.js
View File

@ -83,7 +83,7 @@ export default class MindMapWidget extends TypeWidget {
return; return;
} }
const svgContent = await this.mind.exportSvg().text(); const svgContent = await this.renderSvg();
return { return {
content: mind.getDataString(), content: mind.getDataString(),
attachments: [ attachments: [
@ -98,9 +98,36 @@ export default class MindMapWidget extends TypeWidget {
}; };
} }
async renderSvg() {
return await this.mind.exportSvg().text();
}
async entitiesReloadedEvent({loadResults}) { async entitiesReloadedEvent({loadResults}) {
if (loadResults.isNoteReloaded(this.noteId)) { if (loadResults.isNoteReloaded(this.noteId)) {
this.refresh(); this.refresh();
} }
} }
async exportSvgEvent({ntxId}) {
if (!this.isNoteContext(ntxId)) {
return;
}
const svg = await this.renderSvg();
this.download(`${this.note.title}.svg`, svg);
}
download(filename, text) {
const element = document.createElement('a');
element.setAttribute('href', `data:image/svg+xml;charset=utf-8,${encodeURIComponent(text)}`);
element.setAttribute('download', filename);
element.style.display = 'none';
document.body.appendChild(element);
element.click();
document.body.removeChild(element);
}
} }