From 6447f01c777be15af1cb60a045d6295dfd3071a5 Mon Sep 17 00:00:00 2001
From: Kyle Banicevic <kylebanicevic@gmail.com>
Date: Sun, 18 Jan 2026 13:37:51 +1100
Subject: [PATCH] Changed quick bar from 4 to 10 item slots

---
 src/ui/components/QuickSlotComponent.ts | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/src/ui/components/QuickSlotComponent.ts b/src/ui/components/QuickSlotComponent.ts
index fe8fd0e..dfb8e12 100644
--- a/src/ui/components/QuickSlotComponent.ts
+++ b/src/ui/components/QuickSlotComponent.ts
@@ -5,8 +5,8 @@ export class QuickSlotComponent {
   private scene: Phaser.Scene;
   private container!: Phaser.GameObjects.Container;
   private slots: Phaser.GameObjects.Container[] = [];
-  private itemMap: (Item | null)[] = [null, null, null, null]; // 4 slots
-  private assignedIds: string[] = ["health_potion", "throwing_dagger", "", ""]; // Default slot 1 to HP pot, 2 to Dagger
+  private itemMap: (Item | null)[] = new Array(10).fill(null); 
+  private assignedIds: string[] = ["health_potion", "throwing_dagger", ...new Array(8).fill("")]; 
 
   constructor(scene: Phaser.Scene) {
     this.scene = scene;
@@ -16,7 +16,7 @@ export class QuickSlotComponent {
     const { width, height } = this.scene.scale;
     const slotSize = 48;
     const slotSpacing = 4;
-    const totalWidth = (slotSize + slotSpacing) * 4 - slotSpacing;
+    const totalWidth = (slotSize + slotSpacing) * 10 - slotSpacing;
     const actionButtonHeight = 40 + 10; // Button height + spacing
     
     // Position above action buttons
@@ -26,7 +26,7 @@ export class QuickSlotComponent {
     );
     this.container.setScrollFactor(0).setDepth(1500);
 
-    for (let i = 0; i < 4; i++) {
+    for (let i = 0; i < 10; i++) {
         const x = i * (slotSize + slotSpacing);
         const g = this.scene.add.graphics();
         
@@ -39,7 +39,8 @@ export class QuickSlotComponent {
         g.strokeRect(0, 0, slotSize, slotSize);
 
         // Hotkey label (bottom-left, gold color)
-        const key = this.scene.add.text(3, slotSize - 3, `${i + 1}`, {
+        const label = i === 9 ? "0" : `${i + 1}`;
+        const key = this.scene.add.text(3, slotSize - 3, label, {
             fontSize: "12px",
             color: "#D4AF37",
             fontStyle: "bold"
@@ -62,6 +63,12 @@ export class QuickSlotComponent {
     this.scene.input.keyboard?.on("keydown-TWO", () => this.activateSlot(1));
     this.scene.input.keyboard?.on("keydown-THREE", () => this.activateSlot(2));
     this.scene.input.keyboard?.on("keydown-FOUR", () => this.activateSlot(3));
+    this.scene.input.keyboard?.on("keydown-FIVE", () => this.activateSlot(4));
+    this.scene.input.keyboard?.on("keydown-SIX", () => this.activateSlot(5));
+    this.scene.input.keyboard?.on("keydown-SEVEN", () => this.activateSlot(6));
+    this.scene.input.keyboard?.on("keydown-EIGHT", () => this.activateSlot(7));
+    this.scene.input.keyboard?.on("keydown-NINE", () => this.activateSlot(8));
+    this.scene.input.keyboard?.on("keydown-ZERO", () => this.activateSlot(9));
   }
 
   update(player: CombatantActor, activeItemId?: string | null) {
@@ -70,7 +77,7 @@ export class QuickSlotComponent {
       const slotSize = 48;
 
       // Update slots based on inventory availability
-      for (let i = 0; i < 4; i++) {
+      for (let i = 0; i < 10; i++) {
           const desiredId = this.assignedIds[i];
           const slot = this.slots[i];
           const bgGraphics = slot.list[0] as Phaser.GameObjects.Graphics;