import 'package:flutter/material.dart';
import 'package:flutter_custom_toolbox/flutter_toolbox.dart';

import 'package:scrobbles/config/default_global_settings.dart';
import 'package:scrobbles/cubit/settings_global_cubit.dart';
import 'package:scrobbles/ui/settings/theme_card.dart';

class SettingsForm extends StatefulWidget {
  const SettingsForm({super.key});

  @override
  State<SettingsForm> createState() => _SettingsFormState();
}

class _SettingsFormState extends State<SettingsForm> {
  final usernameController = TextEditingController();
  final securityTokenController = TextEditingController();

  int discoveriesDaysCount = DefaultGlobalSettings.defaultDiscoveriesDaysCount;
  int distributionDaysCount = DefaultGlobalSettings.defaultDistributionDaysCount;
  int statisticsRecentDaysCount = DefaultGlobalSettings.defaultStatisticsRecentDaysCount;
  int timelineDaysCount = DefaultGlobalSettings.defaultTimelineDaysCount;
  int topArtistsDaysCount = DefaultGlobalSettings.defaultTopArtistsDaysCount;
  int newArtistsCount = DefaultGlobalSettings.defaultNewArtistsCount;
  int newTracksCount = DefaultGlobalSettings.defaultNewTracksCount;

  List<bool> _selectedDiscoveriesDaysCount = [];
  List<bool> _selectedDistributionDaysCount = [];
  List<bool> _selectedStatisticsRecentDaysCount = [];
  List<bool> _selectedTimelineDaysCount = [];
  List<bool> _selectedTopArtistsDaysCount = [];
  List<bool> _selectedNewArtistsCount = [];
  List<bool> _selectedNewTracksCount = [];

  @override
  void didChangeDependencies() {
    GlobalSettingsCubit settings = BlocProvider.of<GlobalSettingsCubit>(context);

    usernameController.text = settings.getUsername();
    securityTokenController.text = settings.getSecurityToken();

    discoveriesDaysCount = settings.getDiscoveriesDaysCount();
    distributionDaysCount = settings.getDistributionDaysCount();
    statisticsRecentDaysCount = settings.getStatisticsRecentDaysCount();
    timelineDaysCount = settings.getTimelineDaysCount();
    topArtistsDaysCount = settings.getTopArtistsDaysCount();
    newArtistsCount = settings.getNewArtistsCount();
    newTracksCount = settings.getNewTracksCount();

    _selectedDiscoveriesDaysCount = DefaultGlobalSettings.allowedDaysCountValues
        .map((e) => (e == discoveriesDaysCount))
        .toList();
    _selectedDistributionDaysCount = DefaultGlobalSettings.allowedDaysCountValues
        .map((e) => (e == distributionDaysCount))
        .toList();
    _selectedStatisticsRecentDaysCount = DefaultGlobalSettings.allowedDaysCountValues
        .map((e) => (e == statisticsRecentDaysCount))
        .toList();
    _selectedTimelineDaysCount = DefaultGlobalSettings.allowedDaysCountValues
        .map((e) => (e == timelineDaysCount))
        .toList();
    _selectedTopArtistsDaysCount = DefaultGlobalSettings.allowedDaysCountValues
        .map((e) => (e == topArtistsDaysCount))
        .toList();
    _selectedNewArtistsCount =
        DefaultGlobalSettings.allowedCountValues.map((e) => (e == newArtistsCount)).toList();
    _selectedNewTracksCount =
        DefaultGlobalSettings.allowedCountValues.map((e) => (e == newTracksCount)).toList();

    super.didChangeDependencies();
  }

