Virtue-Slots/objects/LossAnimation.js

81 lines
2.1 KiB
JavaScript

export class LossAnimation {
// sinBoxCenter: { x, y } screen position of the Sin fund box
play(scene, originX, originY, sinBoxCenter, onComplete) {
// Draw devil: red triangle body + horns
const devilGfx = scene.add.graphics();
// Body — red triangle
devilGfx.fillStyle(0xcc1111, 1);
devilGfx.fillTriangle(-24, 20, 24, 20, 0, -20);
// Head — red circle
devilGfx.fillStyle(0xdd2222, 1);
devilGfx.fillCircle(0, -30, 16);
// Horns
devilGfx.fillStyle(0x880000, 1);
devilGfx.fillTriangle(-14, -42, -8, -42, -11, -56);
devilGfx.fillTriangle(8, -42, 14, -42, 11, -56);
// Eyes
devilGfx.fillStyle(0xffff00, 1);
devilGfx.fillCircle(-6, -32, 4);
devilGfx.fillCircle(6, -32, 4);
devilGfx.fillStyle(0x000000, 1);
devilGfx.fillCircle(-6, -32, 2);
devilGfx.fillCircle(6, -32, 2);
// Tail
devilGfx.lineStyle(3, 0x880000, 1);
devilGfx.beginPath();
devilGfx.moveTo(16, 10);
devilGfx.lineTo(30, 0);
devilGfx.lineTo(36, 14);
devilGfx.strokePath();
// Tail tip arrowhead
devilGfx.fillStyle(0x880000, 1);
devilGfx.fillTriangle(30, 10, 36, 14, 40, 6);
devilGfx.setPosition(originX, originY);
// Money bag label
const moneyText = scene.add.text(originX + 10, originY - 60, '💰', {
fontSize: '28px'
}).setOrigin(0.5, 0.5);
// Screen tint to dark red briefly
scene.cameras.main.flash(800, 150, 0, 0, true);
// Tween devil + money up to sin box
scene.tweens.add({
targets: [devilGfx, moneyText],
x: `+=${sinBoxCenter.x - originX}`,
y: `+=${sinBoxCenter.y - originY}`,
duration: 2800,
ease: 'Cubic.easeInOut',
onComplete: () => {
// Fade out
scene.tweens.add({
targets: [devilGfx, moneyText],
alpha: 0,
duration: 600,
onComplete: () => {
devilGfx.destroy();
moneyText.destroy();
if (onComplete) onComplete();
}
});
}
});
// Wobble
scene.tweens.add({
targets: devilGfx,
angle: { from: -8, to: 8 },
duration: 400,
repeat: 6,
yoyo: true
});
}
}