dlawler489/printhive
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Keep the open model in the address too

Browse source 
Opening a model adds /model/<id> to the address (#collection/12/model/34),
so a refresh or bookmark reopens it and Back closes it. Moving from one
model to the next doesn't add Back steps, and closing takes back the step
opening added. A model that's gone is dropped from the address.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
dlawler489 2026-09-18 00:21:03 +10:00
parent 2aff27cbdd
commit f3e0a645a2
1 changed files with 52 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
public/app.js
View file

@ -72,7 +72,12 @@ function startApp() {
document.querySelector('.container').style.display = '';
if (!appStarted) { setupEventListeners(); appStarted = true; }
selectedScope = scopeFromHash();
loadData();
const model = modelFromHash(); // read now: drawing the page rewrites the address
loadData().then(() => {
if (!model) return;
if (findModel(model)) openModelDetail(model, { push: false });
else syncAddress(); // gone, or in the trash: drop it from the address
});
}
function showAuth(mode) {
@ -979,25 +984,38 @@ function setupEventListeners() {
document.getElementById('addFilesInput').addEventListener('change', handleAddFiles);
}
// The page you're on lives in the address — #filament, #collection/12 — so a
// refresh or a bookmark comes back to it, and Back and Forward move between pages.
function scopeHash(scope) {
if (scope === 'all') return '';
return SPECIAL_SCOPES.includes(scope) ? `#${scope}` : `#collection/${scope}`;
// The page you're on lives in the address — #filament, #collection/12, and
// /model/34 on the end while a model is open — so a refresh or a bookmark comes
// back to it, and Back and Forward move between pages and models.
let shownModelId = null; // the model open in the detail view
let modelStepPushed = false; // opening it here added a Back step
function scopeHash(scope, modelId = null) {
const page = scope === 'all' ? '' : SPECIAL_SCOPES.includes(scope) ? scope : `collection/${scope}`;
const parts = [page, modelId ? `model/${modelId}` : ''].filter(Boolean);
return parts.length ? `#${parts.join('/')}` : '';
}
function hashParts() {
const h = decodeURIComponent(location.hash.slice(1));
const m = h.match(/^(.*?)\/?model\/(\d+)$/);
return { page: m ? m[1] : h, model: m ? Number(m[2]) : null };
}
function scopeFromHash() {
const h = decodeURIComponent(location.hash.slice(1));
const collection = h.match(/^collection\/(\d+)$/);
const { page } = hashParts();
const collection = page.match(/^collection\/(\d+)$/);
if (collection) return collection[1];
return SPECIAL_SCOPES.includes(h) ? h : 'all';
return SPECIAL_SCOPES.includes(page) ? page : 'all';
}
// Keeps the address in step with the page shown; `push` makes a Back step.
const modelFromHash = () => hashParts().model;
// Keeps the address in step with what's shown; `push` makes a Back step.
function syncAddress(push = false) {
const hash = scopeHash(String(selectedScope));
const hash = scopeHash(String(selectedScope), shownModelId);
if (location.hash === hash || (!hash && !location.hash)) return;
history[push ? 'pushState' : 'replaceState'](null, '', `${location.pathname}${location.search}${hash}`);
history[push ? 'pushState' : 'replaceState']({ model: shownModelId }, '', `${location.pathname}${location.search}${hash}`);
}
async function selectScope(scope, { push = true } = {}) {
@ -1010,7 +1028,14 @@ async function selectScope(scope, { push = true } = {}) {
window.addEventListener('popstate', () => {
if (!appStarted) return;
const scope = scopeFromHash();
const model = modelFromHash();
if (String(scope) !== String(selectedScope)) selectScope(scope, { push: false });
if (model && model !== shownModelId) {
openModelDetail(model, { push: false });
} else if (!model && shownModelId) {
modelStepPushed = false; // Back already took the step away
closeModal(fileDetailModal);
}
});
// Tracks the file currently shown in the detail viewer (for thumbnail regen).
@ -1020,6 +1045,13 @@ let currentDetailThumb = null; // model image, used as a viewer fallback
function closeModal(modal) {
modal.classList.remove('active');
if (modal === slicerModal) pendingHandoff = null;
if (modal === fileDetailModal && shownModelId) {
shownModelId = null;
// Undo the step opening it added, so Back doesn't reopen what was just closed.
if (modelStepPushed && history.state && history.state.model) history.back();
else syncAddress();
modelStepPushed = false;
}
if (modal === fileDetailModal) {
hideSlicerNotice();
flushNotes();
@ -1155,9 +1187,16 @@ function openImportModal() {
importModal.classList.add('active');
}
function openModelDetail(modelId) {
function openModelDetail(modelId, { push = true } = {}) {
const model = findModel(modelId);
if (!model) return;
// Reopening the same model (to refresh it) leaves the address alone.
if (shownModelId !== Number(model.id)) {
const replacing = shownModelId !== null; // one model to the next: no extra Back step
shownModelId = Number(model.id);
syncAddress(push && !replacing);
if (push && !replacing) modelStepPushed = true;
}
flushNotes(); // save any edit still pending for the previously open model
fileDetailModal.dataset.currentModelId = modelId;
currentDetailThumb = model.thumbnailUrl || null;