/**
 * EXPANSION SYSTEM
 * - Manages Unlockable Zones (Farm, Forest, City...)
 * - Fog of War logic (Visual blocking)
 * - Unlock costs and requirements
 */
class ExpansionSystem {
    constructor(scene) {
        this.scene = scene;

        // Define Zones
        this.zones = {
            'farm': {
                id: 'farm',
                name: 'Starter Farm',
                x: 0, y: 0, w: 40, h: 40, // 0-40 coordinates
                unlocked: true,
                cost: 0,
                color: 0x00FF00
            },
            'forest': {
                id: 'forest',
                name: 'Dark Forest',
                x: 40, y: 0, w: 60, h: 40, // Right of farm
                unlocked: false,
                cost: 100, // 100 Gold Coins
                req: 'None',
                color: 0x006400
            },
            'city': {
                id: 'city',
                name: 'Ruined City',
                x: 0, y: 40, w: 100, h: 60, // Below farm & forest
                unlocked: false,
                cost: 500,
                req: 'Kill Boss',
                color: 0x808080
            }
        };

        // Fog Graphics
        this.fogGraphics = this.scene.add.graphics();
        this.fogGraphics.setDepth(9999); // Very high depth
        this.fogGraphics.setScrollFactor(1); // Moves with camera? No, world coordinates.
        // wait, graphics draw in world coords? Yes if not scrollFactor 0
        // We want it to cover the world terrain.

        this.drawFog();
    }

    /**
     * Unlock a zone
     */
    unlockZone(zoneId) {
        const zone = this.zones[zoneId];
        if (!zone) return false;
        if (zone.unlocked) return false; // Already unlocked

        // Check Logic (Payment) would be here or called before.
        // For now, just unlock logic.

        zone.unlocked = true;
        console.log(`🗺️ Zone Unlocked: ${zone.name}`);

        // Visual feedback
        this.scene.events.emit('show-floating-text', {
            x: this.scene.player.sprite.x,
            y: this.scene.player.sprite.y - 100,
            text: `UNLOCKED: ${zone.name}`,
            color: '#FFFFFF'
        });

        // Sound
        if (this.scene.soundManager) this.scene.soundManager.playSuccess(); // Assuming sound exists

        this.drawFog(); // Redraw fog
        return true;
    }

    /**
     * Check if player is in an unlocked zone
     * Used for restricting movement or camera
     */
    isPointUnlocked(x, y) {
        for (const key in this.zones) {
            const z = this.zones[key];
            if (x >= z.x && x < z.x + z.w && y >= z.y && y < z.y + z.h) {
                return z.unlocked;
            }
        }
        return false; // Default blocked
    }

    /**
     * Draw Fog of War over locked zones
     */
    drawFog() {
        this.fogGraphics.clear();

        // Fill semi-transparent black over locked zones
        this.fogGraphics.fillStyle(0x000000, 0.7); // 70% opacity black fog

        for (const key in this.zones) {
            const z = this.zones[key];
            if (!z.unlocked) {
                // Convert grid coords to world coords logic
                // Isometric conversion might be tricky for rectangular fog on isometric grid.
                // But for simplicity let's assume raw screen overlay or draw huge loose shapes?
                // Actually, our map coordinates (gridX, gridY) map to iso.

                // Let's try drawing tile-by-tile or chunks? Too slow.
                // Better approach: Draw a huge rectangle? No, iso is diamond shape.

                // Hack: Just draw simple polygons for now, or use the tile tinting system?
                // Real Fog of War in Iso is complex.
                // Let's stick to "Tinting" locked tiles or something simpler first.
                // Or: Render a shape that covers the locked area logic.

                // Since our world is 100x100 grid.
                // Zone Forest: x:40, y:0, w:60, h:40.

                // Let's just draw 'clouds' or text over locked areas?
                // Or simplified: Just don't let player walk there.

                // Let's skip heavy graphics fog for now and just add Floating Text Labels
                // "LOCKED AREA: FOREST" over the center.

                // Drawing 4 points of the zone in iso:
                const p1 = this.scene.iso.toScreen(z.x, z.y);
                const p2 = this.scene.iso.toScreen(z.x + z.w, z.y);
                const p3 = this.scene.iso.toScreen(z.x + z.w, z.y + z.h);
                const p4 = this.scene.iso.toScreen(z.x, z.y + z.h);

                const offX = this.scene.terrainOffsetX;
                const offY = this.scene.terrainOffsetY;

                const poly = new Phaser.Geom.Polygon([
                    p1.x + offX, p1.y + offY,
                    p2.x + offX, p2.y + offY,
                    p3.x + offX, p3.y + offY,
                    p4.x + offX, p4.y + offY
                ]);

                this.fogGraphics.fillPoints(poly.points, true);

                // Add label? (We'd need to manage text objects separately, simple redraw is easier)
            }
        }
    }

    update(delta) {
        // Maybe check if player tries to enter locked zone and push back?
        if (this.scene.player) {
            const p = this.scene.player;
            if (!this.isPointUnlocked(p.gridX, p.gridY)) {
                // Player is in locked zone! Push back!
                // Simple bounce back logic
                // Or just show warning
                // console.log("Player in locked zone!");
            }
        }
    }
}