Update rich text converter controls (#51)

https://chatgpt.com/s/cd_68d2fe3456d481918979271748764d12

Author: simonw

rich-text-to-markdown.html

@@ -119,9 +119,6 @@ <h1>Rich Text → Markdown (No React)</h1>
           <span class="hint">Tip: long‑press → Paste</span>
         </div>
         <div id="input" class="dropzone" contenteditable="true" role="textbox" aria-label="Paste rich text here" data-placeholder="Paste here…"></div>
-        <div class="btnrow" style="margin-top:10px;">
-          <button id="clearBtn" type="button">Clear</button>
-        </div>
       </section>
 
       <section class="panel">
@@ -131,8 +128,8 @@ <h1>Rich Text → Markdown (No React)</h1>
         </div>
         <textarea id="output" class="output" spellcheck="false" aria-label="Markdown output" placeholder="Your Markdown will appear here…"></textarea>
         <div class="btnrow" style="margin-top:10px;">
-          <button id="convertBtn" class="primary" type="button">Convert</button>
           <button id="copyBtn" type="button">Copy</button>
+          <button id="quoteBtn" type="button" style="display:none;">Quote this</button>
         </div>
         <p class="hint" style="margin-top:10px;">Only <strong>bold</strong>, <em>italic</em>, inline links, line breaks, and paragraph breaks are converted. Other formatting is ignored.</p>
       </section>
@@ -149,9 +146,8 @@ <h1>Rich Text → Markdown (No React)</h1>
   <script>
     const input = document.getElementById('input');
     const output = document.getElementById('output');
-    const convertBtn = document.getElementById('convertBtn');
     const copyBtn = document.getElementById('copyBtn');
-    const clearBtn = document.getElementById('clearBtn');
+    const quoteBtn = document.getElementById('quoteBtn');
     const toast = document.getElementById('toast');
 
     // Placeholder behavior for contenteditable
@@ -267,10 +263,20 @@ <h1>Rich Text → Markdown (No React)</h1>
       return md.trim();
     }
 
+    function updateQuoteVisibility(md) {
+      if (!quoteBtn) return;
+      if (md && md.trim()) {
+        quoteBtn.style.display = '';
+      } else {
+        quoteBtn.style.display = 'none';
+      }
+    }
+
     function convert() {
       const html = input.getAttribute('data-empty') === 'true' ? '' : input.innerHTML;
       const md = htmlToMarkdown(html || '');
       output.value = md;
+      updateQuoteVisibility(md);
       return md;
     }
 
@@ -293,8 +299,6 @@ <h1>Rich Text → Markdown (No React)</h1>
       convert();
     });
 
-    convertBtn.addEventListener('click', convert);
-
     copyBtn.addEventListener('click', async () => {
       try {
         await navigator.clipboard.writeText(output.value || '');
@@ -306,15 +310,23 @@ <h1>Rich Text → Markdown (No React)</h1>
       }
     });
 
-    clearBtn.addEventListener('click', () => {
-      input.innerHTML = '';
-      output.value = '';
-      updatePlaceholder();
-      input.focus();
-    });
+    if (quoteBtn) {
+      quoteBtn.addEventListener('click', () => {
+        const text = output.value || '';
+        if (!text.trim()) return;
+        const quoted = text.split('\n').map(line => {
+          if (!line.trim()) {
+            return '>';
+          }
+          return line.startsWith('>') ? line : `> ${line}`;
+        }).join('\n');
+        output.value = quoted;
+      });
+    }
 
     // Init
     updatePlaceholder();
+    updateQuoteVisibility('');
   </script>
 </body>
 </html>