/**
 * UNIFIED STATS PANEL
 * Combines Performance Monitor + Debug Info into one popup
 * Toggle with TAB, auto-hides after 3 seconds
 */
class UnifiedStatsPanel {
    constructor(scene) {
        this.scene = scene;
        this.visible = false;
        this.autoHideTimer = null;

        // FPS tracking
        this.fps = 60;
        this.fpsHistory = [];
        this.maxHistoryLength = 60;

        // Stats
        this.stats = {
            avgFPS: 60,
            minFPS: 60,
            maxFPS: 60,
            frameTime: 16.67,
            activeSprites: 0,
            memoryMB: 0
        };

        this.createUI();
        this.setupKeyboard();

        console.log('📊 Unified Stats Panel initialized (TAB to toggle)');
    }

    createUI() {
        const uiScene = this.scene.scene.get('UIScene');
        if (!uiScene) return;

        const x = 10;
        const y = 10;
        const width = 280;
        const height = 180;

        // Container
        this.container = uiScene.add.container(x, y);
        this.container.setDepth(100000);
        this.container.setScrollFactor(0);
        this.container.setVisible(false);

        // Background
        const bg = uiScene.add.graphics();
        bg.fillStyle(0x000000, 0.85);
        bg.fillRoundedRect(0, 0, width, height, 8);
        bg.lineStyle(3, 0x00ff00, 0.8);
        bg.strokeRoundedRect(0, 0, width, height, 8);
        this.container.add(bg);

        // Title
        const title = uiScene.add.text(width / 2, 12, '📊 STATS PANEL', {
            fontSize: '14px',
            fontFamily: 'Arial',
            fill: '#00ff00',
            fontStyle: 'bold'
        }).setOrigin(0.5, 0);
        this.container.add(title);

        // Separator
        const separator = uiScene.add.graphics();
        separator.lineStyle(1, 0x00ff00, 0.5);
        separator.lineBetween(10, 30, width - 10, 30);
        this.container.add(separator);

        // Performance section
        this.perfText = uiScene.add.text(15, 38, '', {
            fontSize: '11px',
            fontFamily: 'Courier New',
            fill: '#00ff00',
            stroke: '#000000',
            strokeThickness: 2
        });
        this.container.add(this.perfText);

        // Debug section
        this.debugText = uiScene.add.text(15, 105, '', {
            fontSize: '11px',
            fontFamily: 'Courier New',
            fill: '#ffff00',
            stroke: '#000000',
            strokeThickness: 2
        });
        this.container.add(this.debugText);

        // FPS Graph
        this.graph = uiScene.add.graphics();
        this.container.add(this.graph);

        // Auto-hide hint
        this.hintText = uiScene.add.text(width / 2, height - 8, 'Auto-hides in 3s', {
            fontSize: '9px',
            fill: '#888888'
        }).setOrigin(0.5, 1);
        this.container.add(this.hintText);
    }

    setupKeyboard() {
        const uiScene = this.scene.scene.get('UIScene');
        if (!uiScene || !uiScene.input) return;

        // TAB key
        uiScene.input.keyboard.on('keydown-TAB', (event) => {
            event.preventDefault();
            this.toggle();
        });

        // F3 key (alternative)
        uiScene.input.keyboard.on('keydown-F3', () => {
            this.toggle();
        });
    }

    toggle() {
        this.visible = !this.visible;

        if (this.container) {
            this.container.setVisible(this.visible);
        }

        console.log(`Stats Panel: ${this.visible ? 'ON' : 'OFF'}`);

        // Auto-hide after 3 seconds
        if (this.visible) {
            this.startAutoHideTimer();
        } else {
            this.cancelAutoHideTimer();
        }
    }

    startAutoHideTimer() {
        this.cancelAutoHideTimer();

        const uiScene = this.scene.scene.get('UIScene');
        if (!uiScene) return;

        this.autoHideTimer = uiScene.time.delayedCall(3000, () => {
            this.visible = false;
            if (this.container) {
                this.container.setVisible(false);
            }
            console.log('Stats Panel auto-hidden');
        });
    }

    cancelAutoHideTimer() {
        if (this.autoHideTimer) {
            this.autoHideTimer.remove();
            this.autoHideTimer = null;
        }
    }

