auto open and size about page
This commit is contained in:
parent
bc06e79c6c
commit
a60597157d
3 changed files with 30 additions and 22 deletions
|
|
@ -124,8 +124,8 @@ function createRow(entries, rowIndex) {
|
|||
row.className = "tab-row";
|
||||
|
||||
const pxPerSec = 15 + (rng() * 10); // 15-25 px/sec, consistent across screen sizes
|
||||
const goLeft = rng() > 0.5;
|
||||
const stagger = rng();
|
||||
const goLeft = rowIndex === 0 ? true : rng() > 0.5;
|
||||
const stagger = rowIndex === 0 ? 0 : rng();
|
||||
|
||||
// Store config — animation starts after DOM insertion (needs measured width)
|
||||
row._animConfig = { pxPerSec, goLeft, stagger };
|
||||
|
|
@ -221,8 +221,7 @@ async function loadMore() {
|
|||
iframe_ok: true,
|
||||
_isAbout: true,
|
||||
};
|
||||
const pos = Math.floor(rng() * Math.min(entries.length, tabsPerRow()));
|
||||
entries.splice(pos, 0, aboutEntry);
|
||||
entries.splice(0, 0, aboutEntry);
|
||||
}
|
||||
renderEntries(entries);
|
||||
loadingEl.style.display = "none";
|
||||
|
|
@ -232,8 +231,6 @@ async function loadMore() {
|
|||
const aboutTab = container.querySelector(".tab-about");
|
||||
if (aboutTab) {
|
||||
aboutTab.click();
|
||||
// Use smaller viewer for initial about page
|
||||
if (activeViewer) activeViewer.classList.add("iframe-viewer-small");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -301,17 +298,18 @@ function openInlineViewer(tabEl, entry, url) {
|
|||
// Build the viewer
|
||||
const viewer = document.createElement("div");
|
||||
viewer.className = "iframe-viewer";
|
||||
const isAbout = entry._isAbout;
|
||||
|
||||
// Title bar
|
||||
// Title bar (hidden on desktop, shown on mobile)
|
||||
const titlebar = document.createElement("div");
|
||||
titlebar.className = "iframe-titlebar";
|
||||
titlebar.textContent = entry.title || entry.url;
|
||||
viewer.appendChild(titlebar);
|
||||
|
||||
// Toolbar (address bar area)
|
||||
const toolbar = document.createElement("div");
|
||||
toolbar.className = "iframe-toolbar";
|
||||
|
||||
// URL bar pill
|
||||
const urlbar = document.createElement("div");
|
||||
urlbar.className = "iframe-urlbar";
|
||||
|
||||
|
|
@ -343,12 +341,27 @@ function openInlineViewer(tabEl, entry, url) {
|
|||
close.addEventListener("click", closeInlineViewer);
|
||||
toolbar.appendChild(close);
|
||||
|
||||
viewer.appendChild(toolbar);
|
||||
|
||||
const iframe = document.createElement("iframe");
|
||||
iframe.sandbox = "allow-scripts allow-same-origin allow-forms";
|
||||
iframe.src = url;
|
||||
|
||||
viewer.appendChild(titlebar);
|
||||
viewer.appendChild(toolbar);
|
||||
// About page: auto-size iframe to content height (same-origin)
|
||||
if (isAbout) {
|
||||
iframe.addEventListener("load", () => {
|
||||
try {
|
||||
const body = iframe.contentDocument.body;
|
||||
const lastEl = body.lastElementChild;
|
||||
const contentHeight = lastEl.offsetTop + lastEl.offsetHeight +
|
||||
parseInt(getComputedStyle(body).marginTop) +
|
||||
parseInt(getComputedStyle(body).marginBottom);
|
||||
const chromeHeight = viewer.offsetHeight - iframe.clientHeight;
|
||||
viewer.style.height = (contentHeight + chromeHeight) + "px";
|
||||
} catch (e) {}
|
||||
});
|
||||
}
|
||||
|
||||
viewer.appendChild(iframe);
|
||||
|
||||
// Insert after the row
|
||||
|
|
@ -356,8 +369,8 @@ function openInlineViewer(tabEl, entry, url) {
|
|||
activeViewer = viewer;
|
||||
activeRow = row;
|
||||
|
||||
// Scroll so the viewer is visible
|
||||
viewer.scrollIntoView({ behavior: "smooth", block: "start" });
|
||||
// Scroll so the tab row + viewer are visible
|
||||
row.scrollIntoView({ behavior: "smooth", block: "start" });
|
||||
}
|
||||
|
||||
function closeInlineViewer() {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue