import 'package:flutter/material.dart';
import 'emoX.dart';

class Level3 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Level 3'),
      ),
      body: SingleChildScrollView(
        child: Column(
          children: [
            Padding(
              padding: const EdgeInsets.only(top: 20.0),
              child: Center(
                child: Column(
                  children: [
                    Text(
                      "Let's Identify",
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: Color.fromARGB(255, 48, 173, 26),
                        fontSize: 20,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    Text(
                      "Different Human Emotions",
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: Color.fromARGB(255, 48, 173, 26),
                        fontSize: 21,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ],
                ),
              ),
            ),
            // Display the first GIF (laugh.gif)
            Image.asset(
              'game_assets/laugh.gif',
              width: 380,
              height: 350,
            ),
            SizedBox(height: 0), // Reduce the gap between GIFs
            // Display the second GIF (sad.gif)
            Image.asset(
              'game_assets/sad.gif',
              width: 380,
              height: 350,
            ),
            Padding(
              padding: const EdgeInsets.only(top: 20.0, bottom: 20.0),
              child: ElevatedButton(
                onPressed: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => NextPage()),
                  );
                },
                child: Text('Next page'),
                style: ElevatedButton.styleFrom(
                  primary: Color.fromARGB(255, 120, 149, 145),
                  onPrimary: Colors.white,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class NextPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Next Page'),
      ),
      body: SingleChildScrollView(
        child: Column(
          children: [
            Padding(
              padding: const EdgeInsets.only(top: 20.0),
              child: Center(
                child: Column(
                  children: [
                    Text(
                      "Let's Identify",
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: Color.fromARGB(255, 48, 173, 26),
                        fontSize: 20,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    Text(
                      "Different Human Emotions",
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: Color.fromARGB(255, 48, 173, 26),
                        fontSize: 21,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ],
                ),
              ),
            ),
            // Display the first GIF (fear.gif)
            Image.asset(
              'game_assets/fear.gif',
              width: 380,
              height: 320,
            ),
            SizedBox(height: 0), // Reduce the gap between GIFs
            // Display the second GIF (anger.gif)
            Image.asset(
              'game_assets/anger.gif',
              width: 380,
              height: 350,
            ),
            Padding(
              padding: const EdgeInsets.only(top: 20.0, bottom: 20.0),
              child: ElevatedButton(
                onPressed: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => FinalPage()),
                  );
                },
                child: Text('Next page'),
                style: ElevatedButton.styleFrom(
                  primary: Color.fromARGB(255, 120, 149, 145),
                  onPrimary: Colors.white,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class FinalPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Final Page'),
      ),
      body: SingleChildScrollView(
        child: Column(
          children: [
            Padding(
              padding: const EdgeInsets.only(top: 20.0),
              child: Center(
                child: Column(
                  children: [
                    Text(
                      "Let's Identify",
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: Color.fromARGB(255, 48, 173, 26),
                        fontSize: 20,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    Text(
                      "Different Human Emotions",
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: Color.fromARGB(255, 48, 173, 26),
                        fontSize: 21,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ],
                ),
              ),
            ),
            // Display the first GIF (disgust.gif)
            Image.asset(
              'game_assets/disgust.gif',
              width: 380,
              height: 320,
            ),
            SizedBox(height: 0), // Reduce the gap between GIFs
            // Display the second GIF (surprise.gif)
            Image.asset(
              'game_assets/surprise.gif',
              width: 380,
              height: 350,
            ),
            Padding(
              padding: const EdgeInsets.only(top: 20.0, bottom: 20.0),
              child: ElevatedButton(
                onPressed: () {
                  Navigator.pushReplacement(
                    context,
                    MaterialPageRoute(builder: (context) => LevelScreen()),
                  );
                },
                child: Text('Finish'),
                style: ElevatedButton.styleFrom(
                  primary: Color.fromARGB(255, 231, 65, 43),
                  onPrimary: Colors.white,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
