Spaces:
Running
Running
| const input = document.getElementById('input'); | |
| const transformed = document.getElementById('transformed'); | |
| const preview = document.getElementById('preview'); | |
| input.addEventListener('input', update); | |
| function renderPreview(raw) { | |
| // 1. Markdown Parse (Pehle markdown convert karein) | |
| let html = marked.parse(raw); | |
| // 2. Render Display Math ($$ .. $$) | |
| // Yeh logic sirf tabhi replace karega jab closing $$ mil jaaye | |
| html = html.replace(/\$\$([\s\S]+?)\$\$/g, (match, expr) => { | |
| try { | |
| // KaTeX render check | |
| return katex.renderToString(expr.trim(), { | |
| displayMode: true, | |
| throwOnError: true // Galti hone par catch block mein bhej dega | |
| }); | |
| } catch (e) { | |
| return match; // Agar invalid LaTeX hai toh original text ($$..) hi rehne do | |
| } | |
| }); | |
| // 3. Render Inline Math ($ .. $) | |
| // Negative lookbehind use kiya hai taaki $$ ko target na kare | |
| html = html.replace(/(?<!\$)\$([^\$\n]+?)\$(?!\$)/g, (match, expr) => { | |
| try { | |
| return katex.renderToString(expr.trim(), { | |
| displayMode: false, | |
| throwOnError: true | |
| }); | |
| } catch (e) { | |
| return match; // Invalid hone par render mat karo, as-is rehne do | |
| } | |
| }); | |
| preview.innerHTML = html; | |
| } | |
| function update() { | |
| const val = input.value; | |
| // Transformed View Logic (Sirf valid pairs ko replace karega) | |
| let transformedText = val; | |
| let displayCount = 0; | |
| // Display Math replace for Transformed View | |
| transformedText = transformedText.replace(/\$\$([\s\S]+?)\$\$/g, (match, expr) => { | |
| return "{% katex %}" + expr.trim() + "{% endkatex %}"; | |
| }); | |
| // Inline Math replace for Transformed View | |
| transformedText = transformedText.replace(/(?<!\$)\$([^\$\n]+?)\$(?!\$)/g, (match, expr) => { | |
| return "{% katex inline %}" + expr.trim() + "{% endkatex %}"; | |
| }); | |
| transformed.innerText = transformedText; | |
| renderPreview(val); | |
| } | |
| function copyTransformed() { | |
| const textToCopy = transformed.innerText; // Sirf transformed content lega | |
| if (!textToCopy) return; | |
| navigator.clipboard.writeText(textToCopy).then(() => { | |
| const btn = document.getElementById('copyBtn'); | |
| btn.innerHTML = "β Copied!"; | |
| btn.style.background = "var(--success)"; | |
| setTimeout(() => { | |
| btn.innerHTML = "π Copy Result"; | |
| btn.style.background = "var(--accent)"; | |
| }, 2000); | |
| }); | |
| } | |
| function showTab(idx) { | |
| document.querySelectorAll('.panel').forEach((p, i) => { | |
| p.classList.toggle('active', i === idx); | |
| if (window.innerWidth > 850) p.style.display = "flex"; // Reset for desktop | |
| }); | |
| document.querySelectorAll('.tab').forEach((t, i) => t.classList.toggle('active', i === idx)); | |
| } | |
| function loadFile(e) { | |
| const file = e.target.files[0]; | |
| const reader = new FileReader(); | |
| reader.onload = (ev) => { input.value = ev.target.result; update(); }; | |
| reader.readAsText(file); | |
| } | |
| // Default content | |
| input.value = "# Hello LaTeX\nWrite math between double dollar signs:\n\n$$ e^{i\\pi} + 1 = 0 $$"; | |
| update(); |