From a038e3fa4fe4c11511a20d58c3e10d19c4671f5e Mon Sep 17 00:00:00 2001
From: vcheckzen <18008498+vcheckzen@users.noreply.github.com>
Date: Wed, 9 Oct 2024 05:50:08 +0800
Subject: [PATCH] feat: check cache for relative paths in markdown

---
 front-end/index.html | 41 +++++++++++++++++++++++++++++------------
 1 file changed, 29 insertions(+), 12 deletions(-)

diff --git a/front-end/index.html b/front-end/index.html
index 44da6dc9..5fc7c08b 100644
--- a/front-end/index.html
+++ b/front-end/index.html
@@ -975,21 +975,38 @@
             window.fileCache.set(path, text);
           }
 
-          // SCF_GATEWAY must contains protocol and resources can't be in encrypted path
-          const renderer = new marked.Renderer();
-          renderer.image = (href, title, text) => {
-            if (href.startsWith('./') || href.startsWith('../')) {
-              href = new URL(href, window.GLOBAL_CONFIG.SCF_GATEWAY + path).href;
-            }
-            return `<img src="${href}" alt="${text}">`;
-          };
-          renderer.link = (href, title, text) => {
-            if (href.startsWith('./') || href.startsWith('../')) {
-              href = new URL(href, window.GLOBAL_CONFIG.SCF_GATEWAY + path).href;
+          // It is not possible to load resources that are not cached and in an encrypted path.
+          const transformHref = (href) => {
+            if (href.startsWith('http') || href.startsWith('//')) {
+              return href;
             }
-            return `<a href="${href}">${text}</a>`;
+
+            const dummyBase = new URL(
+              window.backFordwardCache.current + '/',
+              location
+            );
+            const absPath = new URL(href, dummyBase).href.slice(
+              location.origin.length
+            );
+
+            const containingPath = (path) =>
+              path.slice(0, path.lastIndexOf('/')) || '/';
+
+            return (
+              window.fileCache
+                .get(containingPath(absPath))
+                ?.files.find(({ name }) => name === absPath.split('/').pop())
+                ?.url ||
+              window.GLOBAL_CONFIG.SCF_GATEWAY.replace('/$', '') + absPath
+            );
           };
 
+          const renderer = new marked.Renderer();
+          renderer.image = (href, title, text) =>
+            `<img src="${transformHref(href)}" alt="${text}">`;
+          renderer.link = (href, title, text) =>
+            `<a href="${transformHref(href)}">${text}</a>`;
+
           text = marked.parse(text, {
             gfm: true,
             renderer: renderer,