render attachment SVG when sharing mermaid

This commit is contained in:
zadam 2023-10-21 17:32:07 +02:00
parent aefc4c6bd2
commit 5282af55f6
2 changed files with 32 additions and 31 deletions

View File

@ -24,7 +24,7 @@ function getContent(note) {
} else if (note.type === 'code') { } else if (note.type === 'code') {
renderCode(result); renderCode(result);
} else if (note.type === 'mermaid') { } else if (note.type === 'mermaid') {
renderMermaid(result); renderMermaid(result, note);
} else if (note.type === 'image' || note.type === 'canvas') { } else if (note.type === 'image' || note.type === 'canvas') {
renderImage(result, note); renderImage(result, note);
} else if (note.type === 'file') { } else if (note.type === 'file') {
@ -126,15 +126,14 @@ function renderCode(result) {
} }
} }
function renderMermaid(result) { function renderMermaid(result, note) {
result.content = ` result.content = `
<div class="mermaid">${escapeHtml(result.content)}</div> <img src="api/images/${note.noteId}/${note.escapedTitle}?${note.utcDateModified}">
<hr> <hr>
<details> <details>
<summary>Chart source</summary> <summary>Chart source</summary>
<pre>${escapeHtml(result.content)}</pre> <pre>${escapeHtml(result.content)}</pre>
</details>` </details>`
result.header += `<script src="../../${assetPath}/libraries/mermaid.min.js"></script>`;
} }
function renderImage(result, note) { function renderImage(result, note) {

View File

@ -105,6 +105,27 @@ function checkNoteAccess(noteId, req, res) {
return false; return false;
} }
function renderImageAttachment(image, res, attachmentName) {
let svgString = '<svg/>'
const attachment = image.getAttachmentByTitle(attachmentName);
if (attachment) {
svgString = attachment.getContent();
} else {
// backwards compatibility, before attachments, the SVG was stored in the main note content as a separate key
const contentSvg = image.getJsonContentSafely()?.svg;
if (contentSvg) {
svgString = contentSvg;
}
}
const svg = svgString
res.set('Content-Type', "image/svg+xml");
res.set("Cache-Control", "no-cache, no-store, must-revalidate");
res.send(svg);
}
function register(router) { function register(router) {
function renderNote(note, req, res) { function renderNote(note, req, res) {
if (!note) { if (!note) {
@ -209,37 +230,18 @@ function register(router) {
return; return;
} }
if (!["image", "canvas"].includes(image.type)) { if (image.type === 'image') {
return res.status(400)
.json({ message: "Requested note is not a shareable image" });
} else if (image.type === "canvas") {
/**
* special "image" type. the canvas is actually type application/json
* to avoid bitrot and enable usage as referenced image the svg is included.
*/
let svgString = '<svg/>'
const attachment = image.getAttachmentByTitle('canvas-export.svg');
if (attachment) {
svgString = attachment.getContent();
} else {
// backwards compatibility, before attachments, the SVG was stored in the main note content as a separate key
const contentSvg = image.getJsonContentSafely()?.svg;
if (contentSvg) {
svgString = contentSvg;
}
}
const svg = svgString
res.set('Content-Type', "image/svg+xml");
res.set("Cache-Control", "no-cache, no-store, must-revalidate");
res.send(svg);
} else {
// normal image // normal image
res.set('Content-Type', image.mime); res.set('Content-Type', image.mime);
addNoIndexHeader(image, res); addNoIndexHeader(image, res);
res.send(image.getContent()); res.send(image.getContent());
} else if (image.type === "canvas") {
renderImageAttachment(image, res, 'canvas-export.svg');
} else if (image.type === 'mermaid') {
renderImageAttachment(image, res, 'mermaid-export.svg');
} else {
return res.status(400)
.json({ message: "Requested note is not a shareable image" });
} }
}); });