    update(delta) {
        if (!this.visible) return;

        // Calculate FPS
        this.fps = 1000 / delta;
        this.fpsHistory.push(this.fps);
        if (this.fpsHistory.length > this.maxHistoryLength) {
            this.fpsHistory.shift();
        }

        // Calculate stats
        this.stats.avgFPS = this.fpsHistory.reduce((a, b) => a + b, 0) / this.fpsHistory.length;
        this.stats.minFPS = Math.min(...this.fpsHistory);
        this.stats.maxFPS = Math.max(...this.fpsHistory);
        this.stats.frameTime = delta;
        this.stats.activeSprites = this.countActiveSprites();

        // Memory
        if (performance.memory) {
            this.stats.memoryMB = (performance.memory.usedJSHeapSize / 1048576).toFixed(1);
        }

        // Update UI every 5 frames
        if (this.scene.game.loop.frame % 5 === 0) {
            this.updateUI();
        }
    }

    countActiveSprites() {
        if (!this.scene.children) return 0;
        return this.scene.children.list.filter(child =>
            child.active && child.visible
        ).length;
    }

    updateUI() {
        // Performance section
        if (this.perfText) {
            const perfLines = [
                `PERFORMANCE:`,
                `FPS: ${this.fps.toFixed(1)} (Avg: ${this.stats.avgFPS.toFixed(1)})`,
                `Min: ${this.stats.minFPS.toFixed(1)} | Max: ${this.stats.maxFPS.toFixed(1)}`,
                `Frame: ${this.stats.frameTime.toFixed(2)}ms`,
                `Memory: ${this.stats.memoryMB} MB`
            ];
            this.perfText.setText(perfLines.join('\n'));
        }

        // Debug section
        if (this.debugText) {
            const player = this.scene.player;
            const playerPos = player ? player.getPosition() : { x: 0, y: 0 };
            const activeCrops = this.scene.terrainSystem?.cropsMap?.size || 0;
            const dropsCount = this.scene.lootSystem?.drops?.length || 0;
            const gameTime = this.scene.timeSystem?.gameTime?.toFixed(1) || '?';
            const conn = this.scene.multiplayerSystem?.isConnected ? '🟢' : '🔴';

            const debugLines = [
                `GAME INFO: ${conn}`,
                `Time: ${gameTime}h | Crops: ${activeCrops}`,
                `Loot: ${dropsCount} | Sprites: ${this.stats.activeSprites}`,
                `Player: (${playerPos.x}, ${playerPos.y})`
            ];
            this.debugText.setText(debugLines.join('\n'));
        }

        // Draw FPS graph
        this.drawGraph();
    }

    drawGraph() {
        if (!this.graph) return;

        this.graph.clear();

        const graphX = 15;
        const graphY = 155;
        const graphWidth = 250;
        const graphHeight = 15;
        const maxFPS = 60;

        // Background
        this.graph.fillStyle(0x222222, 0.5);
        this.graph.fillRect(graphX, graphY, graphWidth, graphHeight);

        // FPS bars
        const barWidth = graphWidth / this.maxHistoryLength;
        this.fpsHistory.forEach((fps, i) => {
            const barHeight = (fps / maxFPS) * graphHeight;
            const x = graphX + (i * barWidth);
            const y = graphY + graphHeight - barHeight;

            // Color based on FPS
            if (fps < 30) {
                this.graph.fillStyle(0xff0000, 0.8); // Red
            } else if (fps < 50) {
                this.graph.fillStyle(0xffaa00, 0.8); // Orange
            } else {
                this.graph.fillStyle(0x00ff00, 0.8); // Green
            }

            this.graph.fillRect(x, y, barWidth, barHeight);
        });

        // 60 FPS line
        this.graph.lineStyle(1, 0xffffff, 0.5);
        this.graph.beginPath();
        this.graph.moveTo(graphX, graphY);
        this.graph.lineTo(graphX + graphWidth, graphY);
        this.graph.strokePath();
    }

    destroy() {
        this.cancelAutoHideTimer();
        if (this.container) {
            this.container.destroy();
        }
    }
}