Vito
e8d96a0f55
* feat(library): set the category on many selected prompts (#437)
The Prompt library shelf gets the concept's Images selection checkbox on each
card and its .bulkbar (N selected, Set category, Clear), recorded as D148.
Set category opens the shared one-value dialog and posts
{prompt_ids, category, expected_epoch} to POST /prompt_manager/bulk/category:
the server checks the storage epoch the shelf was read under, then sets the
category on the Library parents in one BEGIN IMMEDIATE transaction, writing
only rows that change. A restored storage answers 409 storage-changed and
writes nothing. The legacy admin and images_filter bodies are unchanged.
This replaces the legacy admin page's bulk Set Category, a cutover
prerequisite (#334).
Closes #437
* feat(library): add tags to many selected prompts and select every loaded prompt (#442)
The Library selection bar (D148) gets Add tags and select-all of the loaded
shelf, the legacy admin page's bulk Add Tags and select-all checkbox.
Add tags posts {prompt_ids, tags, expected_epoch} to
POST /prompt_manager/bulk/tags: in one BEGIN IMMEDIATE transaction the server
checks the storage epoch, normalizes the names as image tags are, gives each
Library parent only the names it lacks (casefold), finds or inserts tag rows
by exact name only when some prompt gets them, and skips prompts that would
pass 20 tags. Prompt tags only. Both bulk/tags forms refuse a non-object body
with 400.
Ctrl/Cmd+A in the grid and "Select all N loaded" in the bar select every
loaded prompt; the offer follows each loaded batch.
Closes #442
* feat(vocabulary): tag search, tag sort and an Untagged prompts entry (#444)
Tags & categories gains a server-side tag search and sort (keyset pages,
cursor scoped to the query) and an "Untagged prompts" row whose Browse opens
the Library with tag_mode=untagged. Refine this view gets Tag match, saved
Library views keep it, and the routes echo the applied query so a stale
server is an error, never an unfiltered list. Recorded as D149.
Refs #444
* feat(library): filter prompts by output folder and browse tags with Any (#444)
Refine this view on the Prompt library gains the concept's Folder (folders
below an output root, read when the dialog opens) and a Tag match select
(All / Any). The listing takes folder and tag_mode, matches folders on the
normalized file_path under every spelling of each output root, echoes both
so a stale server is an error, and saved Library views keep them. Recorded
as D150.
Refs #444
* docs(library): record Add tags and select-all as D151 (#442)
* feat(library): archive paired and delete unpaired selected prompts on the server (#443)
A prompt_archive table marks Library parents hidden from the shelf; older
builds ignore it. New routes /prompt_manager/library/delete/preview,
/library/delete and /library/restore classify a selection (delete,
archive, protected, already archived, not found), execute exactly what was
reviewed under a records hold, take a verified safety backup (disk checked)
before any delete, and restore archived prompts. The shelf, search and the
shelf-facing counts honor the archive (?shelf=active|archived); archiving
repairs a stale prompt hash so scans find the archived row.
* feat(library): Delete… on the selection bar, Show archived prompts and Restore (#443)
The Library bar's Delete… previews the selection and opens the shared
review: what is deleted (in no saved pair), archived (paired: hidden,
restorable) or kept (tagged __protected__), the safety backup and what
cannot be undone. Show archived prompts (N) lists archived prompts with
Restore on their bar; an archived prompt's page shows an Archived notice
with Restore. TESTING.md records D152; the route snapshot gains the three
workspace routes.
* test(library): cover the Delete… review failure and close-only paths; record coverage floors (#443)
* fix(library): let saved-view defaults fill the missing #444 filters
libraryViewState passed `?? 'all'` and `?? ''` fallbacks that
normalizeViewState already applies to an undefined value. The redundant
branches were never taken in the page, which dropped saved-views.mjs below
its 95% branch floor. A unit now covers a shelf without the new filters.
Refs #444
* fix(library): lay out a loaded page of prompts without waiting for an animation frame (#443)
A starved renderer (headless WebKit under CPU load, a background tab) can
hold requestAnimationFrame for seconds. The shelf laid out each loaded page
only in its next frame, so the grid stayed empty after the first load or a
delete's reload while the caption already showed the new count. A loaded
batch is now laid out at once; measurements still flush per frame.
The regression test holds every animation frame and fails before the fix.
* test(saved-views): give the D153 Library view the tag_mode key (#444)
The Library saved-view state now holds tag_mode, and the API requires
every key, so main's new "Highest rated" spec posts it too.
Refs #444
* test(saved-views): give the D153 Library view the folder key (#444)
Refs #444
* fix(library): name the saved pair, not negative variants, as the archive reason (#443)
A prompt in a saved pair with no negative variants was described in the
Delete… review as "1 prompt with negative variants: hidden, restorable".
Paired prompts are archived because of the pair, so the Archive row now
reads "N prompts in a saved pair: hidden, restorable" and the first
sentence explains the pair. Found in the live test of #470.
* fix(library): nest Refine folders by path segment; backslash separates only on Windows (#444)
Live test B1: the Folder list indented a server list sorted as full-path
text, so "-" and "_" sorted before "/" and children landed under the wrong
parent (kiko/char under kiko-v6), with case variants interleaved. The
options are now a tree built by segment: each folder directly under its own
parent, case variants distinct siblings.
On POSIX a folder named "Metadata\Klein..." was listed but filtered to no
prompts, because normalize_folder read "\" as a separator. It now does so
only on Windows (ntpath), as the listing already did.
Refs #444
* fix(library): say why an archived prompt is archived, and name variants only when it has any (#443)
The archived prompt page's notice always said "This prompt and its
negative variants are hidden", also for a saved-pair prompt with none.
It now says the prompt is archived because it is in a saved pair, and
counts its negative variants only when there are any. From the live
test of #470.
* feat(library): delete a prompt in a saved pair permanently, with its own pairs (#482, server)
The Delete review's preview now marks which archive ids may be deleted
permanently (in a saved pair, and nobody else's negative), with a review
digest of the prompt and its pairs and the counts the review shows. The
write accepts an optional delete_paired_ids with their digests. Each is
deleted with its own saved pairs (image-pair links, then pairs, then the
prompt as #443 deletes it) only while its digest is unchanged. Any drift
archives it and counts it changed. Paired deletes are backed up and
disk-checked like deletes.
* feat(library): ask Archive or Delete permanently for prompts in a saved pair (#482, review)
The Delete… review asks, for prompts in a saved pair, Archive (checked
on every open, D152's review) or Delete permanently, with their saved
pairs, in a D90 radio row. The choice rewrites the grid, sentences, title
and primary in place (openReviewDialog setRows/setPrimary), and the body
carries the chosen ids with their review digests. On the archived shelf,
Show archived prompts now reads the concept's way back, "← Prompt
library", as a plain button. TESTING.md records D154.
* docs(testing): number #482's deviation D160 (D154-D159 are taken)
* Revert "docs(testing): number #482's deviation D160 (D154-D159 are taken)"
This reverts commit 96c2a293a4.
* docs(testing): number #482's deviation D160 (D154-D159 are taken)
* feat(library): Delete prompt… on a prompt's page (#481)
The recipe editor's actions read Create text revision, Archive variant…
(the selected negative variant's archive, renamed from Archive… so the two
danger buttons cannot be confused) and Delete prompt…, which closes the
editor and runs the Library's Delete… review for that prompt: the same
preview, saved-pair choice (Archive stays the default), backup and write.
A delete opens the Prompt library; an archive reads the page again.
Recorded as D161 in TESTING.md and in the editor concept comparison.
* fix(library): hold Edit metadata while a prompt's page delete runs (#481)
While the page's Delete… review or its write runs, Edit metadata is
aria-disabled and its click ignored, so no editor save can race the delete.
Adds tests for a failed review, a write answered after the page was left
(no toast, no jump, the shelf reads again) and heading focus after an
archive.
* feat(library): delete archived prompts from the archived shelf (#492)
The archived shelf's bar offers Delete… after Restore. Its review is the
permanent delete only (no Archive choice: the prompts are archived
already), with #482's grid, safety backup, review digests, records hold
and epoch fence. A prompt used as another prompt's negative stays
archived; one restored since the shelf was read is kept and counted.
The preview and delete routes take an optional shelf ('active' or
'archived'). The held write classifies the same shelf, so the permanent
delete is backed up; on this shelf the write archives and rewrites
nothing and counts every reviewed id it did not delete as changed.
* fix(library): say only 'Nothing was deleted.' on the archived shelf (#492)
Review LOWs: the archived shelf archives nothing, so its empty outcome no
longer says 'Nothing was deleted or archived.'; a mixed write (deleted,
drifted, protected, gone and restored ids) counts each once.
* fix(library): open the archived shelf's delete review on Cancel (#492)
Its only action is a permanent delete, so focus starts on Cancel
(openReviewDialog's focusCancel); the spec also pins that the copy says
the delete cannot be undone and removes the prompt's saved pairs.
* fix(library): delete review and prompt page polish from the live test (#512)
- A prompt page whose prompt no longer exists says so, with Open the
Prompt library and no Retry.
- The Delete review leaves out rows with nothing in them.
- A review from a prompt's page is titled Delete this prompt or Archive
this prompt.
- An archived prompt used as another prompt's negative is named so.
- D162: a More menu button after Send to ComfyUI holds Delete prompt...,
an accessible menu that fits 390px; Edit metadata keeps its entry.
- Item 5 already holds after #505; a regression test pins it.
* fix(library): act on a loaded prompt only, keep focus on a gone page, close the menu on focus loss (#512)
Review fixes: Edit metadata and the More menu are disabled while the
prompt loads or failed to load; on a gone prompt's page a focused control
hands focus to Open the Prompt library; the menu closes when focus leaves
it. A unit pins that a paired prompt with a missing digest is not called
another prompt's negative.
* docs(testing): number #512's deviation D163 (D162 is #514's)
* test(library): drive every More menu key and drop its unused close export (#512)
CI's coverage gate found more-menu.mjs functions at 71.42% (floor 80): the
ArrowUp-on-button, ArrowUp/Home/End-in-menu and Tab paths were untested and
an unused close() export counted as uncovered. The delete spec now drives
them; measured locally on that spec: 100% lines and functions.
955 lines
83 KiB
JavaScript
955 lines
83 KiB
JavaScript
import {createScope,createButton} from '../shared/toolkit/core.js';
|
||
import {createPromptSender} from './prompt-sender.mjs';
|
||
import {mountPromptBlocks} from './prompt-inspector.mjs';
|
||
import {mountImages} from './images.mjs';
|
||
import {createLibraryStream,createLibraryDetail,libraryPromptRoles,LIBRARY_TAG_MODES,libraryFolderOptions} from './library-state.mjs';
|
||
import {promptRoles} from './prompt-blocks.mjs';
|
||
import {createLibraryEditor,showWorkspaceToast} from './library-editor.mjs';
|
||
import {createLibraryEditorController} from './library-editor-state.mjs';
|
||
import {layoutLibraryRows,visibleLibraryRows,usedLabel} from './library-layout.mjs';
|
||
import {createWorkspaceIcon} from './icons.mjs';
|
||
import {mountRecordedHistory} from './history.mjs';
|
||
import {countOf} from './plural.mjs';
|
||
import {addedTerms} from './history-state.mjs';
|
||
import {pageHeading} from './heading.mjs';
|
||
import {mountToolbar} from './toolbar.mjs';
|
||
import {libraryFilters,libraryViewState} from './saved-views.mjs';
|
||
import {openRefineDialog,openContentDialog} from './workspace-dialogs.mjs';
|
||
import {mountLibrarySelection} from './library-selection.mjs';
|
||
import {fallBackToOriginal,replaceOnError,showsThumbnail,thumbnailSource} from './thumbnail-support.mjs';
|
||
import {COPY as DELETE_COPY,RESTORE_URL,archivedNoticeText,restoreOutcome,reviewPromptDelete} from './library-delete.mjs';
|
||
import {createMoreMenu} from './more-menu.mjs';
|
||
|
||
let shelfVisit=null;
|
||
// #512: what a prompt page says when its prompt no longer exists (404).
|
||
const PROMPT_GONE='This prompt no longer exists. It may have been deleted.';
|
||
// Every confirmed receipt advances this; a shelf mounted before it never restores its cached stream.
|
||
let writeGeneration=0, focusHeadingOnMount=false, savedParentId=null;
|
||
// The pair one reconciled save names, taken once by the history it opens (the concept selects it after a save, app.js 986).
|
||
const savedSelections=new Map();
|
||
const historyVisits=new Map();
|
||
// Exact-ID pair reads for selections outside the bounded variant page; never merged into it.
|
||
const selectedPairs=new Map();
|
||
// Parent metadata a reuse did not apply, kept for an explicit Edit metadata action.
|
||
const metadataDrafts=new Map();
|
||
const archivedVisible=new Map();
|
||
// The concept's sorts first, then the Library's appended Oldest first (D14); D153 (#447) drops "Highest rated".
|
||
const LIBRARY_SORTS=Object.freeze([['newest','Recently added'],['name','Name A–Z'],['oldest','Oldest first']]);
|
||
// Refine › Tag match (#444 D149, D150), in LIBRARY_TAG_MODES order.
|
||
const TAG_MATCH_OPTIONS=Object.freeze([['all','All of these tags'],['any','Any of these tags'],['untagged','Prompts without tags']]);
|
||
// A card's focusable controls in order: the D148 selection checkbox, then its buttons (#437).
|
||
const CARD_CONTROLS='button, input[type="checkbox"]';
|
||
const CATEGORIES_FAILED='Categories could not be loaded. Open the Prompt library again to retry.';
|
||
const ARCHIVED_MESSAGE='Archived. Find it under Show archived in Negative variants.';
|
||
function el(tag,text,className) {
|
||
const node=document.createElement(tag);if(text!==undefined) node.textContent=text;if(className) node.className=className;return node;
|
||
}
|
||
// Cut at 80 UTF-16 units, never inside a surrogate pair (database/library.py titled() matches).
|
||
export function libraryTitle(text) {
|
||
const first=text.split('\n')[0].trim();
|
||
if (first.length<=80) return first;
|
||
const cut=first.slice(0,80);
|
||
return `${/[\uD800-\uDBFF]$/.test(cut)?cut.slice(0,-1):cut}…`;
|
||
}
|
||
const title=libraryTitle;
|
||
/** The full stored title; the first-line fallback only when it is blank. */
|
||
function displayTitle(positive) {return typeof positive.title==='string' && positive.title.trim()?positive.title:title(positive.text);}
|
||
function focusHeading(main) {const heading=main.querySelector('h1');if(!heading)return;heading.tabIndex=-1;heading.focus();}
|
||
/** The shell heading's action row (concept `.heading-actions`); a view mounted without one gets its own row. */
|
||
function headingActions(main,fallback) {
|
||
const actions=pageHeading(main)?.actions;if(actions) return actions;
|
||
const row=el('div',undefined,'heading-actions');fallback.append(row);return row;
|
||
}
|
||
/** The shell heading's description (concept `p.muted`); a view mounted without one shows it at the top of `fallback`. */
|
||
function headingDescription(main,fallback,text) {
|
||
const description=pageHeading(main)?.description;
|
||
if(description) description.textContent=text;else fallback.prepend(el('p',text,'muted'));
|
||
}
|
||
|
||
/** A confirmed receipt makes cached shelf items, cursor and measured heights stale; filters and anchor survive. */
|
||
const writeListeners=new Set();
|
||
export function invalidateLibraryAfterWrite(commit) {
|
||
if(!commit || typeof commit.kind!=='string' || !commit.receipt || typeof commit.receipt!=='object') throw new TypeError('Invalid editor commit');
|
||
writeGeneration++;
|
||
if(shelfVisit) shelfVisit={filters:shelfVisit.filters,anchor:shelfVisit.layout?.anchor ?? shelfVisit.anchor ?? null};
|
||
for(const listener of [...writeListeners]) listener(commit);
|
||
}
|
||
/** Forget the shelf's last visit (filters, items and position): the next visit starts fresh (S9: a restored library). */
|
||
export function forgetLibraryVisit() {
|
||
writeGeneration++;shelfVisit=null;
|
||
}
|
||
/** Observe confirmed Library and vocabulary writes (the sidebar re-reads its counts); returns the unsubscribe. */
|
||
export function onLibraryWrite(listener) {
|
||
if(typeof listener!=='function') throw new TypeError('Invalid Library write listener');
|
||
writeListeners.add(listener);return ()=>{writeListeners.delete(listener);};
|
||
}
|
||
/**
|
||
* Open the Library shelf with exactly these filters (Tags & categories Browse): the
|
||
* visit is seeded like a returning shelf without a cached stream, so it reads page one
|
||
* with the existing Library filters, and the heading takes focus as after a save.
|
||
*/
|
||
export function browseLibrary(filters) {
|
||
const {text='',category='',tags=[],sort='newest',tagMode='all',folder=''}=filters || {};
|
||
if(typeof text!=='string' || typeof category!=='string' || !Array.isArray(tags) || tags.some(tag=>typeof tag!=='string') || typeof sort!=='string' || !LIBRARY_TAG_MODES.includes(tagMode) || typeof folder!=='string') throw new TypeError('Invalid Library filters');
|
||
shelfVisit={filters:{text,category,tags:[...tags],sort,tagMode,folder},anchor:null};
|
||
focusHeadingOnMount=true;window.location.hash='#/library';
|
||
}
|
||
/** Remember the selection a reconciled save names, so the destination history opens on it once. */
|
||
export function rememberLibraryResult(result) {
|
||
const positive=result?.detail?.positive, kind=result?.commit?.kind;
|
||
if(!positive || !Number.isSafeInteger(positive.id) || !Array.isArray(result.detail.variants) || typeof kind!=='string') throw new TypeError('Invalid reconciled Library result');
|
||
if(kind==='create') savedParentId=positive.id;
|
||
if(!result.pair || kind==='archive-pair') return;
|
||
savedSelections.set(positive.id,result.pair.id);
|
||
if(result.detail.variants.some(variant=>variant.id===result.pair.id)) selectedPairs.delete(positive.id);
|
||
else selectedPairs.set(positive.id,result.pair);
|
||
if(result.pair.archived) archivedVisible.set(positive.id,true);
|
||
}
|
||
/**
|
||
* Toast copy from the receipt: the concept's save toast for New, Revision and Edit and its
|
||
* Add-negative line (app.js 989, 1028); a reuse discloses what was not saved, and only
|
||
* when the controller found the entered parent metadata differs from the stored one.
|
||
*/
|
||
function outcomeMessage(result,outcome) {
|
||
const {kind,receipt}=result.commit;
|
||
if(kind==='metadata') return 'Saved.';
|
||
// #443: a save that reused an archived prompt leaves it archived; say how to bring it back.
|
||
if((kind==='create' || kind==='add-negative') && result.detail?.positive?.archived===true) return DELETE_COPY.archivedText;
|
||
if(kind==='archive-pair') return ARCHIVED_MESSAGE;
|
||
if(kind!=='create' && kind!=='add-negative') return null;
|
||
if(receipt.positive_created) return 'Saved.';
|
||
if(receipt.pair_created) return kind==='add-negative'?'Negative saved without adding another positive or gallery.'
|
||
:outcome?.metadataNotApplied?'Saved as a new negative variant of an existing prompt. The title, category, tags and notes you entered were not applied.'
|
||
:'Saved as a new negative variant of an existing prompt.';
|
||
if(receipt.pair.archived) return 'This combination is an archived negative variant. It stays archived; restore it from Show archived in Negative variants.';
|
||
return 'This prompt pair already exists. Showing the saved version.';
|
||
}
|
||
/** Take the saved selection for one positive; it never outlives the visit that consumes it. */
|
||
function takeSavedSelection(positiveId) {
|
||
const pairId=savedSelections.get(positiveId);savedSelections.delete(positiveId);return pairId ?? null;
|
||
}
|
||
function rememberUnappliedMetadata(result,{outcome,draft}={}) {
|
||
if(result.commit.kind!=='create' || !outcome?.metadataNotApplied || !draft) return;
|
||
const {title:name,category,tags,notes}=draft;metadataDrafts.set(result.detail.positive.id,{title:name,category,tags,notes});
|
||
}
|
||
/** New prompt, from Library or Images: a saved prompt always opens its own history, as in the concept. */
|
||
function createNewPromptEditor(api,scope,main) {
|
||
return createLibraryEditor({api,parentScope:scope,onCommitted:invalidateLibraryAfterWrite,onReconciled:(result,context)=>{
|
||
rememberLibraryResult(result);rememberUnappliedMetadata(result,context);
|
||
const message=outcomeMessage(result,context?.outcome);if(message) showWorkspaceToast(message);
|
||
const hash=`#/library/${result.detail.positive.id}`;
|
||
if(window.location.hash===hash) focusHeading(main);else {focusHeadingOnMount=true;window.location.hash=hash;}
|
||
}});
|
||
}
|
||
/** The Images heading's New prompt: opens the editor without mounting or navigating to the Library. */
|
||
export function mountNewPromptAction(main,api,parentScope) {
|
||
const actions=headingActions(main,main);
|
||
const button=createButton('','ca-primary');button.append(createWorkspaceIcon('plus'),el('span','New prompt'));actions.append(button);
|
||
const editor=createNewPromptEditor(api,parentScope,main);
|
||
parentScope.listen(button,'click',()=>editor.open({mode:'new',trigger:button}));
|
||
return button;
|
||
}
|
||
|
||
/** `savedState` opens a saved view (#249 D16) instead of the last visit; `onSaveView(trigger, state)` is Save view. */
|
||
export function mountLibrary(main,api,parentScope,{positiveId,savedState=null,onSaveView=()=>{}}={}) {
|
||
const scope=createScope();parentScope.cleanup(()=>scope.dispose());
|
||
main.classList.add('library-main');
|
||
const sender=createPromptSender({scope});
|
||
if(positiveId!==undefined) mountHistory();
|
||
else mountShelf();
|
||
if(focusHeadingOnMount) {focusHeadingOnMount=false;focusHeading(main);}
|
||
// Save the visit before removing the class that defines the shelf's scroll range.
|
||
scope.cleanup(()=>main.classList.remove('library-main'));
|
||
|
||
function mountShelf() {
|
||
const saved=savedState?libraryFilters(savedState):null;
|
||
const visit=saved?null:shelfVisit, mountedGeneration=writeGeneration;
|
||
// An invalidated visit keeps only filters and anchor: the stream restarts and heights are measured again.
|
||
const restorable=visit?.state?visit:null;
|
||
// #443 D152: `shelf` ('active' or 'archived', Show archived prompts) lives in the visit's filters, never in a saved view.
|
||
const filters={text:'',category:'',tags:[],sort:'newest',tagMode:'all',folder:'',shelf:'active',...visit?.filters,...saved};
|
||
// D153: a sort the shelf no longer offers (an older "Highest rated" visit) reads as Recently added.
|
||
if(!LIBRARY_SORTS.some(([value])=>value===filters.sort)) filters.sort='newest';
|
||
const section=el('section',undefined,'library-shelf');section.setAttribute('aria-label','Prompt library');
|
||
// The shared concept toolbar (app.js toolbar(), a347–360): Tags live in "Refine this view" (D14), no Refresh (D15).
|
||
// Its own scope, disposed after the visit is saved: removing it first would shorten the page and clamp scrollY.
|
||
const toolbarScope=createScope();
|
||
// D44: Filters reads "Filters · N" while Refine filters (from Refine or a Browse) narrow the shelf: Tags, a Folder
|
||
// and a Tag match other than All (#444 D149, D150) each count once.
|
||
const refinements=()=>(filters.tags.length?1:0)+(filters.folder?1:0)+(filters.tagMode!=='all'?1:0);
|
||
const toolbar=mountToolbar(section,{scope:toolbarScope,categories:filters.category?[filters.category]:[],sorts:LIBRARY_SORTS,
|
||
value:{q:filters.text,category:filters.category,sort:filters.sort},activeFilters:refinements(),onChange:applyToolbar,onFilters:openFilters,
|
||
onSaveView:trigger=>{const value=toolbar.value();onSaveView(trigger,libraryViewState({...filters,text:value.q.trim(),category:value.category,sort:value.sort}));}});
|
||
const optionsStatus=el('p','','library-options-status');optionsStatus.hidden=true;optionsStatus.setAttribute('role','alert');
|
||
// The concept caption (app.js renderLibrary a586): the filtered set's parents and their negative variants.
|
||
const caption=el('div',undefined,'section-caption');const captionCount=el('span');caption.append(captionCount,el('span','Images are grouped by positive prompt'));caption.hidden=true;
|
||
// The count is announced when it changes; a reload keeps the last count shown, so nothing else re-announces it.
|
||
captionCount.setAttribute('role','status');
|
||
const grid=el('div',undefined,'library-grid');grid.setAttribute('role','list');grid.setAttribute('aria-label','Positive prompts');
|
||
// #437 D148: select prompts and set their category (the legacy admin's Set Category); a write reloads the shelf.
|
||
let categoryNames=[];
|
||
const selection=mountLibrarySelection({scope,api,grid,getItems:()=>state?.items ?? [],getEpoch:()=>state?.epoch ?? null,
|
||
getCategories:()=>categoryNames,focusFallback:{focus:()=>focusHeading(main)},getShelf:()=>filters.shelf,
|
||
nameOf:id=>{const item=state?.items.find(entry=>entry.id===id);return item?displayTitle(item):null;},
|
||
onCommitted:(kind,receipt)=>invalidateLibraryAfterWrite({kind:`bulk-${kind}`,receipt}),onReload:()=>{loadCategories();reset();}});
|
||
const message=el('p','','library-status');message.setAttribute('role','status');
|
||
const continuation=el('div',undefined,'library-continuation');
|
||
const more=createButton('Load more prompts');const retry=createButton('Retry prompt library');retry.hidden=true;
|
||
const actions=headingActions(main,section);
|
||
const exportButton=createButton('Export');exportButton.setAttribute('aria-label','Export full Library JSON');
|
||
// #443 D152: the shelf's counterpart of Negative variants' Show archived (#235); N follows the filters. #482: on
|
||
// the archived shelf it reads the concept's own way back ("← Prompt library", app.js 594); a plain button whose
|
||
// label names where it goes, so it carries no pressed state its changing label would contradict.
|
||
const BACK_TO_LIBRARY='← Prompt library';
|
||
const showArchived=createButton(filters.shelf==='archived'?BACK_TO_LIBRARY:'Show archived prompts');
|
||
const newPrompt=createButton('+ New prompt','ca-primary');actions.append(showArchived,exportButton,newPrompt);
|
||
scope.listen(showArchived,'click',()=>{
|
||
if(selection.writing()) return;
|
||
filters.shelf=filters.shelf==='archived'?'active':'archived';
|
||
reset();selection.shelfChanged();
|
||
});
|
||
const exportStatus=el('p','','library-options-status');exportStatus.hidden=true;exportStatus.setAttribute('role','alert');
|
||
const editor=createNewPromptEditor(api,scope,main);
|
||
scope.listen(newPrompt,'click',()=>editor.open({mode:'new',trigger:newPrompt}));
|
||
const exportUrls=new Set();let exporting=false;
|
||
scope.cleanup(()=>{for(const url of exportUrls)URL.revokeObjectURL(url);exportUrls.clear();});
|
||
// The exact full-Library document; a failure is reported before anything is downloaded.
|
||
async function exportLibrary() {
|
||
if(exporting) return;exporting=true;exportStatus.hidden=true;
|
||
try {
|
||
const response=await fetch(window.ApiClient.resolveUrl('/prompt_manager/library/export'),{cache:'no-store',credentials:'same-origin',signal:scope.signal});
|
||
if(!response.ok) throw new Error(`Export failed with status ${response.status}`);
|
||
const text=await response.text();const parsed=JSON.parse(text);
|
||
if(parsed?.kind!=='prompt-manager-library' || parsed.schema_version!==1 || !Array.isArray(parsed.positives)) throw new TypeError('Invalid Library export');
|
||
if(scope.signal.aborted) return;
|
||
const url=URL.createObjectURL(new Blob([text],{type:'application/json'}));exportUrls.add(url);
|
||
const anchor=el('a');anchor.href=url;anchor.download='prompt-manager-library-v1.json';anchor.hidden=true;section.append(anchor);anchor.click();anchor.remove();
|
||
setTimeout(()=>{if(exportUrls.delete(url))URL.revokeObjectURL(url);},0);
|
||
} catch {
|
||
if(!scope.signal.aborted) {exportStatus.textContent='The Library export could not be downloaded. Nothing was saved to this device.';exportStatus.hidden=false;}
|
||
} finally {exporting=false;}
|
||
}
|
||
scope.listen(exportButton,'click',exportLibrary);
|
||
headingDescription(main,section,'One positive. Reusable negatives. Every experiment stays connected.');
|
||
// Nothing follows the grid in the concept; the legacy Library stays one click away on Overview (spec §5).
|
||
continuation.append(message,retry,more);section.append(optionsStatus,exportStatus,selection.element,caption,grid,continuation);main.append(section);
|
||
const cards=new Map(), rowNodes=new Map(), spacers=new Map(), heights=new Map(), pendingMeasurements=new Map();
|
||
let state,frame=0,loadFrame=0,observer,optionsRequest,folderRequest,focusOverride=-1;
|
||
const columns=()=>window.innerWidth>=1700?3:window.innerWidth<=700?1:2;
|
||
const readInlineSize=()=>Math.round(grid.getBoundingClientRect().width*64)/64;
|
||
let inlineSize=readInlineSize(), columnCount=columns(), layout={rows:[],height:0}, dirty=true, items, indexesById=new Map();
|
||
let anchor=restorable?.layout?.anchor || null, pendingAnchor=anchor, observedScrollY=window.scrollY, retainedAnchor=restorable?null:visit?.anchor || null;
|
||
let restoreScrollY=Number.isFinite(restorable?.scrollY) && restorable.scrollY>=0?restorable.scrollY:null;
|
||
if(restorable?.layout?.inlineSize===inlineSize && restorable.layout.columns===columnCount) for(const [id,height] of restorable.layout.heights) heights.set(id,height);
|
||
const hiddenSave=restorable?null:savedParentId;savedParentId=null;
|
||
function removeCard(card) {measurementObserver?.unobserve(card.node);pendingMeasurements.delete(Number(card.node.dataset.promptId));card.blocks.dispose();card.node.remove();}
|
||
/** The concept's prompt card (app.js renderLibrary a586) with real counts and last use (#249 D23; no rating, D153). */
|
||
function cardFor(item,index) {
|
||
const article=el('article',undefined,'prompt-card');article.dataset.promptId=item.id;article.setAttribute('role','listitem');
|
||
const art=el('div',undefined,'card-art');art.setAttribute('aria-hidden','true');
|
||
const previews=item.previews || [];
|
||
for(const image of previews.slice(0,2)) {
|
||
// #317: a video with no preview, or one this browser cannot show (JPEG XL), keeps its label.
|
||
if(!showsThumbnail(image)) art.append(el('span','Video preview','small'));
|
||
else {
|
||
// #317: an image's JPEG XL preview this browser cannot show, or one that fails, loads the original;
|
||
// a video's preview that fails becomes its label, never a broken image.
|
||
const img=el('img');img.src=window.ApiClient.resolveUrl(thumbnailSource(image));if(image.is_video) replaceOnError(img,()=>el('span','Video preview','small'));else fallBackToOriginal(img,window.ApiClient.resolveUrl(image.url));img.alt='';img.loading='lazy';img.decoding='async';img.width=image.width || 800;img.height=image.height || 600;art.append(img);
|
||
}
|
||
}
|
||
if(!previews.length) art.append(el('span','No available image previews','small'));
|
||
const name=displayTitle(item);
|
||
const content=el('div',undefined,'card-content');
|
||
const heading=el('div',undefined,'card-title');const open=createButton(name);open.dataset.history='';
|
||
heading.append(open,el('span',item.category || 'Uncategorized','chip'));
|
||
if(item.archived===true) heading.append(el('span','Archived','chip'));
|
||
const prompts=el('div');
|
||
const blocks=mountPromptBlocks(prompts,{prompts:{positive:{status:'resolved',text:item.text,source:'library'}},sender,parentScope:scope,roles:['positive'],title:name});
|
||
const meta=el('div',undefined,'card-meta');
|
||
meta.append(el('span',`\u2212 ${countOf(item.variant_count,'negative variant')}`,'chip red'),el('span',countOf(item.run_count ?? 0,'run')),el('span',countOf(item.image_count,'image')));
|
||
const vocabulary=el('div',undefined,'tags');for(const tag of item.tags || []) vocabulary.append(el('span',tag,'chip'));
|
||
content.append(heading,prompts,meta,vocabulary);
|
||
const footer=el('div',undefined,'card-footer');
|
||
// D153 (#447): the footer reads only the last use; the concept's rating stars are not drawn.
|
||
const facts=el('span',usedLabel(item.last_used_at));
|
||
const actions=el('div',undefined,'row-actions');
|
||
const send=createButton('','send icon-btn');send.setAttribute('aria-label',`Send positive prompt to ComfyUI: ${name}`);send.append(createWorkspaceIcon('send'));send.dataset.sendPositive='';
|
||
const explore=createButton('');explore.append(createWorkspaceIcon('branch'),' Explore history');explore.dataset.history='';
|
||
actions.append(send,explore);footer.append(facts,actions);
|
||
article.append(selection.overlayFor(item,name),art,content,footer);article.dataset.index=index;return {node:article,blocks};
|
||
}
|
||
function captureAnchor() {
|
||
// Mounted rows can already differ from estimates before their observer batch.
|
||
for(const row of grid.children) {
|
||
if(!row.classList.contains('library-row'))continue;
|
||
const bounds=row.getBoundingClientRect();
|
||
if(bounds.bottom>0 && bounds.top<window.innerHeight)return {id:Number(row.firstElementChild.dataset.promptId),offset:bounds.top};
|
||
}
|
||
return null;
|
||
}
|
||
function reconcileScroll() {
|
||
const delta=window.scrollY-observedScrollY;observedScrollY=window.scrollY;
|
||
if(!delta)return;
|
||
// Keep pending height compensation while honoring movement since it was queued.
|
||
if(pendingAnchor)pendingAnchor={...pendingAnchor,offset:pendingAnchor.offset-delta};
|
||
else anchor=captureAnchor();
|
||
}
|
||
function spacer(key,height) {
|
||
let node=spacers.get(key);
|
||
if(!node) {node=el('div',undefined,'library-row-spacer');node.setAttribute('aria-hidden','true');spacers.set(key,node);}
|
||
const size=`${height}px`;if(node.style.blockSize!==size)node.style.blockSize=size;
|
||
return node;
|
||
}
|
||
function renderWindow(topOverride) {
|
||
if(!state || scope.signal.aborted) return;
|
||
const active=document.activeElement, activeCard=active?.closest('article[data-prompt-id]');
|
||
const focused=focusOverride>=0?focusOverride:activeCard?Number(activeCard.dataset.index):-1;
|
||
const top=topOverride??Math.max(0,-grid.getBoundingClientRect().top);
|
||
const visible=state.items.length<=120?layout.rows.map((_,index)=>index):visibleLibraryRows(layout.rows,top,window.innerHeight,focused);
|
||
const keep=new Set(), children=[];let previous=-1;
|
||
for(const rowIndex of visible) {
|
||
const row=layout.rows[rowIndex];
|
||
if(rowIndex>previous+1) {
|
||
const end=previous<0?0:layout.rows[previous].top+layout.rows[previous].height+18;
|
||
children.push(spacer(`${previous}:${rowIndex}`,row.top-end-18));
|
||
}
|
||
let rowNode=rowNodes.get(rowIndex);
|
||
if(!rowNode) {rowNode=el('div',undefined,'library-row');rowNode.setAttribute('role','presentation');rowNodes.set(rowIndex,rowNode);}
|
||
if(!rowNode.isConnected)grid.append(rowNode);
|
||
for(let index=row.first;index<=row.last;index++) {
|
||
const item=state.items[index];keep.add(item.id);let card=cards.get(item.id);
|
||
if(!card) {card=cardFor(item,index);cards.set(item.id,card);rowNode.append(card.node);measurementObserver?.observe(card.node);}
|
||
else if(card.node.parentElement!==rowNode)rowNode.append(card.node);
|
||
card.node.dataset.index=index;card.node.setAttribute('aria-posinset',index+1);card.node.setAttribute('aria-setsize',state.total);
|
||
}
|
||
children.push(rowNode);previous=rowIndex;
|
||
}
|
||
for(const [id,card] of cards) if(!keep.has(id)) {removeCard(card);cards.delete(id);}
|
||
if(previous>=0 && previous<layout.rows.length-1) {const end=layout.rows[previous].top+layout.rows[previous].height;children.push(spacer(`${previous}:end`,layout.height-end-18));}
|
||
for(const child of [...grid.children]) if(!children.includes(child)) child.remove();
|
||
let sibling=null;
|
||
for(const child of children) {if(sibling?sibling.nextElementSibling!==child:grid.firstElementChild!==child)grid.insertBefore(child,sibling?sibling.nextElementSibling:grid.firstChild);sibling=child;}
|
||
for(const [key,node] of rowNodes)if(!node.isConnected)rowNodes.delete(key);
|
||
for(const [key,node] of spacers)if(!node.isConnected)spacers.delete(key);
|
||
if(activeCard && active.isConnected && document.activeElement!==active)active.focus({preventScroll:true});
|
||
}
|
||
function flush() {
|
||
frame=0;if(scope.signal.aborted)return;
|
||
reconcileScroll();
|
||
const width=readInlineSize(), size=columns();
|
||
if(width!==inlineSize || size!==columnCount) {pendingAnchor ||= anchor;inlineSize=width;columnCount=size;heights.clear();dirty=true;}
|
||
for(const [id,measurement] of pendingMeasurements) {
|
||
if(measurement.width===inlineSize && indexesById.has(id) && Math.abs((heights.get(id)??0)-measurement.height)>.5) {heights.set(id,measurement.height);dirty=true;}
|
||
}
|
||
pendingMeasurements.clear();
|
||
const restore=dirty?(pendingAnchor || anchor):null;
|
||
if(dirty) {layout=layoutLibraryRows(state.items.map(item=>heights.get(item.id)??null),columnCount,{estimate:columnCount===1?422:448});dirty=false;}
|
||
const index=restore?indexesById.get(restore.id):undefined;
|
||
const target=index===undefined?undefined:Math.max(0,layout.rows[Math.floor(index/columnCount)].top-restore.offset);
|
||
renderWindow(target);
|
||
const card=index===undefined?null:cards.get(restore.id);
|
||
if(card) {
|
||
const delta=card.node.getBoundingClientRect().top-restore.offset;if(Math.abs(delta)>.5)window.scrollBy(0,delta);
|
||
anchor=restore;
|
||
} else {
|
||
if(restoreScrollY!==null)window.scrollTo(0,restoreScrollY);
|
||
anchor=captureAnchor();
|
||
}
|
||
// Read the actual clamped result now; its later scroll event is not new motion.
|
||
observedScrollY=window.scrollY;
|
||
restoreScrollY=null;pendingAnchor=null;scheduleLoad();
|
||
}
|
||
const schedule=()=>{if(!frame)frame=requestAnimationFrame(flush);};
|
||
const measurementObserver=typeof ResizeObserver==='function'?new ResizeObserver(entries=>{
|
||
const width=readInlineSize();let changed=width!==inlineSize || columns()!==columnCount;
|
||
for(const entry of entries) {
|
||
const id=Number(entry.target.dataset.promptId);if(!cards.has(id) || cards.get(id).node!==entry.target)continue;
|
||
const height=entry.borderBoxSize?.[0]?.blockSize ?? entry.target.getBoundingClientRect().height;
|
||
if(Number.isFinite(height) && height>0 && (width!==inlineSize || Math.abs((pendingMeasurements.get(id)?.height??heights.get(id)??0)-height)>.5)) {pendingMeasurements.set(id,{height,width});changed=true;}
|
||
}
|
||
if(changed) {pendingAnchor ||= anchor;schedule();}
|
||
}):null;
|
||
measurementObserver?.observe(grid);
|
||
/** Focus a card's first or `last` control (Tab across the window edge), or its title (`title`: Home/End/arrows). */
|
||
function focusCard(index,last=false,title=false) {
|
||
if(index<0 || index>=state.items.length) return;
|
||
if(dirty) {cancelAnimationFrame(frame);flush();}focusOverride=index;renderWindow();const card=cards.get(state.items[index].id).node;
|
||
const controls=card.querySelectorAll(CARD_CONTROLS);(title?card.querySelector('.card-title > button'):last?controls[controls.length-1]:controls[0]).focus();card.scrollIntoView({block:'nearest'});focusOverride=-1;renderWindow();
|
||
}
|
||
// The title and Explore history open the prompt's history; the footer send sends the full positive (D23).
|
||
scope.listen(grid,'click',event=>{
|
||
const card=event.target.closest('article[data-prompt-id]');if(!card) return;
|
||
const item=state?.items[indexesById.get(Number(card.dataset.promptId))];if(!item) return;
|
||
if(event.target.closest('[data-history]')) window.location.hash=`#/library/${item.id}`;
|
||
const send=event.target.closest('[data-send-positive]');if(send) sender.open({positive:item.text},send);
|
||
});
|
||
scope.listen(grid,'keydown',event=>{
|
||
const card=event.target.closest('article[data-prompt-id]');if(!card) return;
|
||
const index=Number(card.dataset.index);
|
||
// D151 (#444 ruling): Ctrl/Cmd+A selects every loaded prompt and Escape clears, as on Images (focus stays).
|
||
if((event.ctrlKey || event.metaKey) && !event.altKey && event.key.toLowerCase()==='a') {event.preventDefault();selection.selectAll();return;}
|
||
if(event.key==='Escape' && selection.hasSelection()) {event.preventDefault();selection.clear();return;}
|
||
if(event.target.matches('[data-history]') && ['Home','End','ArrowLeft','ArrowRight'].includes(event.key)) {event.preventDefault();focusCard(event.key==='Home'?0:event.key==='End'?state.items.length-1:index+(event.key==='ArrowLeft'?-1:1),false,true);}
|
||
else if(event.key==='Tab') {
|
||
const controls=card.querySelectorAll(CARD_CONTROLS);const next=index+(event.shiftKey?-1:1);
|
||
const edge=event.shiftKey?controls[0]:controls[controls.length-1];
|
||
if(event.target===edge && state.items[next] && !cards.has(state.items[next].id)) {event.preventDefault();focusCard(next,event.shiftKey);}
|
||
}
|
||
});
|
||
function render(next) {
|
||
const batch=items!==next.items;
|
||
if(batch) {
|
||
pendingAnchor ||= captureAnchor();items=next.items;indexesById=new Map(items.map((item,index)=>[item.id,index]));dirty=true;
|
||
if(!items.length) {
|
||
anchor=null;pendingAnchor=null;heights.clear();layout={rows:[],height:0};
|
||
for(const card of cards.values())removeCard(card);
|
||
cards.clear();rowNodes.clear();spacers.clear();grid.replaceChildren();
|
||
} else if(retainedAnchor) {pendingAnchor=retainedAnchor;retainedAnchor=null;}
|
||
}
|
||
state=next;
|
||
// A loaded batch: the selection bar's count and Select all N loaded follow it (D151).
|
||
if(batch) selection.listingChanged();
|
||
if(next.variantTotal!==null) {
|
||
const count=filters.shelf==='archived'?`${countOf(next.total,'archived prompt')} · ${countOf(next.variantTotal,'negative variant')} hidden with them`
|
||
:`${countOf(next.total,'positive prompt')} · ${countOf(next.variantTotal,'negative variant')}`;
|
||
if(captionCount.textContent!==count) captionCount.textContent=count;caption.hidden=false;
|
||
}
|
||
const archivedLabel=filters.shelf==='archived'?BACK_TO_LIBRARY
|
||
:next.archivedTotal===null?'Show archived prompts':`Show archived prompts (${next.archivedTotal.toLocaleString('en-US')})`;
|
||
if(showArchived.textContent!==archivedLabel) showArchived.textContent=archivedLabel;
|
||
const filtered=Boolean(filters.text || filters.category || filters.tags.length || filters.folder || filters.tagMode!=='all');
|
||
const empty=filters.shelf==='archived'?(filtered?'No archived prompts match.':'No archived prompts.'):'No matching prompts. Try changing the filters.';
|
||
const hidden=hiddenSave!==null && !next.loading && !next.error && !next.hasMore && !next.items.some(item=>item.id===hiddenSave)?' The saved prompt is hidden by the current filters.':'';
|
||
message.textContent=(next.error?'Prompt library could not be loaded. Retry.':next.loading?'Loading prompt library…':!next.items.length?empty:!next.hasMore?'You’re all caught up.':'')+hidden;
|
||
message.setAttribute('role',next.error?'alert':'status');retry.hidden=!next.error;more.hidden=!next.hasMore || !!next.error;more.setAttribute('aria-disabled',String(next.loading));
|
||
// #464: a loaded page is laid out now, not on the next frame: a starved renderer (a background tab, headless
|
||
// WebKit under load) can hold frames for seconds, which left a loaded shelf empty. Measurements still flush per frame.
|
||
if(batch && grid.isConnected) {cancelAnimationFrame(frame);flush();} else schedule();
|
||
scheduleLoad();
|
||
}
|
||
const stream=createLibraryStream({api,onChange:render,restore:restorable?{filters,state:restorable.state}:undefined});
|
||
function maybeLoad() {
|
||
if(!observer || !state?.hasMore || state.loading || state.error || scope.signal.aborted) return;
|
||
const bounds=continuation.getBoundingClientRect();if(bounds.top<=window.innerHeight+250 && bounds.bottom>=0) stream.loadMore();
|
||
}
|
||
function scheduleLoad() {if(observer && !loadFrame) loadFrame=requestAnimationFrame(()=>{loadFrame=0;maybeLoad();});}
|
||
if(typeof IntersectionObserver==='function') {observer=new IntersectionObserver(entries=>{if(entries.some(entry=>entry.isIntersecting)) maybeLoad();},{rootMargin:'250px'});observer.observe(continuation);}
|
||
async function loadCategories() {
|
||
optionsRequest?.abort();const request=optionsRequest=new AbortController();
|
||
try {
|
||
const data=await api.get('/prompt_manager/library/options',{signal:request.signal});if(scope.signal.aborted || optionsRequest!==request) return;
|
||
categoryNames=[...data.categories];toolbar.setCategories([...data.categories,filters.category]);toolbar.setValue({category:filters.category});optionsStatus.hidden=true;
|
||
} catch {if(!scope.signal.aborted && optionsRequest===request) {optionsStatus.textContent=CATEGORIES_FAILED;optionsStatus.hidden=false;}}
|
||
}
|
||
const reset=()=>{restoreScrollY=null;selection.clear();toolbar.setActiveFilters(refinements());return stream.reset(filters);};
|
||
/** A toolbar report; a debounced search that lands after a select already applied the same values reloads nothing. */
|
||
function applyToolbar(value) {
|
||
const next={text:value.q.trim(),category:value.category,sort:value.sort};
|
||
if(Object.entries(next).every(([key,item])=>filters[key]===item)) return;
|
||
Object.assign(filters,next);reset();
|
||
}
|
||
/**
|
||
* "Refine this view" with the Library's filters: the concept's Folder (#444 D150, its options read when the dialog
|
||
* opens), Tags (D14) and Tag match (D149, D150); Clear also clears the toolbar category.
|
||
*/
|
||
function openFilters(trigger) {
|
||
const refine=openRefineDialog({scope,trigger,fields:[{key:'folder',options:libraryFolderOptions([],filters.folder)},{key:'tags'},
|
||
{key:'tagMode',options:TAG_MATCH_OPTIONS}],values:{folder:filters.folder,tags:filters.tags.join(', '),tagMode:filters.tagMode},
|
||
onApply:applyRefinement,onClear:cleared=>{toolbar.setValue({category:cleared.category});applyRefinement(cleared);}});
|
||
folderRequest?.abort();const request=folderRequest=new AbortController();
|
||
// A failed read leaves "All output folders" and the current folder; nothing else depends on it.
|
||
api.get('/prompt_manager/library/options?include=folders',{signal:request.signal}).then(data=>{
|
||
if(scope.signal.aborted || folderRequest!==request || !Array.isArray(data?.folders) || data.folders.some(folder=>typeof folder!=='string')) return;
|
||
refine.setOptions('folder',libraryFolderOptions(data.folders,filters.folder));
|
||
},()=>{});
|
||
}
|
||
function applyRefinement({tags,tagMode='all',folder='',category=filters.category}) {
|
||
// "Prompts without tags" takes no Tags (the dialog disables them).
|
||
const next=tagMode==='untagged'?[]:[...new Set(tags.split(',').map(tag=>tag.trim()).filter(Boolean))];
|
||
if(category===filters.category && tagMode===filters.tagMode && folder===filters.folder && next.length===filters.tags.length && next.every((tag,index)=>tag===filters.tags[index])) return;
|
||
filters.category=category;filters.tags=next;filters.tagMode=tagMode;filters.folder=folder;reset();
|
||
}
|
||
scope.listen(more,'click',()=>stream.loadMore());
|
||
// Retry also re-reads a category list that failed (D15: Refresh is gone).
|
||
scope.listen(retry,'click',()=>{if(!optionsStatus.hidden)loadCategories();stream.loadMore();});
|
||
scope.listen(window,'scroll',()=>{reconcileScroll();schedule();});
|
||
// Mobile viewport resizing can adjust scroll before delivering its resize event.
|
||
scope.listen(window,'resize',()=>{pendingAnchor ||= anchor;observedScrollY=window.scrollY;schedule();});
|
||
scope.cleanup(()=>{
|
||
const savedFilters={...filters,tags:[...filters.tags]},savedAnchor=pendingAnchor || anchor || captureAnchor();
|
||
// A write while mounted makes this stream stale: keep only what still means something.
|
||
// A saved view is not the plain shelf, so it never replaces the Library return state (#249 M2, as Favorites).
|
||
if(!saved) shelfVisit=mountedGeneration!==writeGeneration?{filters:savedFilters,anchor:savedAnchor}:state?{filters:savedFilters,state,scrollY:window.scrollY,layout:{inlineSize,columns:columnCount,heights:[...heights],anchor:savedAnchor}}:null;
|
||
toolbarScope.dispose();stream.dispose();optionsRequest?.abort();folderRequest?.abort();observer?.disconnect();measurementObserver?.disconnect();cancelAnimationFrame(frame);cancelAnimationFrame(loadFrame);for(const card of cards.values())removeCard(card);cards.clear();});
|
||
loadCategories();if(restorable) {render(stream.state);if(restorable.state.loading || restorable.state.error)stream.loadMore();} else reset();
|
||
}
|
||
|
||
function mountHistory() {
|
||
const history=el('section',undefined,'library-history');history.setAttribute('aria-label','Prompt history');main.append(history);
|
||
const body=el('div');history.append(body);
|
||
// Concept heading (app.js a591–597): ← Prompt library, Edit metadata, then the selected pair's Send to ComfyUI.
|
||
headingDescription(main,history,'Prompt history · one positive, one shared gallery');
|
||
const actions=headingActions(main,history);
|
||
const back=createButton('← Prompt library'),edit=createButton('Edit metadata'),send=createButton('','send');
|
||
send.append(createWorkspaceIcon('send'),el('span','Send to ComfyUI'));send.disabled=true;
|
||
// D163 (#512, maintainer 2026-10-29): a "⋯" More menu after Send to ComfyUI holds Delete prompt…, so delete is
|
||
// findable on the page; Edit metadata keeps its own Delete prompt… (D161).
|
||
const moreMenu=createMoreMenu({scope,label:'More actions for this prompt',items:[{label:'Delete prompt…',danger:true,onSelect:()=>deletePrompt(moreMenu.button)}]});
|
||
actions.append(back,edit,send,moreMenu.element);
|
||
let blocks,galleryScope,detail,contentScope,updateBranches,updateParent,current=null;
|
||
scope.cleanup(()=>{blocks?.dispose();galleryScope?.dispose();contentScope?.dispose();});
|
||
// Every visit opens on the first negative, as the concept's navigate() does (app.js 1149: state.variant = 0);
|
||
// only the pair a save just named is selected instead. A verified pair outside the page belongs to that save.
|
||
let pendingSelection=takeSavedSelection(positiveId);
|
||
if(selectedPairs.get(positiveId)?.id!==pendingSelection) selectedPairs.delete(positiveId);
|
||
const loader=createLibraryDetail({api,onChange:render});scope.cleanup(()=>loader.dispose());
|
||
const editor=createLibraryEditor({api,parentScope:scope,onCommitted:invalidateLibraryAfterWrite,onReconciled:reconciled,onRefreshRequired:reloadView,
|
||
onDeletePrompt:()=>deletePrompt()});
|
||
/** #481: this prompt through the Library's Delete… review; a delete returns to the shelf, an archive shows its notice. */
|
||
let deleting=false;
|
||
// While the review or its write runs, Edit metadata is held (as the selection bar holds its actions), so no save
|
||
// can race the delete; aria-disabled keeps it focusable for the return.
|
||
function holdEdit(held) {
|
||
deleting=held;
|
||
for(const button of [edit,moreMenu.button]) {
|
||
if(held) button.setAttribute('aria-disabled','true');else button.removeAttribute('aria-disabled');
|
||
}
|
||
}
|
||
function deletePrompt(trigger=edit) {
|
||
const shown=detail;if(deleting || !shown?.positive) return;
|
||
// One review at a time, as the selection bar holds itself (a second press during the preview starts nothing).
|
||
holdEdit(true);
|
||
reviewPromptDelete({api,scope,trigger,ids:[shown.positive.id],epoch:shown.library_epoch,
|
||
titleOf:()=>displayTitle(shown.positive),onDismiss:()=>{holdEdit(false);if(trigger.isConnected) trigger.focus({preventScroll:true});},
|
||
onSettled:(outcome,result,failure)=>{
|
||
holdEdit(false);
|
||
if(outcome.committed) invalidateLibraryAfterWrite({kind:'bulk-delete',receipt:result ?? {phase:'unconfirmed'}});
|
||
// A left page still invalidates what it cached, but says nothing (as the bar's write).
|
||
if(scope.signal.aborted) return;
|
||
showWorkspaceToast(outcome.toast);
|
||
// Restored storage: the whole Library view reads again, as the editor's own restore path.
|
||
if(failure?.code==='storage-changed') {reloadView();return;}
|
||
if(result && Number.isSafeInteger(result.deleted) && result.deleted>0) {focusHeadingOnMount=true;window.location.hash='#/library';return;}
|
||
if(outcome.reload) {detail=null;loader.load(positiveId);focusHeading(main);}
|
||
}});
|
||
}
|
||
scope.listen(back,'click',()=>{window.location.hash='#/library';});
|
||
scope.listen(edit,'click',()=>{
|
||
if(deleting) return;
|
||
const draft=metadataDrafts.get(positiveId);metadataDrafts.delete(positiveId);
|
||
editor.open({mode:'metadata',positiveId,pairId:current?.activePairId() ?? null,trigger:edit,draft:draft || null});
|
||
});
|
||
scope.listen(send,'click',()=>{const roles=current?.sendRoles();if(roles)sender.open(roles,send);});
|
||
function reconciled(result,context) {
|
||
rememberLibraryResult(result);rememberUnappliedMetadata(result,context);
|
||
const message=outcomeMessage(result,context?.outcome),id=result.detail.positive.id;
|
||
if(message) showWorkspaceToast(message);
|
||
if(id!==positiveId) {focusHeadingOnMount=true;window.location.hash=`#/library/${id}`;return;}
|
||
pendingSelection=takeSavedSelection(positiveId);
|
||
if(current) current.apply(result);else loader.load(positiveId);
|
||
focusHeading(main);
|
||
}
|
||
/** The Archived notice: Restore takes the prompt off the archive, then the page reads it again. */
|
||
function archivedNotice(content,shown) {
|
||
const notice=el('div',undefined,'notice library-archived-notice'),copy=el('div'),row=el('div',undefined,'row-actions');
|
||
const status=el('p','','small');status.setAttribute('role','status');status.hidden=true;
|
||
const restore=createButton('Restore');restore.setAttribute('aria-label','Restore this prompt to the Prompt library');
|
||
copy.append(el('h2','Archived'),el('p',archivedNoticeText(shown.positive.variant_count)),status);row.append(restore);notice.append(copy,row);
|
||
content.listen(restore,'click',async()=>{
|
||
if(restore.getAttribute('aria-disabled')==='true') return;
|
||
restore.setAttribute('aria-disabled','true');status.hidden=true;
|
||
let result=null,failure=null;
|
||
try {result=await api.post(RESTORE_URL,{prompt_ids:[shown.positive.id],expected_epoch:shown.library_epoch});} catch(error) {failure=error;}
|
||
const outcome=restoreOutcome(result,failure);
|
||
if(outcome.committed) invalidateLibraryAfterWrite({kind:'bulk-restore',receipt:result?.success?result:{phase:'unconfirmed'}});
|
||
if(content.signal.aborted) return;
|
||
restore.removeAttribute('aria-disabled');
|
||
if(outcome.reload) {showWorkspaceToast(outcome.toast);detail=null;loader.load(positiveId);focusHeading(main);return;}
|
||
status.textContent=outcome.toast;status.hidden=false;
|
||
});
|
||
return notice;
|
||
}
|
||
/** Explicit exit after restored storage: dispose the recorded view, then remount with a fresh visit. */
|
||
function reloadView() {
|
||
writeGeneration++;shelfVisit=shelfVisit && {filters:shelfVisit.filters,anchor:null};
|
||
pendingSelection=null;savedSelections.delete(positiveId);selectedPairs.delete(positiveId);metadataDrafts.delete(positiveId);
|
||
current=null;contentScope?.dispose();contentScope=null;historyVisits.delete(positiveId);
|
||
loader.load(positiveId);focusHeading(main);
|
||
}
|
||
function render(state) {
|
||
if(detail && state.detail && !state.loading && !state.error) {detail=state.detail;updateParent();updateBranches(state);return;}
|
||
contentScope?.dispose();contentScope=createScope();detail=null;updateBranches=null;updateParent=null;current=null;send.disabled=true;
|
||
blocks?.dispose();blocks=null;galleryScope?.dispose();galleryScope=null;body.replaceChildren();
|
||
// #512: a prompt that no longer exists (deleted, or a stale link) says so, with the way back; no Retry.
|
||
// Edit metadata and ⋯ act on a loaded prompt only (review M2).
|
||
const hadFocus=[edit,moreMenu.button].includes(document.activeElement);
|
||
const loaded=!state.loading && !state.error;edit.disabled=!loaded;moreMenu.setDisabled(!loaded);
|
||
if(state.error?.status===404) {
|
||
const message=el('p',PROMPT_GONE,'library-status');message.setAttribute('role','status');body.append(message);
|
||
const open=createButton('Open the Prompt library');contentScope.listen(open,'click',()=>{window.location.hash='#/library';});body.append(open);
|
||
// A focused control that was just disabled hands focus to the way back (review M3).
|
||
if(hadFocus) open.focus({preventScroll:true});
|
||
return;
|
||
}
|
||
if(state.loading || state.error) {
|
||
const message=el('p',state.loading?'Loading prompt history…':'Prompt history could not be loaded.','library-status');message.setAttribute('role',state.error?'alert':'status');body.append(message);
|
||
if(state.error) {const retry=createButton('Retry prompt history');contentScope.listen(retry,'click',()=>loader.load(positiveId));body.append(retry);}return;
|
||
}
|
||
detail=state.detail;const content=contentScope;
|
||
// The concept summary (app.js a598): category chip, positive and selected negative blocks, then the counts (D24).
|
||
const summary=el('article',undefined,'surface');const categoryChip=el('span','','chip');summary.append(categoryChip);
|
||
const promptContainer=el('div');promptContainer.setAttribute('role','region');promptContainer.setAttribute('aria-label','Saved prompt texts');summary.append(promptContainer);
|
||
const meta=el('div',undefined,'card-meta'),runsMeta=el('span'),imagesMeta=el('span'),variantsMeta=el('span');runsMeta.hidden=true;
|
||
meta.append(runsMeta,imagesMeta,variantsMeta);summary.append(meta);
|
||
const parentStatus=el('p','','library-parent-status muted');parentStatus.hidden=true;parentStatus.setAttribute('role','status');
|
||
const retryParent=createButton('Retry saved Library details'),reloadSaved=createButton('Reload saved Library view');retryParent.hidden=reloadSaved.hidden=true;summary.append(parentStatus,retryParent,reloadSaved);
|
||
const ownerText=detail.positive.text;let savedReadState='current',parentRequest,parentGeneration=0;
|
||
content.cleanup(()=>{parentGeneration++;parentRequest?.abort();});
|
||
const all=createButton('All images for this positive');
|
||
// The concept's negative variants panel (app.js a598, style.css 1059-1154): heading, the lanes, then the legend.
|
||
const variants=el('section',undefined,'surface timeline-panel');variants.setAttribute('aria-label','Saved negative variants');
|
||
const panelHeading=el('div',undefined,'panel-heading'),panelCopy=el('div'),rowActions=el('div',undefined,'row-actions');
|
||
panelCopy.append(el('h2','Negative variants'),el('p','Choose a red dot to change the negative and filter this gallery.','small'));
|
||
// Compare negatives (aria-pressed) opens the comparison section below; Show archived is the approved #235 addition.
|
||
const compare=createButton('Compare negatives'),addNegative=createButton('+ Add negative'),showArchived=createButton('');
|
||
compare.setAttribute('aria-pressed','false');showArchived.setAttribute('aria-pressed','false');
|
||
rowActions.append(compare,addNegative,showArchived);panelHeading.append(panelCopy,rowActions);variants.append(panelHeading);
|
||
content.listen(compare,'click',()=>{compare.setAttribute('aria-pressed',String(compare.getAttribute('aria-pressed')!=='true'));updateCompare();});
|
||
// The concept's comparison (app.js a599-616, style.css 1155-1179): after the timeline panel, the baseline (the oldest
|
||
// active variant, D25) beside the selected negative, then its added terms. Another dot updates it in place.
|
||
const compareSection=el('section',undefined,'surface');let compareBlocks=[],compareKey=null;
|
||
const disposeCompareBlocks=()=>{for(const item of compareBlocks)item.dispose();compareBlocks=[];};
|
||
content.cleanup(disposeCompareBlocks);
|
||
function compareBlock(text,label) {
|
||
// The concept's `.compare-item` holds the block itself; the blocks mount in a transparent child (D25).
|
||
const item=el('div',undefined,'compare-item'),mount=el('div');item.append(mount);
|
||
// D46: the two blocks are named Baseline and Selected, so no region or action name repeats on the page.
|
||
compareBlocks.push(mountPromptBlocks(mount,{prompts:{negative:{status:'resolved',text,source:'library'}},roles:['negative'],sender,parentScope:content,includePairAction:false,contextLabel:label,title:displayTitle(detail.positive)}));
|
||
compareBlocks.at(-1).setState({prompts:{negative:{status:'resolved',text,source:'library'}},actionsEnabled:savedReadState==='current'});
|
||
return item;
|
||
}
|
||
function updateCompare() {
|
||
if(detail.variant_total===0) compare.setAttribute('aria-pressed','false');
|
||
compare.disabled=detail.variant_total===0;
|
||
if(compare.getAttribute('aria-pressed')!=='true') {compareSection.remove();disposeCompareBlocks();compareKey=null;return;}
|
||
if(variants.nextSibling!==compareSection) variants.after(compareSection);
|
||
// D46: the oldest active variant may sit on an unloaded page; the baseline is never guessed from the newest lanes.
|
||
const baseline=detail.variants_has_more?null:detail.variants.reduce((oldest,variant)=>!oldest || variant.id<oldest.id?variant:oldest,null);
|
||
const lane=[...lanes.values()].find(item=>item.entry.variant.id===activePairId) || [...lanes.values()].find(item=>item.entry.variant.id===baseline?.id);
|
||
const selected=(activePairId!==null && activePairId!==undefined && recordFor(activePairId)) || baseline;
|
||
const name=lane?laneName(lane.entry):'';
|
||
const key=JSON.stringify([baseline?.id,baseline?.negative_text,selected?.id,selected?.negative_text,name,displayTitle(detail.positive),savedReadState]);
|
||
if(key===compareKey) return;
|
||
compareKey=key;disposeCompareBlocks();compareSection.replaceChildren(el('h2','Compare negative variants'));
|
||
if(!baseline || !selected) {compareSection.append(el('p','Load more negative variants to reach the baseline.','small'));return;}
|
||
const grid=el('div',undefined,'compare-grid');grid.append(compareBlock(baseline.negative_text,'Baseline'),compareBlock(selected.negative_text,'Selected'));
|
||
compareSection.append(el('p',`Baseline compared with ${name}. Choose another red dot to change the comparison.`),grid,el('p','Added terms','small'));
|
||
const terms=addedTerms(baseline.negative_text,selected.negative_text);
|
||
if(terms.length) for(const term of terms) compareSection.append(el('span',`+ ${term}`,'diff-added'));
|
||
else compareSection.append(el('p','No added terms.','small'));
|
||
}
|
||
const branches=el('div',undefined,'timeline');const positiveLane=el('div',undefined,'positive-lane');positiveLane.append(el('span','Positive prompt · unchanged'));branches.append(positiveLane);
|
||
const lanes=new Map();const emptyNote=el('p','No saved negative variants. Existing image associations remain available.','muted');
|
||
// D45: the bounded page count stays a status for assistive technology; the concept shows no count line.
|
||
const variantCount=el('p','','ca-visually-hidden');variantCount.setAttribute('role','status');
|
||
const variantError=el('p','','muted');variantError.setAttribute('role','alert');variantError.hidden=true;
|
||
const restoreStatus=el('p','','muted library-restore-status');restoreStatus.setAttribute('role','alert');restoreStatus.hidden=true;
|
||
const restoreAction=createButton('');restoreAction.hidden=true;let restoreHandler=null;
|
||
content.listen(restoreAction,'click',()=>restoreHandler?.());
|
||
const more=createButton('Load more negative variants');const retry=createButton('Retry negative variants');retry.hidden=true;
|
||
const archivedLoader=createLibraryDetail({api,onChange:()=>{if(!content.signal.aborted)updateBranches(loader.state);},archive:'archived'});content.cleanup(()=>archivedLoader.dispose());
|
||
const restoringPairs=new Set();
|
||
let archivedShown=archivedVisible.get(positiveId)===true,archivedStale=false;
|
||
const archivedList=()=>archivedShown?archivedLoader.state.detail?.variants || []:[];
|
||
const separate=()=>{const pair=selectedPairs.get(positiveId);return pair && !detail.variants.some(variant=>variant.id===pair.id) && !archivedList().some(variant=>variant.id===pair.id)?pair:null;};
|
||
const moreTarget=()=>detail.variants_has_more?loader:archivedShown && archivedLoader.state.detail?.variants_has_more?archivedLoader:null;
|
||
content.listen(more,'click',()=>{if(savedReadState==='current')moreTarget()?.loadMore();});
|
||
content.listen(retry,'click',()=>{
|
||
if(savedReadState!=='current') return;
|
||
if(archivedLoader.state.error) archivedLoader.load(positiveId);else if(archivedLoader.state.variantsError) archivedLoader.loadMore();else loader.loadMore();
|
||
});
|
||
content.listen(addNegative,'click',()=>editor.open({mode:'negative',positiveId,trigger:addNegative}));
|
||
content.listen(showArchived,'click',()=>{
|
||
archivedShown=!archivedShown;archivedVisible.set(positiveId,archivedShown);
|
||
// A write while hidden makes the loaded archived list stale; reread it when it is shown again.
|
||
if(archivedShown && (archivedStale || (!archivedLoader.state.detail && !archivedLoader.state.loading))) {archivedStale=false;archivedLoader.load(positiveId);}
|
||
if(!archivedShown && archivedList().every(variant=>variant.id!==activePairId) && detail.variants.every(variant=>variant.id!==activePairId) && separate()?.id!==activePairId) select(null);
|
||
updateBranches(loader.state);
|
||
});
|
||
function laneName(entry) {
|
||
const {variant}=entry;
|
||
return variant.title || (variant.negative_text===''?'Explicitly empty negative':entry.kind==='separate'?'Selected saved negative variant':`Negative variant ${entry.number}`);
|
||
}
|
||
function laneEntries() {
|
||
const entries=detail.variants.map((variant,index)=>({key:`active:${variant.id}`,kind:'active',variant,number:index+1}));
|
||
const loadedArchived=archivedList(),outside=separate();
|
||
// Archived numbers follow the active total; a pair outside the loaded archived page follows them, so names stay unique.
|
||
if(outside) entries.push({key:`${outside.archived?'archived':'separate'}:${outside.id}`,kind:outside.archived?'archived':'separate',variant:outside,number:detail.variant_total+loadedArchived.length+1});
|
||
for(const [index,variant] of loadedArchived.entries()) entries.push({key:`archived:${variant.id}`,kind:'archived',variant,number:detail.variant_total+index+1});
|
||
return entries;
|
||
}
|
||
/** D45: a dot names its pair by a title no other loaded lane shares, else by its number, so every name is unique. */
|
||
// Titles compare trimmed (accessible names are whitespace-normalized), and a title that reads like a fallback
|
||
// "variant N" is never used, so it cannot collide with an untitled lane's name.
|
||
const trimmedTitle=variant=>typeof variant.title==='string'?variant.title.trim():'';
|
||
function dotName(entry,entries) {
|
||
const title=trimmedTitle(entry.variant);
|
||
return title && !/^variant\s+\d+$/i.test(title) && entries.filter(other=>trimmedTitle(other.variant)===title).length===1?title:`variant ${entry.number}`;
|
||
}
|
||
const runCount=variant=>Number.isSafeInteger(variant.run_count) && variant.run_count>0?variant.run_count:0;
|
||
function laneFor(entry) {
|
||
let lane=lanes.get(entry.key);
|
||
if(!lane) {
|
||
// Concept lane (app.js a598): the "−" dot, "<name> · N runs", then the repeat-run dot (D26).
|
||
const node=el('div',undefined,`variant-lane${entry.kind==='archived'?' library-variant-archived':''}`);const button=createButton('−','variant-dot');const label=el('span');
|
||
const runDot=createButton('','run-dot');runDot.hidden=true;
|
||
node.append(button,label,runDot);lane={node,button,label,runDot,text:document.createTextNode(''),entry};label.append(lane.text);
|
||
if(entry.kind==='archived') {lane.restore=createButton('Restore','library-variant-restore');label.append(lane.restore);content.listen(lane.restore,'click',()=>restorePair(lane.entry.variant.id,lane.restore));}
|
||
content.listen(button,'click',()=>select(lane.entry.variant.id));content.listen(runDot,'click',()=>openRunDot(lane));lanes.set(entry.key,lane);
|
||
}
|
||
lane.entry=entry;return lane;
|
||
}
|
||
updateBranches=state=>{
|
||
const entries=laneEntries(),keep=new Set(entries.map(entry=>entry.key)),active=document.activeElement;
|
||
for(const [key,lane] of lanes) if(!keep.has(key)) {lane.node.remove();lanes.delete(key);}
|
||
let previous=positiveLane;
|
||
for(const [index,entry] of entries.entries()) {
|
||
const lane=laneFor(entry),name=laneName(entry);
|
||
lane.node.style.setProperty('--lane-offset',`${38+index*47}px`);
|
||
const named=entry.kind==='separate'?'the saved negative variant outside the loaded list':dotName(entry,entries);
|
||
lane.button.setAttribute('aria-label',entry.kind==='separate'?'Select the saved negative variant outside the loaded list':`Select negative ${named}`);
|
||
lane.button.setAttribute('aria-pressed',String(activePairId===entry.variant.id));lane.button.disabled=savedReadState!=='current';
|
||
lane.text.textContent=`${name} · ${countOf(runCount(entry.variant),'run')}${entry.kind==='archived'?' · Archived':''}`;
|
||
// D26: the small dot appears only for a pair counted more than once.
|
||
lane.runDot.hidden=runCount(entry.variant)<=1;lane.runDot.setAttribute('aria-label',`Show repeat run for ${named}`);lane.runDot.disabled=savedReadState!=='current';
|
||
if(lane.restore) {lane.restore.setAttribute('aria-label',`Restore ${name}`);lane.restore.disabled=savedReadState!=='current' || restoringPairs.has(entry.variant.id);}
|
||
if(previous.nextSibling!==lane.node) previous.after(lane.node);
|
||
previous=lane.node;
|
||
}
|
||
if(active?.isConnected && document.activeElement!==active) active.focus({preventScroll:true});
|
||
emptyNote.hidden=entries.length>0;
|
||
variantCount.textContent=`${detail.variants.length} of ${countOf(detail.variant_total,'saved negative variant')}`;
|
||
const archivedState=archivedLoader.state,target=moreTarget();
|
||
const loadError=state.variantsError || (archivedShown && (archivedState.error || archivedState.variantsError));
|
||
more.hidden=!target || !!loadError;more.setAttribute('aria-disabled',String(state.loadingVariants || archivedState.loading || archivedState.loadingVariants || savedReadState!=='current'));retry.hidden=!loadError;
|
||
more.disabled=retry.disabled=savedReadState!=='current';all.disabled=savedReadState!=='current';addNegative.disabled=savedReadState!=='current';
|
||
variantError.hidden=!loadError;variantError.textContent=!loadError?'':state.variantsError?'Negative variants could not be loaded. Retry to continue.':'Archived negative variants could not be loaded. Retry to continue.';
|
||
const archivedCount=Number.isSafeInteger(detail.positive.archived_variant_count)?detail.positive.archived_variant_count:0;
|
||
showArchived.textContent=`Show archived (${archivedCount})`;showArchived.setAttribute('aria-pressed',String(archivedShown));
|
||
updateCompare();updateGalleryContext();
|
||
};
|
||
const updateMeta=()=>{imagesMeta.textContent=countOf(detail.positive.image_count ?? 0,'image');variantsMeta.textContent=countOf(detail.positive.variant_count ?? 0,'negative variant');};
|
||
updateParent=()=>{
|
||
const name=displayTitle(detail.positive);
|
||
main.querySelector('h1').textContent=name;categoryChip.textContent=detail.positive.category || 'Uncategorized';updateMeta();
|
||
send.setAttribute('aria-label',`Send prompt pair to ComfyUI: ${name}`);blocks?.setTitle(name);
|
||
};
|
||
let activePairId;
|
||
updateParent();updateBranches(state);
|
||
branches.append(emptyNote);
|
||
const lower=el('div',undefined,'timeline-lower');lower.append(el('span','Green + positive · red − negative · small dot repeat run','small'),all);
|
||
variants.append(branches,variantCount,variantError,restoreStatus,restoreAction,more,retry,lower);
|
||
// The concept's shared gallery (app.js a616-621): its heading names the selected variant; the embedded
|
||
// collection renders the PR C media cards. Recorded executions (#209) stay below it.
|
||
const context=el('span','','small');context.setAttribute('role','status');
|
||
const galleryTitle=el('h2','Shared gallery');galleryTitle.tabIndex=-1;
|
||
const galleryHeading=el('div',undefined,'panel-heading');galleryHeading.append(galleryTitle,context);
|
||
const gallery=el('section',undefined,'history-gallery');gallery.setAttribute('aria-label','Shared gallery');gallery.append(galleryHeading);
|
||
const images=el('div',undefined,'library-linked-images');gallery.append(images);
|
||
const recorded=el('div',undefined,'library-recorded-container');
|
||
// #443 D152: an archived prompt's page says so first, with Restore (the concept's `.notice`).
|
||
if(detail.positive.archived===true) body.append(archivedNotice(content,detail));
|
||
body.append(summary,variants,gallery,recorded);
|
||
const recordFor=pairId=>detail.variants.find(variant=>variant.id===pairId) || archivedList().find(variant=>variant.id===pairId) || (separate()?.id===pairId?separate():null);
|
||
const archivedSelection=pairId=>archivedList().some(variant=>variant.id===pairId) || (separate()?.id===pairId && separate().archived===true);
|
||
function rolesFor(pairId) {
|
||
if(pairId===null || detail.variants.some(variant=>variant.id===pairId)) return libraryPromptRoles(detail,pairId);
|
||
const outside=separate();if(outside?.id===pairId) return libraryPromptRoles(detail,pairId,outside);
|
||
return libraryPromptRoles({...detail,variants:[...detail.variants,...archivedList()]},pairId);
|
||
}
|
||
function updateSend() {
|
||
const roles=activePairId===null || activePairId===undefined?{}:promptRoles(rolesFor(activePairId));
|
||
send.disabled=savedReadState!=='current' || !Object.hasOwn(roles,'positive') || !Object.hasOwn(roles,'negative');
|
||
}
|
||
function setParentState(parent) {
|
||
if(content.signal.aborted || (!parent.loading && !parent.error && !parent.detail)) return;
|
||
parentStatus.hidden=false;parentStatus.setAttribute('role',parent.error?'alert':'status');retryParent.hidden=true;reloadSaved.hidden=true;
|
||
if(parent.loading) {savedReadState='validating';parentStatus.textContent='Revalidating saved Library details…';}
|
||
else if(parent.error) {savedReadState='error';parentStatus.textContent='Saved Library details could not be revalidated. The saved selection and gallery have been retained.';retryParent.hidden=false;}
|
||
else {
|
||
const fresh=parent.detail;
|
||
if(fresh.positive.id!==positiveId || fresh.positive.text!==ownerText) {
|
||
savedReadState='stale';parentStatus.textContent='Saved Library owner changed. This view retains the previous prompt and gallery. Reload the saved Library view to inspect current data.';reloadSaved.hidden=false;
|
||
} else {
|
||
const observed=new Map(fresh.variants.map(variant=>[variant.id,variant]));const loaded=new Set(detail.variants.map(variant=>variant.id));const additional=fresh.variants.some(variant=>!loaded.has(variant.id));let changed=false,unobserved=false;
|
||
const variants=detail.variants.map(variant=>{
|
||
const current=observed.get(variant.id);
|
||
if(!current) {unobserved=true;return variant;}
|
||
if(current.negative_text!==variant.negative_text || current.explicit_empty!==variant.explicit_empty) {changed=true;return variant;}
|
||
return {...variant,...current};
|
||
});
|
||
detail={...detail,positive:fresh.positive,variants};categoryChip.textContent=fresh.positive.category || 'Uncategorized';updateMeta();
|
||
savedReadState=changed || unobserved || additional?'stale':'current';
|
||
parentStatus.textContent=changed?'A saved negative changed identity. This view retains its previous selection and gallery. Reload the saved Library view to inspect current data.':unobserved?(fresh.variants_has_more?'Some loaded saved negatives were not observed in this bounded revalidation page. Reload the saved Library view to validate them.':'Some loaded saved negatives were not present in the revalidation result. This view retains its previous selection and gallery.'):additional?'Saved Library choices changed. This view retains its previous selection and gallery. Reload the saved Library view to inspect current choices.':'Saved Library details revalidated.';
|
||
reloadSaved.hidden=savedReadState==='current';
|
||
}
|
||
}
|
||
updateBranches(loader.state);blocks?.setState({prompts:rolesFor(activePairId ?? null),actionsEnabled:savedReadState==='current'});updateSend();
|
||
}
|
||
async function retrySavedParent() {
|
||
parentRequest?.abort();const request=parentRequest=new AbortController(),generation=++parentGeneration;setParentState({loading:true});
|
||
try {
|
||
const fresh=await api.get(`/prompt_manager/library/${positiveId}?variant_limit=40`,{signal:request.signal});
|
||
if(content.signal.aborted || generation!==parentGeneration) return;
|
||
if(!fresh?.positive || !Number.isSafeInteger(fresh.positive.id) || typeof fresh.positive.text!=='string' || !Array.isArray(fresh.variants) || fresh.variants.some(variant=>!Number.isSafeInteger(variant.id) || typeof variant.negative_text!=='string' || typeof variant.explicit_empty!=='boolean' || variant.explicit_empty!==(variant.negative_text===''))) throw new TypeError('Invalid saved Library details');
|
||
setParentState({detail:fresh});
|
||
} catch(error) {if(!content.signal.aborted && generation===parentGeneration)setParentState({error});}
|
||
}
|
||
content.listen(retryParent,'click',retrySavedParent);content.listen(reloadSaved,'click',()=>{pendingSelection=null;loader.load(positiveId);});
|
||
if(!historyVisits.has(positiveId)) historyVisits.set(positiveId,{});
|
||
const recordedView=mountRecordedHistory(recorded,{api,positiveId,parentScope:content,sender,visit:historyVisits.get(positiveId),onParentRevalidate:parent=>{
|
||
if(content.signal.aborted) return;parentGeneration++;parentRequest?.abort();setParentState(parent);
|
||
},onRecordedCount:count=>{runsMeta.hidden=count===null;runsMeta.textContent=count===null?'':countOf(count,'tracked run');}});
|
||
// The heading carries the pair send, as in the concept; the saved texts keep their per-role actions.
|
||
blocks=mountPromptBlocks(promptContainer,{prompts:libraryPromptRoles(detail),sender,parentScope:content,includePairAction:false,title:displayTitle(detail.positive)});
|
||
/** The gallery heading's "<name> · same positive prompt" with the lane's own name, renamed with it (D47). */
|
||
// With no saved variant the page shows every image of the positive, a state the concept never reaches.
|
||
function updateGalleryContext() {
|
||
if(activePairId===undefined) return;
|
||
const lane=[...lanes.values()].find(item=>item.entry.variant.id===activePairId);
|
||
const archived=activePairId!==null && archivedSelection(activePairId);
|
||
context.textContent=activePairId===null?'All images for this positive, including unassigned images. Choose a saved negative variant to inspect or send it.':`${lane?laneName(lane.entry):'Selected saved negative variant'}${archived?' · Archived':''} · same positive prompt`;
|
||
}
|
||
function select(pairId,{force=false}={}) {
|
||
if(savedReadState!=='current' || (!force && galleryScope && activePairId===pairId)) return;
|
||
if(pairId!==null && !recordFor(pairId)) pairId=null;
|
||
activePairId=pairId;blocks.setState({prompts:rolesFor(pairId),actionsEnabled:true});
|
||
for(const lane of lanes.values()) lane.button.setAttribute('aria-pressed',String(lane.entry.variant.id===pairId));
|
||
const archived=pairId!==null && archivedSelection(pairId);
|
||
updateGalleryContext();
|
||
galleryScope?.dispose();galleryScope=createScope();images.replaceChildren();
|
||
// An archived pair's images are read in the archived scope; the gallery stays authoritative. The
|
||
// embedded collection has no caption: the gallery heading names it (D47).
|
||
mountImages(images,api,galleryScope,{embedded:true,focusTarget:galleryTitle,emptyText:pairId===null?undefined:'Saved variant · no runs yet.',fetchPage:({parameters,signal})=>{const query=new URLSearchParams(parameters);if(pairId!==null) query.set('pair_id',String(pairId));if(archived) query.set('archive','archived');return api.get(`/prompt_manager/library/${positiveId}/images?${query}`,{signal});}});
|
||
updateSend();updateCompare();
|
||
}
|
||
/** A metadata receipt names no pair, so the page re-reads its own selection through the exact-ID route. */
|
||
async function rereadSelectedPair() {
|
||
const pairId=activePairId;if(pairId===null || pairId===undefined) return;
|
||
try {
|
||
const value=await api.get(`/prompt_manager/pairs/${pairId}`,{signal:content.signal,cache:'no-store'});
|
||
const pair=value?.pair;
|
||
if(content.signal.aborted || activePairId!==pairId || pair?.id!==pairId || pair.positive_prompt_id!==positiveId || pair.positive_text!==detail.positive.text || typeof pair.negative_text!=='string') return;
|
||
if(!detail.variants.some(variant=>variant.id===pairId) && !archivedList().some(variant=>variant.id===pairId)) {selectedPairs.set(positiveId,pair);updateBranches(loader.state);}
|
||
blocks.setState({prompts:rolesFor(pairId),actionsEnabled:savedReadState==='current'});updateSend();
|
||
} catch {
|
||
// The previous verified selection stays; a later explicit action reads it again.
|
||
}
|
||
}
|
||
function showRestoreProblem(text,label,handler) {
|
||
restoreStatus.textContent=text;restoreStatus.hidden=!text;restoreHandler=handler;restoreAction.textContent=label || '';restoreAction.hidden=!label;
|
||
}
|
||
/** Restore through the editor controller's fenced pair path; nothing restores silently. */
|
||
async function restorePair(pairId,button) {
|
||
// A rebuilt lane must not offer a second Restore while this one is in flight.
|
||
if(restoringPairs.has(pairId)) return;
|
||
restoringPairs.add(pairId);showRestoreProblem('');button.disabled=true;
|
||
const controller=createLibraryEditorController({api,mode:'metadata',positiveId,pairId,onCommitted:invalidateLibraryAfterWrite,onReconciled:result=>{
|
||
rememberLibraryResult(result);pendingSelection=takeSavedSelection(positiveId);apply(result);
|
||
const dot=[...lanes.values()].find(lane=>lane.entry.kind!=='archived' && lane.entry.variant.id===pairId)?.button;dot?.focus();
|
||
}});
|
||
content.cleanup(()=>controller.dispose());
|
||
const settle=()=>{
|
||
const {phase,error}=controller.state;
|
||
if(phase==='complete' || phase==='disposed' || content.signal.aborted) return;
|
||
if(button.isConnected) button.disabled=savedReadState!=='current';
|
||
if(phase==='storage-changed' || (phase==='saved-refresh-error' && error?.code==='storage-changed')) showRestoreProblem(phase==='storage-changed'?'Prompt storage was restored since this view loaded. Nothing was restored.':'Restored; Library refresh failed because prompt storage was restored. Reload the Library to see current data.','Reload Library',reloadView);
|
||
else if(phase==='saved-refresh-error') showRestoreProblem('Restored; Library refresh failed.','Retry refresh',async()=>{await controller.retryReconciliation();settle();});
|
||
else if(phase==='unknown-outcome') showRestoreProblem('Restore could not be confirmed. Retry sends the same restore once.','Retry',async()=>{await controller.retryUnconfirmed();settle();});
|
||
else showRestoreProblem(`Not restored: ${error?.message || 'The saved negative variant could not be read.'}`);
|
||
};
|
||
try {
|
||
await controller.initialize();
|
||
if(controller.state.phase==='ready') await controller.setArchive(false);
|
||
} finally {
|
||
restoringPairs.delete(pairId);if(!content.signal.aborted) updateBranches(loader.state);
|
||
}
|
||
settle();
|
||
}
|
||
/** Same-parent reconciliation from one authoritative result; the separately verified pair stays outside the page. */
|
||
function apply(result) {
|
||
const kind=result.commit.kind,pair=result.pair,previous=detail.variants.map(variant=>variant.id);
|
||
// An authoritative reconciled read supersedes any stale or pending revalidation.
|
||
parentGeneration++;parentRequest?.abort();savedReadState='current';
|
||
parentStatus.hidden=true;parentStatus.textContent='';retryParent.hidden=reloadSaved.hidden=true;
|
||
loader.accept(result.detail);
|
||
// A reused archived pair is shown where it lives, under Show archived; archiving itself never turns the toggle on.
|
||
if(pair?.archived && kind!=='archive-pair') {archivedShown=true;archivedVisible.set(positiveId,true);}
|
||
if(archivedShown) archivedLoader.load(positiveId);else archivedStale=true;
|
||
if(kind==='metadata') {rereadSelectedPair();return;}
|
||
if(kind==='archive-pair') {
|
||
if(selectedPairs.get(positiveId)?.id===pair.id) selectedPairs.delete(positiveId);
|
||
const index=previous.indexOf(pair.id),next=detail.variants[Math.min(Math.max(index,0),detail.variants.length-1)];
|
||
select(next?.id ?? null,{force:true});return;
|
||
}
|
||
if(pair) select(pair.id,{force:true});
|
||
}
|
||
current={activePairId:()=>activePairId ?? null,sendRoles:()=>{const roles=activePairId===null || activePairId===undefined?{}:promptRoles(rolesFor(activePairId));return Object.hasOwn(roles,'positive') && Object.hasOwn(roles,'negative')?roles:null;},apply};
|
||
/** A bounded media dialog (D26): its gallery lives until the dialog closes or the view goes. */
|
||
// One slot: each open replaces the previous dialog's scope, so repeated opens never pile up cleanups.
|
||
let imagesDialogScope=null;content.cleanup(()=>{imagesDialogScope?.dispose();imagesDialogScope=null;});
|
||
function openImagesDialog({title,intro,className,fetchPage,trigger}) {
|
||
imagesDialogScope?.dispose();
|
||
const dialogScope=createScope();imagesDialogScope=dialogScope;
|
||
const grid=el('div',undefined,className);
|
||
openContentDialog({scope:content,title,nodes:intro?[el('p',intro,'small'),grid]:[grid],trigger,onClose:()=>{dialogScope.dispose();if(imagesDialogScope===dialogScope) imagesDialogScope=null;}});
|
||
// D47: the dialog's own title names its images, as in the concept (a1282-1304), so the collection has no
|
||
// "Linked images" heading or count; a stranded focus returns to the dialog's close button.
|
||
mountImages(grid,api,dialogScope,{embedded:true,focusTarget:grid.closest('dialog')?.querySelector('.dialog-header > button') ?? null,fetchPage});
|
||
}
|
||
const imagesPage=(id,query,signal)=>api.get(`/prompt_manager/library/${id}/images?${query}`,{signal});
|
||
/** Concept "All images for this positive" (a1282-1290): every image of the positive, Load more bounded. */
|
||
function openAllImagesDialog(id,trigger) {
|
||
openImagesDialog({title:'All images for this positive',trigger,fetchPage:({parameters,signal})=>imagesPage(id,new URLSearchParams(parameters),signal)});
|
||
}
|
||
/** Concept "Repeat run" (a1291-1304): the pair's newest linked image only. */
|
||
function openRepeatRun(pair,trigger) {
|
||
openImagesDialog({title:'Repeat run',intro:'Same positive and negative, another execution.',className:'spaced-15',trigger,fetchPage:async({parameters,signal})=>{
|
||
const query=new URLSearchParams(parameters);query.set('pair_id',String(pair.id));query.set('limit','1');query.delete('cursor');
|
||
if(pair.archived===true) query.set('archive','archived');
|
||
const page=await imagesPage(positiveId,query,signal),images=Array.isArray(page?.images)?page.images.slice(0,1):page?.images;
|
||
return {...page,images,total:Array.isArray(images)?images.length:page?.total,has_more:false,next_cursor:null};
|
||
}});
|
||
}
|
||
/** D26: the run dot opens Recorded run for the pair's newest recorded execution, else Repeat run. */
|
||
const runLookups=new Set();
|
||
async function openRunDot(lane) {
|
||
const pair=lane.entry.variant,trigger=lane.runDot;
|
||
if(savedReadState!=='current' || runLookups.has(pair.id)) return;
|
||
runLookups.add(pair.id);let run=null,failed=false;
|
||
try {
|
||
const value=await api.get(`/prompt_manager/library/${positiveId}/history/pairs/${pair.id}/newest`,{signal:content.signal,cache:'no-store'});
|
||
run=value?.run && typeof value.run.run_id==='string'?value.run:null;
|
||
} catch {
|
||
failed=true;
|
||
} finally {runLookups.delete(pair.id);}
|
||
// The view may have gone stale while the lookup was in flight; a stale view opens nothing.
|
||
if(content.signal.aborted || savedReadState!=='current') return;
|
||
if(run && recordedView.openRun({runId:run.run_id,anchorId:run.anchor_id ?? null,contextId:run.context_id ?? null,trigger})) return;
|
||
if(failed) showWorkspaceToast('Recorded runs could not be read. Showing the newest linked image.');
|
||
openRepeatRun(pair,trigger);
|
||
}
|
||
content.listen(all,'click',()=>openAllImagesDialog(positiveId,all));
|
||
const remembered=pendingSelection,outside=selectedPairs.get(positiveId);pendingSelection=null;
|
||
if(outside?.archived && outside.id===remembered && !archivedShown) {archivedShown=true;archivedVisible.set(positiveId,true);}
|
||
if(archivedShown) archivedLoader.load(positiveId);
|
||
// Open on the first negative variant (concept navigate: state.variant = 0) unless a save just named a pair.
|
||
let initial=detail.variants[0]?.id ?? null;
|
||
if(detail.variants.some(variant=>variant.id===remembered)) initial=remembered;
|
||
else if(outside && outside.id===remembered) {try {libraryPromptRoles(detail,remembered,outside);initial=remembered;} catch {selectedPairs.delete(positiveId);}}
|
||
updateBranches(state);select(initial);
|
||
}
|
||
loader.load(positiveId);
|
||
}
|
||
}
|