Replace Prompt Builder beats with complete set framings.

Sets are places with labeled full-text framings; selecting a framing copies only that text, and legacy beat-only sets migrate to a wide framing.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Towsty
2026-10-03 22:28:44 -05:00
co-authored by Cursor
parent d803d57a78
commit b6eef6a511
3 changed files with 1058 additions and 1006 deletions
+85 -93
View File
@@ -131,7 +131,7 @@
<div class="flex flex-wrap items-center justify-between gap-2">␍ <div class="flex flex-wrap items-center justify-between gap-2">␍
<div>␍ <div>␍
<span class="text-sm font-medium text-zinc-300">Sets</span>␍ <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> <p class="text-[11px] text-zinc-500">Sequence-wide locations and props. Toggle and framing per scene below.</p>␍
</div>␍ </div>␍
<button␍ <button␍
type="button"␍ type="button"␍
@@ -160,69 +160,50 @@
</button>␍ </button>␍
</div>␍ </div>␍
</div>␍ </div>␍
<input <label class="block text-sm">␍
v-model="set.name" <input␍
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" v-model="set.name"␍
maxlength="120" 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"␍
placeholder="Name" maxlength="120"␍
> placeholder="Name"␍
<textarea >␍
v-model="set.description" <p class="mt-1 text-[11px] text-zinc-500">Label only — not copied into the prompt.</p>␍
rows="2" </label>␍
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="space-y-2 border-t border-white/5 pt-3">␍
<div class="flex flex-wrap items-center justify-between gap-2">␍ <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> <span class="text-[11px] font-medium uppercase tracking-wide text-zinc-500">Framings</span>␍
<button␍ <button␍
type="button"␍ type="button"␍
class="rounded-full bg-amber-400 px-4 min-h-11 py-2.5 text-sm font-semibold text-zinc-950 hover:bg-amber-300 disabled:cursor-not-allowed disabled:opacity-50"␍ class="rounded-full bg-amber-400 px-4 min-h-11 py-2.5 text-sm font-semibold text-zinc-950 hover:bg-amber-300 disabled:cursor-not-allowed disabled:opacity-50"␍
@click="addBeat(sIndex)" @click="addFraming(sIndex)"␍
>␍ >␍
Add beat Add framing␍
</button>␍ </button>␍
</div>␍ </div>␍
<div␍ <div␍
v-for="(beat, bIndex) in set.beats" v-for="(framing, fIndex) in set.framings"␍
:key="beat.id" :key="framing.id"␍
class="rounded-xl border border-white/5 bg-zinc-950/50 p-2 space-y-2"␍ 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">␍ <div class="flex items-center justify-between gap-2">␍
<span class="text-[11px] text-zinc-500">Beat {{ bIndex + 1 }}</span> <span class="text-[11px] text-zinc-500">Framing {{ fIndex + 1 }}</span>␍
<div class="flex items-center gap-2">␍ <div class="flex items-center gap-2">␍
<button type="button" class="rounded-full border border-amber-300/70 px-3 min-h-11 py-1.5 text-sm font-semibold text-amber-100 hover:border-amber-300 hover:bg-amber-400/10" @click="clearBeat(sIndex, bIndex)">Clear</button> <button type="button" class="rounded-full border border-amber-300/70 px-3 min-h-11 py-1.5 text-sm font-semibold text-amber-100 hover:border-amber-300 hover:bg-amber-400/10" @click="clearFraming(sIndex, fIndex)">Clear</button>␍
<button type="button" class="rounded-full border border-amber-300/70 px-3 min-h-11 py-2 text-sm font-semibold text-amber-100 hover:border-amber-300 hover:bg-amber-400/10" @click="removeBeat(sIndex, bIndex)">Remove</button> <button type="button" class="rounded-full border border-amber-300/70 px-3 min-h-11 py-2 text-sm font-semibold text-amber-100 hover:border-amber-300 hover:bg-amber-400/10" @click="removeFraming(sIndex, fIndex)">Remove</button>␍
</div>␍ </div>␍
</div>␍ </div>␍
<input␍ <input␍
v-model="beat.name" v-model="framing.label"␍
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"␍ 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"␍ maxlength="120"␍
placeholder="Beat name (not copied)" :placeholder="framingLabelPlaceholder(fIndex)"␍
>␍ >␍
<textarea␍ <textarea␍
v-model="beat.text" v-model="framing.text"␍
rows="2"␍ 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"␍ 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" placeholder="Place / location text copied into the prompt"␍
/>␍ />␍
<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>␍ </div>␍
@@ -316,31 +297,15 @@
/>␍ />␍
</div>␍ </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 v-if="sets.length" class="space-y-3">␍
<div>␍ <div>␍
<span class="text-sm font-medium text-zinc-300">Sets in this scene</span>␍ <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> <p class="text-[11px] text-zinc-500">Toggle which set blocks appear. Pick a framing for each on set.</p>␍
</div>␍ </div>␍
<div␍ <div␍
v-for="set in sets"␍ v-for="set in sets"␍
:key="'scene-set-'+set.id"␍ :key="'scene-set-'+set.id"␍
class="rounded-2xl border border-white/10 bg-zinc-950/40 px-3 py-2.5" class="rounded-2xl border border-white/10 bg-zinc-950/40 px-3 py-2.5 space-y-2"␍
>␍ >␍
<label class="flex items-center justify-between gap-3 text-sm text-zinc-200">␍ <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>␍ <span class="min-w-0 truncate">{{ set.name || 'Unnamed set' }}</span>␍
@@ -351,6 +316,19 @@
@change="setSetOn(set.id, ($event.target as HTMLInputElement).checked)"␍ @change="setSetOn(set.id, ($event.target as HTMLInputElement).checked)"␍
>␍ >␍
</label>␍ </label>␍
<label v-if="isSetOn(set.id)" class="block text-[11px] text-zinc-500">␍
Framing␍
<select␍
class="mt-1 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"␍
:value="activeSetFramingId(set.id) || ''"␍
@change="setSetFraming(set.id, ($event.target as HTMLSelectElement).value)"␍
>␍
<option value="">None</option>␍
<option v-for="framing in set.framings" :key="framing.id" :value="framing.id">␍
{{ framing.label || 'Untitled framing' }}␍
</option>␍
</select>␍
</label>␍
</div>␍ </div>␍
</div>␍ </div>␍
␍ ␍
@@ -487,18 +465,17 @@
<script setup lang="ts">␍ <script setup lang="ts">␍
import type {␍ import type {␍
PromptSequence,␍ PromptSequence,␍
PromptSequenceBeat,
PromptSequenceCharacter,␍ PromptSequenceCharacter,␍
PromptSequenceScene,␍ PromptSequenceScene,␍
PromptSequenceSet␍ PromptSequenceSet␍
} from '~/utils/promptSequences'␍ } from '~/utils/promptSequences'␍
import {␍ import {␍
PROMPT_SEQUENCE_SHOT_SIZES, PROMPT_SEQUENCE_FRAMING_SUGGESTIONS,␍
assembleSceneText,␍ assembleSceneText,␍
assembleSequenceText,␍ assembleSequenceText,␍
cloneSceneForNext,␍ cloneSceneForNext,␍
emptyBeat,
emptyCharacter,␍ emptyCharacter,␍
emptyFraming,␍
emptyOutfit,␍ emptyOutfit,␍
emptyScene,␍ emptyScene,␍
emptySet,␍ emptySet,␍
@@ -525,8 +502,6 @@ const copiedScene = ref(false)
let copyTimer: ReturnType<typeof setTimeout> | null = null␍ let copyTimer: ReturnType<typeof setTimeout> | null = null␍
let copySceneTimer: 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 activeScene = computed(() => scenes.value[activeIndex.value] || null)␍
const previewText = computed(() => assembleSequenceText({␍ const previewText = computed(() => assembleSequenceText({␍
characters: characters.value,␍ characters: characters.value,␍
@@ -538,6 +513,11 @@ const activeSceneText = computed(() => {
return assembleSceneText(activeScene.value, characters.value, sets.value)␍ return assembleSceneText(activeScene.value, characters.value, sets.value)␍
})␍ })␍
␍ ␍
function framingLabelPlaceholder(index: number) {␍
const suggestion = PROMPT_SEQUENCE_FRAMING_SUGGESTIONS[index % PROMPT_SEQUENCE_FRAMING_SUGGESTIONS.length]␍
return suggestion || 'wide / medium / narrow'␍
}␍
␍
function startNew() {␍ function startNew() {␍
selectedId.value = ''␍ selectedId.value = ''␍
name.value = ''␍ name.value = ''␍
@@ -561,15 +541,15 @@ function select(sequence: PromptSequence) {
sets.value = (normalized.sets || []).map(set => ({␍ sets.value = (normalized.sets || []).map(set => ({␍
...emptySet(),␍ ...emptySet(),␍
...set,␍ ...set,␍
beats: (set.beats?.length ? set.beats : [emptyBeat()]).map(beat => ({ ...emptyBeat(), ...beat })) framings: (set.framings?.length ? set.framings : [emptyFraming()]).map(framing => ({ ...emptyFraming(), ...framing }))␍
}))␍ }))␍
scenes.value = (normalized.scenes?.length ? normalized.scenes : [emptyScene(1, characters.value, sets.value)]).map((scene, index) => ({␍ scenes.value = (normalized.scenes?.length ? normalized.scenes : [emptyScene(1, characters.value, sets.value)]).map((scene, index) => ({␍
...emptyScene(index + 1, characters.value, sets.value),␍ ...emptyScene(index + 1, characters.value, sets.value),␍
...scene,␍ ...scene,␍
shotSize: scene.shotSize || '',
setStates: (scene.setStates || []).map(state => ({␍ setStates: (scene.setStates || []).map(state => ({␍
setId: state.setId,␍ setId: state.setId,␍
on: state.on !== false on: state.on !== false,␍
framingId: state.framingId || null␍
})),␍ })),␍
characterStates: (scene.characterStates || []).map(state => ({␍ characterStates: (scene.characterStates || []).map(state => ({␍
characterId: state.characterId,␍ characterId: state.characterId,␍
@@ -676,8 +656,11 @@ function clearSet(index: number) {
const set = sets.value[index]␍ const set = sets.value[index]␍
if (!set) return␍ if (!set) return␍
set.name = ''␍ set.name = ''␍
set.description = '' set.framings = [emptyFraming()]␍
set.beats = [emptyBeat()] for (const scene of scenes.value) {␍
const state = scene.setStates.find(item => item.setId === set.id)␍
if (state) state.framingId = null␍
}␍
}␍ }␍
␍ ␍
function removeSet(index: number) {␍ function removeSet(index: number) {␍
@@ -688,38 +671,30 @@ function removeSet(index: number) {
}␍ }␍
}␍ }␍
␍ ␍
function addBeat(setIndex: number) { function addFraming(setIndex: number) {␍
const set = sets.value[setIndex]␍ const set = sets.value[setIndex]␍
if (!set) return␍ if (!set) return␍
set.beats.push(emptyBeat()) set.framings.push(emptyFraming())␍
}␍ }␍
␍ ␍
function removeBeat(setIndex: number, beatIndex: number) { function removeFraming(setIndex: number, framingIndex: number) {␍
const set = sets.value[setIndex]␍ const set = sets.value[setIndex]␍
if (!set) return␍ if (!set) return␍
set.beats.splice(beatIndex, 1) const [removed] = set.framings.splice(framingIndex, 1)␍
} if (!removed) return␍
for (const scene of scenes.value) {␍
function clearBeat(setIndex: number, beatIndex: number) { const state = scene.setStates.find(item => item.setId === set.id)␍
const beat = sets.value[setIndex]?.beats[beatIndex] if (state?.framingId === removed.id) state.framingId = null␍
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 clearFraming(setIndex: number, framingIndex: number) {␍
const framing = sets.value[setIndex]?.framings[framingIndex]␍
if (!framing) return␍
framing.label = ''␍
framing.text = ''␍
}␍
␍
function sceneSetState(setId: string) {␍ function sceneSetState(setId: string) {␍
return activeScene.value?.setStates?.find(state => state.setId === setId)␍ return activeScene.value?.setStates?.find(state => state.setId === setId)␍
}␍ }␍
@@ -732,12 +707,29 @@ function isSetOn(setId: string) {
function setSetOn(setId: string, on: boolean) {␍ function setSetOn(setId: string, on: boolean) {␍
const state = sceneSetState(setId)␍ const state = sceneSetState(setId)␍
if (!state) {␍ if (!state) {␍
activeScene.value?.setStates.push({ setId, on }) activeScene.value?.setStates.push({ setId, on, framingId: null })␍
return␍ return␍
}␍ }␍
state.on = on␍ state.on = on␍
}␍ }␍
␍ ␍
function activeSetFramingId(setId: string) {␍
return sceneSetState(setId)?.framingId || ''␍
}␍
␍
function setSetFraming(setId: string, framingId: string) {␍
const state = sceneSetState(setId)␍
if (!state) {␍
activeScene.value?.setStates.push({␍
setId,␍
on: true,␍
framingId: framingId || null␍
})␍
return␍
}␍
state.framingId = framingId || null␍
}␍
␍
function sceneState(characterId: string) {␍ function sceneState(characterId: string) {␍
return activeScene.value?.characterStates.find(state => state.characterId === characterId)␍ return activeScene.value?.characterStates.find(state => state.characterId === characterId)␍
}␍ }␍
+85 -61
View File
@@ -23,11 +23,10 @@ const {
emptyCharacter, emptyCharacter,
emptyOutfit, emptyOutfit,
emptySet, emptySet,
emptyBeat, emptyFraming,
cloneSceneForNext, cloneSceneForNext,
normalizePromptSequence, normalizePromptSequence,
ensureSceneStatesForCharacters, ensureSceneStatesForCharacters
beatMatchesShotSize
} = await import(pathToFileURL(tmp).href) } = await import(pathToFileURL(tmp).href)
unlinkSync(tmp) unlinkSync(tmp)
@@ -39,84 +38,112 @@ test('formatCharacterLine covers name/description and outfit', () => {
) )
}) })
test('shot size filters beats; untagged always included; tags never copied', () => { test('selecting a framing copies only that framing text; labels never appear', () => {
const wide = { ...emptyFraming('wide'), id: 'f-wide', text: 'open courtyard at dawn' }
const medium = { ...emptyFraming('medium'), id: 'f-med', text: 'courtyard from the arch' }
const narrow = { ...emptyFraming('narrow'), id: 'f-nar', text: 'door latch detail' }
const set = { const set = {
...emptySet(), ...emptySet(),
id: 's1', id: 's1',
name: 'BadgeSet', name: 'Courtyard',
description: 'studio backdrop', framings: [wide, medium, narrow]
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 = { const base = {
style: 'style', style: 'style',
settings: 'settings', settings: 'settings',
shotSize: 'medium',
setStates: [{ setId: 's1', on: true }],
characterStates: [], characterStates: [],
prompt: 'prompt' prompt: 'prompt'
} }
const mediumText = assembleSceneText(sceneMedium, [], [set]) const mediumText = assembleSceneText({
assert.equal( ...base,
mediumText, setStates: [{ setId: 's1', on: true, framingId: 'f-med' }]
'style\n\nsettings\n\nstudio backdrop\nwide and medium\nuntagged beat\n\nprompt' }, [], [set])
) assert.equal(mediumText, 'style\n\nsettings\n\ncourtyard from the arch\n\nprompt')
assert.ok(!mediumText.includes('wide only')) assert.ok(!mediumText.includes('open courtyard'))
assert.ok(!mediumText.includes('close only')) assert.ok(!mediumText.includes('door latch'))
assert.ok(!mediumText.includes('BadgeSet')) assert.ok(!mediumText.includes('Courtyard'))
assert.ok(!mediumText.includes('WideBeat')) assert.ok(!mediumText.includes('wide'))
assert.ok(!mediumText.includes('close-up')) assert.ok(!mediumText.includes('medium'))
assert.ok(!/\bwide\b/.test(mediumText.replace('wide and medium', ''))) assert.ok(!mediumText.includes('narrow'))
const sceneClose = { ...sceneMedium, shotSize: 'close-up' } const narrowText = assembleSceneText({
const closeText = assembleSceneText(sceneClose, [], [set]) ...base,
assert.equal( setStates: [{ setId: 's1', on: true, framingId: 'f-nar' }]
closeText, }, [], [set])
'style\n\nsettings\n\nstudio backdrop\nuntagged beat\nclose only\n\nprompt' assert.equal(narrowText, 'style\n\nsettings\n\ndoor latch detail\n\nprompt')
) assert.ok(!narrowText.includes('open courtyard'))
assert.ok(!narrowText.includes('from the arch'))
const sceneAny = { ...sceneMedium, shotSize: '' } const noneText = assembleSceneText({
const anyText = assembleSceneText(sceneAny, [], [set]) ...base,
assert.ok(anyText.includes('wide only line')) setStates: [{ setId: 's1', on: true, framingId: null }]
assert.ok(anyText.includes('wide and medium')) }, [], [set])
assert.ok(anyText.includes('untagged beat')) assert.equal(noneText, 'style\n\nsettings\n\nprompt')
assert.ok(anyText.includes('close only'))
assert.equal(beatMatchesShotSize({ framings: ['wide'] }, 'medium'), false)
assert.equal(beatMatchesShotSize({ framings: [] }, 'medium'), true)
}) })
test('off set omitted; copy scene is one scene; sequence join is double blank', () => { test('off set is omitted; sequence join is double blank', () => {
const set = { const framing = { ...emptyFraming('wide'), id: 'f1', text: 'set text' }
...emptySet(), const set = { ...emptySet(), id: 's1', name: 'Place', framings: [framing] }
id: 's1',
description: 'set desc',
beats: [{ ...emptyBeat(), text: 'beat', framings: [] }]
}
const scene1 = { const scene1 = {
style: 'a', style: 'a',
settings: '', settings: '',
shotSize: '', setStates: [{ setId: 's1', on: true, framingId: 'f1' }],
setStates: [{ setId: 's1', on: true }],
characterStates: [], characterStates: [],
prompt: 'p1' prompt: 'p1'
} }
const scene2 = { const scene2 = {
style: 'b', style: 'b',
settings: '', settings: '',
shotSize: '', setStates: [{ setId: 's1', on: false, framingId: 'f1' }],
setStates: [{ setId: 's1', on: false }],
characterStates: [], characterStates: [],
prompt: 'p2' prompt: 'p2'
} }
assert.equal(assembleSceneText(scene2, [], [set]), 'b\n\np2') assert.equal(assembleSceneText(scene2, [], [set]), 'b\n\np2')
const full = assembleSequenceText({ sets: [set], scenes: [scene1, scene2] }) 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(full, 'a\n\nset text\n\np1\n\n\nb\n\np2')
assert.equal(assembleSceneText(scene1, [], [set]), 'a\n\nset desc\nbeat\n\np1') assert.ok(!full.includes('Place'))
assert.ok(!full.includes('wide'))
})
test('legacy beat-only set still opens as one wide framing', () => {
const legacy = normalizePromptSequence({
id: 'seq1',
name: 'Old beats',
sets: [{
id: 's1',
name: 'Hall',
description: 'stone walls',
beats: [
{ id: 'b1', name: 'Beat1', text: 'first beat', framings: ['wide'] },
{ id: 'b2', name: 'Beat2', text: 'second beat', framings: ['medium'] }
]
}],
scenes: [{
id: 'sc1',
title: 'Scene 1',
style: 'oil',
settings: '',
shotSize: 'wide',
setStates: [{ setId: 's1', on: true }],
prompt: 'walk',
characters: []
}],
characters: [{ id: 'x', name: 'Ada', description: 'tall', outfits: [] }],
createdAt: 1,
updatedAt: 1
})
assert.equal(legacy.sets.length, 1)
assert.equal(legacy.sets[0].framings.length, 1)
assert.equal(legacy.sets[0].framings[0].label, 'wide')
assert.ok(legacy.sets[0].framings[0].text.includes('stone walls'))
assert.ok(legacy.sets[0].framings[0].text.includes('first beat'))
assert.ok(legacy.sets[0].framings[0].text.includes('second beat'))
assert.equal(legacy.scenes[0].setStates[0].framingId, legacy.sets[0].framings[0].id)
const text = assembleSequenceText(legacy)
assert.ok(text.includes('stone walls'))
assert.ok(text.includes('first beat'))
assert.ok(!text.includes('Hall'))
assert.ok(!text.includes('Beat1'))
}) })
test('legacy sequence without sets still assembles', () => { test('legacy sequence without sets still assembles', () => {
@@ -137,19 +164,17 @@ test('legacy sequence without sets still assembles', () => {
updatedAt: 1 updatedAt: 1
}) })
assert.deepEqual(legacy.sets, []) assert.deepEqual(legacy.sets, [])
assert.equal(legacy.scenes[0].shotSize, '') assert.equal(assembleSequenceText(legacy), 'oil\n\nAda: tall\n\nwalk')
const text = assembleSequenceText(legacy)
assert.equal(text, 'oil\n\nAda: tall\n\nwalk')
}) })
test('cloneSceneForNext copies shotSize and setStates', () => { test('cloneSceneForNext copies setStates including framingId', () => {
const sets = [emptySet()] const sets = [emptySet()]
const first = emptyScene(1, [], sets) const first = emptyScene(1, [], sets)
first.shotSize = 'close-up'
first.setStates[0].on = false first.setStates[0].on = false
first.setStates[0].framingId = sets[0].framings[0].id
const next = cloneSceneForNext(first, 2) const next = cloneSceneForNext(first, 2)
assert.equal(next.shotSize, 'close-up')
assert.equal(next.setStates[0].on, false) assert.equal(next.setStates[0].on, false)
assert.equal(next.setStates[0].framingId, sets[0].framings[0].id)
assert.equal(next.setStates[0].setId, sets[0].id) assert.equal(next.setStates[0].setId, sets[0].id)
}) })
@@ -164,7 +189,6 @@ test('character outfit and off still work with sets', () => {
const text = assembleSceneText({ const text = assembleSceneText({
style: '', style: '',
settings: '', settings: '',
shotSize: '',
setStates: [], setStates: [],
characterStates: [{ characterId: 'c1', on: true, outfitId: 'o1' }], characterStates: [{ characterId: 'c1', on: true, outfitId: 'o1' }],
prompt: 'hi' prompt: 'hi'
+105 -69
View File
@@ -18,28 +18,26 @@ export type PromptSequenceCharacterState = {
outfitId: string | null outfitId: string | null
} }
export type PromptSequenceShotSize = '' | 'wide' | 'medium' | 'close-up' | 'detail' /** Suggested labels only — not a hard enum. */
export const PROMPT_SEQUENCE_FRAMING_SUGGESTIONS = ['wide', 'medium', 'narrow'] as const
export const PROMPT_SEQUENCE_SHOT_SIZES = ['wide', 'medium', 'close-up', 'detail'] as const export type PromptSequenceFraming = {
export type PromptSequenceBeat = {
id: string id: string
name: string label: string
text: string text: string
/** Empty = always include for any shot size. */
framings: Array<'wide' | 'medium' | 'close-up' | 'detail'>
} }
export type PromptSequenceSet = { export type PromptSequenceSet = {
id: string id: string
name: string name: string
description: string framings: PromptSequenceFraming[]
beats: PromptSequenceBeat[]
} }
export type PromptSequenceSetState = { export type PromptSequenceSetState = {
setId: string setId: string
on: boolean on: boolean
/** Chosen framing for this set in this scene (like outfitId). Empty = copy nothing. */
framingId: string | null
} }
export type PromptSequenceScene = { export type PromptSequenceScene = {
@@ -47,7 +45,6 @@ export type PromptSequenceScene = {
title: string title: string
style: string style: string
settings: string settings: string
shotSize: PromptSequenceShotSize
setStates: PromptSequenceSetState[] setStates: PromptSequenceSetState[]
characterStates: PromptSequenceCharacterState[] characterStates: PromptSequenceCharacterState[]
prompt: string prompt: string
@@ -82,20 +79,20 @@ export function emptyCharacter(): PromptSequenceCharacter {
return { id: newId(), name: '', description: '', outfits: [] } return { id: newId(), name: '', description: '', outfits: [] }
} }
export function emptyBeat(): PromptSequenceBeat { export function emptyFraming(label = ''): PromptSequenceFraming {
return { id: newId(), name: '', text: '', framings: [] } return { id: newId(), label, text: '' }
} }
export function emptySet(): PromptSequenceSet { export function emptySet(): PromptSequenceSet {
return { id: newId(), name: '', description: '', beats: [emptyBeat()] } return { id: newId(), name: '', framings: [emptyFraming()] }
} }
export function defaultCharacterState(characterId: string, on = true): PromptSequenceCharacterState { export function defaultCharacterState(characterId: string, on = true): PromptSequenceCharacterState {
return { characterId, on, outfitId: null } return { characterId, on, outfitId: null }
} }
export function defaultSetState(setId: string, on = true): PromptSequenceSetState { export function defaultSetState(setId: string, on = true, framingId: string | null = null): PromptSequenceSetState {
return { setId, on } return { setId, on, framingId }
} }
export function emptyScene( export function emptyScene(
@@ -108,8 +105,7 @@ export function emptyScene(
title: `Scene ${Math.max(1, index)}`, title: `Scene ${Math.max(1, index)}`,
style: '', style: '',
settings: '', settings: '',
shotSize: '', setStates: sets.map(set => defaultSetState(set.id, true, null)),
setStates: sets.map(set => defaultSetState(set.id, true)),
characterStates: characters.map(character => defaultCharacterState(character.id, true)), characterStates: characters.map(character => defaultCharacterState(character.id, true)),
prompt: '' prompt: ''
} }
@@ -121,10 +117,10 @@ export function cloneSceneForNext(previous: PromptSequenceScene, nextIndex: numb
title: `Scene ${nextIndex}`, title: `Scene ${nextIndex}`,
style: previous.style, style: previous.style,
settings: previous.settings, settings: previous.settings,
shotSize: previous.shotSize || '',
setStates: (previous.setStates || []).map(state => ({ setStates: (previous.setStates || []).map(state => ({
setId: state.setId, setId: state.setId,
on: !!state.on on: !!state.on,
framingId: state.framingId || null
})), })),
characterStates: (previous.characterStates || []).map(state => ({ characterStates: (previous.characterStates || []).map(state => ({
characterId: state.characterId, characterId: state.characterId,
@@ -160,19 +156,9 @@ export function formatCharacterLine(
return `${base}. Outfit: ${outfitText}` return `${base}. Outfit: ${outfitText}`
} }
export function beatMatchesShotSize( /** Selected framing text for each on set. No set name, no framing label. */
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( export function assembleSetBlock(
scene: { shotSize?: string; setStates?: PromptSequenceSetState[] }, scene: { setStates?: PromptSequenceSetState[] },
sets: PromptSequenceSet[] = [] sets: PromptSequenceSet[] = []
) { ) {
const states = scene.setStates || [] const states = scene.setStates || []
@@ -181,13 +167,11 @@ export function assembleSetBlock(
for (const set of sets) { for (const set of sets) {
const state = stateById.get(set.id) const state = stateById.get(set.id)
if (state && !state.on) continue if (state && !state.on) continue
const description = String(set.description || '').trim() const framingId = state?.framingId || null
const beatLines = (set.beats || []) if (!framingId) continue
.filter(beat => beatMatchesShotSize(beat, scene.shotSize || '')) const framing = (set.framings || []).find(item => item.id === framingId)
.map(beat => String(beat.text || '').trim()) const text = String(framing?.text || '').trim()
.filter(Boolean) if (text) chunks.push(text)
const lines = [description, ...beatLines].filter(Boolean)
if (lines.length) chunks.push(lines.join('\n'))
} }
return chunks.join('\n') return chunks.join('\n')
} }
@@ -216,7 +200,6 @@ export function assembleSceneText(
style?: string style?: string
settings?: string settings?: string
prompt?: string prompt?: string
shotSize?: string
setStates?: PromptSequenceSetState[] setStates?: PromptSequenceSetState[]
characterStates?: PromptSequenceCharacterState[] characterStates?: PromptSequenceCharacterState[]
/** Legacy per-scene characters (migration / old tests). */ /** Legacy per-scene characters (migration / old tests). */
@@ -256,7 +239,6 @@ export function assembleSequenceText(sequence: {
style?: string style?: string
settings?: string settings?: string
prompt?: string prompt?: string
shotSize?: string
setStates?: PromptSequenceSetState[] setStates?: PromptSequenceSetState[]
characterStates?: PromptSequenceCharacterState[] characterStates?: PromptSequenceCharacterState[]
characters?: Array<{ name?: string; description?: string }> characters?: Array<{ name?: string; description?: string }>
@@ -287,12 +269,6 @@ export function normalizePromptSequenceTitle(raw: unknown, fallback: string) {
return title || fallback 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 { export function normalizeOutfit(raw: unknown): PromptSequenceOutfit {
const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown> const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown>
return { return {
@@ -313,29 +289,46 @@ export function normalizeCharacter(raw: unknown): PromptSequenceCharacter {
} }
} }
export function normalizeBeat(raw: unknown): PromptSequenceBeat { export function normalizeFraming(raw: unknown): PromptSequenceFraming {
const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown> 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 { return {
id: String(rec.id || '').trim() || newId(), id: String(rec.id || '').trim() || newId(),
name: String(rec.name || '').trim().slice(0, 120), label: String(rec.label || '').trim().slice(0, 120),
text: normalizePromptSequenceField(rec.text), text: normalizePromptSequenceField(rec.text)
framings
} }
} }
/** Fold legacy beat-only sets into one framing labeled "wide". */
function framingsFromLegacyBeats(rec: Record<string, unknown>): PromptSequenceFraming[] {
const parts: string[] = []
const description = normalizePromptSequenceField(rec.description).trim()
if (description) parts.push(description)
const beats = Array.isArray(rec.beats) ? rec.beats : []
for (const beat of beats) {
if (!beat || typeof beat !== 'object') continue
const text = normalizePromptSequenceField((beat as Record<string, unknown>).text).trim()
if (text) parts.push(text)
}
if (!parts.length) return [emptyFraming()]
return [{ id: newId(), label: 'wide', text: parts.join('\n') }]
}
export function normalizeSet(raw: unknown): PromptSequenceSet { export function normalizeSet(raw: unknown): PromptSequenceSet {
const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown> const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown>
const beats = Array.isArray(rec.beats) ? rec.beats.map(normalizeBeat) : [] let framings: PromptSequenceFraming[]
if (Array.isArray(rec.framings) && rec.framings.length) {
framings = rec.framings.map(normalizeFraming)
} else if (Array.isArray(rec.beats) && rec.beats.length) {
framings = framingsFromLegacyBeats(rec)
} else if (String(rec.description || '').trim()) {
framings = framingsFromLegacyBeats(rec)
} else {
framings = [emptyFraming()]
}
return { return {
id: String(rec.id || '').trim() || newId(), id: String(rec.id || '').trim() || newId(),
name: String(rec.name || '').trim().slice(0, 120), name: String(rec.name || '').trim().slice(0, 120),
description: normalizePromptSequenceField(rec.description), framings
beats: beats.length ? beats : [emptyBeat()]
} }
} }
@@ -351,11 +344,30 @@ export function normalizeCharacterState(raw: unknown, fallbackCharacterId = ''):
} }
} }
export function normalizeSetState(raw: unknown, fallbackSetId = ''): PromptSequenceSetState { export function normalizeSetState(
raw: unknown,
fallbackSetId = '',
sets: PromptSequenceSet[] = [],
legacyShotSize = ''
): PromptSequenceSetState {
const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown> const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown>
const setId = String(rec.setId || fallbackSetId || '').trim()
const framingRaw = rec.framingId
let framingId = framingRaw == null || framingRaw === '' ? null : String(framingRaw).trim() || null
const set = sets.find(item => item.id === setId)
if (framingId && set && !set.framings.some(framing => framing.id === framingId)) {
framingId = null
}
if (!framingId && legacyShotSize && set) {
const match = set.framings.find(
framing => framing.label.trim().toLowerCase() === legacyShotSize.trim().toLowerCase()
)
if (match) framingId = match.id
}
return { return {
setId: String(rec.setId || fallbackSetId || '').trim(), setId,
on: rec.on === undefined ? true : !!rec.on on: rec.on === undefined ? true : !!rec.on,
framingId
} }
} }
@@ -400,16 +412,32 @@ function syncCharacterStates(
function syncSetStates( function syncSetStates(
statesRaw: unknown, statesRaw: unknown,
sets: PromptSequenceSet[], sets: PromptSequenceSet[],
defaultOn = true defaultOn = true,
legacyShotSize = ''
): PromptSequenceSetState[] { ): PromptSequenceSetState[] {
const incoming = Array.isArray(statesRaw) const incoming = Array.isArray(statesRaw)
? statesRaw.map(state => normalizeSetState(state)).filter(state => state.setId) ? statesRaw.map(state => normalizeSetState(state, '', sets, legacyShotSize)).filter(state => state.setId)
: [] : []
const byId = new Map(incoming.map(state => [state.setId, state])) const byId = new Map(incoming.map(state => [state.setId, state]))
return sets.map((set) => { return sets.map((set) => {
const existing = byId.get(set.id) const existing = byId.get(set.id)
if (existing) return { setId: set.id, on: existing.on } if (existing) {
return defaultSetState(set.id, defaultOn) const framingOk = existing.framingId
&& set.framings.some(framing => framing.id === existing.framingId)
return {
setId: set.id,
on: existing.on,
framingId: framingOk ? existing.framingId : null
}
}
let framingId: string | null = null
if (legacyShotSize) {
const match = set.framings.find(
framing => framing.label.trim().toLowerCase() === legacyShotSize.trim().toLowerCase()
)
if (match) framingId = match.id
}
return defaultSetState(set.id, defaultOn, framingId)
}) })
} }
@@ -420,13 +448,13 @@ export function normalizeScene(
sets: PromptSequenceSet[] = [] sets: PromptSequenceSet[] = []
): PromptSequenceScene { ): PromptSequenceScene {
const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown> const rec = (raw && typeof raw === 'object' ? raw : {}) as Record<string, unknown>
const legacyShotSize = String(rec.shotSize || '').trim()
return { return {
id: String(rec.id || '').trim() || newId(), id: String(rec.id || '').trim() || newId(),
title: normalizePromptSequenceTitle(rec.title, `Scene ${index + 1}`), title: normalizePromptSequenceTitle(rec.title, `Scene ${index + 1}`),
style: normalizePromptSequenceField(rec.style), style: normalizePromptSequenceField(rec.style),
settings: normalizePromptSequenceField(rec.settings), settings: normalizePromptSequenceField(rec.settings),
shotSize: normalizeShotSize(rec.shotSize), setStates: syncSetStates(rec.setStates, sets, true, legacyShotSize),
setStates: syncSetStates(rec.setStates, sets, true),
characterStates: syncCharacterStates(rec.characterStates, characters, true), characterStates: syncCharacterStates(rec.characterStates, characters, true),
prompt: normalizePromptSequenceField(rec.prompt) prompt: normalizePromptSequenceField(rec.prompt)
} }
@@ -493,11 +521,19 @@ export function ensureSceneStatesForSets(
const byId = new Map((scene.setStates || []).map(state => [state.setId, state])) const byId = new Map((scene.setStates || []).map(state => [state.setId, state]))
scene.setStates = sets.map((set) => { scene.setStates = sets.map((set) => {
const existing = byId.get(set.id) const existing = byId.get(set.id)
if (existing) return existing if (existing) {
const framingOk = existing.framingId
&& set.framings.some(framing => framing.id === existing.framingId)
return {
setId: set.id,
on: existing.on,
framingId: framingOk ? existing.framingId : null
}
}
const on = newSetId && set.id === newSetId const on = newSetId && set.id === newSetId
? i === turnOnIndex ? i === turnOnIndex
: true : true
return defaultSetState(set.id, on) return defaultSetState(set.id, on, null)
}) })
} }
} }