| document.addEventListener('DOMContentLoaded', function() { |
| |
| const sampleMarkdown = `# Welcome to Markdown Slides |
| |
| ## Create Beautiful Presentations |
| |
| - Write in simple markdown |
| - Generate professional slides |
| - Export to PowerPoint |
| |
| --- |
| |
| ## Features |
| |
| 1. **Easy to Use** - Just write markdown |
| 2. **Powerful** - Supports all markdown features |
| 3. **Flexible** - Customize your slides |
| |
| --- |
| |
| ## Get Started |
| |
| \`\`\`markdown |
| # Slide Title |
| |
| - Bullet point 1 |
| - Bullet point 2 |
| \`\`\` |
| `; |
|
|
| |
| const markdownInput = document.getElementById('markdown-input'); |
| const generateBtn = document.getElementById('generate-btn'); |
| const exportBtn = document.getElementById('export-btn'); |
| const slidesPreview = document.getElementById('slides-preview'); |
| const sampleBtn = document.getElementById('sample-btn'); |
|
|
| |
| sampleBtn.addEventListener('click', () => { |
| markdownInput.value = sampleMarkdown; |
| generateSlides(); |
| }); |
|
|
| |
| generateBtn.addEventListener('click', generateSlides); |
|
|
| |
| exportBtn.addEventListener('click', exportToPPTX); |
|
|
| function generateSlides() { |
| const markdown = markdownInput.value.trim(); |
| if (!markdown) return; |
|
|
| |
| const slides = markdown.split(/\n---\n/); |
| |
| let html = ''; |
| slides.forEach((slide, index) => { |
| const content = marked.parse(slide); |
| html += ` |
| <div class="slide"> |
| <div class="slide-title">Slide ${index + 1}</div> |
| <div class="slide-content">${content}</div> |
| </div> |
| `; |
| }); |
|
|
| slidesPreview.innerHTML = html; |
| exportBtn.disabled = false; |
| } |
|
|
| function exportToPPTX() { |
| const markdown = markdownInput.value.trim(); |
| if (!markdown) return; |
|
|
| const slides = markdown.split(/\n---\n/); |
| const pptx = new PptxGenJS(); |
| |
| slides.forEach(slide => { |
| const content = marked.parse(slide); |
| |
| |
| const pptxSlide = pptx.addSlide(); |
| |
| |
| const lines = slide.split('\n'); |
| const title = lines[0].replace(/^#\s+/, ''); |
| |
| |
| pptxSlide.addText(title, { |
| x: 0.5, y: 0.5, w: 9, h: 1, |
| fontSize: 24, |
| bold: true, |
| color: '4F46E5' |
| }); |
| |
| |
| const contentWithoutTitle = lines.slice(1).join('\n'); |
| const htmlContent = marked.parse(contentWithoutTitle); |
| |
| pptxSlide.addText(htmlContent, { |
| x: 0.5, y: 1.5, w: 9, h: 5, |
| fontSize: 18, |
| color: '4B5563' |
| }); |
| }); |
| |
| |
| pptx.writeFile({ fileName: 'MarkdownSlides.pptx' }); |
| } |
|
|
| |
| if (!markdownInput.value) { |
| markdownInput.value = sampleMarkdown; |
| generateSlides(); |
| } |
| }); |