mdv-live 0.3.6 → 0.3.7

package/bin/mdv.js

@@ -274,7 +274,7 @@ async function convertToPdf(inputPath, outputPath) {
  */
 async function convertMarpToPdf(inputPath, outputPath) {
   try {
-    execSync(`npx @marp-team/marp-cli --no-stdin "${inputPath}" --pdf -o "${outputPath}"`, {
+    execSync(`npx @marp-team/marp-cli --no-stdin "${inputPath}" --pdf --html --allow-local-files -o "${outputPath}"`, {
       encoding: 'utf-8',
       stdio: 'inherit'
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mdv-live",
-  "version": "0.3.6",
+  "version": "0.3.7",
   "description": "Markdown Viewer - File tree + Live preview + Marp support + Hot reload",
   "main": "src/server.js",
   "bin": {

package/src/api/pdf.js

@@ -49,7 +49,7 @@ export function setupPdfRoutes(app) {
 
     const outputPath = fullPath.replace(/\.md$/, '.pdf');
     const outputFileName = path.basename(outputPath);
-    const command = `"${marpBin}" "${fullPath}" -o "${outputPath}" --allow-local-files --no-stdin`;
+    const command = `"${marpBin}" "${fullPath}" -o "${outputPath}" --html --allow-local-files --no-stdin`;
 
     try {
       await execAsync(command, { timeout: 60000 });

package/src/static/app.js

@@ -608,6 +608,11 @@
                             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
                         </svg>
                     </button>
+                    <button class="marp-fullscreen-btn" title="Fullscreen (F)">
+                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4" />
+                        </svg>
+                    </button>
                 `;
                 marpit.appendChild(nav);
             }
@@ -669,6 +674,13 @@
             if (prevBtn) prevBtn.addEventListener('click', prevSlide);
             if (nextBtn) nextBtn.addEventListener('click', nextSlide);
 
+            // Fullscreen toggle
+            const fullscreenBtn = elements.content.querySelector('.marp-fullscreen-btn');
+            const toggleFullscreen = () => {
+                document.body.classList.toggle('marp-fullscreen');
+            };
+            if (fullscreenBtn) fullscreenBtn.addEventListener('click', toggleFullscreen);
+
             // Keyboard navigation
             marpKeyHandler = (e) => {
                 // Don't handle if editing or in dialog
@@ -681,6 +693,12 @@
                 } else if (e.key === 'ArrowLeft') {
                     e.preventDefault();
                     prevSlide();
+                } else if (e.key === 'f' || e.key === 'F') {
+                    e.preventDefault();
+                    toggleFullscreen();
+                } else if (e.key === 'Escape' && document.body.classList.contains('marp-fullscreen')) {
+                    e.preventDefault();
+                    document.body.classList.remove('marp-fullscreen');
                 }
             };
             document.addEventListener('keydown', marpKeyHandler);
@@ -688,6 +706,7 @@
 
         cleanupMarp() {
             elements.content.classList.remove('marp-viewer');
+            document.body.classList.remove('marp-fullscreen');
             if (marpKeyHandler) {
                 document.removeEventListener('keydown', marpKeyHandler);
                 marpKeyHandler = null;

package/src/static/styles.css

@@ -917,6 +917,59 @@ body {
     margin-left: 8px;
 }
 
+/* Fullscreen Mode */
+body.marp-fullscreen {
+    overflow: hidden;
+}
+
+body.marp-fullscreen .sidebar,
+body.marp-fullscreen .resize-handle,
+body.marp-fullscreen .toolbar,
+body.marp-fullscreen .tab-bar {
+    display: none !important;
+}
+
+body.marp-fullscreen .container {
+    display: block;
+}
+
+body.marp-fullscreen .main {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 9999;
+    background: #0f172a;
+}
+
+body.marp-fullscreen .content {
+    height: 100vh;
+    padding: 0;
+}
+
+body.marp-fullscreen .marp-nav {
+    bottom: 32px;
+    right: 32px;
+}
+
+body.marp-fullscreen .marpit {
+    padding: 0;
+    height: 100vh;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+body.marp-fullscreen .marpit > svg[data-marpit-svg] {
+    max-height: 95vh;
+    max-width: 95vw;
+}
+
+.marp-fullscreen-btn {
+    margin-left: 4px;
+}
+
 /* Print styles for Marp */
 @media print {
     .marp-nav { display: none !important; }