fix: track and clear all intervals and event listeners
- FightPage.vue: store SSE listener refs in array, removeEventListener on each before close() in disconnectSSE() - FightScene.ts: add cleanupTimers Set with trackedInterval/trackedTimeout helpers; replace key setInterval calls (projectile trails, entrance flames, talking animation, exhaust effects, dimensional shift, hole fade) with tracked versions; clear all on scene destroy() - rate-limit.ts: export cleanupInterval handle for graceful shutdown Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dorian
co-authored by
Claude Opus 4.6
Claude Opus 4.6
parent
010e18fbd3
commit
7bd110684d
@@ -347,6 +347,23 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
|
||||
const W = k.width()
|
||||
const H = k.height()
|
||||
// Track all intervals/timeouts for cleanup on scene destroy
|
||||
const cleanupTimers = new Set<ReturnType<typeof setTimeout>>()
|
||||
function trackedTimeout(fn: () => void, ms: number): ReturnType<typeof setTimeout> {
|
||||
const id = setTimeout(() => { cleanupTimers.delete(id); fn() }, ms)
|
||||
cleanupTimers.add(id)
|
||||
return id
|
||||
}
|
||||
function trackedInterval(fn: () => void, ms: number): ReturnType<typeof setInterval> {
|
||||
const id = setInterval(fn, ms)
|
||||
cleanupTimers.add(id)
|
||||
return id
|
||||
}
|
||||
function clearTracked(id: ReturnType<typeof setTimeout>) {
|
||||
clearInterval(id)
|
||||
clearTimeout(id)
|
||||
cleanupTimers.delete(id)
|
||||
}
|
||||
// Scale factor so sprites shrink on small canvases (reference: 500px tall)
|
||||
const SF = Math.min(1, H / 500)
|
||||
const GROUND_Y = H * 0.78
|
||||
@@ -392,10 +409,10 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
k.z(9), // behind fighters
|
||||
])
|
||||
// Fade out after a bit
|
||||
setTimeout(() => {
|
||||
const fadeInterval = setInterval(() => {
|
||||
trackedTimeout(() => {
|
||||
const fadeInterval = trackedInterval(() => {
|
||||
hole.opacity -= 0.02
|
||||
if (hole.opacity <= 0) { hole.destroy(); clearInterval(fadeInterval) }
|
||||
if (hole.opacity <= 0) { hole.destroy(); clearTracked(fadeInterval) }
|
||||
}, 50)
|
||||
}, 1500)
|
||||
}
|
||||
@@ -403,8 +420,8 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
|
||||
function spawnExhaust(x: number, y: number, duration: number) {
|
||||
const endTime = performance.now() + duration * 1000
|
||||
const interval = setInterval(() => {
|
||||
if (performance.now() > endTime) { clearInterval(interval); return }
|
||||
const interval = trackedInterval(() => {
|
||||
if (performance.now() > endTime) { clearTracked(interval); return }
|
||||
for (let i = 0; i < 3; i++) {
|
||||
const p = k.add([
|
||||
k.circle(3 + Math.random() * 5),
|
||||
@@ -434,7 +451,7 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
k.z(15),
|
||||
])
|
||||
// Trail
|
||||
const trail = setInterval(() => {
|
||||
const trail = trackedInterval(() => {
|
||||
const t = k.add([
|
||||
k.circle(size * 0.6),
|
||||
k.pos(proj.pos.x, proj.pos.y),
|
||||
@@ -455,7 +472,7 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
proj.pos.x = fromX + dx * t
|
||||
proj.pos.y = fromY + dy * t
|
||||
}, k.easings.linear).then(() => {
|
||||
clearInterval(trail)
|
||||
clearTracked(trail)
|
||||
proj.destroy()
|
||||
spawnSparks(toX, toY, 8, color)
|
||||
resolve()
|
||||
@@ -569,12 +586,12 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
k.rect(W, H), k.pos(0, 0),
|
||||
k.color(safeColor(k,colors[0])), k.opacity(0.08), k.z(1),
|
||||
])
|
||||
const interval = setInterval(() => {
|
||||
const interval = trackedInterval(() => {
|
||||
idx = (idx + 1) % colors.length
|
||||
overlay.color = safeColor(k,colors[idx])
|
||||
overlay.opacity = 0.05 + Math.random() * 0.06
|
||||
}, 80)
|
||||
setTimeout(() => { clearInterval(interval); if (overlay.exists()) overlay.destroy() }, duration * 1000)
|
||||
trackedTimeout(() => { clearTracked(interval); if (overlay.exists()) overlay.destroy() }, duration * 1000)
|
||||
}
|
||||
|
||||
// Schizo cut — rapid zoom/position jitter simulating jump cuts
|
||||
@@ -2549,8 +2566,8 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
spawnSparks(def.pos.x, def.pos.y - 30, 15, '#ff6600')
|
||||
if (isCritical) { screenFlash('#ff6600'); sfxExplosion() }
|
||||
// Defender on fire briefly
|
||||
const fireTimer = setInterval(() => {
|
||||
if (!def.exists()) { clearInterval(fireTimer); return }
|
||||
const fireTimer = trackedInterval(() => {
|
||||
if (!def.exists()) { clearTracked(fireTimer); return }
|
||||
k.add([
|
||||
k.circle(3),
|
||||
k.pos(def.pos.x + (Math.random() - 0.5) * 25, def.pos.y - Math.random() * 60),
|
||||
@@ -2562,7 +2579,7 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
const push = dir * (isCritical ? 110 : 50)
|
||||
k.tween(def.pos.x, origDX + push, 0.3, (v) => { def.pos.x = v }, k.easings.easeOutQuad)
|
||||
await k.wait(0.6)
|
||||
clearInterval(fireTimer)
|
||||
clearTracked(fireTimer)
|
||||
await Promise.all([
|
||||
k.tween(atk.pos.x, origAX, 0.2, (v) => { atk.pos.x = v }, k.easings.easeInQuad),
|
||||
k.tween(def.pos.x, origDX, 0.3, (v) => { def.pos.x = v }, k.easings.easeInOutQuad),
|
||||
@@ -3322,14 +3339,14 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
const nose = k.add([k.rect(6, 6), k.pos(rocketX + dir * 12, rocketY + 1), k.color(safeColor(k,'#ff2d2d')), k.z(17)])
|
||||
sfxJetpack()
|
||||
// Trail exhaust as rocket flies
|
||||
const exhaustInt = setInterval(() => {
|
||||
const exhaustInt = trackedInterval(() => {
|
||||
const p = k.add([k.circle(3 + Math.random() * 4), k.pos(rocket.pos.x - dir * 12, rocket.pos.y + (Math.random() - 0.5) * 8), k.color(safeColor(k,Math.random() > 0.5 ? '#ff6600' : '#ffcc00')), k.opacity(0.7), k.z(16)])
|
||||
p.onUpdate(() => { p.pos.x -= dir * 100 * k.dt(); p.opacity -= 3 * k.dt(); if (p.opacity <= 0) p.destroy() })
|
||||
}, 30)
|
||||
// Fly rocket to target
|
||||
const dur = 0.3
|
||||
await k.tween(0, 1, dur, (t) => { rocket.pos.x = rocketX + (def.pos.x - rocketX) * t; nose.pos.x = rocket.pos.x + dir * 12; rocket.pos.y = rocketY + Math.sin(t * Math.PI * 3) * 8; nose.pos.y = rocket.pos.y + 1 }, k.easings.linear)
|
||||
clearInterval(exhaustInt)
|
||||
clearTracked(exhaustInt)
|
||||
rocket.destroy(); nose.destroy()
|
||||
// EXPLOSION!
|
||||
sfxExplosion()
|
||||
@@ -3610,7 +3627,7 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
const wheelR = k.add([k.circle(8), k.pos(startX - dir * 16, bikeY + 12), k.color(safeColor(k,'#333333')), k.z(16)])
|
||||
sfxJetpack()
|
||||
// Tire marks + exhaust as it zooms across
|
||||
const exh = setInterval(() => {
|
||||
const exh = trackedInterval(() => {
|
||||
const p = k.add([k.circle(3), k.pos(bike.pos.x - dir * 25, bikeY + 5), k.color(safeColor(k,'#888888')), k.opacity(0.5), k.z(4)])
|
||||
p.onUpdate(() => { p.opacity -= 2 * k.dt(); if (p.opacity <= 0) p.destroy() })
|
||||
}, 30)
|
||||
@@ -3619,7 +3636,7 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
await k.tween(startX, targetX, 0.3, (v) => {
|
||||
bike.pos.x = v; wheelF.pos.x = v + dir * 18; wheelR.pos.x = v - dir * 16
|
||||
}, k.easings.easeInQuad)
|
||||
clearInterval(exh)
|
||||
clearTracked(exh)
|
||||
// IMPACT
|
||||
sfxExplosion()
|
||||
sfxCritical()
|
||||
@@ -4574,7 +4591,7 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
extras.push(k.add([k.rect(p.w, p.h), k.pos(startX + p.ox * dir, vY + p.oy), k.color(safeColor(k,p.color)), k.z(17)]))
|
||||
}
|
||||
sfxJetpack()
|
||||
const exh = setInterval(() => {
|
||||
const exh = trackedInterval(() => {
|
||||
const ep = k.add([k.circle(3), k.pos(body.pos.x - dir * bodyW / 2, vY + 5), k.color(safeColor(k,'#888888')), k.opacity(0.5), k.z(4)])
|
||||
ep.onUpdate(() => { ep.opacity -= 2 * k.dt(); if (ep.opacity <= 0) ep.destroy() })
|
||||
}, 30)
|
||||
@@ -4583,7 +4600,7 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
body.pos.x = v; w1.pos.x = v + dir * (bodyW / 3); w2.pos.x = v - dir * (bodyW / 3)
|
||||
extras.forEach((e, i) => { if (parts) e.pos.x = v + parts[i].ox * dir })
|
||||
}, k.easings.easeInQuad)
|
||||
clearInterval(exh)
|
||||
clearTracked(exh)
|
||||
sfxExplosion(); sfxCritical()
|
||||
body.destroy(); w1.destroy(); w2.destroy(); extras.forEach(e => e.destroy())
|
||||
k.shake(isCritical ? 25 : 14); screenFlash(isCritical ? '#ff2d2d' : bodyColor, 0.18)
|
||||
@@ -7354,7 +7371,7 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
])
|
||||
|
||||
// Toggle open/close every 120ms for a fast chatter effect
|
||||
const timer = setInterval(() => {
|
||||
const timer = trackedInterval(() => {
|
||||
if (!mouth.exists() || !fighter.exists()) { stopTalking(side); return }
|
||||
open = !open
|
||||
mouth.pos.x = fighter.pos.x
|
||||
@@ -7368,7 +7385,7 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
function stopTalking(side: 'a' | 'b') {
|
||||
const anim = talkingAnims[side]
|
||||
if (!anim) return
|
||||
clearInterval(anim.timer)
|
||||
clearTracked(anim.timer)
|
||||
anim.objs.forEach(o => { if (o.exists()) o.destroy() })
|
||||
delete talkingAnims[side]
|
||||
}
|
||||
@@ -8803,13 +8820,13 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
sfxJetpack()
|
||||
// Fly in with flame trail
|
||||
const flames: any[] = []
|
||||
const interval = setInterval(() => {
|
||||
const interval = trackedInterval(() => {
|
||||
const f = k.add([k.circle(5 + Math.random() * 5), k.pos(fighter.pos.x, fighter.pos.y + 25), k.color(safeColor(k,Math.random() > 0.5 ? '#ff6600' : '#ffcc00')), k.opacity(0.8), k.z(9)])
|
||||
flames.push(f)
|
||||
k.tween(f.opacity, 0, 0.3, (v) => { f.opacity = v }).then(() => { if (f.exists()) f.destroy() })
|
||||
}, 30)
|
||||
await k.tween(startX, homeX, 0.4, (v) => { fighter.pos.x = v }, k.easings.easeOutQuad)
|
||||
clearInterval(interval)
|
||||
clearTracked(interval)
|
||||
// Land
|
||||
sfxExplosion()
|
||||
await k.tween(fighter.pos.y, GROUND_Y - 6, 0.15, (v) => { fighter.pos.y = v }, k.easings.easeInQuad)
|
||||
@@ -11308,6 +11325,13 @@ export async function createFightScene(config: FightSceneConfig) {
|
||||
|
||||
destroy() {
|
||||
stopMusic()
|
||||
stopTalking('a')
|
||||
stopTalking('b')
|
||||
for (const id of cleanupTimers) {
|
||||
clearInterval(id)
|
||||
clearTimeout(id)
|
||||
}
|
||||
cleanupTimers.clear()
|
||||
k.quit()
|
||||
},
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user