Changes to disabled Spin feature

objects/SlotMachine.js

@@ -28,12 +28,12 @@ export class SlotMachine {
     ];
 
     // Center line indicator
-    const lineGfx = scene.add.graphics();
-    lineGfx.lineStyle(3, 0xffd700, 0.9);
-    lineGfx.beginPath();
-    lineGfx.moveTo(startX - 10, centerY);
-    lineGfx.lineTo(startX + totalWidth + 10, centerY);
-    lineGfx.strokePath();
+    this.lineGfx = scene.add.graphics();
+    this.lineGfx.lineStyle(3, 0xffd700, 0.9);
+    this.lineGfx.beginPath();
+    this.lineGfx.moveTo(startX - 10, centerY);
+    this.lineGfx.lineTo(startX + totalWidth + 10, centerY);
+    this.lineGfx.strokePath();
 
     this.lastResults = null;
   }
@@ -78,6 +78,17 @@ export class SlotMachine {
     });
   }
 
+  /** Fade all visual elements in (on=true) or out (on=false) to indicate disabled state. */
+  setEnabled(on) {
+    const targets = [this.framGfx, this.lineGfx, ...this.reels.map(r => r.container)];
+    this.scene.tweens.add({
+      targets,
+      alpha: on ? 1 : 0.35,
+      duration: 180,
+      ease: 'Sine.easeInOut',
+    });
+  }
+
   getCenterX() { return this.centerX; }
   getCenterY() { return this.centerY; }
 }

scenes/GameScene.js

@@ -96,6 +96,11 @@ export default class GameScene extends Phaser.Scene {
     // Listen for spin button events from UIScene via global event bus
     this.game.events.on('spin', () => this._triggerSpin(), this);
 
+    // Restore the slot machine once animations finish
+    this.game.events.on('spin-complete', () => {
+      if (!this._gameOver) this.slotMachine.setEnabled(true);
+    }, this);
+
     // Victory: play the victory video and shatter the losing vial
     this.game.events.on('vial-winner', ({ winner }) => {
       this._gameOver = true;
@@ -125,11 +130,14 @@ export default class GameScene extends Phaser.Scene {
     GameState.playerFunds -= GameState.spinCost;
     GameState.spinning = true;
     this.game.events.emit('funds-updated');
+    this.game.events.emit('spinning-started');
 
     this.slotMachine.spin((result) => this._handleResult(result));
   }
 
   _handleResult({ win, symbols, payout }) {
+    // Dim the slot machine half a second after the reels stop
+    this.time.delayedCall(500, () => this.slotMachine.setEnabled(false));
     if (win) {
       const playerGain = Math.round(payout * 0.6);
       const lordGain = payout - playerGain;

scenes/UIScene.js

@@ -17,6 +17,8 @@ export default class UIScene extends Phaser.Scene {
   }
 
   create() {
+    this._spinDisabled = false;
+    this._gameOver     = false;
     this._buildTopBar();
     this._buildBottomBar();
     this._buildSpinButton();
@@ -116,8 +118,8 @@ export default class UIScene extends Phaser.Scene {
       this.game.events.emit('spin');
     });
 
-    this.spinBtnHitArea.on('pointerover', () => this._drawSpinBtn(true));
-    this.spinBtnHitArea.on('pointerout', () => this._drawSpinBtn(false));
+    this.spinBtnHitArea.on('pointerover', () => { if (!this._spinDisabled) this._drawSpinBtn(true); });
+    this.spinBtnHitArea.on('pointerout',  () => { if (!this._spinDisabled) this._drawSpinBtn(false); });
 
     // Store button center for layout reference
     this._btnX = btnX;
@@ -133,10 +135,24 @@ export default class UIScene extends Phaser.Scene {
     const btnH = 60;
 
     this.spinBtnGfx.clear();
-    this.spinBtnGfx.fillStyle(hover ? 0xffe066 : 0xffd700, 1);
-    this.spinBtnGfx.fillRoundedRect(btnX - btnW / 2, btnY - btnH / 2, btnW, btnH, 12);
-    this.spinBtnGfx.lineStyle(3, hover ? 0xffa500 : 0xc8a000, 1);
-    this.spinBtnGfx.strokeRoundedRect(btnX - btnW / 2, btnY - btnH / 2, btnW, btnH, 12);
+
+    if (this._spinDisabled) {
+      this.spinBtnGfx.fillStyle(0x3a3a3a, 1);
+      this.spinBtnGfx.fillRoundedRect(btnX - btnW / 2, btnY - btnH / 2, btnW, btnH, 12);
+      this.spinBtnGfx.lineStyle(3, 0x555555, 1);
+      this.spinBtnGfx.strokeRoundedRect(btnX - btnW / 2, btnY - btnH / 2, btnW, btnH, 12);
+    } else {
+      this.spinBtnGfx.fillStyle(hover ? 0xffe066 : 0xffd700, 1);
+      this.spinBtnGfx.fillRoundedRect(btnX - btnW / 2, btnY - btnH / 2, btnW, btnH, 12);
+      this.spinBtnGfx.lineStyle(3, hover ? 0xffa500 : 0xc8a000, 1);
+      this.spinBtnGfx.strokeRoundedRect(btnX - btnW / 2, btnY - btnH / 2, btnW, btnH, 12);
+    }
+  }
+
+  _setSpinDisabled(disabled) {
+    this._spinDisabled = disabled;
+    this._drawSpinBtn(false);
+    this.spinBtnLabel.setColor(disabled ? '#555555' : '#1a0a2e');
   }
 
   _bindEvents() {
@@ -167,8 +183,12 @@ export default class UIScene extends Phaser.Scene {
       });
     }, this);
 
+    this.game.events.on('spinning-started', () => {
+      this._setSpinDisabled(true);
+    }, this);
+
     this.game.events.on('spin-complete', () => {
-      // Re-enable button visually (it was never disabled, just state-guarded)
+      if (!this._gameOver) this._setSpinDisabled(false);
     }, this);
 
     this.game.events.on('funds-updated', () => {
@@ -181,6 +201,8 @@ export default class UIScene extends Phaser.Scene {
     }, this);
 
     this.game.events.on('vial-winner', ({ winner }) => {
+      this._gameOver = true;
+      this._setSpinDisabled(true);
       const isLord = winner.toLowerCase().includes('lord');
       this.messageText.setText(
         isLord