managarten/games/whopixels/js/scenes/MainMenuScene.js

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

    create() {
        // Add background
        this.add.image(400, 300, 'background');

        // Add title
        this.add.text(400, 120, 'WhoPixels', { 
            fontSize: '64px', 
            fill: '#fff',
            fontStyle: 'bold'
        }).setOrigin(0.5);

        // Add subtitle
        this.add.text(400, 180, 'Ein Pixel-Abenteuer', { 
            fontSize: '32px', 
            fill: '#fff' 
        }).setOrigin(0.5);

        // Create buttons
        const startButton = this.add.text(400, 280, 'RPG Spiel starten', { 
            fontSize: '32px', 
            fill: '#fff',
            backgroundColor: '#4a4a4a',
            padding: { x: 20, y: 10 }
        }).setOrigin(0.5).setInteractive();

        const editorButton = this.add.text(400, 350, 'Pixel Editor', { 
            fontSize: '32px', 
            fill: '#fff',
            backgroundColor: '#4a4a4a',
            padding: { x: 20, y: 10 }
        }).setOrigin(0.5).setInteractive();

        const optionsButton = this.add.text(400, 420, 'Optionen', { 
            fontSize: '32px', 
            fill: '#fff',
            backgroundColor: '#4a4a4a',
            padding: { x: 20, y: 10 }
        }).setOrigin(0.5).setInteractive();

        // Button interactions - RPG Game
        startButton.on('pointerover', () => {
            startButton.setStyle({ fill: '#ff0' });
        });

        startButton.on('pointerout', () => {
            startButton.setStyle({ fill: '#fff' });
        });

        startButton.on('pointerdown', () => {
            this.scene.start('RPGScene');
        });

        // Button interactions - Pixel Editor
        editorButton.on('pointerover', () => {
            editorButton.setStyle({ fill: '#ff0' });
        });

        editorButton.on('pointerout', () => {
            editorButton.setStyle({ fill: '#fff' });
        });

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

        // Button interactions - Options
        optionsButton.on('pointerover', () => {
            optionsButton.setStyle({ fill: '#ff0' });
        });

        optionsButton.on('pointerout', () => {
            optionsButton.setStyle({ fill: '#fff' });
        });

        optionsButton.on('pointerdown', () => {
            // Options functionality would go here
            console.log('Options button clicked');
        });
    }
}