feat: 更改在对话气泡中切换md渲染显示

assets/custom.css

@@ -229,7 +229,7 @@ ol:not(.options), ul:not(.options) {
     }
 }
 /* 对话气泡 */
-[class *= "message"] {
+.message {
     border-radius: var(--radius-xl) !important;
     border: none;
     padding: var(--spacing-xl) !important;
@@ -247,7 +247,17 @@ ol:not(.options), ul:not(.options) {
     width: auto !important;
     border-bottom-right-radius: 0 !important;
 }
-.raw-message {
+
+.message .md-message {
+    display: block;
+    padding: 0 !important;
+}
+.message .raw-message {
+    display: block;
+    padding: 0 !important;
+    white-space: pre-wrap;
+}
+.raw-message.hideM, .md-message.hideM {
     display: none;
 }
 

assets/custom.js

@@ -277,20 +277,21 @@ const copiedIcon = '<span><svg stroke="currentColor" fill="none" stroke-width="2
 const toggleIcon = '<span><svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" height=".8em" width=".8em" xmlns="http://www.w3.org/2000/svg"><rect x="4" y="4" width="16" height="16" rx="2" ry="2"></rect><circle cx="8" cy="12" r="2"></circle><circle cx="16" cy="12" r="2"></circle></svg></span>';
 
 function addChuanhuButton(botElement) {
-    var copyButton = null;
-    var toggleButton = null;
     var rawMessage = null;
+    var mdMessage = null;
     rawMessage = botElement.querySelector('.raw-message');
+    mdMessage = botElement.querySelector('.md-message');
+    var renderMarkdown = true;
+    var copyButton = null;
+    var toggleButton = null;
     copyButton = botElement.querySelector('button.copy-bot-btn');
     toggleButton = botElement.querySelector('button.toggle-md-btn');
+    
     if (!rawMessage) return;
-    if (copyButton) {
-        copyButton.remove();
-    }
-    if (toggleButton) {
-        toggleButton.remove();
-    }
-    rawMessage.style.display = "none";
+    if (copyButton) copyButton.remove();
+    if (toggleButton) toggleButton.remove();
+    
+    // Copy bot button
     var copyButton = document.createElement('button');
     copyButton.classList.add('chuanhu-btn');
     copyButton.classList.add('copy-bot-btn');
@@ -317,11 +318,26 @@ function addChuanhuButton(botElement) {
     toggleButton.setAttribute('aria-label', 'Toggle');
     toggleButton.innerHTML = toggleIcon;
     toggleButton.addEventListener('click', () => {
-        rawMessage.style.display === "none" ? rawMessage.style.display = "block" : rawMessage.style.display = "none";
+        console.log('toggle')
+        renderMarkdown = mdMessage.classList.contains('hideM');
+        renderMarkdown ? renderMarkdownText(botElement) : removeMarkdownText(botElement);
     });
     botElement.insertBefore(toggleButton, copyButton);
 }
 
+function renderMarkdownText(message) {
+    var mdDiv = message.querySelector('.md-message');
+    if (mdDiv) mdDiv.classList.remove('hideM');
+    var rawDiv = message.querySelector('.raw-message');
+    if (rawDiv) rawDiv.classList.add('hideM');
+}
+function removeMarkdownText(message) {
+    var rawDiv = message.querySelector('.raw-message');
+    if (rawDiv) rawDiv.classList.remove('hideM');
+    var mdDiv = message.querySelector('.md-message');
+    if (mdDiv) mdDiv.classList.add('hideM');
+}
+
 var rendertime = 0; // for debugging
 var mathjaxUpdated = false;
 

modules/utils.py

@@ -183,7 +183,7 @@ def convert_mdtext(md_text):
     non_code_parts = code_block_pattern.split(md_text)[::2]
 
     result = []
-    raw = f'<span class="raw-message">{html.escape(md_text)}</span>'
+    raw = f'<div class="raw-message hideM">{html.escape(md_text)}</span>'
     for non_code, code in zip(non_code_parts, code_blocks + [""]):
         if non_code.strip():
             non_code = normalize_markdown(non_code)
@@ -195,9 +195,10 @@ def convert_mdtext(md_text):
             code = markdown_to_html_with_syntax_highlight(code)
             result.append(code)
     result = "".join(result)
-    result += raw
-    result += ALREADY_CONVERTED_MARK
-    return result
+    output = f'<div class="md-message">{result}</div>'
+    output += raw
+    output += ALREADY_CONVERTED_MARK
+    return output
 
 
 def convert_asis(userinput):