From b07a2ebe888157a60ca63892f17029e3a74d9122 Mon Sep 17 00:00:00 2001
From: Groupr <grop3r@protonmail.com>
Date: Tue, 11 Nov 2025 04:12:51 +0000
Subject: [PATCH] Update custom.js

Updated previewAjax() and sendPreview() functions to use katex parameter instead of mathjax.

Replaced MathJax.Hub.Queue() call with KaTeXrenderMathInElement() for live preview rendering.
---
 remarkbox/static/js/custom.js | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/remarkbox/static/js/custom.js b/remarkbox/static/js/custom.js
index ab28d8a..51b6e2b 100644
--- a/remarkbox/static/js/custom.js
+++ b/remarkbox/static/js/custom.js
@@ -2,7 +2,7 @@
 // previewTimer must live outside the functions.
 var previewTimer = null;
 
-function previewAjax(textarea, div, show_raw = false, mathjax = false){
+function previewAjax(textarea, div, show_raw = false, katex = false){
     // set div to raw textarea while waiting for remote Markdown rendering.
     if (show_raw) {
 	// bust HTML tags like <script> to prevent running evil code.
@@ -14,12 +14,12 @@ function previewAjax(textarea, div, show_raw = false, mathjax = false){
         clearTimeout(previewTimer);
     }
     previewTimer = setTimeout(
-        function() { sendPreview( textarea, div, mathjax ); },
+        function() { sendPreview( textarea, div, katex ); },
 	800
     );
 }
 
-function sendPreview(textarea, div, mathjax=false){
+function sendPreview(textarea, div, katex=false){
     $.ajaxSetup ({
         cache: false
     });
@@ -29,10 +29,17 @@ function sendPreview(textarea, div, mathjax=false){
 
     $( '#' + div ).load( url, params );
 
-    if (mathjax) {
+    if (katex) {
         setTimeout(function(){
-            // hack: block MathJax rerender for 50ms, give div chance to load.
-            MathJax.Hub.Queue(["Typeset",MathJax.Hub,div]);
+            // Give div chance to load before rendering math
+            if (typeof renderMathInElement !== 'undefined') {
+                renderMathInElement(document.getElementById(div), {
+                    delimiters: [
+                        {left: '$$', right: '$$', display: true},
+                        {left: '$', right: '$', display: false}
+                    ]
+                });
+            }
         }, 100);
     }
 }