// import 'package:flutter/material.dart';
// import 'package:match_magic/game/match_magic_game.dart';

// class MainMenu extends StatelessWidget {
//   const MainMenu({Key? key}) : super(key: key);

//   @override
//   Widget build(BuildContext context) {
//     return Scaffold(
//       appBar: AppBar(
//         leading: IconButton(
//           icon: const Icon(Icons.settings, color: Colors.white),
//           onPressed: () {
//             showDialog(
//               context: context,
//               builder: (context) => AlertDialog(
//                 title: const Text('Settings'),
//                 content:
//                     const Text('The settings have not yet been implemented.'),
//                 actions: [
//                   TextButton(
//                     onPressed: () {
//                       Navigator.of(context).pop();
//                     },
//                     child: const Text('Ok'),
//                   ),
//                 ],
//               ),
//             );
//           },
//         ),
//         backgroundColor: Colors.black,
//       ),
//       backgroundColor: Colors.black,
//       body: Center(
//         child: Column(
//           children: [
//             const SizedBox(
//               height: 100,
//             ),
//             const Text(
//               'Match Magic',
//               style: TextStyle(
//                   fontSize: 28,
//                   fontWeight: FontWeight.bold,
//                   color: Colors.white),
//             ),
//             const SizedBox(
//               height: 300,
//             ),
//             ElevatedButton(
//               onPressed: () {
//                 Navigator.push(
//                   context,
//                   MaterialPageRoute(
//                       builder: (context) => const MatchMagicGameScreen()),
//                 );
//               },
//               style: ElevatedButton.styleFrom(
//                 padding: const EdgeInsets.symmetric(
//                     horizontal: 60.0, vertical: 16.0),
//               ),
//               child: const Text('Play', style: TextStyle(fontSize: 16)),
//             ),
//           ],
//         ),
//       ),
//     );
//   }
// }

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:match_magic/models/app_state_manager.dart';
import 'package:match_magic/screens/game_screen.dart';
import 'package:match_magic/screens/options_screen.dart';
import 'package:match_magic/styles/styles.dart';
import 'package:match_magic/utilities/assets.dart';

class MainMenuScreen extends StatefulWidget {
  @override
  State<MainMenuScreen> createState() => _MainMenuScreenState();
}

class _MainMenuScreenState extends State<MainMenuScreen> {
  bool islevelProgression = true;

  @override
  void initState() {
    super.initState();
    SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);
    // _loadBackground();
    // _checkPremiumStatus();
    _loadMode();
  }

  Future<void> _loadMode() async {
    final mode = await AppStateManager.getMode();
    setState(() {
      islevelProgression = mode;
    });
  }

  // Future<void> _loadBackground() async {
  //   final background = await MainDB.instance.getBackground();
  //   setState(() {
  //     backgroundImage = background;
  //   });
  // }

  // void _updateBackground(Background newBackground) {
  //   setState(() {
  //     backgroundImage = newBackground;
  //   });
  // }

  // // Premium check
  // Future<void> _checkPremiumStatus() async {
  //   bool isPremium = await AppStateManager.isPremium();
  //   setState(() {
  //     _isPremium = isPremium;
  //   });
  // }

  Future<void> _refreshMainScreen() async {
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: [
          // Container(
          //   decoration: BoxDecoration(
          //     image: DecorationImage(
          //       image: BackgroundImageProvider.getBackgroundImage(
          //           backgroundImage ?? Background.sky),
          //       fit: BoxFit.cover,
          //     ),
          //   ),
          // ),
          Container(
            padding:
                const EdgeInsets.only(left: 16, top: 32, right: 16, bottom: 70),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                Row(
                  children: [
                    TextButton(
                        onPressed: () async {
                          bool? refreshScreen = await showDialog(
                            context: context,
                            builder: (BuildContext context) => OptionsScreen(
                                // onUpdateBackground: (background) {
                                //   setState(() {
                                //     backgroundImage = background;
                                //   });
                                // },
                                ),
                          );
                          if (refreshScreen != null && refreshScreen == true) {
                            await _refreshMainScreen();
                          }
                        },
                        child: Text(
                          'Options',
                          style: AppStyles.subtitleTextStyle
                              .copyWith(color: AppStyles.accentColorTopBar),
                        )),
                  ],
                ),
                Expanded(
                  child: Container(),
                ),
                Container(
                  height: 150,
                  child: Text(
                    'Match Magic',
                    style: TextStyle(
                        color: AppStyles.accentColorTopBar, fontSize: 30),
                  ),
                ),
                const SizedBox(height: 50),
                Container(
                  height: 200,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      // Levels mode
                      Expanded(
                        child: GestureDetector(
                          onTap: () async {
                            setState(() {
                              islevelProgression = true;
                            });
                            await AppStateManager.setMode(true);
                          },
                          child: Container(
                            padding: const EdgeInsets.all(16),
                            decoration: BoxDecoration(
                              color: Colors.blue,
                              borderRadius:
                                  const BorderRadius.all(Radius.circular(20)),
                              border: islevelProgression
                                  ? Border.all(
                                      color: AppStyles.accentColor,
                                      width: 2,
                                    )
                                  : null,
                            ),
                            child: const Align(
                              alignment: Alignment.bottomCenter,
                              child: Text(
                                'Levels',
                                style: TextStyle(
                                  color: Colors.white,
                                  fontSize: 18,
                                  fontWeight: FontWeight.bold,
                                ),
                              ),
                            ),
                          ),
                        ),
                      ),
                      const SizedBox(
                        width: 16,
                      ),
                      // Limited time mode
                      Expanded(
                        child: GestureDetector(
                          onTap: () async {
                            setState(() {
                              islevelProgression = false;
                            });
                            await AppStateManager.setMode(false);
                          },
                          child: Stack(
                            children: [
                              Container(
                                padding: const EdgeInsets.all(16),
                                decoration: BoxDecoration(
                                  color: Colors.blue,
                                  borderRadius: const BorderRadius.all(
                                      Radius.circular(20)),
                                  border: islevelProgression
                                      ? null
                                      : Border.all(
                                          color: AppStyles.accentColor,
                                          width: 2,
                                        ),
                                ),
                                child: const Align(
                                  alignment: Alignment.bottomCenter,
                                  child: Text(
                                    'Limited time',
                                    style: TextStyle(
                                      color: Colors.white,
                                      fontSize: 18,
                                      fontWeight: FontWeight.bold,
                                    ),
                                  ),
                                ),
                              ),
                            ],
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
                const SizedBox(height: 50),

                // Play game

                Row(
                  children: [
                    Expanded(
                      child: ElevatedButton(
                        onPressed: () {
                          Navigator.of(context).pushAndRemoveUntil(
                              MaterialPageRoute(
                                  builder: (context) =>
                                      GameScreen(islevelProgression)),
                              (route) => false);
                        },
                        child: Text('Play game'),
                      ),
                    ),
                  ],
                ),
                const SizedBox(height: 12),
              ],
            ),
          ),
        ],
      ),
    );
  }
}