From 7a5f3f5b3876b1ea4634fc6100ff55187d5e80f5 Mon Sep 17 00:00:00 2001
From: Ellpeck <me@ellpeck.de>
Date: Fri, 11 Aug 2023 20:51:34 +0200
Subject: [PATCH] switched to marked

---
 server/public/index.html     | 37 +++++++++++++++++++++++++-----------
 test-vault/Cool Test Note.md | 29 +++++++++++++++++++++++-----
 2 files changed, 50 insertions(+), 16 deletions(-)

diff --git a/server/public/index.html b/server/public/index.html
index d6a3e52..4d5e57b 100644
--- a/server/public/index.html
+++ b/server/public/index.html
@@ -8,12 +8,24 @@
     <title>Just Share Please</title>
 
     <script src="https://cdn.jsdelivr.net/npm/jquery@3.7.0/dist/jquery.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/showdown@2.1.0/dist/showdown.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/dompurify@3.0.5/dist/purify.js"></script>
+    <script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.8.0/build/highlight.min.js"></script>
+
+    <script src="https://cdn.jsdelivr.net/npm/marked@7.0.2/lib/marked.umd.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/marked-katex-extension@3.0.3/lib/index.umd.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/marked-highlight@2.0.4/lib/index.umd.js"></script>
 
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter&display=swap">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=JetBrains+Mono&display=swap">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/katex.min.css">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.8.0/build/styles/github.min.css">
+    <link href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.8.0/build/styles/github-dark.min.css" media="(prefers-color-scheme:dark)" rel="stylesheet">
+    <link href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.8.0/build/styles/github.min.css" media="(prefers-color-scheme:light),(prefers-color-scheme:no-preference)" rel="stylesheet">
+
+
     <link rel="icon" href="favicon.ico">
 
+    <!-- TODO consider improving the style or using Obsidian's default style as a basis? -->
     <style>
         html {
             position: relative;
@@ -26,6 +38,8 @@
 
         code {
             font-family: "JetBrains Mono", monospace;
+            font-variant-ligatures: none;
+            border-radius: 5px;
         }
 
         img {
@@ -52,7 +66,7 @@
 
             body {
                 color: #d8d8d8;
-                background-color: #1b1b1b;
+                background-color: #1e1e1e;
             }
 
         }
@@ -66,7 +80,7 @@
                 let main = $("#main");
 
                 // TODO display nice message when there is no hash
-                
+
                 $(window).on("hashchange", display);
                 display();
 
@@ -78,14 +92,15 @@
                         method: "get",
                         url: `share.php?id=${hash}`,
                         success: t => {
-                            let converter = new showdown.Converter({
-                                simplifiedAutoLink: true,
-                                strikethrough: true,
-                                tables: true,
-                                tasklists: true,
-                                metadata: true
-                            });
-                            main.html(converter.makeHtml(t));
+                            marked.use(markedKatex());
+                            marked.use(markedHighlight.markedHighlight({
+                                langPrefix: "hljs language-",
+                                highlight: (c, l) => {
+                                    const language = hljs.getLanguage(l) ? l : "plaintext";
+                                    return hljs.highlight(c, {language}).value;
+                                }
+                            }));
+                            main.html(DOMPurify.sanitize(marked.parse(t)));
                         },
                         // TODO display this error more nicely
                         error: (r, s, e) => main.html(e)
diff --git a/test-vault/Cool Test Note.md b/test-vault/Cool Test Note.md
index 3e1b2c3..04d87e1 100644
--- a/test-vault/Cool Test Note.md	
+++ b/test-vault/Cool Test Note.md	
@@ -4,11 +4,30 @@ This is a cool test note, my friends!
 
 > How are you?
 
-```cs
-public class VeryGood {
-
-}
+```js
+$.ajax({  
+    method: "get",  
+    url: `share.php?id=${hash}`,  
+    success: t => {  
+        marked.use(markedKatex());  
+        marked.use(markedHighlight.markedHighlight({  
+            langPrefix: "hljs language-",  
+            highlight: (c, l) => {  
+                const language = hljs.getLanguage(l) ? l : "plaintext";  
+                return hljs.highlight(c, {language}).value;  
+            }  
+        }));  
+        main.html(DOMPurify.sanitize(marked.parse(t)));  
+    },  
+    // TODO display this error more nicely  
+    error: (r, s, e) => main.html(e)  
+});
 ```
 http://localhost:8080#ff3ebb34
 
-cool!!
\ No newline at end of file
+cool!!
+
+The following is $x^2 = 7$, but more complicated!
+$$
+x^2 + \sum_{i = 1}^{10000} x^2 \cdot 0 = 7
+$$
\ No newline at end of file