From 2384fc9f7d2752a76b0c8df5230c80b99f41a04a Mon Sep 17 00:00:00 2001
From: nmemmert <67961292+nmemmert@users.noreply.github.com>
Date: Thu, 30 Jul 2026 10:31:50 -0400
Subject: [PATCH] Render document content inline instead of in iframe

Replace the <iframe> with an inline <div> containing the mammoth HTML.
Content now flows full-width with the page instead of being cramped in
a fixed-height scrolling box. Download link still available below.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 public/admin.js |  4 ++--
 server.js       | 18 ++++++------------
 2 files changed, 8 insertions(+), 14 deletions(-)

diff --git a/public/admin.js b/public/admin.js
index 9b106ac..dab6668 100644
--- a/public/admin.js
+++ b/public/admin.js
@@ -620,8 +620,8 @@ $('#import-go-btn').addEventListener('click', async () => {
       method: 'POST',
       body: { base64, originalName: file.name },
     });
-    const embed = result.htmlUrl
-      ? `<details><summary>📄 ${result.originalName}</summary><iframe src="${result.htmlUrl}" style="width:100%;height:600px;border:1px solid #ccc;border-radius:4px;margin-top:.5em;"></iframe><p><a href="${result.url}" download="${result.originalName}">⬇️ Download ${result.originalName}</a></p></details>`
+    const embed = result.htmlBody
+      ? `<details><summary>📄 ${result.originalName}</summary><div style="border:1px solid #ccc;border-radius:4px;padding:1em;margin-top:.5em;">${result.htmlBody}</div><p><a href="${result.url}" download="${result.originalName}">⬇️ Download ${result.originalName}</a></p></details>`
       : `<a href="${result.url}" target="_blank">📄 ${result.originalName}</a>`;
     if (type === 'assignment') {
       const cur = $('#ie-body-assignment').value;
diff --git a/server.js b/server.js
index 21ea7e6..1918334 100644
--- a/server.js
+++ b/server.js
@@ -1548,22 +1548,16 @@ app.post('/api/admin/upload-attachment', requirePin, async (req, res) => {
     return res.status(500).json({ error: `Could not save file: ${err.message}` });
   }
 
-  // Convert to HTML so it can be shown in an iframe
-  let htmlUrl = null;
+  // Convert to HTML for inline rendering
+  let htmlBody = null;
   try {
-    const { value: bodyHtml } = await mammoth.convertToHtml({ buffer });
-    const htmlFilename = `${uuid}.html`;
-    const page = `<!doctype html><html><head><meta charset="utf-8">
-<style>body{font-family:sans-serif;max-width:800px;margin:2rem auto;padding:0 1rem;line-height:1.6}
-img{max-width:100%}table{border-collapse:collapse;width:100%}td,th{border:1px solid #ccc;padding:.4em .6em}</style>
-</head><body>${bodyHtml}</body></html>`;
-    await writeFile(join(ATTACHMENTS_DIR, htmlFilename), page);
-    htmlUrl = `/api/attachments/${htmlFilename}`;
+    const { value } = await mammoth.convertToHtml({ buffer });
+    htmlBody = value || null;
   } catch (_) {
-    // HTML preview generation failed — download link still works
+    // preview failed — download link still works
   }
 
-  return res.json({ url: `/api/attachments/${filename}`, htmlUrl, originalName });
+  return res.json({ url: `/api/attachments/${filename}`, htmlBody, originalName });
 });
 
 app.get('/health', (req, res) => res.json({ ok: true }));