From e19ddc10d3f9642c0f6b95e3c350f3c5947b211d Mon Sep 17 00:00:00 2001
From: Tom <7283497+thfrei@users.noreply.github.com>
Date: Sun, 17 Apr 2022 22:28:08 +0200
Subject: [PATCH] make revision and renderer svg to shrink to box but not
 enlarge

---
 src/public/app/dialogs/note_revisions.js         | 16 ++++++++--------
 src/public/app/services/note_content_renderer.js | 12 +++++++-----
 2 files changed, 15 insertions(+), 13 deletions(-)

diff --git a/src/public/app/dialogs/note_revisions.js b/src/public/app/dialogs/note_revisions.js
index d47a46bab..647b760ac 100644
--- a/src/public/app/dialogs/note_revisions.js
+++ b/src/public/app/dialogs/note_revisions.js
@@ -172,23 +172,23 @@ async function setContentPane() {
         $content.html($table);
     }
     else if (revisionItem.type === 'canvas-note') {
-        /**
-         * can the revisions called without being on the note type before?
-         * if so: load excalidraw
-         */
         /**
          * FIXME: We load a font called Virgil.wof2, which originates from excalidraw.com
          *        REMOVE external dependency!!!! This is defined in the svg in defs.style
          */
-        /**
-         * FIXME: If svg is not present, probably use live excalidraw?
-         */
         const content = fullNoteRevision.content;
 
         try {
             const data = JSON.parse(content)
             const svg = data.svg || "no svg present."
-            $content.html($('<div>').html(svg));
+
+            /**
+             * Debatable
+             * maxWidth: 100% use full width of container but do not enlarge!
+             * height:auto to ensure that height scales with width
+             */
+            const svgHtml = $(svg).css({maxWidth: "100%", height: "auto"});
+            $content.html($('<div>').append(svgHtml));
         } catch(err) {
             console.error("error parsing fullNoteRevision.content as JSON", fullNoteRevision.content, err);
             $content.html($("<div>").text("Error parsing content. Please check console.error() for more details."));
diff --git a/src/public/app/services/note_content_renderer.js b/src/public/app/services/note_content_renderer.js
index 0944175c1..6ce23fd8a 100644
--- a/src/public/app/services/note_content_renderer.js
+++ b/src/public/app/services/note_content_renderer.js
@@ -142,16 +142,18 @@ async function getRenderedContent(note, options = {}) {
         $renderedContent.append($content);
     }
     else if (type === 'canvas-note') {
-        await libraryLoader.requireLibrary(libraryLoader.EXCALIDRAW_UTILS);
-        const {exportToSvg} = window.ExcalidrawUtils
-
         const noteComplement = await froca.getNoteComplement(note.noteId);
         const content = noteComplement.content || "";
 
         try {
+            const errorSvg = `<svg viewBox="0 0 240 80" style="background-color: white" xmlns="http://www.w3.org/2000/svg"><style>.red { font: 12px serif; fill: red; }</style><text x="20" y="35" class="red">Error: note svg is undefined or empty</text></svg>`;
             const data = JSON.parse(content)
-            const svg = data.svg || "no svg present."
-            $renderedContent.append($('<div>').html(svg));
+            const svg = data.svg || errorSvg;
+            /**
+             * maxWidth: size down to 100% (full) width of container but do not enlarge!
+             * height:auto to ensure that height scales with width
+             */
+            $renderedContent.append($(svg).css({maxWidth: "100%", height: "auto"}));
         } catch(err) {
             console.error("error parsing content as JSON", content, err);
             $renderedContent.append($("<div>").text("Error parsing content. Please check console.error() for more details."));