fix(viewer): resume gallery continuation after close (#216)

This commit is contained in:
Vito Sansevero
2026-10-18 07:53:27 -07:00
parent eb530382a6
commit 20cbda7529
6 changed files with 77 additions and 7 deletions
+1 -1
View File
@@ -13,7 +13,7 @@ const REPRESENTATIONS = {
invalid: 'Invalid container record; text is unavailable',
};
const FACTS = [['seed', 'Seed'], ['steps', 'Steps'], ['cfg', 'CFG'], ['sampler', 'Sampler'], ['scheduler', 'Scheduler'], ['model', 'Model']];
const FACT_SOURCES = {'api-graph': 'Saved API graph', workflow: 'Saved workflow', 'embedded-parameters': 'Embedded generation parameters'};
const FACT_SOURCES = {'api-graph': 'Embedded API configuration', workflow: 'Saved workflow configuration', 'embedded-parameters': 'Embedded generation parameters'};
function safeFilename(value) {
return String(value || 'file').replace(/[\\/\x00-\x1f\x7f<>:"|?*]/g, '_').replace(/^\.+|[. ]+$/g, '') || 'file';
+2 -3
View File
@@ -136,12 +136,11 @@ export function mountImages(main, api, parentScope, {embedded = false, fetchPage
main.append(body);
const mediaViewer = createMediaViewer({container:main,parentScope:scope,inspectionController:inspection,sender,
onSelect:image => {if (selection !== imageKey(image)) inspect(image);else inspection.select(image);},
onRefresh:refreshInspectionCollection,onRestoreFocus:image => {
onRefresh:refreshInspectionCollection,onClose:scheduleLoad,onRestoreFocus:image => {
const index = state?.items.findIndex(entry => imageKey(entry) === imageKey(image));
if (index >= 0) focusImage(index);else collectionHeading.focus({preventScroll:true});
}});
scope.cleanup(() => mediaViewer.dispose());
main.addEventListener('close',event => {if (event.target.matches('.image-preview')) scheduleLoad();},{capture:true,signal:scope.signal});
function mediaElement(image, lazy = false) {
const video = image.is_video && !image.thumbnail_url;
@@ -348,7 +347,7 @@ export function mountImages(main, api, parentScope, {embedded = false, fetchPage
if (bounds.top <= window.innerHeight + 250 && bounds.bottom >= 0) stream.loadMore();
}
function scheduleLoad() {
if (!loadFrame) loadFrame = requestAnimationFrame(() => { loadFrame = 0; maybeLoad(); });
if (!scope.signal.aborted && !loadFrame) loadFrame = requestAnimationFrame(() => { loadFrame = 0; maybeLoad(); });
}
if (typeof IntersectionObserver === 'function') {
observer = new IntersectionObserver(entries => {
+2 -1
View File
@@ -17,7 +17,7 @@ function element(tag, className, text) {
return node;
}
export function createMediaViewer({container,parentScope,inspectionController,sender,onSelect,onRefresh,onRestoreFocus}) {
export function createMediaViewer({container,parentScope,inspectionController,sender,onSelect,onRefresh,onRestoreFocus,onClose}) {
const scope = createScope();
let active = null, retryVersion = 0;
const dispose = () => scope.dispose();
@@ -83,6 +83,7 @@ export function createMediaViewer({container,parentScope,inspectionController,se
if (trigger?.isConnected) trigger.focus({preventScroll:true});
else onRestoreFocus?.(entry);
}
if (!scope.signal.aborted) onClose?.();
}
active = {close:closeViewer,stop:() => session.stop()};
local.cleanup(() => {
-1
View File
@@ -113,4 +113,3 @@ export function mountPromptBlocks(container, {prompts, sender, parentScope, role
render({prompts});
return {update:prompts => render({prompts}), setState:render, dispose:() => scope.dispose()};
}