From 39a1b07c0705fe234b773c56fbd6af14a7b4eac6 Mon Sep 17 00:00:00 2001
From: evilchili <evilchili@gmail.com>
Date: Sat, 17 Jan 2026 15:05:34 -0800
Subject: [PATCH] fix wysiwyg compatibility in widgets

---
 src/ttfrog/themes/default/static/froghat.js | 36 ++++++++++++++-------
 1 file changed, 24 insertions(+), 12 deletions(-)

diff --git a/src/ttfrog/themes/default/static/froghat.js b/src/ttfrog/themes/default/static/froghat.js
index 1baf966..59ae70d 100644
--- a/src/ttfrog/themes/default/static/froghat.js
+++ b/src/ttfrog/themes/default/static/froghat.js
@@ -167,8 +167,7 @@ class FroghatPlugin {
 WIDGETS = {};
 
 function loadWidget(name, callback) {
-    var widget = null;
-    if (Object.values(WIDGETS).indexOf(name) == -1) {
+    if (Object.keys(WIDGETS).indexOf(name) == -1) {
         (async () => {
             await FroghatAPIv1.search("Widget", name, (res) => {
                 if (res.code == 200) {
@@ -205,9 +204,7 @@ function loadWidget(name, callback) {
             });
         })();
     } else {
-        if (callback) {
-            callback(WIDGETS[name]);
-        }
+        return WIDGETS[name];
     }
 }
 
@@ -219,19 +216,36 @@ class MacroPlugin extends FroghatPlugin {
 
         widget: {
             inline: true,
+            editable: false,
+
             toHTML: (token, node) => {
                 var widgetName = token.keywords.split(" ")[0];
                 var contents = '';
-                loadWidget(widgetName, (widget) => {
+                var cached = loadWidget(widgetName, (widget) => {
+                    console.log(token, node);
                     contents = widget.processor(token, widget);
                     var targets = wiki.element.querySelectorAll(`[data-macro-name="widget"][data-keywords="${token.keywords}"]`);
                     targets.forEach(widgetElement => {
                         widgetElement.style = widget.css;
                         widgetElement.innerHTML = contents;
                     });
+                    wiki.cachedHTML = wiki.element.innerHTML;
                 });
-                return node + "</span>";
-            }
+                var ret = node + (cached ? cached.processor(token, cached) : "");
+                return ret;
+            },
+            postprocess: (html) => {
+                const buf = document.createElement('div');
+                buf.innerHTML = html;
+                var targets = buf.querySelectorAll(`[data-macro-name="widget"]`);
+                targets.forEach(widgetElement => {
+                    var widget = WIDGETS[widgetElement.dataset.keywords.split(" ")[0]];
+                    if (widget) {
+                        widgetElement.style = widget.css;
+                    }
+                });
+                return buf.innerHTML;
+            },
         },
 
         style: {
@@ -263,9 +277,6 @@ class MacroPlugin extends FroghatPlugin {
         toc: {
             inline: true,
             element: 'aside',
-            toHTML: (token, node) => {
-                return node + "</aside>";
-            },
             postprocess: (html) => {
                 const subList = (depth) => {
                     var li = document.createElement("li");
@@ -477,7 +488,8 @@ class MacroPlugin extends FroghatPlugin {
                 },
                 postprocess: (html) => {
                     plugin.getTokens(plugin.pattern, html).forEach(token => {
-                        html = html.replaceAll(token.source, token.rendered);
+                        var pat = new RegExp('(?<!<pre>.+?)' + token.source, 'mg');
+                        html = html.replaceAll(pat, token.rendered);
                     });
                     html = html.replaceAll(plugin.endPattern, '</div>');
                     Object.values(plugin.macros).forEach(macro => {