updejt

src/systems/BuildSystem.js

@@ -78,6 +78,12 @@ class BuildSystem {
         this.buildMode = !this.buildMode;
         console.log(`Build Mode: ${this.buildMode ? 'ON' : 'OFF'}`);
 
+        // Show tutorial on first time
+        if (this.buildMode && !this.tutorialShown) {
+            this.showTutorial();
+            this.tutorialShown = true;
+        }
+
         // Notify UI
         const uiScene = this.scene.scene.get('UIScene');
         if (uiScene) {
@@ -223,4 +229,64 @@ class BuildSystem {
         const building = this.placedBuildings.find(b => b.gridX === gridX && b.gridY === gridY);
         return building ? building.collision : false;
     }
+
+    showTutorial() {
+        const uiScene = this.scene.scene.get('UIScene');
+        if (!uiScene) return;
+
+        const width = this.scene.cameras.main.width;
+        const height = this.scene.cameras.main.height;
+
+        // Tutorial panel
+        const panel = uiScene.add.container(width / 2, height / 2);
+        panel.setDepth(10000);
+
+        const bg = uiScene.add.rectangle(0, 0, 500, 300, 0x1a1a2e, 0.95);
+        bg.setStrokeStyle(3, 0x00ff41);
+        panel.add(bg);
+
+        const title = uiScene.add.text(0, -120, '🏗️ BUILD MODE', {
+            fontSize: '24px',
+            fontFamily: 'Courier New',
+            color: '#00ff41',
+            fontStyle: 'bold'
+        }).setOrigin(0.5);
+        panel.add(title);
+
+        const instructions = [
+            'Controls:',
+            '1-5: Select building type',
+            'Mouse: Move preview',
+            'Click: Place building',
+            'B: Exit build mode',
+            '',
+            'Green = OK | Red = Blocked'
+        ];
+
+        const text = uiScene.add.text(0, 0, instructions.join('\n'), {
+            fontSize: '16px',
+            fontFamily: 'Courier New',
+            color: '#ffffff',
+            align: 'center',
+            lineSpacing: 8
+        }).setOrigin(0.5);
+        panel.add(text);
+
+        const closeBtn = uiScene.add.text(0, 120, '[Click to close]', {
+            fontSize: '14px',
+            color: '#888888'
+        }).setOrigin(0.5);
+        panel.add(closeBtn);
+
+        // Auto-dismiss after 5 seconds
+        uiScene.time.delayedCall(5000, () => {
+            panel.destroy();
+        });
+
+        // Click to dismiss
+        bg.setInteractive();
+        bg.on('pointerdown', () => {
+            panel.destroy();
+        });
+    }
 }