import '../../l10n/strings.dart';
import '../../l10n/locales.dart';
import '../../mews/document.dart';
import '../fonts.dart';
import '../controllers/reader_settings_controller.dart'
    show ReaderSettingsController;
import 'mews_urls.dart';
import 'page_blocks.dart';

/// Message ids for the values the controller accepts. Kept literal so every
/// id in the locale file can be found by searching for it.
const _themeLabels = {
  'light': 'settings-theme-light',
  'dark': 'settings-theme-dark',
  'system': 'settings-theme-system',
};

const _variantLabels = {
  'site': 'settings-variant-site',
  'warm': 'settings-variant-warm',
  'cool': 'settings-variant-cool',
  'green': 'settings-variant-green',
  'mono': 'settings-variant-mono',
};

Future<MewsPage> buildSettingsPage(
  Uri url, {
  required ReaderSettingsController settings,
  required Strings strings,
}) async {
  final title = strings.t('settings-page-title');
  final scale = settings.fontScale.value;

  return internalPage(
    url: url,
    title: title,
    strings: strings,
    body: [
      ...chrome(title: title, current: url, strings: strings),
      HeadingBlock(2, [MewsText(strings.t('settings-font-heading'))]),
      choiceRow([
        for (final font in readerFonts)
          (
            href: MewsUrls.action('set-font', {'value': font.family}),
            label: strings.t(font.labelId),
            current: font.family == settings.font.value,
          ),
      ]),
      // Text size steps between the controller's bounds, with the current
      // value between the two steps.
      HeadingBlock(2, [MewsText(strings.t('settings-size-heading'))]),
      itemList([
        if (scale > ReaderSettingsController.minScale)
          MewsListItem([
            ParagraphBlock([
              MewsLink(MewsUrls.action('set-size', {'step': 'down'}),
                  [MewsText(strings.t('settings-size-decrease'))]),
            ]),
          ]),
        MewsListItem([
          ParagraphBlock([
            MewsEmphasis(EmphasisStyle.strong, [
              MewsText(strings.t('settings-size-value',
                  {'percent': (scale * 100).round()})),
            ]),
          ]),
        ]),
        if (scale < ReaderSettingsController.maxScale)
          MewsListItem([
            ParagraphBlock([
              MewsLink(MewsUrls.action('set-size', {'step': 'up'}),
                  [MewsText(strings.t('settings-size-increase'))]),
            ]),
          ]),
      ]),
      HeadingBlock(2, [MewsText(strings.t('settings-theme-heading'))]),
      choiceRow([
        for (final mode in ReaderSettingsController.themeModes)
          (
            href: MewsUrls.action('set-theme', {'value': mode}),
            label: strings.t(_themeLabels[mode]!),
            current: mode == settings.themeMode.value,
          ),
      ]),
      // The language a reader wants may not be the one they can currently
      // read, so each is named in its own words.
      HeadingBlock(2, [MewsText(strings.t('settings-language-heading'))]),
      choiceRow([
        (
          href: MewsUrls.action('set-language', {'value': systemLanguage}),
          label: strings.t('settings-language-system'),
          current: settings.language.value == systemLanguage,
        ),
        for (final locale in appLocales)
          (
            href: MewsUrls.action('set-language', {'value': locale.tag}),
            label: strings.t(locale.labelId),
            current: locale.tag == settings.language.value,
          ),
      ]),
      HeadingBlock(2, [MewsText(strings.t('settings-variant-heading'))]),
      choiceRow([
        for (final variant in ReaderSettingsController.variants)
          (
            href: MewsUrls.action('set-colors', {'value': variant}),
            label: strings.t(_variantLabels[variant]!),
            current: variant == settings.variant.value,
          ),
      ]),
    ],
  );
}