From c6a1d928a6661d8e9824c815d47765a3861cbc46 Mon Sep 17 00:00:00 2001
From: Brian Fertig <brian.fertig@bio-techne.com>
Date: Wed, 13 Aug 2025 14:21:29 -0600
Subject: [PATCH] Add card stat display (attack, shield, health) to player hand
 cards

This change adds visual indicators for attack, shield, and health values to each card displayed in the player's hand. The stats are shown in specific corners of each card:
- Attack value in upper left corner
- Shield value in lower left corner
- Health value in lower right corner

The stat text elements are properly positioned relative to the card sprite and maintain their positions during hover animations. Each card now stores references to its stat text elements for consistent positioning and updates.
---
 src/main.js | 46 ++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 46 insertions(+)

diff --git a/src/main.js b/src/main.js
index ee8ed33..8daeddd 100644
--- a/src/main.js
+++ b/src/main.js
@@ -197,6 +197,32 @@ function displayPlayerHand() {
         });
         numberText.setOrigin(0.5);
         
+        // Display attack in upper left corner
+        const attackText = this.add.text(xPosition - 40, yPosition - 50, `A:${card.attack}`, {
+            fontSize: '16px',
+            fill: '#ffffff'
+        });
+        attackText.setOrigin(0.5);
+        
+        // Display shield in lower left corner
+        const shieldText = this.add.text(xPosition - 40, yPosition + 50, `S:${card.shield}`, {
+            fontSize: '16px',
+            fill: '#ffffff'
+        });
+        shieldText.setOrigin(0.5);
+        
+        // Display health in lower right corner
+        const healthText = this.add.text(xPosition + 40, yPosition + 50, `H:${card.health}`, {
+            fontSize: '16px',
+            fill: '#ffffff'
+        });
+        healthText.setOrigin(0.5);
+        
+        // Store references to stat texts with sprite reference
+        card.attackText = attackText;
+        card.shieldText = shieldText;
+        card.healthText = healthText;
+        
         // Store card data with sprite reference
         card.sprite = cardSprite;
         card.text = numberText;
@@ -226,6 +252,16 @@ function addInteractiveCard(card, xPosition, yPosition, width, height) {
         if (card.text) {
             card.text.setY(originalY - 50);
         }
+        // Move stat texts with the card
+        if (card.attackText) {
+            card.attackText.setY(originalY - 80);
+        }
+        if (card.shieldText) {
+            card.shieldText.setY(originalY + 20);
+        }
+        if (card.healthText) {
+            card.healthText.setY(originalY + 20);
+        }
     });
     
     hitArea.on('pointerout', () => {
@@ -236,6 +272,16 @@ function addInteractiveCard(card, xPosition, yPosition, width, height) {
         if (card.text && !card.isLocked) {
             card.text.setY(originalY - 20);
         }
+        // Return stat texts to original positions
+        if (card.attackText && !card.isLocked) {
+            card.attackText.setY(originalY - 50);
+        }
+        if (card.shieldText && !card.isLocked) {
+            card.shieldText.setY(originalY + 50);
+        }
+        if (card.healthText && !card.isLocked) {
+            card.healthText.setY(originalY + 50);
+        }
     });
     
     // Add click event to lock the card in place