unbounded

This commit is contained in:
Mark Randall Havens 2025-11-09 14:14:31 +00:00
parent 4bcc2e5e1c
commit 2433d91271
3 changed files with 59 additions and 43 deletions

View file

@ -1,6 +1,6 @@
{
"name": "the-fold-within",
"version": "3.0.0",
"version": "3.1.0",
"dependencies": {
"pdf-parse": "^1.1.1"
}

View file

@ -167,9 +167,8 @@ function renderSubNav(parent) {
async function handleHash() {
els.viewer.innerHTML = "";
const rel = location.hash.replace(/^#\//, "");
const parts = rel.split("/").filter(Boolean); // e.g., ["about", "Mark"]
const parts = rel.split("/").filter(Boolean);
// Determine current depth parent for subnav
const currentParentPath = parts.slice(0, -1).join("/") || parts[0] || null;
if (currentParentPath !== currentParent) {
@ -177,7 +176,6 @@ async function handleHash() {
renderSubNav(currentParent);
}
// Sync sidebar section to top-level
const topSection = parts[0] || null;
if (topSection && indexData.sections.includes(topSection)) {
els.sectionSelect.value = topSection;
@ -186,7 +184,6 @@ async function handleHash() {
if (!rel) return renderDefault();
// CASE: Trailing slash → render index at *current* level
if (rel.endsWith('/')) {
const currentPath = parts.join("/");
@ -202,34 +199,12 @@ async function handleHash() {
const html = marked.parse(src || `# ${currentPath.split("/").pop()}\n\nNo content yet.`);
els.viewer.innerHTML = `<article class="markdown">${html}</article>`;
} else {
const iframe = document.createElement("iframe");
iframe.src = "/" + indexFile.path;
iframe.loading = "eager";
iframe.setAttribute("sandbox", "allow-same-origin allow-scripts allow-forms");
els.viewer.appendChild(iframe);
iframe.onload = () => {
try {
const doc = iframe.contentDocument;
const body = doc.body;
const hasContent = body && body.innerText.trim().length > 50;
if (!hasContent) {
doc.body.innerHTML = `
<div style="text-align:center;padding:4rem;font-family:Inter,sans-serif;">
<h1 style="color:#e6e3d7;">${currentPath.split("/").pop()}</h1>
<p style="color:#888;">No content yet.</p>
</div>
`;
doc.body.style.background = "#0b0b0b";
}
} catch (e) {}
};
renderIframe("/" + indexFile.path);
}
} catch (e) {
els.viewer.innerHTML = `<h1>${currentPath.split("/").pop()}</h1><p>No content yet.</p>`;
}
} else {
// No index → show children or fallback
if (topSection) {
els.sectionSelect.value = topSection;
renderList();
@ -239,14 +214,13 @@ async function handleHash() {
}
}
}
// CASE: Direct file
else {
const file = indexData.flat.find(f => f.path === rel);
if (!file) {
els.viewer.innerHTML = "<h1>404</h1><p>Not found.</p>";
return;
}
file.ext === ".md" ? await renderMarkdown(file.path) : renderIframe(file.path);
file.ext === ".md" ? await renderMarkdown(file.path) : renderIframe("/" + file.path);
}
}
@ -255,11 +229,17 @@ async function renderMarkdown(rel) {
els.viewer.innerHTML = `<article class="markdown">${marked.parse(src || "# Untitled")}</article>`;
}
function renderIframe(rel) {
function renderIframe(src) {
const iframe = document.createElement("iframe");
iframe.src = "/" + rel;
iframe.src = src;
iframe.loading = "eager";
iframe.setAttribute("sandbox", "allow-same-origin allow-scripts allow-forms");
iframe.setAttribute("sandbox", "allow-same-origin allow-scripts allow-forms allow-popups");
iframe.style.width = "100vw";
iframe.style.height = "calc(100vh - var(--topbar-h) - var(--subnav-h))";
iframe.style.border = "none";
iframe.style.borderRadius = "0";
iframe.style.margin = "0";
els.viewer.appendChild(iframe);
iframe.onload = () => {
@ -267,11 +247,29 @@ function renderIframe(rel) {
const doc = iframe.contentDocument;
const style = doc.createElement("style");
style.textContent = `
html,body{background:#0b0b0b;color:#e6e3d7;font-family:Inter,sans-serif;margin:0;padding:2rem;}
*{max-width:720px;margin:auto;}
img, video, iframe {max-width:100%;height:auto;}
html, body {
background: transparent;
color: inherit;
font-family: inherit;
margin: 0;
padding: 3rem 4vw;
}
* { max-width: 100%; }
img, video, iframe { max-width: 100%; height: auto; }
`;
doc.head.appendChild(style);
const body = doc.body;
const hasContent = body && body.innerText.trim().length > 50;
if (!hasContent) {
doc.body.innerHTML = `
<div style="text-align:center;padding:6rem;font-family:Inter,sans-serif;">
<h1 style="color:#e6e3d7;">${src.split("/").pop().replace(/\..*$/, "")}</h1>
<p style="color:#888;">No content yet.</p>
</div>
`;
doc.body.style.background = "transparent";
}
} catch (e) {}
};
}

View file

@ -172,7 +172,7 @@ body.sidebar-open #sidebar { transform: translateX(0); }
margin-top: calc(var(--topbar-h) + var(--subnav-h)); margin-left: 0;
transition: margin-left var(--transition), margin-top var(--transition);
min-height: calc(100vh - var(--topbar-h) - var(--subnav-h));
padding: 2rem 1rem;
padding: 0;
}
@media (min-width: 1024px) {
@ -180,8 +180,22 @@ body.sidebar-open #sidebar { transform: translateX(0); }
.content { margin-left: 300px; }
}
/* BREATHING HORIZON: Full-Field Viewer */
.viewer {
display: flex;
flex-direction: column;
height: 100%;
transition: background 1s ease;
}
.viewer:hover {
background: radial-gradient(circle at center, #111 0%, #0b0b0b 80%);
}
.viewer > * {
max-width: 720px; margin: auto; padding: 2rem 1rem;
width: 100%;
margin: 0;
padding: 3rem 4vw;
animation: fadeIn .4s ease-out;
}
@ -191,7 +205,11 @@ body.sidebar-open #sidebar { transform: translateX(0); }
}
.viewer iframe {
width: 100%; height: calc(100vh - var(--topbar-h) - var(--subnav-h) - 80px);
border: 0; border-radius: var(--radius); background: transparent;
flex: 1;
width: 100vw;
min-height: 100vh;
border: none;
border-radius: 0;
margin: 0;
display: block;
}