import 'package:flutter/material.dart';
import 'package:match_magic/db/main_db.dart';
import 'package:match_magic/game/board.dart';
import 'package:match_magic/styles/styles.dart';
import 'package:match_magic/widgets/icon_widgets/arrow_left_icon.dart';
import 'package:match_magic/widgets/icon_widgets/music_icon.dart';
import 'package:match_magic/widgets/icon_widgets/star_icon.dart';
import 'package:match_magic/widgets/icon_widgets/volume_icon.dart';
import 'package:match_magic/widgets/toggle_switch.dart';
import 'package:package_info_plus/package_info_plus.dart';

class OptionsScreen extends StatefulWidget {
  // final Function(Background) onUpdateBackground;

  OptionsScreen();
  @override
  State<OptionsScreen> createState() => _OptionsScreenState();
}

class _OptionsScreenState extends State<OptionsScreen> {
  bool isSound = true;
  bool isMusic = true;
  // Background? backgroundImage;

  @override
  void initState() {
    super.initState();
    fetchSoundAndMusicState();
    // _loadBackground();
    getVersionNumber();
    // _checkPremiumStatus();
  }

  Future<String> getVersionNumber() async {
    PackageInfo packageInfo = await PackageInfo.fromPlatform();
    return packageInfo.version;
  }

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

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

  // Future<void> refreshOptionsScreen() async {
  //   await _checkPremiumStatus();

  //   setState(() {});
  // }

  Future<void> fetchSoundAndMusicState() async {
    bool soundEnabled = await MainDB.instance.getSoundEnabled();
    bool musicEnabled = await MainDB.instance.getMusicEnabled();

    setState(() {
      isSound = soundEnabled;
      isMusic = musicEnabled;
    });
  }

  // void updateBackground(Background newBackground) {
  //   setState(() {
  //     backgroundImage = newBackground;
  //   });
  //   widget.onUpdateBackground(newBackground);
  // }

  @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(top: 38, left: 16, right: 16, bottom: 16),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                Row(
                  children: [
                    IconButton(
                        onPressed: () {
                          Navigator.pop(context, true);
                        },
                        icon: ArrowLeftIcon()),
                    Text(
                      'Options',
                      style: AppStyles.subtitleTextStyle
                          .copyWith(color: AppStyles.accentColorTopBar),
                    ),
                  ],
                ),
                const SizedBox(
                  height: 28,
                ),
                Expanded(
                  child: ListView(
                    children: [
                      // Sound settings
                      Container(
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(8),
                          color: AppStyles.mainBackground,
                        ),
                        padding: EdgeInsets.only(
                            top: 12, bottom: 12, right: 12, left: 18),
                        child: Column(
                          children: [
                            const SizedBox(
                              height: 10,
                            ),
                            const Row(
                              children: [
                                Text(
                                  'Sound settings',
                                  style: AppStyles.subtitleTextStyle,
                                ),
                              ],
                            ),
                            const SizedBox(
                              height: 10,
                            ),
                            Row(
                              children: [
                                VolumeIcon(),
                                const SizedBox(
                                  width: 6,
                                ),
                                const Text(
                                  'Sound Effects',
                                  style: TextStyle(fontSize: 16),
                                ),
                                const Expanded(child: SizedBox()),
                                ToggleSwitch(
                                    value: isSound,
                                    onChanged: (value) async {
                                      setState(() {
                                        isSound = value;
                                      });

                                      await MainDB.instance
                                          .saveSoundEnabled(value);
                                    })
                              ],
                            ),
                            const SizedBox(
                              height: 10,
                            ),
                            Row(
                              children: [
                                MusicIcon(),
                                const SizedBox(
                                  width: 6,
                                ),
                                const Text(
                                  'Music',
                                  style: TextStyle(fontSize: 16),
                                ),
                                const Expanded(child: SizedBox()),
                                ToggleSwitch(
                                    value: isMusic,
                                    onChanged: (value) async {
                                      setState(() {
                                        isMusic = value;
                                      });
                                      await MainDB.instance
                                          .saveMusicEnabled(value);
                                    })
                              ],
                            ),
                          ],
                        ),
                      ),
                      const SizedBox(
                        height: 12,
                      ),

                      // High score
                      Container(
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(8),
                          color: AppStyles.mainBackground,
                        ),
                        child: ExpansionTile(
                          backgroundColor: AppStyles.mainBackground,
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(8),
                          ),
                          title: Row(
                            children: [
                              StarIcon(),
                              SizedBox(
                                width: 6,
                              ),
                              Text('High score'),
                            ],
                          ),
                          children: [
                            ListTile(
                              title: FutureBuilder<int?>(
                                future: MainDB.instance.getHighScoreValue(),
                                builder: (context, snapshot) {
                                  if (snapshot.hasData) {
                                    return Text(
                                      '${snapshot.data}',
                                      style: TextStyle(fontSize: 16),
                                    );
                                  } else {
                                    return Text('HighScore: 0');
                                  }
                                },
                              ),
                            ),
                          ],
                        ),
                      ),
                      const SizedBox(
                        height: 12,
                      ),
                    ],
                  ),
                ),
                // About
                Container(
                  margin: EdgeInsets.only(top: 16),
                  child: Column(
                    children: [
                      Text('MatchMagic. Copyright 2024 Cypher Stack, LLC'),
                      FutureBuilder<String>(
                        future: getVersionNumber(),
                        builder: (context, snapshot) {
                          if (snapshot.hasData) {
                            return Text('Version: ${snapshot.data}');
                          } else {
                            return Text('Version: loading...');
                          }
                        },
                      )
                    ],
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}