stanje 4am

src/scenes/UIScene.js

@@ -10,8 +10,10 @@ class UIScene extends Phaser.Scene {
         this.gameScene = this.scene.get('GameScene');
 
         // Setup UI Container
-        this.width = this.cameras.main.width;
-        this.height = this.cameras.main.height;
+        // Shared Overlay (DayNight + Weather)
+        // Rendered here to be screen-space (HUD) and ignore zoom
+        this.overlayGraphics = this.add.graphics();
+        this.overlayGraphics.setDepth(-1000); // Behind UI elements
 
         this.createStatusBars();
         this.createInventoryBar();
@@ -19,7 +21,33 @@ class UIScene extends Phaser.Scene {
         this.createClock();
         this.createDebugInfo();
 
-        // Listen for events from GameScene if needed
+        // Resize event
+        this.scale.on('resize', this.resize, this);
+    }
+
+    resize(gameSize) {
+        this.width = gameSize.width;
+        this.height = gameSize.height;
+
+        this.cameras.main.setViewport(0, 0, this.width, this.height);
+
+        // Re-create UI elements at new positions
+        this.createClock();
+        this.createGoldDisplay();
+        this.createInventoryBar();
+        this.createDebugInfo();
+
+        // Refresh data
+        if (this.gameScene) {
+            if (this.gameScene.inventorySystem) {
+                this.updateInventory(this.gameScene.inventorySystem.slots);
+            }
+            // Clock/Gold update automatically in next frame
+            // Overlay fixes itself via Systems
+            if (this.overlayGraphics) {
+                this.overlayGraphics.clear();
+            }
+        }
     }
 
     createStatusBars() {
@@ -81,16 +109,26 @@ class UIScene extends Phaser.Scene {
     }
 
     createInventoryBar() {
+        // Clean up
+        if (this.inventorySlots) {
+            this.inventorySlots.forEach(slot => {
+                if (slot.itemSprite) slot.itemSprite.destroy();
+                if (slot.itemText) slot.itemText.destroy();
+                if (slot.countText) slot.countText.destroy();
+                slot.destroy();
+            });
+        }
+
         const slotCount = 9;
         const slotSize = 48; // 48x48 sloti
         const padding = 5;
 
         const totalWidth = (slotCount * slotSize) + ((slotCount - 1) * padding);
-        const startX = (this.width - totalWidth) / 2;
-        const startY = this.height - slotSize - 20;
+        const startX = (this.scale.width - totalWidth) / 2;
+        const startY = this.scale.height - slotSize - 20;
 
         this.inventorySlots = [];
-        this.selectedSlot = 0;
+        if (this.selectedSlot === undefined) this.selectedSlot = 0;
 
         for (let i = 0; i < slotCount; i++) {
             const x = startX + i * (slotSize + padding);
@@ -220,8 +258,11 @@ class UIScene extends Phaser.Scene {
     }
 
     createClock() {
+        if (this.clockBg) this.clockBg.destroy();
+        if (this.clockText) this.clockText.destroy();
+
         // Clock box top right
-        const x = this.width - 150;
+        const x = this.scale.width - 150;
         const y = 20;
 
         // Background
@@ -231,6 +272,8 @@ class UIScene extends Phaser.Scene {
         bg.lineStyle(2, 0xffffff, 0.8);
         bg.strokeRect(x, y, 130, 40);
 
+        this.clockBg = bg; // Save ref
+
         this.clockText = this.add.text(x + 65, y + 20, 'Day 1 - 08:00', {
             fontSize: '14px',
             fontFamily: 'Courier New',
@@ -241,7 +284,10 @@ class UIScene extends Phaser.Scene {
     }
 
     createGoldDisplay() {
-        const x = this.width - 150;
+        if (this.goldBg) this.goldBg.destroy();
+        if (this.goldText) this.goldText.destroy();
+
+        const x = this.scale.width - 150;
         const y = 70; // Below clock
 
         // Background
@@ -251,6 +297,8 @@ class UIScene extends Phaser.Scene {
         bg.lineStyle(2, 0xFFD700, 0.8);
         bg.strokeRect(x, y, 130, 30);
 
+        this.goldBg = bg; // Save ref
+
         this.goldText = this.add.text(x + 65, y + 15, 'GOLD: 0', {
             fontSize: '16px',
             fontFamily: 'Courier New',
@@ -267,10 +315,21 @@ class UIScene extends Phaser.Scene {
     }
 
     createDebugInfo() {
+        if (this.debugText) this.debugText.destroy();
+
+        // Use scale height to position at bottom left (above inventory?) or top left
+        // Original was 10, 100 (top leftish). User said "manjkajo na dnu".
+        // Let's put it top left but ensure it is recreated.
+        // Actually, user said stats missing on top/bottom.
+        // Debug info is usually extra.
+        // Let's stick to simple recreation.
+
         this.debugText = this.add.text(10, 100, '', {
             fontSize: '12px',
             fontFamily: 'monospace',
-            fill: '#00ff00'
+            fill: '#00ff00', // Green as requested before? Or White? Sticking to Green from file.
+            stroke: '#000000',
+            strokeThickness: 3
         });
     }