  @override
  void dispose() {
    usernameController.dispose();
    securityTokenController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    void saveSettings() {
      BlocProvider.of<GlobalSettingsCubit>(context).setValues(
        username: usernameController.text,
        securityToken: securityTokenController.text,
        discoveriesDaysCount: discoveriesDaysCount,
        distributionDaysCount: distributionDaysCount,
        statisticsRecentDaysCount: statisticsRecentDaysCount,
        timelineDaysCount: timelineDaysCount,
        topArtistsDaysCount: topArtistsDaysCount,
        newArtistsCount: newArtistsCount,
        newTracksCount: newTracksCount,
      );
    }

    return Column(
      mainAxisAlignment: MainAxisAlignment.start,
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisSize: MainAxisSize.max,
      children: <Widget>[
        const SizedBox(height: 8),

        // Light/dark theme
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            const Text('settings_label_theme').tr(),
            const Row(
              mainAxisAlignment: MainAxisAlignment.end,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                ThemeCard(
                  mode: ThemeMode.system,
                  icon: UniconsLine.cog,
                ),
                ThemeCard(
                  mode: ThemeMode.light,
                  icon: UniconsLine.sun,
                ),
                ThemeCard(
                  mode: ThemeMode.dark,
                  icon: UniconsLine.moon,
                )
              ],
            ),
          ],
        ),

        const SizedBox(height: 16),

        AppTitle(text: tr('settings_title_global')),

