class StoryScene extends Phaser.Scene {
    constructor() {
        super({ key: 'StoryScene' });
    }

    create() {
        const width = this.cameras.main.width;
        const height = this.cameras.main.height;

        // Black background
        this.add.rectangle(0, 0, width, height, 0x000000).setOrigin(0);

        const storyText =
            `LETO 2084.
SVET JE PADEL V TEMO.

Virus je večino spremenil v pošasti.
Mesta so grobnice.

Toda našel si upanje.
Zapuščeno kmetijo na robu divjine.
Zadnje varno zatočišče.

Tvoja naloga:
1. Obnovi kmetijo in preživi.
2. Zgradi obrambo pred hordo.
3. Najdi zdravilo in reši svet.

Pripravi se... NOČ PRIHAJA.`;

        const textObj = this.add.text(width / 2, height, storyText, {
            fontFamily: 'Courier New',
            fontSize: '28px',
            fill: '#00ff41',
            align: 'center',
            lineSpacing: 15,
            stroke: '#000000',
            strokeThickness: 4
        });
        textObj.setOrigin(0.5, 0);

        // Scroll animation
        this.tweens.add({
            targets: textObj,
            y: 50,
            duration: 15000, // 15s scroll
            ease: 'Linear',
            onComplete: () => {
                this.time.delayedCall(2000, () => {
                    this.scene.start('GameScene');
                });
            }
        });

        // Skip instructions
        const skip = this.add.text(width - 20, height - 20, '[SPACE] Skip', {
            fontSize: '16px', fill: '#666'
        }).setOrigin(1);

        // LANGUAGE SELECTOR
        this.createLanguageSelector(width, height);

        // Input to skip
        this.input.keyboard.on('keydown-SPACE', () => {
            this.scene.start('GameScene');
        });

        this.input.on('pointerdown', () => {
            this.scene.start('GameScene');
        });
    }

    createLanguageSelector(width, height) {
        // Initialize localization
        if (!window.i18n) {
            window.i18n = new LocalizationSystem();
        }

        const languages = [
            { code: 'slo', flag: '🇸🇮', name: 'SLO' },
            { code: 'en', flag: '🇬🇧', name: 'ENG' },
            { code: 'de', flag: '🇩🇪', name: 'DEU' },
            { code: 'it', flag: '🇮🇹', name: 'ITA' },
            { code: 'cn', flag: '🇨🇳', name: '中文' }
        ];

        const startX = 20;
        const startY = 20;
        const spacing = 80;

        // Title
        this.add.text(startX, startY, '🌍 Language:', {
            fontSize: '18px',
            fill: '#ffffff',
            fontFamily: 'Courier New'
        });

        // Language buttons
        languages.forEach((lang, index) => {
            const x = startX;
            const y = startY + 40 + (index * spacing);

            // Background
            const bg = this.add.rectangle(x, y, 200, 60, 0x333333, 0.8);
            bg.setOrigin(0, 0);

            // Flag + Name
            const text = this.add.text(x + 100, y + 30, `${lang.flag} ${lang.name}`, {
                fontSize: '24px',
                fill: window.i18n.getCurrentLanguage() === lang.code ? '#00ff41' : '#ffffff',
                fontFamily: 'Courier New'
            }).setOrigin(0.5);

            // Make interactive
            bg.setInteractive({ useHandCursor: true });
            bg.on('pointerover', () => {
                bg.setFillStyle(0x555555, 0.9);
                text.setScale(1.1);
            });
            bg.on('pointerout', () => {
                bg.setFillStyle(0x333333, 0.8);
                text.setScale(1.0);
            });
            bg.on('pointerdown', () => {
                // Set language
                window.i18n.setLanguage(lang.code);

                // Update all text colors
                languages.forEach((l, i) => {
                    const langText = this.children.list.find(child =>
                        child.text && child.text.includes(l.flag)
                    );
                    if (langText) {
                        langText.setColor(window.i18n.getCurrentLanguage() === l.code ? '#00ff41' : '#ffffff');
                    }
                });

                // Visual feedback
                this.tweens.add({
                    targets: bg,
                    alpha: 0.5,
                    yoyo: true,
                    duration: 100
                });
            });
        });
    }
}