towsty/aigen
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Add Prompt Builder sets/framing and harden mobile draft look settings.

Browse Source 
Sets and beats filter by shot size; scenes reorder/delete; portrait links Prompt Builder; landscape queue collapses; per-engine look settings and prompt Clear persist across iOS resumes.
This commit is contained in:
Towsty
2026-10-03 19:31:22 -05:00
parent 7799529788
commit a8ae61704e
9 changed files with 1441 additions and 760 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/display.css
+22
View File
@@ -686,6 +686,10 @@
flex-direction: column;
}
.queue-col[data-collapsed='1'] {
min-width: 0;
}
.queue-head {
display: flex;
flex-shrink: 0;
@@ -695,6 +699,24 @@
font-weight: 650;
}
.queue-toggle {
display: inline-flex;
align-items: center;
gap: 8px;
border: 0;
background: transparent;
color: inherit;
font: inherit;
font-weight: 650;
cursor: pointer;
padding: 0;
}
.queue-toggle-mark {
color: var(--muted);
font-size: 12px;
}
.queue-badge {
display: inline-grid;
min-width: 1.25rem;
components/studio2/Bench.vue
+105 -31
View File
@@ -120,7 +120,10 @@
</div>
<label>
<span class="field-label">Prompt</span>
<span class="field-label flex items-center justify-between gap-2">
Prompt
<button type="button" class="text-[11px] font-normal text-[var(--muted)] hover:text-[var(--amber)]" @click.prevent="clearPrompt">Clear</button>
</span>
<textarea
ref="promptArea"
v-model="form.promptSections.action"
@@ -373,12 +376,15 @@
</section>
<!-- RIGHT queue -->
<aside class="bench-panel queue-col">
<aside class="bench-panel queue-col" :data-collapsed="queueCollapsed ? '1' : undefined">
<div class="queue-head">
<button type="button" class="queue-toggle" :aria-expanded="queueCollapsed ? 'false' : 'true'" @click="queueCollapsed=!queueCollapsed">
Queue
<span class="queue-badge">{{ queueCount }}</span>
<span class="queue-toggle-mark" aria-hidden="true">{{ queueCollapsed ? '▸' : '▾' }}</span>
</button>
</div>
<div class="queue-list">
<div v-show="!queueCollapsed" class="queue-list">
<div
v-for="card in queueCards"
:key="card.id"
@@ -410,7 +416,7 @@
</div>
<p v-if="!queueCards.length" class="px-1 text-[var(--type-sm)] text-[var(--muted)]">No active jobs</p>
</div>
<div class="queue-foot">
<div v-show="!queueCollapsed" class="queue-foot">
<button type="button" class="generate-cta" :disabled="submitting" @click="queue">
<span aria-hidden="true">▶</span>
{{ submitting ? 'Queuing…' : (batchMode && imagePromptCount > 1 ? `Generate · ${imagePromptCount} prompts` : 'Generate') }}
@@ -506,7 +512,14 @@ const NEG_STORAGE_KEY='studio2-negative-chips'
const ENHANCE_STORAGE_KEY='studio2-qwen21-enhance-prompt'
const TURBO_STORAGE_KEY='studio2-qwen21-turbo'
const BENCH_DRAFT_KEY='aigen:bench-draft'
const BENCH_DRAFT_SESSION_KEY='aigen:bench-draft:session'
let draftTimer:ReturnType<typeof setTimeout>|null=null
let restoringDraft=false
type EngineLook={steps:number;cfg:number;aspect:string;seed:number|null;seedMode:string;loraStack:any[]}
function defaultEngineLook(engine:string):EngineLook{
if(engine==='qwen21') return {steps:25,cfg:1,aspect:'auto',seed:null,seedMode:'random',loraStack:[]}
return {steps:24,cfg:4,aspect:'auto',seed:null,seedMode:'random',loraStack:[]}
}
function readStoredNegatives(){
if(!import.meta.client)return [...defaultNegatives]
try{
@@ -537,8 +550,9 @@ function writeStoredTurbo(on:boolean){
try{localStorage.setItem(TURBO_STORAGE_KEY,on?'1':'0')}catch{/* ignore */}
}
function benchDraftPayload(){
if(['flux','krea','qwen21'].includes(form.engine)) rememberEngineSampling(form.engine)
return {
v:1,
v:2,
mode:form.mode,
engine:form.engine,
folderId:form.folderId,
@@ -563,26 +577,57 @@ function benchDraftPayload(){
batchMode:!!batchMode.value,
eyeOpen:!!eyeOpen.value,
hideInputs:!!hideInputs.value,
queueCollapsed:!!queueCollapsed.value,
selectedId:selected.value?.id||'',
music:structuredClone({tags:music.tags,lyrics:music.lyrics,duration:music.duration,seed:music.seed,name:music.name})
}
}
function writeDraftStores(payload:string){
try{localStorage.setItem(BENCH_DRAFT_KEY,payload)}catch{/* ignore */}
try{sessionStorage.setItem(BENCH_DRAFT_SESSION_KEY,payload)}catch{/* ignore */}
}
function readDraftRaw(){
let session=''
let local=''
try{session=sessionStorage.getItem(BENCH_DRAFT_SESSION_KEY)||''}catch{/* ignore */}
try{local=localStorage.getItem(BENCH_DRAFT_KEY)||''}catch{/* ignore */}
return session || local
}
function saveBenchDraft(immediate=false){
if(!import.meta.client)return
if(!import.meta.client || restoringDraft)return
const write=()=>{
try{localStorage.setItem(BENCH_DRAFT_KEY,JSON.stringify(benchDraftPayload()))}catch{/* ignore */}
try{writeDraftStores(JSON.stringify(benchDraftPayload()))}catch{/* ignore */}
}
if(draftTimer)clearTimeout(draftTimer)
if(immediate){write();return}
draftTimer=setTimeout(write,400)
}
function mergeEngineLook(row:any, fallback:EngineLook):EngineLook{
return {
steps:Number.isFinite(Number(row?.steps))?Number(row.steps):fallback.steps,
cfg:Number.isFinite(Number(row?.cfg))?Number(row.cfg):fallback.cfg,
aspect:typeof row?.aspect==='string' && row.aspect ? row.aspect : fallback.aspect,
seed:row?.seed==null || row?.seed==='' ? null : Number(row.seed),
seedMode:row?.seedMode==='locked'?'locked':'random',
loraStack:Array.isArray(row?.loraStack)?structuredClone(row.loraStack):structuredClone(fallback.loraStack)
}
}
function restoreBenchDraft(){
if(!import.meta.client)return
let raw=''
try{raw=localStorage.getItem(BENCH_DRAFT_KEY)||''}catch{return}
const raw=readDraftRaw()
if(!raw)return
let draft:any
try{draft=JSON.parse(raw)}catch{return}
if(!draft||draft.v!==1)return
if(!draft|| (draft.v!==1 && draft.v!==2))return
restoringDraft=true
try{
if(draft.engineSampling && typeof draft.engineSampling==='object'){
for(const key of ['flux','krea','qwen21'] as const){
const row=draft.engineSampling[key]
if(!row) continue
engineSampling[key]=mergeEngineLook(row, defaultEngineLook(key))
}
}
if(draft.mode)form.mode=draft.mode
if(draft.engine)form.engine=draft.engine
if(draft.folderId)form.folderId=draft.folderId
@@ -605,17 +650,11 @@ function restoreBenchDraft(){
loraStack:Array.isArray(draft.settings.loraStack)?draft.settings.loraStack:form.settings.loraStack
})
}
if(draft.engineSampling && typeof draft.engineSampling==='object'){
for(const key of ['flux','krea','qwen21'] as const){
const row=draft.engineSampling[key]
if(row && Number.isFinite(Number(row.steps)) && Number.isFinite(Number(row.cfg))){
engineSampling[key]={steps:Number(row.steps),cfg:Number(row.cfg)}
}
}
}
if(['flux','krea','qwen21'].includes(form.engine)) applyEngineSampling(form.engine)
if(draft.batchMode!=null)batchMode.value=!!draft.batchMode
if(draft.eyeOpen!=null)eyeOpen.value=!!draft.eyeOpen
if(draft.hideInputs!=null)hideInputs.value=!!draft.hideInputs
if(draft.queueCollapsed!=null)queueCollapsed.value=!!draft.queueCollapsed
if(draft.music){
music.tags=String(draft.music.tags||music.tags)
music.lyrics=String(draft.music.lyrics||music.lyrics)
@@ -624,6 +663,9 @@ function restoreBenchDraft(){
if(draft.music.name!=null)music.name=String(draft.music.name)
}
syncPhotosBindings()
} finally {
restoringDraft=false
}
}
const xaigen=isXaigenStudio(useRuntimeConfig().public)
@@ -662,11 +704,12 @@ const route=useRoute()
const tasks=['generate','edit','compose','refine','video','extend','music']
const settingsOpen=ref(false),detailsOpen=ref(false),submitting=ref(false),error=ref(''),batchText=ref('')
const batchMode=ref(false)
const queueCollapsed=ref(false)
const selectionPinned=ref(false)
const engineSampling=reactive<Record<string,{steps:number;cfg:number}>>({
flux:{steps:24,cfg:4},
krea:{steps:24,cfg:4},
qwen21:{steps:25,cfg:1}
const engineSampling=reactive<Record<string,EngineLook>>({
flux:defaultEngineLook('flux'),
krea:defaultEngineLook('krea'),
qwen21:defaultEngineLook('qwen21')
})
const viewerVideo=ref<HTMLVideoElement|null>(null)
const viewerMuted=ref(false)
@@ -696,22 +739,36 @@ function defaultSamplingFor(engine:string){
}
function rememberEngineSampling(engine:string){
if(!['flux','krea','qwen21'].includes(engine)) return
const fallback=defaultEngineLook(engine)
engineSampling[engine]={
steps:Number(form.settings.steps)||defaultSamplingFor(engine).steps,
cfg:Number(form.settings.cfg)||defaultSamplingFor(engine).cfg
steps:Number(form.settings.steps)||defaultSamplingFor(engine).steps||fallback.steps,
cfg:Number(form.settings.cfg)||defaultSamplingFor(engine).cfg||fallback.cfg,
aspect:String(form.settings.aspect||fallback.aspect),
seed:form.settings.seed==null || form.settings.seed==='' ? null : Number(form.settings.seed),
seedMode:form.settings.seedMode==='locked'?'locked':'random',
loraStack:Array.isArray(form.settings.loraStack)?structuredClone(form.settings.loraStack):[]
}
}
function applyEngineSampling(engine:string){
const saved=engineSampling[engine]
if(!['flux','krea','qwen21'].includes(engine)) return
const saved=engineSampling[engine] || defaultEngineLook(engine)
const fallback=defaultSamplingFor(engine)
form.settings.steps=saved?.steps ?? fallback.steps
form.settings.cfg=saved?.cfg ?? fallback.cfg
form.settings.steps=saved.steps ?? fallback.steps
form.settings.cfg=saved.cfg ?? fallback.cfg
form.settings.aspect=saved.aspect || form.settings.aspect || 'auto'
form.settings.seed=saved.seed
form.settings.seedMode=saved.seedMode || 'random'
form.settings.loraStack=Array.isArray(saved.loraStack)?structuredClone(saved.loraStack):[]
}
function clearPrompt(){
if(form.promptSections) form.promptSections.action=''
}
watch(engineOptions,opts=>{
const current=opts.find(o=>o.value===form.engine)
if(!current || current.disabled)form.engine=opts.find(o=>!o.disabled)?.value || form.engine
})
watch(()=>form.engine,(engine,prev)=>{
if(restoringDraft) return
if(prev && prev!==engine) rememberEngineSampling(prev)
if(['flux','krea','qwen21'].includes(engine)) applyEngineSampling(engine)
if(engine==='qwen21'){
@@ -722,14 +779,17 @@ watch(()=>form.engine,(engine,prev)=>{
watch(()=>form.enhancePrompt,on=>writeStoredEnhancePrompt(!!on))
watch(()=>form.turbo,on=>{
writeStoredTurbo(!!on)
if(form.engine!=='qwen21')return
if(restoringDraft || form.engine!=='qwen21')return
form.settings.steps=on?6:25
form.settings.cfg=1
rememberEngineSampling('qwen21')
})
watch(()=>[form.settings.steps,form.settings.cfg],()=>{
watch(()=>[
form.settings.steps,form.settings.cfg,form.settings.aspect,form.settings.seed,form.settings.seedMode,form.settings.loraStack
],()=>{
if(restoringDraft) return
if(['flux','krea','qwen21'].includes(form.engine)) rememberEngineSampling(form.engine)
})
},{deep:true})
watch(()=>[form.mode,form.engine],([mode,engine])=>{
if(engine==='qwen21' && mode==='edit'){
form.lockFace=false
@@ -1753,9 +1813,16 @@ async function fetchHealth(){
watch(()=>[
form.mode,form.engine,form.folderId,form.enhancePrompt,form.turbo,form.lockFace,form.lockOutfit,
form.promptSections,form.photos,form.imageStyles,form.settings,
eyeOpen.value,hideInputs.value,batchMode.value,
eyeOpen.value,hideInputs.value,batchMode.value,queueCollapsed.value,
music.tags,music.lyrics,music.duration,music.seed,music.name
],()=>saveBenchDraft(),{deep:true})
function onPageHide(){saveBenchDraft(true)}
function onVisibilityFlush(){
if(typeof document!=='undefined' && document.visibilityState==='hidden') saveBenchDraft(true)
}
function onPageShow(event:PageTransitionEvent){
if(!event.persisted) restoreBenchDraft()
}
let timer:ReturnType<typeof setTimeout>,clock:ReturnType<typeof setInterval>,disposed=false
onMounted(()=>{
submitting.value=false
@@ -1791,6 +1858,9 @@ onMounted(()=>{
if(import.meta.client){
window.addEventListener('keydown',onStageHotkey)
window.addEventListener('pointerdown',onStagePointerDown,true)
window.addEventListener('pagehide',onPageHide)
window.addEventListener('pageshow',onPageShow)
document.addEventListener('visibilitychange',onVisibilityFlush)
}
})
onBeforeUnmount(()=>{
@@ -1800,6 +1870,9 @@ onBeforeUnmount(()=>{
saveBenchDraft(true)
window.removeEventListener('keydown',onStageHotkey)
window.removeEventListener('pointerdown',onStagePointerDown,true)
window.removeEventListener('pagehide',onPageHide)
window.removeEventListener('pageshow',onPageShow)
document.removeEventListener('visibilitychange',onVisibilityFlush)
}
})
@@ -1828,6 +1901,7 @@ const mobileCtx=computed(()=>({
eyeOpen:eyeOpen.value,
hideInputs:hideInputs.value,
photoFilledCount:photoFilledCount.value,
clearPrompt,
openLibrary:()=>{libraryOpen.value=true},
closeLibrary:()=>{libraryOpen.value=false},
toggleHideInputs:()=>{hideInputs.value=!hideInputs.value;saveBenchDraft(true)},
components/studio2/Mobile.vue
+78 -4
View File
@@ -1,5 +1,5 @@
<template>
<div class="m-shell" data-mobile="1">
<div class="m-shell" data-mobile="1" :data-queue-collapsed="queueRailCollapsed ? '1' : undefined">
<header class="m-header">
<span class="m-brand">{{ ctx.instanceName }}</span>
<label class="m-crumb">
@@ -9,11 +9,15 @@
</label>
<span class="m-grow" />
<span class="m-gpu" :data-tone="ctx.gpu.tone" :title="ctx.gpu.detail">● {{ ctx.gpuChipLabel }}</span>
<button type="button" class="m-chip" @click="toggleSheet('queue')">Queue {{ ctx.queueCount }}</button>
<button type="button" class="m-chip m-queue-chip-portrait" @click="toggleSheet('queue')">Queue {{ ctx.queueCount }}</button>
<button type="button" class="m-chip m-queue-chip-landscape" :aria-expanded="queueRailCollapsed ? 'false' : 'true'" @click="queueRailCollapsed=!queueRailCollapsed">
Queue {{ ctx.queueCount }} {{ queueRailCollapsed ? '▸' : '▾' }}
</button>
<details class="m-more">
<summary aria-label="More">⋯</summary>
<div class="m-more-menu">
<NuxtLink to="/library" @click="closeMenus">Library</NuxtLink>
<NuxtLink to="/prompt-builder" @click="closeMenus">Prompt Builder</NuxtLink>
<NuxtLink to="/queue" @click="closeMenus">Queue</NuxtLink>
<NuxtLink to="/settings" @click="closeMenus">Settings</NuxtLink>
</div>
@@ -224,7 +228,8 @@
<label class="m-label">Lyrics<textarea v-model="ctx.music.lyrics" rows="8" class="m-area" /></label>
</template>
<template v-else>
<label class="m-label">Prompt
<label class="m-label">
<span class="m-label-row">Prompt<button type="button" class="m-link" @click.stop="ctx.clearPrompt()">Clear</button></span>
<textarea
:value="ctx.form.promptSections.action"
rows="5"
@@ -329,7 +334,7 @@
</div>
</aside>
<aside v-if="sheet==='queue'" class="m-sheet" role="dialog" aria-label="Queue">
<aside v-if="sheet==='queue'" class="m-sheet m-queue-sheet-portrait" role="dialog" aria-label="Queue">
<button type="button" class="m-handle" aria-label="Close" @click="sheet=''" />
<div class="m-sheet-head"><strong>Queue</strong><button type="button" @click="sheet=''">Done</button></div>
<div class="m-sheet-body">
@@ -367,6 +372,33 @@
</div>
</aside>
<aside v-show="!queueRailCollapsed" class="m-queue-rail" aria-label="Queue">
<div class="m-sheet-head">
<strong>Queue</strong>
<button type="button" @click="queueRailCollapsed=true">Hide</button>
</div>
<div class="m-sheet-body">
<div
v-for="card in ctx.queueCards"
:key="'rail-'+card.id"
class="m-job"
:class="{ on: ctx.focusedJobId===card.id }"
@click="ctx.focusQueueCard(card)"
>
<div class="m-job-id">{{ card.code }}</div>
<div class="m-job-title">{{ card.title }}</div>
<div class="m-muted">{{ card.meta }}</div>
<div class="m-job-status">
<span>● {{ card.statusLabel }}</span>
<button v-if="card.cancelable" type="button" @click.stop="ctx.cancel(card.job)">Cancel</button>
<button v-else-if="card.dismissable" type="button" @click.stop="ctx.dismissFinishedCard(card)">Dismiss</button>
</div>
</div>
<p v-if="!ctx.queueCards.length" class="m-muted">No active jobs</p>
<button v-if="ctx.canClearFinished" type="button" class="m-link" @click="ctx.clearFinished">Clear finished</button>
</div>
</aside>
<div
v-if="promptEditorOpen"
class="m-prompt-editor"
@@ -393,6 +425,7 @@ export type Studio2MobileCtx = Record<string, any>
const props = defineProps<{ ctx: Studio2MobileCtx }>()
const sheet = ref('')
const queueRailCollapsed = ref(false)
const touchStart = ref<{ x: number; y: number } | null>(null)
const promptEditorOpen = ref(false)
const promptEditorDraft = ref('')
@@ -725,6 +758,7 @@ watch(() => props.ctx.form.mode, () => { sheet.value = '' })
gap: 10px;
}
.m-label { display: block; font-size: 11px; color: var(--muted); }
.m-label-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; }
.m-area, .m-input {
width: 100%;
margin-top: 4px;
@@ -800,6 +834,46 @@ watch(() => props.ctx.form.mode, () => { sheet.value = '' })
font-size: 16px;
font-weight: 600;
}
.m-queue-chip-landscape { display: none; }
.m-queue-rail { display: none; }
@media (orientation: landscape) {
.m-queue-chip-portrait,
.m-queue-sheet-portrait { display: none !important; }
.m-queue-chip-landscape { display: inline-flex; align-items: center; }
.m-shell { position: relative; }
.m-queue-rail {
position: absolute;
top: 0;
right: 0;
bottom: 0;
z-index: 25;
display: flex;
width: min(42vw, 16rem);
flex-direction: column;
border-left: 1px solid var(--line);
background: var(--panel);
}
.m-shell[data-queue-collapsed='1'] .m-queue-rail { display: none; }
.m-queue-rail .m-sheet-head {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 12px;
border-bottom: 1px solid var(--line);
}
.m-queue-rail .m-sheet-body {
flex: 1;
min-height: 0;
overflow: auto;
padding: 10px 12px;
}
.m-stage { padding-right: 0; }
.m-shell:not([data-queue-collapsed='1']) .m-stage,
.m-shell:not([data-queue-collapsed='1']) .m-dock,
.m-shell:not([data-queue-collapsed='1']) .m-chips {
margin-right: min(42vw, 16rem);
}
}
.m-prompt-editor-area {
flex: 1;
width: 100%;
pages/prompt-builder.vue
+295 -7
View File
@@ -127,6 +127,107 @@
</div>␍
</div>␍
␍
<div class="space-y-3">␍
<div class="flex flex-wrap items-center justify-between gap-2">␍
<div>␍
<span class="text-sm font-medium text-zinc-300">Sets</span>␍
<p class="text-[11px] text-zinc-500">Sequence-wide locations and props. Toggle per scene below.</p>␍
</div>␍
<button␍
type="button"␍
class="rounded-full border border-white/10 px-3 py-1 text-[11px] text-zinc-300 hover:border-amber-300/50 hover:text-white"␍
@click="addSet"␍
>␍
Add set␍
</button>␍
</div>␍
<p v-if="!sets.length" class="text-[11px] text-zinc-600">No sets yet.</p>␍
<div␍
v-for="(set, sIndex) in sets"␍
:key="set.id"␍
class="rounded-2xl border border-white/10 bg-zinc-950/40 p-3 space-y-3"␍
>␍
<div class="flex items-center justify-between gap-2">␍
<span class="text-[11px] uppercase tracking-wide text-zinc-500">Set {{ sIndex + 1 }}</span>␍
<div class="flex items-center gap-2">␍
<button type="button" class="text-[11px] text-zinc-500 hover:text-amber-200" @click="clearSet(sIndex)">Clear</button>␍
<button␍
type="button"␍
class="text-[11px] text-zinc-500 hover:text-red-300"␍
@click="removeSet(sIndex)"␍
>␍
Remove␍
</button>␍
</div>␍
</div>␍
<input␍
v-model="set.name"␍
class="w-full rounded-xl border border-white/10 bg-zinc-950 px-3 py-2 text-sm outline-none ring-amber-300/40 placeholder:text-zinc-600 focus:ring-2"␍
maxlength="120"␍
placeholder="Name"␍
>␍
<textarea␍
v-model="set.description"␍
rows="2"␍
class="w-full rounded-xl border border-white/10 bg-zinc-950/70 px-3 py-2 text-sm outline-none ring-amber-300/40 placeholder:text-zinc-600 focus:ring-2"␍
placeholder="Description"␍
/>␍
<div class="space-y-2 border-t border-white/5 pt-3">␍
<div class="flex flex-wrap items-center justify-between gap-2">␍
<span class="text-[11px] font-medium uppercase tracking-wide text-zinc-500">Beats</span>␍
<button␍
type="button"␍
class="text-[11px] text-zinc-400 hover:text-amber-200"␍
@click="addBeat(sIndex)"␍
>␍
Add beat␍
</button>␍
</div>␍
<div␍
v-for="(beat, bIndex) in set.beats"␍
:key="beat.id"␍
class="rounded-xl border border-white/5 bg-zinc-950/50 p-2 space-y-2"␍
>␍
<div class="flex items-center justify-between gap-2">␍
<span class="text-[11px] text-zinc-500">Beat {{ bIndex + 1 }}</span>␍
<div class="flex items-center gap-2">␍
<button type="button" class="text-[11px] text-zinc-500 hover:text-amber-200" @click="clearBeat(sIndex, bIndex)">Clear</button>␍
<button type="button" class="text-[11px] text-zinc-500 hover:text-red-300" @click="removeBeat(sIndex, bIndex)">Remove</button>␍
</div>␍
</div>␍
<input␍
v-model="beat.name"␍
class="w-full rounded-lg border border-white/10 bg-zinc-950 px-2.5 py-1.5 text-sm outline-none ring-amber-300/40 placeholder:text-zinc-600 focus:ring-2"␍
maxlength="120"␍
placeholder="Beat name (not copied)"␍
>␍
<textarea␍
v-model="beat.text"␍
rows="2"␍
class="w-full rounded-lg border border-white/10 bg-zinc-950/70 px-2.5 py-1.5 text-sm outline-none ring-amber-300/40 placeholder:text-zinc-600 focus:ring-2"␍
placeholder="Beat text"␍
/>␍
<div class="flex flex-wrap items-center gap-x-3 gap-y-1">␍
<span class="text-[11px] text-zinc-500">Framing</span>␍
<label␍
v-for="size in PROMPT_SEQUENCE_SHOT_SIZES"␍
:key="size"␍
class="flex items-center gap-1.5 text-[11px] text-zinc-400"␍
>␍
<input␍
type="checkbox"␍
class="accent-amber-400"␍
:checked="isBeatFraming(beat, size)"␍
@change="toggleBeatFraming(beat, size, ($event.target as HTMLInputElement).checked)"␍
>␍
{{ size }}␍
</label>␍
</div>␍
</div>␍
</div>␍
</div>␍
</div>␍
␍
<div class="flex flex-wrap items-center gap-2 border-b border-white/10 pb-2">␍
<button␍
v-for="(scene, index) in scenes"␍
@@ -147,6 +248,32 @@
>␍
Next scene␍
</button>␍
<button␍
type="button"␍
class="rounded-full border border-white/10 px-2.5 py-1.5 text-xs text-zinc-300 hover:border-amber-300/50 hover:text-white disabled:cursor-not-allowed disabled:opacity-40"␍
title="Move scene earlier"␍
:disabled="activeIndex <= 0"␍
@click="moveScene(activeIndex, -1)"␍
>␍
←␍
</button>␍
<button␍
type="button"␍
class="rounded-full border border-white/10 px-2.5 py-1.5 text-xs text-zinc-300 hover:border-amber-300/50 hover:text-white disabled:cursor-not-allowed disabled:opacity-40"␍
title="Move scene later"␍
:disabled="activeIndex >= scenes.length - 1"␍
@click="moveScene(activeIndex, 1)"␍
>␍
→␍
</button>␍
<button␍
type="button"␍
class="rounded-full border border-white/10 px-3 py-1.5 text-xs text-zinc-300 hover:border-red-400/50 hover:text-red-200 disabled:cursor-not-allowed disabled:opacity-40"␍
:disabled="scenes.length <= 1"␍
@click="deleteScene(activeIndex)"␍
>␍
Delete scene␍
</button>␍
</div>␍
␍
<div v-if="activeScene" class="space-y-4">␍
@@ -189,6 +316,44 @@
/>␍
</div>␍
␍
<label class="block text-sm">␍
<span class="mb-1 block font-medium text-zinc-300">Shot size</span>␍
<select␍
v-model="activeScene.shotSize"␍
class="w-full rounded-xl border border-white/10 bg-zinc-950 px-3 py-2 text-sm text-zinc-200 outline-none ring-amber-300/40 focus:ring-2"␍
>␍
<option value="">Any</option>␍
<option v-for="size in PROMPT_SEQUENCE_SHOT_SIZES" :key="size" :value="size">␍
{{ size }}␍
</option>␍
</select>␍
<p class="mt-1 text-[11px] text-zinc-500">␍
Medium drops beats not tagged medium; untagged beats always copy. Empty shot size includes every beat.␍
</p>␍
</label>␍
␍
<div v-if="sets.length" class="space-y-3">␍
<div>␍
<span class="text-sm font-medium text-zinc-300">Sets in this scene</span>␍
<p class="text-[11px] text-zinc-500">Toggle which set blocks appear in this image.</p>␍
</div>␍
<div␍
v-for="set in sets"␍
:key="'scene-set-'+set.id"␍
class="rounded-2xl border border-white/10 bg-zinc-950/40 px-3 py-2.5"␍
>␍
<label class="flex items-center justify-between gap-3 text-sm text-zinc-200">␍
<span class="min-w-0 truncate">{{ set.name || 'Unnamed set' }}</span>␍
<input␍
type="checkbox"␍
class="accent-amber-400"␍
:checked="isSetOn(set.id)"␍
@change="setSetOn(set.id, ($event.target as HTMLInputElement).checked)"␍
>␍
</label>␍
</div>␍
</div>␍
␍
<div class="space-y-3">␍
<div>␍
<span class="text-sm font-medium text-zinc-300">In this scene</span>␍
@@ -322,17 +487,23 @@
<script setup lang="ts">␍
import type {␍
PromptSequence,␍
PromptSequenceBeat,␍
PromptSequenceCharacter,␍
PromptSequenceScene
PromptSequenceScene,␍
PromptSequenceSet␍
} from '~/utils/promptSequences'␍
import {␍
PROMPT_SEQUENCE_SHOT_SIZES,␍
assembleSceneText,␍
assembleSequenceText,␍
cloneSceneForNext,␍
emptyBeat,␍
emptyCharacter,␍
emptyOutfit,␍
emptyScene,␍
emptySet,␍
ensureSceneStatesForCharacters,␍
ensureSceneStatesForSets,␍
normalizePromptSequence␍
} from '~/utils/promptSequences'␍
␍
@@ -342,7 +513,8 @@ const sequences = ref<PromptSequence[]>([])
const selectedId = ref('')␍
const name = ref('')␍
const characters = ref<PromptSequenceCharacter[]>([emptyCharacter()])␍
const scenes = ref<PromptSequenceScene[]>([emptyScene(1, characters.value)])
const sets = ref<PromptSequenceSet[]>([])␍
const scenes = ref<PromptSequenceScene[]>([emptyScene(1, characters.value, sets.value)])␍
const activeIndex = ref(0)␍
const previewOpen = ref(true)␍
const busy = ref('')␍
@@ -353,21 +525,25 @@ const copiedScene = ref(false)
let copyTimer: ReturnType<typeof setTimeout> | null = null␍
let copySceneTimer: ReturnType<typeof setTimeout> | null = null␍
␍
type ShotSize = typeof PROMPT_SEQUENCE_SHOT_SIZES[number]␍
␍
const activeScene = computed(() => scenes.value[activeIndex.value] || null)␍
const previewText = computed(() => assembleSequenceText({␍
characters: characters.value,␍
sets: sets.value,␍
scenes: scenes.value␍
}))␍
const activeSceneText = computed(() => {␍
if (!activeScene.value) return ''␍
return assembleSceneText(activeScene.value, characters.value)
return assembleSceneText(activeScene.value, characters.value, sets.value)␍
})␍
␍
function startNew() {␍
selectedId.value = ''␍
name.value = ''␍
characters.value = [emptyCharacter()]␍
scenes.value = [emptyScene(1, characters.value)]
sets.value = []␍
scenes.value = [emptyScene(1, characters.value, sets.value)]␍
activeIndex.value = 0␍
error.value = ''␍
notice.value = ''␍
@@ -382,15 +558,26 @@ function select(sequence: PromptSequence) {
...character,␍
outfits: (character.outfits || []).map(outfit => ({ ...emptyOutfit(), ...outfit }))␍
}))␍
scenes.value = (normalized.scenes?.length ? normalized.scenes : [emptyScene(1, characters.value)]).map((scene, index) => ({
...emptyScene(index + 1, characters.value),
sets.value = (normalized.sets || []).map(set => ({␍
...emptySet(),␍
...set,␍
beats: (set.beats?.length ? set.beats : [emptyBeat()]).map(beat => ({ ...emptyBeat(), ...beat }))␍
}))␍
scenes.value = (normalized.scenes?.length ? normalized.scenes : [emptyScene(1, characters.value, sets.value)]).map((scene, index) => ({␍
...emptyScene(index + 1, characters.value, sets.value),␍
...scene,␍
shotSize: scene.shotSize || '',␍
setStates: (scene.setStates || []).map(state => ({␍
setId: state.setId,␍
on: state.on !== false␍
})),␍
characterStates: (scene.characterStates || []).map(state => ({␍
characterId: state.characterId,␍
on: state.on !== false,␍
outfitId: state.outfitId || null␍
}))␍
}))␍
ensureSceneStatesForSets(scenes.value, sets.value)␍
ensureSceneStatesForCharacters(scenes.value, characters.value)␍
activeIndex.value = 0␍
error.value = ''␍
@@ -398,12 +585,37 @@ function select(sequence: PromptSequence) {
}␍
␍
function addNextScene() {␍
const previous = scenes.value[scenes.value.length - 1] || emptyScene(1, characters.value)
const previous = scenes.value[scenes.value.length - 1] || emptyScene(1, characters.value, sets.value)␍
const next = cloneSceneForNext(previous, scenes.value.length + 1)␍
scenes.value.push(next)␍
activeIndex.value = scenes.value.length - 1␍
}␍
␍
function moveScene(index: number, delta: number) {␍
const newIndex = index + delta␍
if (newIndex < 0 || newIndex >= scenes.value.length) return␍
const [scene] = scenes.value.splice(index, 1)␍
if (!scene) return␍
scenes.value.splice(newIndex, 0, scene)␍
if (activeIndex.value === index) {␍
activeIndex.value = newIndex␍
} else if (index < activeIndex.value && newIndex >= activeIndex.value) {␍
activeIndex.value--␍
} else if (index > activeIndex.value && newIndex <= activeIndex.value) {␍
activeIndex.value++␍
}␍
}␍
␍
function deleteScene(index: number) {␍
if (scenes.value.length <= 1) return␍
scenes.value.splice(index, 1)␍
if (activeIndex.value >= scenes.value.length) {␍
activeIndex.value = scenes.value.length - 1␍
} else if (activeIndex.value > index) {␍
activeIndex.value--␍
}␍
}␍
␍
function addCharacter() {␍
const character = emptyCharacter()␍
characters.value.push(character)␍
@@ -451,6 +663,81 @@ function removeOutfit(characterIndex: number, outfitIndex: number) {
}␍
}␍
␍
function addSet() {␍
const set = emptySet()␍
sets.value.push(set)␍
ensureSceneStatesForSets(scenes.value, sets.value, {␍
newSetId: set.id,␍
turnOnSceneIndex: activeIndex.value␍
})␍
}␍
␍
function clearSet(index: number) {␍
const set = sets.value[index]␍
if (!set) return␍
set.name = ''␍
set.description = ''␍
set.beats = [emptyBeat()]␍
}␍
␍
function removeSet(index: number) {␍
const [removed] = sets.value.splice(index, 1)␍
if (!removed) return␍
for (const scene of scenes.value) {␍
scene.setStates = (scene.setStates || []).filter(state => state.setId !== removed.id)␍
}␍
}␍
␍
function addBeat(setIndex: number) {␍
const set = sets.value[setIndex]␍
if (!set) return␍
set.beats.push(emptyBeat())␍
}␍
␍
function removeBeat(setIndex: number, beatIndex: number) {␍
const set = sets.value[setIndex]␍
if (!set) return␍
set.beats.splice(beatIndex, 1)␍
}␍
␍
function clearBeat(setIndex: number, beatIndex: number) {␍
const beat = sets.value[setIndex]?.beats[beatIndex]␍
if (!beat) return␍
beat.name = ''␍
beat.text = ''␍
beat.framings = []␍
}␍
␍
function isBeatFraming(beat: PromptSequenceBeat, size: ShotSize) {␍
return beat.framings.includes(size)␍
}␍
␍
function toggleBeatFraming(beat: PromptSequenceBeat, size: ShotSize, checked: boolean) {␍
if (checked) {␍
if (!beat.framings.includes(size)) beat.framings.push(size)␍
} else {␍
beat.framings = beat.framings.filter(item => item !== size)␍
}␍
}␍
␍
function sceneSetState(setId: string) {␍
return activeScene.value?.setStates?.find(state => state.setId === setId)␍
}␍
␍
function isSetOn(setId: string) {␍
const state = sceneSetState(setId)␍
return state ? !!state.on : true␍
}␍
␍
function setSetOn(setId: string, on: boolean) {␍
const state = sceneSetState(setId)␍
if (!state) {␍
activeScene.value?.setStates.push({ setId, on })␍
return␍
}␍
state.on = on␍
}␍
␍
function sceneState(characterId: string) {␍
return activeScene.value?.characterStates.find(state => state.characterId === characterId)␍
}␍
@@ -503,6 +790,7 @@ async function save() {
const payload = {␍
name: nextName,␍
characters: characters.value,␍
sets: sets.value,␍
scenes: scenes.value␍
}␍
try {␍
server/api/prompt-sequences.post.ts
+2
View File
@@ -5,12 +5,14 @@ export default defineEventHandler(async (event) => {
const body = await readBody<{
name?: string
characters?: unknown
sets?: unknown
scenes?: unknown
overwrite?: boolean
}>(event).catch(() => ({}))
const sequence = await savePromptSequence(owner, {
name: body?.name || '',
characters: body?.characters,
sets: body?.sets,
scenes: body?.scenes,
overwrite: body?.overwrite === true
})
server/api/prompt-sequences/[id].patch.ts
+2 -1
View File
@@ -3,10 +3,11 @@ import { listPromptSequences, updatePromptSequence } from '~/server/utils/prompt
export default defineEventHandler(async (event) => {
const { owner } = assertLibraryOwner(event)
const id = String(getRouterParam(event, 'id') || '')
const body = await readBody<{ name?: string; characters?: unknown; scenes?: unknown }>(event).catch(() => ({}))
const body = await readBody<{ name?: string; characters?: unknown; sets?: unknown; scenes?: unknown }>(event).catch(() => ({}))
const sequence = await updatePromptSequence(owner, id, {
name: body?.name,
characters: body?.characters,
sets: body?.sets,
scenes: body?.scenes
})
return {
server/utils/promptSequences.ts
+27 -7
View File
@@ -5,11 +5,13 @@ import {
normalizePromptSequence,
normalizePromptSequenceName,
normalizeCharacter,
normalizeSet,
normalizeScene,
emptyCharacter,
emptyScene,
type PromptSequence,
type PromptSequenceCharacter,
type PromptSequenceSet,
type PromptSequenceScene
} from '~/utils/promptSequences'
@@ -62,9 +64,18 @@ function normalizeCharactersInput(raw: unknown): PromptSequenceCharacter[] {
return raw.map(normalizeCharacter)
}
function normalizeScenesInput(raw: unknown, characters: PromptSequenceCharacter[]): PromptSequenceScene[] {
if (!Array.isArray(raw) || !raw.length) return [emptyScene(1, characters)]
return raw.map((scene, index) => normalizeScene(scene, index, characters))
function normalizeSetsInput(raw: unknown): PromptSequenceSet[] {
if (!Array.isArray(raw)) return []
return raw.map(normalizeSet)
}
function normalizeScenesInput(
raw: unknown,
characters: PromptSequenceCharacter[],
sets: PromptSequenceSet[]
): PromptSequenceScene[] {
if (!Array.isArray(raw) || !raw.length) return [emptyScene(1, characters, sets)]
return raw.map((scene, index) => normalizeScene(scene, index, characters, sets))
}
export function listPromptSequences(owner: string) {
@@ -81,13 +92,15 @@ export function getPromptSequence(owner: string, id: string) {
export async function savePromptSequence(owner: string, input: {
name: string
characters?: unknown
sets?: unknown
scenes?: unknown
overwrite?: boolean
}) {
const name = normalizePromptSequenceName(input.name)
if (!name) throw createError({ statusCode: 400, statusMessage: 'A sequence name is required' })
const characters = normalizeCharactersInput(input.characters)
const scenes = normalizeScenesInput(input.scenes, characters)
const sets = normalizeSetsInput(input.sets)
const scenes = normalizeScenesInput(input.scenes, characters, sets)
const now = Date.now()
return mutate(owner, (sequences) => {
const existing = sequences.find(item => item.name.toLowerCase() === name.toLowerCase())
@@ -96,6 +109,7 @@ export async function savePromptSequence(owner: string, input: {
}
if (existing) {
existing.characters = characters
existing.sets = sets
existing.scenes = scenes
existing.updatedAt = now
return existing
@@ -104,6 +118,7 @@ export async function savePromptSequence(owner: string, input: {
id: crypto.randomUUID(),
name,
characters,
sets,
scenes,
createdAt: now,
updatedAt: now
@@ -116,6 +131,7 @@ export async function savePromptSequence(owner: string, input: {
export async function updatePromptSequence(owner: string, id: string, input: {
name?: string
characters?: unknown
sets?: unknown
scenes?: unknown
}) {
const wanted = String(id || '').trim()
@@ -130,14 +146,18 @@ export async function updatePromptSequence(owner: string, id: string, input: {
if (clash) throw createError({ statusCode: 409, statusMessage: `A sequence named “${clash.name}” already exists` })
existing.name = name
}
if (input.characters !== undefined || input.scenes !== undefined) {
if (input.characters !== undefined || input.sets !== undefined || input.scenes !== undefined) {
const characters = input.characters !== undefined
? normalizeCharactersInput(input.characters)
: existing.characters
const sets = input.sets !== undefined
? normalizeSetsInput(input.sets)
: (existing.sets || [])
const scenes = input.scenes !== undefined
? normalizeScenesInput(input.scenes, characters)
: existing.scenes.map((scene, index) => normalizeScene(scene, index, characters))
? normalizeScenesInput(input.scenes, characters, sets)
: existing.scenes.map((scene, index) => normalizeScene(scene, index, characters, sets))
existing.characters = characters
existing.sets = sets
existing.scenes = scenes
}
existing.updatedAt = Date.now()
tests/prompt-sequences.test.mjs
+109 -88
View File
@@ -22,88 +22,104 @@ const {
emptyScene,
emptyCharacter,
emptyOutfit,
emptySet,
emptyBeat,
cloneSceneForNext,
normalizePromptSequence,
ensureSceneStatesForCharacters
ensureSceneStatesForCharacters,
beatMatchesShotSize
} = await import(pathToFileURL(tmp).href)
unlinkSync(tmp)
test('formatCharacterLine covers name/description and outfit', () => {
assert.equal(formatCharacterLine({ name: 'Ada', description: 'tall' }), 'Ada: tall')
assert.equal(formatCharacterLine({ name: 'Ada', description: '' }), 'Ada')
assert.equal(formatCharacterLine({ name: '', description: 'tall' }), 'tall')
assert.equal(formatCharacterLine({ name: '', description: '' }), '')
assert.equal(
formatCharacterLine({ name: 'Ada', description: 'tall' }, { name: 'Work', description: 'blue jacket' }),
'Ada: tall. Outfit: blue jacket'
)
})
test('assembleSceneText joins non-empty boxes with a single blank line', () => {
const text = assembleSceneText({
style: 'oil paint',
settings: 'night',
characters: [
{ name: 'Ada', description: 'tall' },
{ name: '', description: '' },
{ name: 'Bo', description: 'hat' }
],
prompt: 'walks'
})
assert.equal(text, 'oil paint\n\nnight\n\nAda: tall\nBo: hat\n\nwalks')
test('shot size filters beats; untagged always included; tags never copied', () => {
const set = {
...emptySet(),
id: 's1',
name: 'BadgeSet',
description: 'studio backdrop',
beats: [
{ ...emptyBeat(), id: 'b1', name: 'WideBeat', text: 'wide only line', framings: ['wide'] },
{ ...emptyBeat(), id: 'b2', name: 'WideMed', text: 'wide and medium', framings: ['wide', 'medium'] },
{ ...emptyBeat(), id: 'b3', name: 'Always', text: 'untagged beat', framings: [] },
{ ...emptyBeat(), id: 'b4', name: 'CU', text: 'close only', framings: ['close-up'] }
]
}
const sceneMedium = {
style: 'style',
settings: 'settings',
shotSize: 'medium',
setStates: [{ setId: 's1', on: true }],
characterStates: [],
prompt: 'prompt'
}
const mediumText = assembleSceneText(sceneMedium, [], [set])
assert.equal(
mediumText,
'style\n\nsettings\n\nstudio backdrop\nwide and medium\nuntagged beat\n\nprompt'
)
assert.ok(!mediumText.includes('wide only'))
assert.ok(!mediumText.includes('close only'))
assert.ok(!mediumText.includes('BadgeSet'))
assert.ok(!mediumText.includes('WideBeat'))
assert.ok(!mediumText.includes('close-up'))
assert.ok(!/\bwide\b/.test(mediumText.replace('wide and medium', '')))
const sceneClose = { ...sceneMedium, shotSize: 'close-up' }
const closeText = assembleSceneText(sceneClose, [], [set])
assert.equal(
closeText,
'style\n\nsettings\n\nstudio backdrop\nuntagged beat\nclose only\n\nprompt'
)
const sceneAny = { ...sceneMedium, shotSize: '' }
const anyText = assembleSceneText(sceneAny, [], [set])
assert.ok(anyText.includes('wide only line'))
assert.ok(anyText.includes('wide and medium'))
assert.ok(anyText.includes('untagged beat'))
assert.ok(anyText.includes('close only'))
assert.equal(beatMatchesShotSize({ framings: ['wide'] }, 'medium'), false)
assert.equal(beatMatchesShotSize({ framings: [] }, 'medium'), true)
})
test('off characters and active outfits affect assembly', () => {
const ada = { ...emptyCharacter(), id: 'c1', name: 'Ada', description: 'tall', outfits: [
{ ...emptyOutfit(), id: 'o1', name: 'Day', description: 'red dress' },
{ ...emptyOutfit(), id: 'o2', name: 'Night', description: 'black coat' }
] }
const bo = { ...emptyCharacter(), id: 'c2', name: 'Bo', description: 'hat', outfits: [] }
test('off set omitted; copy scene is one scene; sequence join is double blank', () => {
const set = {
...emptySet(),
id: 's1',
description: 'set desc',
beats: [{ ...emptyBeat(), text: 'beat', framings: [] }]
}
const scene1 = {
style: 's1',
style: 'a',
settings: '',
prompt: 'p1',
characterStates: [
{ characterId: 'c1', on: true, outfitId: 'o1' },
{ characterId: 'c2', on: true, outfitId: null }
]
shotSize: '',
setStates: [{ setId: 's1', on: true }],
characterStates: [],
prompt: 'p1'
}
const scene2 = {
style: 's2',
style: 'b',
settings: '',
prompt: 'p2',
characterStates: [
{ characterId: 'c1', on: false, outfitId: 'o1' },
{ characterId: 'c2', on: true, outfitId: null }
]
shotSize: '',
setStates: [{ setId: 's1', on: false }],
characterStates: [],
prompt: 'p2'
}
assert.equal(
assembleSceneText(scene1, [ada, bo]),
's1\n\nAda: tall. Outfit: red dress\nBo: hat\n\np1'
)
assert.equal(
assembleSceneText(scene2, [ada, bo]),
's2\n\nBo: hat\n\np2'
)
const full = assembleSequenceText({ characters: [ada, bo], scenes: [scene1, scene2] })
assert.equal(full, 's1\n\nAda: tall. Outfit: red dress\nBo: hat\n\np1\n\n\ns2\n\nBo: hat\n\np2')
assert.ok(!full.includes('not present'))
assert.equal(assembleSceneText(scene2, [], [set]), 'b\n\np2')
const full = assembleSequenceText({ sets: [set], scenes: [scene1, scene2] })
assert.equal(full, 'a\n\nset desc\nbeat\n\np1\n\n\nb\n\np2')
assert.equal(assembleSceneText(scene1, [], [set]), 'a\n\nset desc\nbeat\n\np1')
})
test('assembleSequenceText uses double blank line between scenes and skips empties', () => {
const text = assembleSequenceText({
name: 'ignored',
scenes: [
{ style: 's1', settings: '', characters: [], prompt: 'p1' },
{ style: '', settings: '', characters: [{ name: '', description: '' }], prompt: '' },
{ style: 's2', settings: 'set2', characters: [{ name: 'C', description: 'd' }], prompt: 'p2' }
]
})
assert.equal(text, 's1\n\np1\n\n\ns2\n\nset2\n\nC: d\n\np2')
assert.ok(!text.includes('ignored'))
})
test('legacy sequences migrate to sequence characters all on with no outfits', () => {
test('legacy sequence without sets still assembles', () => {
const legacy = normalizePromptSequence({
id: 'seq1',
name: 'Old',
@@ -111,51 +127,56 @@ test('legacy sequences migrate to sequence characters all on with no outfits', (
{
id: 'sc1',
title: 'Scene 1',
style: 'a',
style: 'oil',
settings: '',
prompt: 'p',
characters: [{ id: 'x', name: 'Ada', description: 'tall' }]
},
{
id: 'sc2',
title: 'Scene 2',
style: 'b',
settings: '',
prompt: 'q',
prompt: 'walk',
characters: [{ id: 'x', name: 'Ada', description: 'tall' }]
}
],
createdAt: 1,
updatedAt: 1
})
assert.equal(legacy.characters.length, 1)
assert.equal(legacy.characters[0].name, 'Ada')
assert.deepEqual(legacy.characters[0].outfits, [])
assert.equal(legacy.scenes[0].characterStates[0].on, true)
assert.equal(legacy.scenes[0].characterStates[0].outfitId, null)
assert.equal(legacy.scenes[1].characterStates[0].on, true)
assert.deepEqual(legacy.sets, [])
assert.equal(legacy.scenes[0].shotSize, '')
const text = assembleSequenceText(legacy)
assert.equal(text, 'oil\n\nAda: tall\n\nwalk')
})
test('cloneSceneForNext copies toggles and outfit choices', () => {
const chars = [emptyCharacter()]
const first = emptyScene(1, chars)
first.style = 'a'
first.characterStates[0].on = false
first.characterStates[0].outfitId = 'o9'
test('cloneSceneForNext copies shotSize and setStates', () => {
const sets = [emptySet()]
const first = emptyScene(1, [], sets)
first.shotSize = 'close-up'
first.setStates[0].on = false
const next = cloneSceneForNext(first, 2)
assert.equal(next.title, 'Scene 2')
assert.equal(next.style, 'a')
assert.equal(next.characterStates[0].on, false)
assert.equal(next.characterStates[0].outfitId, 'o9')
assert.notEqual(next.id, first.id)
assert.equal(next.shotSize, 'close-up')
assert.equal(next.setStates[0].on, false)
assert.equal(next.setStates[0].setId, sets[0].id)
})
test('character outfit and off still work with sets', () => {
const ada = {
...emptyCharacter(),
id: 'c1',
name: 'Ada',
description: 'tall',
outfits: [{ ...emptyOutfit(), id: 'o1', description: 'red dress' }]
}
const text = assembleSceneText({
style: '',
settings: '',
shotSize: '',
setStates: [],
characterStates: [{ characterId: 'c1', on: true, outfitId: 'o1' }],
prompt: 'hi'
}, [ada], [])
assert.equal(text, 'Ada: tall. Outfit: red dress\n\nhi')
})
test('ensureSceneStatesForCharacters turns new character on only for current scene', () => {
const a = emptyCharacter()
const scenes = [emptyScene(1, [a]), emptyScene(2, [a])]
const b = emptyCharacter()
const list = [a, b]
ensureSceneStatesForCharacters(scenes, list, { newCharacterId: b.id, turnOnSceneIndex: 1 })
ensureSceneStatesForCharacters(scenes, [a, b], { newCharacterId: b.id, turnOnSceneIndex: 1 })
assert.equal(scenes[0].characterStates.find(s => s.characterId === b.id).on, false)
assert.equal(scenes[1].characterStates.find(s => s.characterId === b.id).on, true)
})
utils/promptSequences.ts
+188 -9
View File
@@ -18,11 +18,37 @@ export type PromptSequenceCharacterState = {
outfitId: string | null
}
export type PromptSequenceShotSize = '' | 'wide' | 'medium' | 'close-up' | 'detail'
export const PROMPT_SEQUENCE_SHOT_SIZES = ['wide', 'medium', 'close-up', 'detail'] as const
export type PromptSequenceBeat = {
id: string
name: string
text: string
/** Empty = always include for any shot size. */
framings: Array<'wide' | 'medium' | 'close-up' | 'detail'>
}
export type PromptSequenceSet = {
id: string
name: string
description: string
beats: PromptSequenceBeat[]
}
export type PromptSequenceSetState = {
setId: string
on: boolean
}
export type PromptSequenceScene = {
id: string
title: string
style: string
settings: string
shotSize: PromptSequenceShotSize
setStates: PromptSequenceSetState[]
characterStates: PromptSequenceCharacterState[]
prompt: string
}
@@ -31,6 +57,7 @@ export type PromptSequence = {
id: string
name: string
characters: PromptSequenceCharacter[]
sets: PromptSequenceSet[]
scenes: PromptSequenceScene[]
createdAt: number
updatedAt: number
@@ -55,16 +82,34 @@ export function emptyCharacter(): PromptSequenceCharacter {
return { id: newId(), name: '', description: '', outfits: [] }
}
export function emptyBeat(): PromptSequenceBeat {
return { id: newId(), name: '', text: '', framings: [] }
}
export function emptySet(): PromptSequenceSet {
return { id: newId(), name: '', description: '', beats: [emptyBeat()] }
}
export function defaultCharacterState(characterId: string, on = true): PromptSequenceCharacterState {
return { characterId, on, outfitId: null }
}
export function emptyScene(index = 1, characters: PromptSequenceCharacter[] = []): PromptSequenceScene {
export function defaultSetState(setId: string, on = true): PromptSequenceSetState {
return { setId, on }
}
export function emptyScene(
index = 1,
characters: PromptSequenceCharacter[] = [],
sets: PromptSequenceSet[] = []
): PromptSequenceScene {
return {
id: newId(),
title: `Scene ${Math.max(1, index)}`,
style: '',
settings: '',
shotSize: '',
setStates: sets.map(set => defaultSetState(set.id, true)),
characterStates: characters.map(character => defaultCharacterState(character.id, true)),
prompt: ''
}
@@ -76,6 +121,11 @@ export function cloneSceneForNext(previous: PromptSequenceScene, nextIndex: numb
title: `Scene ${nextIndex}`,
style: previous.style,
settings: previous.settings,
shotSize: previous.shotSize || '',
setStates: (previous.setStates || []).map(state => ({
setId: state.setId,
on: !!state.on
})),
characterStates: (previous.characterStates || []).map(state => ({
characterId: state.characterId,
on: !!state.on,
@@ -110,6 +160,38 @@ export function formatCharacterLine(
return `${base}. Outfit: ${outfitText}`
}
export function beatMatchesShotSize(
beat: { framings?: string[] },
shotSize: string = ''
) {
const framings = Array.isArray(beat.framings) ? beat.framings.filter(Boolean) : []
if (!framings.length) return true
if (!shotSize) return true
return framings.includes(shotSize)
}
/** Set description + matching beat texts (one per line). No set/beat names or framing tags. */
export function assembleSetBlock(
scene: { shotSize?: string; setStates?: PromptSequenceSetState[] },
sets: PromptSequenceSet[] = []
) {
const states = scene.setStates || []
const stateById = new Map(states.map(state => [state.setId, state]))
const chunks: string[] = []
for (const set of sets) {
const state = stateById.get(set.id)
if (state && !state.on) continue
const description = String(set.description || '').trim()
const beatLines = (set.beats || [])
.filter(beat => beatMatchesShotSize(beat, scene.shotSize || ''))
.map(beat => String(beat.text || '').trim())
.filter(Boolean)
const lines = [description, ...beatLines].filter(Boolean)
if (lines.length) chunks.push(lines.join('\n'))
}
return chunks.join('\n')
}
export function resolveSceneCharacterLines(
scene: { characterStates?: PromptSequenceCharacterState[] },
characters: PromptSequenceCharacter[] = []
@@ -119,7 +201,6 @@ export function resolveSceneCharacterLines(
return characters
.map((character) => {
const state = stateById.get(character.id)
// Missing state (legacy) => on
if (state && !state.on) return ''
const outfitId = state?.outfitId || null
const outfit = outfitId
@@ -135,12 +216,18 @@ export function assembleSceneText(
style?: string
settings?: string
prompt?: string
shotSize?: string
setStates?: PromptSequenceSetState[]
characterStates?: PromptSequenceCharacterState[]
/** Legacy per-scene characters (migration / old tests). */
characters?: Array<{ name?: string; description?: string }>
},
sequenceCharacters?: PromptSequenceCharacter[]
sequenceCharacters?: PromptSequenceCharacter[],
sequenceSets?: PromptSequenceSet[]
) {
const setBlock = sequenceSets?.length
? assembleSetBlock(scene, sequenceSets)
: ''
const characterBlock = sequenceCharacters?.length
? resolveSceneCharacterLines(scene, sequenceCharacters).join('\n')
: (scene.characters || [])
@@ -150,6 +237,7 @@ export function assembleSceneText(
const parts = [
String(scene.style || '').trim(),
String(scene.settings || '').trim(),
setBlock,
characterBlock,
String(scene.prompt || '').trim()
].filter(Boolean)
@@ -163,17 +251,25 @@ export function assembleSceneText(
*/
export function assembleSequenceText(sequence: {
characters?: PromptSequenceCharacter[]
sets?: PromptSequenceSet[]
scenes?: Array<{
style?: string
settings?: string
prompt?: string
shotSize?: string
setStates?: PromptSequenceSetState[]
characterStates?: PromptSequenceCharacterState[]
characters?: Array<{ name?: string; description?: string }>
}>
}) {
const characters = sequence.characters || []
const sets = sequence.sets || []
return (sequence.scenes || [])
.map(scene => assembleSceneText(scene, characters.length ? characters : undefined))
.map(scene => assembleSceneText(
scene,
characters.length ? characters : undefined,
sets.length ? sets : undefined
))
.filter(Boolean)
.join('\n\n\n')
}
@@ -191,6 +287,12 @@ export function normalizePromptSequenceTitle(raw: unknown, fallback: string) {
return title || fallback
}
export function normalizeShotSize(raw: unknown): PromptSequenceShotSize {
const value = String(raw || '').trim()
if (value === 'wide' || value === 'medium' || value === 'close-up' || value === 'detail') return value
return ''
}
export function normalizeOutfit(raw: unknown): PromptSequenceOutfit {
const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown>
return {
@@ -211,6 +313,32 @@ export function normalizeCharacter(raw: unknown): PromptSequenceCharacter {
}
}
export function normalizeBeat(raw: unknown): PromptSequenceBeat {
const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown>
const framings = Array.isArray(rec.framings)
? [...new Set(rec.framings.map(item => String(item || '').trim()).filter((item): item is 'wide' | 'medium' | 'close-up' | 'detail' =>
item === 'wide' || item === 'medium' || item === 'close-up' || item === 'detail'
))]
: []
return {
id: String(rec.id || '').trim() || newId(),
name: String(rec.name || '').trim().slice(0, 120),
text: normalizePromptSequenceField(rec.text),
framings
}
}
export function normalizeSet(raw: unknown): PromptSequenceSet {
const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown>
const beats = Array.isArray(rec.beats) ? rec.beats.map(normalizeBeat) : []
return {
id: String(rec.id || '').trim() || newId(),
name: String(rec.name || '').trim().slice(0, 120),
description: normalizePromptSequenceField(rec.description),
beats: beats.length ? beats : [emptyBeat()]
}
}
export function normalizeCharacterState(raw: unknown, fallbackCharacterId = ''): PromptSequenceCharacterState {
const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown>
const characterId = String(rec.characterId || fallbackCharacterId || '').trim()
@@ -223,6 +351,14 @@ export function normalizeCharacterState(raw: unknown, fallbackCharacterId = ''):
}
}
export function normalizeSetState(raw: unknown, fallbackSetId = ''): PromptSequenceSetState {
const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown>
return {
setId: String(rec.setId || fallbackSetId || '').trim(),
on: rec.on === undefined ? true : !!rec.on
}
}
function liftLegacyCharacters(scenesRaw: unknown[]): PromptSequenceCharacter[] {
const byId = new Map<string, PromptSequenceCharacter>()
for (const scene of scenesRaw) {
@@ -261,10 +397,27 @@ function syncCharacterStates(
})
}
function syncSetStates(
statesRaw: unknown,
sets: PromptSequenceSet[],
defaultOn = true
): PromptSequenceSetState[] {
const incoming = Array.isArray(statesRaw)
? statesRaw.map(state => normalizeSetState(state)).filter(state => state.setId)
: []
const byId = new Map(incoming.map(state => [state.setId, state]))
return sets.map((set) => {
const existing = byId.get(set.id)
if (existing) return { setId: set.id, on: existing.on }
return defaultSetState(set.id, defaultOn)
})
}
export function normalizeScene(
raw: unknown,
index: number,
characters: PromptSequenceCharacter[] = []
characters: PromptSequenceCharacter[] = [],
sets: PromptSequenceSet[] = []
): PromptSequenceScene {
const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown>
return {
@@ -272,6 +425,8 @@ export function normalizeScene(
title: normalizePromptSequenceTitle(rec.title, `Scene ${index + 1}`),
style: normalizePromptSequenceField(rec.style),
settings: normalizePromptSequenceField(rec.settings),
shotSize: normalizeShotSize(rec.shotSize),
setStates: syncSetStates(rec.setStates, sets, true),
characterStates: syncCharacterStates(rec.characterStates, characters, true),
prompt: normalizePromptSequenceField(rec.prompt)
}
@@ -287,14 +442,16 @@ export function normalizePromptSequence(raw: unknown): PromptSequence | null {
? rec.characters.map(normalizeCharacter)
: liftLegacyCharacters(scenesRaw)
if (!characters.length) characters = [emptyCharacter()]
const sets = Array.isArray(rec.sets) ? rec.sets.map(normalizeSet) : []
const scenes = scenesRaw.length
? scenesRaw.map((scene, index) => normalizeScene(scene, index, characters))
: [emptyScene(1, characters)]
? scenesRaw.map((scene, index) => normalizeScene(scene, index, characters, sets))
: [emptyScene(1, characters, sets)]
const createdAt = Number(rec.createdAt) || Date.now()
return {
id: String(rec.id || '').trim() || newId(),
name,
characters,
sets,
scenes,
createdAt,
updatedAt: Number(rec.updatedAt) || createdAt
@@ -307,7 +464,7 @@ export function ensureSceneStatesForCharacters(
characters: PromptSequenceCharacter[],
opts?: { newCharacterId?: string; turnOnSceneIndex?: number }
) {
const newId = opts?.newCharacterId
const newCharacterId = opts?.newCharacterId
const turnOnIndex = opts?.turnOnSceneIndex
for (let i = 0; i < scenes.length; i++) {
const scene = scenes[i]
@@ -315,10 +472,32 @@ export function ensureSceneStatesForCharacters(
scene.characterStates = characters.map((character) => {
const existing = byId.get(character.id)
if (existing) return existing
const on = newId && character.id === newId
const on = newCharacterId && character.id === newCharacterId
? i === turnOnIndex
: true
return defaultCharacterState(character.id, on)
})
}
}
/** Ensure every scene has a state row for every sequence set. */
export function ensureSceneStatesForSets(
scenes: PromptSequenceScene[],
sets: PromptSequenceSet[],
opts?: { newSetId?: string; turnOnSceneIndex?: number }
) {
const newSetId = opts?.newSetId
const turnOnIndex = opts?.turnOnSceneIndex
for (let i = 0; i < scenes.length; i++) {
const scene = scenes[i]
const byId = new Map((scene.setStates || []).map(state => [state.setId, state]))
scene.setStates = sets.map((set) => {
const existing = byId.get(set.id)
if (existing) return existing
const on = newSetId && set.id === newSetId
? i === turnOnIndex
: true
return defaultSetState(set.id, on)
})
}
}