- QTESystem: trigger detection via timeupdate, multi-key matching, timeout handling - QTEOverlay: SVG countdown ring + key prompts + success/fail animation - Engine: integrate QTE (timeupdate check, conditional branching, effect application) - Subtitles: WebVTT parsing + synchronized subtitle rendering - GamePlayer: overlay QTE and subtitle components - SaveSystem: DB v2 with thumbnail field, canvas snapshot at 320x180 JPEG - SaveLoadMenu: thumbnail preview for save slots - VideoManager: getActiveVideoElement() for canvas capture - App.vue: QTE/subtitle integration, thumbnail capture on save - stores: QTE state management, save list with thumbnails - demo.json: QTE scene (right_door), subtitles, new event types - ROADMAP: mark P2 as completed
77 lines
1.9 KiB
TypeScript
77 lines
1.9 KiB
TypeScript
import Dexie, { type Table } from 'dexie'
|
|
import type { SaveData } from '../types'
|
|
|
|
interface SaveRecord {
|
|
id?: number
|
|
slot: number
|
|
timestamp: number
|
|
currentScene: string
|
|
variables: string
|
|
flags: string
|
|
history: string
|
|
thumbnail?: string
|
|
}
|
|
|
|
class SaveDB extends Dexie {
|
|
saves!: Table<SaveRecord, number>
|
|
|
|
constructor() {
|
|
super('MovieGameSaves')
|
|
this.version(2).stores({
|
|
saves: '++id, slot',
|
|
})
|
|
}
|
|
}
|
|
|
|
const db = new SaveDB()
|
|
|
|
export class SaveSystem {
|
|
async save(slot: number, data: Omit<SaveData, 'slot'>): Promise<void> {
|
|
const record: SaveRecord = {
|
|
slot,
|
|
timestamp: data.timestamp || Date.now(),
|
|
currentScene: data.currentScene,
|
|
variables: JSON.stringify(data.variables),
|
|
flags: JSON.stringify(data.flags),
|
|
history: JSON.stringify(data.history),
|
|
thumbnail: data.thumbnail,
|
|
}
|
|
|
|
const existing = await db.saves.where('slot').equals(slot).first()
|
|
if (existing) {
|
|
await db.saves.update(existing.id!, record)
|
|
} else {
|
|
await db.saves.add(record)
|
|
}
|
|
}
|
|
|
|
async load(slot: number): Promise<SaveData | null> {
|
|
const record = await db.saves.where('slot').equals(slot).first()
|
|
if (!record) return null
|
|
|
|
return {
|
|
slot: record.slot,
|
|
timestamp: record.timestamp,
|
|
currentScene: record.currentScene,
|
|
variables: JSON.parse(record.variables),
|
|
flags: JSON.parse(record.flags),
|
|
history: JSON.parse(record.history),
|
|
thumbnail: record.thumbnail,
|
|
}
|
|
}
|
|
|
|
async listSlots(): Promise<{ slot: number; timestamp: number; sceneLabel: string; thumbnail?: string }[]> {
|
|
const records = await db.saves.orderBy('slot').toArray()
|
|
return records.map((r) => ({
|
|
slot: r.slot,
|
|
timestamp: r.timestamp,
|
|
sceneLabel: r.currentScene,
|
|
thumbnail: r.thumbnail,
|
|
}))
|
|
}
|
|
|
|
async delete(slot: number): Promise<void> {
|
|
await db.saves.where('slot').equals(slot).delete()
|
|
}
|
|
}
|