        // Username
        const Text('settings_label_username').tr(),
        TextFormField(
          controller: usernameController,
          decoration: InputDecoration(
            border: const UnderlineInputBorder(),
            suffixIcon: ElevatedButton(
              style: ElevatedButton.styleFrom(
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(6.0),
                ),
              ),
              child: const Icon(UniconsLine.save),
              onPressed: () {
                saveSettings();
              },
            ),
          ),
        ),

        const SizedBox(height: 8),

        AppTitle(text: tr('settings_title_days_count')),

        // Statistics (recent)
        Row(
          mainAxisAlignment: MainAxisAlignment.end,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            const Text('settings_label_statistics_recent_days_count').tr(),
            ToggleButtons(
              onPressed: (int index) {
                setState(() {
                  statisticsRecentDaysCount =
                      DefaultGlobalSettings.allowedDaysCountValues[index];
                  for (int i = 0; i < _selectedStatisticsRecentDaysCount.length; i++) {
                    _selectedStatisticsRecentDaysCount[i] = i == index;
                  }
                });
                saveSettings();
              },
              borderRadius: const BorderRadius.all(Radius.circular(8)),
              constraints: const BoxConstraints(minHeight: 30.0, minWidth: 30.0),
              isSelected: _selectedStatisticsRecentDaysCount,
              children: DefaultGlobalSettings.allowedDaysCountValues
                  .map((e) => Text(e.toString()))
                  .toList(),
            ),
          ],
        ),

        // Timeline
        Row(
          mainAxisAlignment: MainAxisAlignment.end,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            const Text('settings_label_timeline_days_count').tr(),
            ToggleButtons(
              onPressed: (int index) {
                setState(() {
                  timelineDaysCount = DefaultGlobalSettings.allowedDaysCountValues[index];
                  for (int i = 0; i < _selectedTimelineDaysCount.length; i++) {
                    _selectedTimelineDaysCount[i] = i == index;
                  }
                });
                saveSettings();
              },
              borderRadius: const BorderRadius.all(Radius.circular(8)),
              constraints: const BoxConstraints(minHeight: 30.0, minWidth: 30.0),
              isSelected: _selectedTimelineDaysCount,
              children: DefaultGlobalSettings.allowedDaysCountValues
                  .map((e) => Text(e.toString()))
                  .toList(),
            ),
          ],
        ),

        // Top Artists
        Row(
          mainAxisAlignment: MainAxisAlignment.end,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            const Text('settings_label_top_artists_days_count').tr(),
            ToggleButtons(
              onPressed: (int index) {
                setState(() {
                  topArtistsDaysCount = DefaultGlobalSettings.allowedDaysCountValues[index];
                  for (int i = 0; i < _selectedTopArtistsDaysCount.length; i++) {
                    _selectedTopArtistsDaysCount[i] = i == index;
                  }
                });
                saveSettings();
              },
              borderRadius: const BorderRadius.all(Radius.circular(8)),
              constraints: const BoxConstraints(minHeight: 30.0, minWidth: 30.0),
              isSelected: _selectedTopArtistsDaysCount,
              children: DefaultGlobalSettings.allowedDaysCountValues
                  .map((e) => Text(e.toString()))
                  .toList(),
            ),
          ],
        ),

        // Discoveries
        Row(
          mainAxisAlignment: MainAxisAlignment.end,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            const Text('settings_label_discoveries_days_count').tr(),
            ToggleButtons(
              onPressed: (int index) {
                setState(() {
                  discoveriesDaysCount = DefaultGlobalSettings.allowedDaysCountValues[index];
                  for (int i = 0; i < _selectedDiscoveriesDaysCount.length; i++) {
                    _selectedDiscoveriesDaysCount[i] = i == index;
                  }
                });
                saveSettings();
              },
              borderRadius: const BorderRadius.all(Radius.circular(8)),
              constraints: const BoxConstraints(minHeight: 30.0, minWidth: 30.0),
              isSelected: _selectedDiscoveriesDaysCount,
              children: DefaultGlobalSettings.allowedDaysCountValues
                  .map((e) => Text(e.toString()))
                  .toList(),
            ),
          ],
        ),

        // Distribution by day/hour + heatmap
        Row(
          mainAxisAlignment: MainAxisAlignment.end,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            const Text('settings_label_distribution_days_count').tr(),
            ToggleButtons(
              onPressed: (int index) {
                setState(() {
                  distributionDaysCount = DefaultGlobalSettings.allowedDaysCountValues[index];
                  for (int i = 0; i < _selectedDistributionDaysCount.length; i++) {
                    _selectedDistributionDaysCount[i] = i == index;
                  }
                });
                saveSettings();
              },
              borderRadius: const BorderRadius.all(Radius.circular(8)),
              constraints: const BoxConstraints(minHeight: 30.0, minWidth: 30.0),
              isSelected: _selectedDistributionDaysCount,
              children: DefaultGlobalSettings.allowedDaysCountValues
                  .map((e) => Text(e.toString()))
                  .toList(),
            ),
          ],
        ),

        const SizedBox(height: 8),
        AppTitle(text: tr('settings_title_counts')),

        // New artists count
        Row(
          mainAxisAlignment: MainAxisAlignment.end,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            const Text('settings_label_new_artists_count').tr(),
            ToggleButtons(
              onPressed: (int index) {
                setState(() {
                  newArtistsCount = DefaultGlobalSettings.allowedCountValues[index];
                  for (int i = 0; i < _selectedNewArtistsCount.length; i++) {
                    _selectedNewArtistsCount[i] = i == index;
                  }
                });
                saveSettings();
              },
              borderRadius: const BorderRadius.all(Radius.circular(8)),
              constraints: const BoxConstraints(minHeight: 30.0, minWidth: 30.0),
              isSelected: _selectedNewArtistsCount,
              children: DefaultGlobalSettings.allowedCountValues
                  .map((e) => Text(e.toString()))
                  .toList(),
            ),
          ],
        ),

        // New tracks count
        Row(
          mainAxisAlignment: MainAxisAlignment.end,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            const Text('settings_label_new_tracks_count').tr(),
            ToggleButtons(
              onPressed: (int index) {
                setState(() {
                  newTracksCount = DefaultGlobalSettings.allowedCountValues[index];
                  for (int i = 0; i < _selectedNewTracksCount.length; i++) {
                    _selectedNewTracksCount[i] = i == index;
                  }
                });
                saveSettings();
              },
              borderRadius: const BorderRadius.all(Radius.circular(8)),
              constraints: const BoxConstraints(minHeight: 30.0, minWidth: 30.0),
              isSelected: _selectedNewTracksCount,
              children: DefaultGlobalSettings.allowedCountValues
                  .map((e) => Text(e.toString()))
                  .toList(),
            ),
          ],
        ),

        // Save
        // ElevatedButton(
        //   child: Row(
        //     mainAxisAlignment: MainAxisAlignment.center,
        //     crossAxisAlignment: CrossAxisAlignment.center,
        //     children: [
        //       Icon(UniconsLine.save),
        //       SizedBox(width: 8),
        //       Text('settings_button_save').tr(),
        //     ],
        //   ),
        //   onPressed: () => saveSettings(),
        // ),
      ],
    );
  }
}