From 338f0f8f8fefcd47f2c3d989162ae920442d208c Mon Sep 17 00:00:00 2001
From: Niklas Rentz <nre@informatik.uni-kiel.de>
Date: Thu, 25 Jul 2024 16:28:19 +0200
Subject: [PATCH] Allow KImages to refer to arbitrary URIs, which will be
 linked in the SVG.

---
 packages/klighd-core/src/diagram-server.ts   |  5 +++--
 packages/klighd-core/src/views-rendering.tsx | 21 +++++++++++++++-----
 2 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/packages/klighd-core/src/diagram-server.ts b/packages/klighd-core/src/diagram-server.ts
index 6d68409b..dbf682dd 100644
--- a/packages/klighd-core/src/diagram-server.ts
+++ b/packages/klighd-core/src/diagram-server.ts
@@ -3,7 +3,7 @@
  *
  * http://rtsys.informatik.uni-kiel.de/kieler
  *
- * Copyright 2021 by
+ * Copyright 2021-2024 by
  * + Kiel University
  *   + Department of Computer Science
  *     + Real-Time and Embedded Systems Group
@@ -257,7 +257,8 @@ export class KlighdDiagramServer extends DiagramServerProxy {
         const notCached: Pair<string, string>[] = []
         for (const image of (action as CheckImagesAction).images) {
             const id = KlighdDiagramServer.imageToSessionStorageString(image.bundleName, image.imagePath)
-            if (!this.sessionStorage.getItem(id)) {
+            // "URI" as bundle name implies that the image path is a URI that should be resolved locally.
+            if (!this.sessionStorage.getItem(id) && image.bundleName !== 'URI') {
                 notCached.push({ k: image.bundleName, v: image.imagePath })
             }
         }
diff --git a/packages/klighd-core/src/views-rendering.tsx b/packages/klighd-core/src/views-rendering.tsx
index ac61ff30..3b44332a 100644
--- a/packages/klighd-core/src/views-rendering.tsx
+++ b/packages/klighd-core/src/views-rendering.tsx
@@ -318,12 +318,23 @@ export function renderRectangularShape(
             break
         }
         case K_IMAGE: {
-            const { clipShape } = rendering as KImage
-            const fullImagePath = `${(rendering as KImage).bundleName}:${(rendering as KImage).imagePath}`
+            const kImage = rendering as KImage
+            const { clipShape } = kImage
             const id = rendering.properties['klighd.lsp.rendering.id'] as string
             const clipId = `${id}$clip`
-            const extension = fullImagePath.slice(fullImagePath.lastIndexOf('.') + 1)
-            const image = `data:image/${extension};base64,${sessionStorage.getItem(fullImagePath)}`
+            let imageURI: string
+            if (kImage.bundleName === 'URI') {
+                // Bundle name "URI" is a special handling to interpret the imagePath as a URI.
+                // Here, we just add that URI to the SVG, expecting that it will be available.
+                // Note, that this does mean the URI has to be available whereever the SVG will be opened, even after saving.
+                // An alternative here would be to download and cache that image in code and include it as an embedded base64 data URI instead.
+                imageURI = kImage.imagePath
+            } else {
+                // Other images have been cached in session storage and can be embedded directly.
+                const fullImagePath = `${(rendering as KImage).bundleName}:${(rendering as KImage).imagePath}`
+                const extension = fullImagePath.slice(fullImagePath.lastIndexOf('.') + 1)
+                imageURI = `data:image/${extension};base64,${sessionStorage.getItem(fullImagePath)}`
+            }
             let clipPath: VNode | undefined
 
             // Render the clip shape within an SVG clipPath element to be used as a clipping mask for the image.
@@ -342,7 +353,7 @@ export function renderRectangularShape(
             element = (
                 <g id={id} {...gAttrs}>
                     {...clipPath ? [clipPath] : []}
-                    {...renderSVGImage(boundsAndTransformation.bounds, shadowStyles, image, styles.kShadow)}
+                    {...renderSVGImage(boundsAndTransformation.bounds, shadowStyles, imageURI, styles.kShadow)}
                 </g>
             )
             break