Update templates/index.html

templates/index.html

@@ -55,37 +55,22 @@
             
             <div class="flex flex-col md:flex-row editor-container">
                 <div class="w-full md:w-1/2 p-4">
-                    <textarea id="markdown-input" class="w-full h-full p-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500 resize-none" placeholder="Write your Markdown here..."># Welcome to Markdown to DOCX Converter
+                    <textarea id="markdown-input" class="w-full h-full p-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500 resize-none" placeholder="# Start writing your Markdown here...
 
-## Features
+## Headers
+Use # for h1, ## for h2 etc.
 
-- **Easy to use**: Just write Markdown and click convert
-- **Supports all Markdown features**:
-  - Headers
-  - Lists
-  - Code blocks
-  - Tables
-  - And more!
+## Lists
+- Item 1
+- Item 2
 
-```python
-def hello_world():
-    print("Hello, World!")
+## Code
+```javascript
+console.log('Hello World');
 ```
 
-## How to use
-
-1. Write your content in Markdown
-2. Click the "Convert to DOCX" button
-3. Download your professional DOCX document
-
-| Feature       | Support |
-|--------------|---------|
-| Headers      | ✅      |
-| Lists        | ✅      |
-| Code Blocks  | ✅      |
-| Tables       | ✅      |
-
-> This is a blockquote. Your converted document will preserve all formatting.</textarea>
+## More formatting
+**Bold**, *italic*, [links](https://example.com)"></textarea>
                 </div>
                 <div id="markdown-preview" class="w-full md:w-1/2 p-4 prose max-w-none"></div>
             </div>
@@ -149,8 +134,8 @@ def hello_world():
                 
                 showStatus('Converting to DOCX...', 'info');
 
-                // Replace this URL with your actual Pandoc server API endpoint
-                const response = await fetch('https://your-pandoc-server-api.com/convert', {
+                // First send the markdown to the conversion endpoint
+                const response = await fetch('/api/convert', {
                     method: 'POST',
                     headers: {
                         'Content-Type': 'application/json',
@@ -164,11 +149,24 @@ def hello_world():
                     throw new Error(`Server returned ${response.status}`);
                 }
 
-                const blob = await response.blob();
+                const result = await response.json();
+                
+                if (!result.success) {
+                    throw new Error(result.message || 'Conversion failed');
+                }
+
+                // Then download the generated file
+                const downloadResponse = await fetch(`/api/download/${result.filename}`);
+                
+                if (!downloadResponse.ok) {
+                    throw new Error('Failed to download file');
+                }
+
+                const blob = await downloadResponse.blob();
                 const url = window.URL.createObjectURL(blob);
                 const a = document.createElement('a');
                 a.href = url;
-                a.download = 'document.docx';
+                a.download = result.filename || 'document.docx';
                 document.body.appendChild(a);
                 a.click();
                 document.body.removeChild(a);
@@ -177,7 +175,7 @@ def hello_world():
                 showStatus('Document downloaded successfully!', 'success');
             } catch (error) {
                 console.error('Conversion error:', error);
-                showStatus('Error converting document. Please try again.', 'error');
+                showStatus('Error converting document: ' + error.message, 'error');
             } finally {
                 convertBtn.disabled = false;
                 convertBtn.innerHTML = `
@@ -210,4 +208,3 @@ def hello_world():
     </script>
 </body>
 </html>
-