import 'package:flutter/cupertino.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:<%= baseName %>/account/login/login_repository.dart';
import 'package:<%= baseName %>/account/settings/bloc/settings_bloc.dart';
<%_ if (enableTranslation) { _%>
import 'package:<%= baseName %>/generated/l10n.dart';
import 'package:<%= baseName %>/environment.dart';
<%_ } _%>
import 'package:<%= baseName %>/keys.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:<%= baseName %>/shared/repository/http_utils.dart';
import 'package:formz/formz.dart';
import 'package:<%= baseName %>/shared/widgets/drawer/bloc/drawer_bloc.dart';
import 'package:<%= baseName %>/shared/widgets/drawer/drawer_widget.dart';

import 'bloc/settings_models.dart';

class SettingsScreen extends StatelessWidget {
  SettingsScreen() : super(key: <%= camelizedUpperFirstBaseName %>Keys.settingsScreen);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          centerTitle: true,
          title: BlocBuilder<SettingsBloc, SettingsState>(
              buildWhen: (previous, current) => previous.firstname != current.firstname
                  || current.action == SettingsAction.reloadForLanguage,
              builder: (context, state) {
                return Text(<%_ if (enableTranslation) { _%> S.of(context).pageSettingsTitle <%_ } else { _%> 'Settings' <%_ } _%>);
              })
        ),
        body: SingleChildScrollView(
          padding: const EdgeInsets.all(15.0),
          child: Column(children: <Widget>[settingsForm(context)]),
        ),
        drawer: BlocProvider<DrawerBloc>(
            create: (context) => DrawerBloc(loginRepository: LoginRepository()),
            child: <%= camelizedUpperFirstBaseName %>Drawer())
    );
  }

  Widget settingsForm(BuildContext context) {
          return Form(
            child: Wrap(runSpacing: 15, children: <Widget>[
              firstnameField(),
              lastnameNameField(),
              emailField(),
            <%_ if (enableTranslation) { _%>
            languageField(),
            <%_ } _%>
              notificationZone(),
              submit(context)
            ]),
          );
  }

  Widget firstnameField() {
    return BlocBuilder<SettingsBloc, SettingsState>(
        buildWhen: (previous, current) => previous.firstname != current.firstname
            || current.action == SettingsAction.reloadForLanguage,
        builder: (context, state) {
          return TextFormField(
              controller: context.bloc<SettingsBloc>().firstNameController,
              onChanged: (value) { context.bloc<SettingsBloc>().add(FirstnameChanged(firstname: value)); },
              keyboardType: TextInputType.text,
              decoration: InputDecoration(
                  labelText: <%_ if (enableTranslation) { _%> S.of(context).pageSettingsFormFirstname <%_ } else { _%> 'Firstname' <%_ } _%>,
                  errorText: state.firstname.invalid ? FirstnameValidationError.invalid.invalidMessage : null));
        }
    );
  }

  Widget lastnameNameField() {
    return BlocBuilder<SettingsBloc, SettingsState>(
        buildWhen: (previous, current) => previous.lastname != current.lastname
            || current.action == SettingsAction.reloadForLanguage,
        builder: (context, state) {
          return TextFormField(
              controller: context.bloc<SettingsBloc>().lastNameController,
              onChanged: (value) { context.bloc<SettingsBloc>().add(LastnameChanged(lastname: value)); },
              keyboardType: TextInputType.text,
              decoration: InputDecoration(
                  labelText: <%_ if (enableTranslation) { _%> S.of(context).pageSettingsFormLastname <%_ } else { _%> 'Lastname' <%_ } _%>,
                  errorText: state.lastname.invalid ? LastnameValidationError.invalid.invalidMessage : null));
        }
    );
  }

  Widget emailField() {
    return BlocBuilder<SettingsBloc, SettingsState>(
        buildWhen: (previous, current) => previous.email != current.email
            || current.action == SettingsAction.reloadForLanguage,
        builder: (context, state) {
          return TextFormField(
              controller: context.bloc<SettingsBloc>().emailController,
              onChanged: (value) { context.bloc<SettingsBloc>().add(EmailChanged(email: value)); },
              keyboardType: TextInputType.text,
              decoration: InputDecoration(
                  labelText: <%_ if (enableTranslation) { _%> S.of(context).pageSettingsFormEmail <%_ } else { _%> 'Email' <%_ } _%>,
                  errorText: state.email.invalid ? EmailValidationError.invalid.invalidMessage : null));
        }
    );
  }
<%_ if (enableTranslation) { _%>
  Widget languageField() {
    return BlocBuilder<SettingsBloc, SettingsState>(
        buildWhen: (previous, current) => previous.language != current.language,
        builder: (context, state) {
           return Padding(
            padding: const EdgeInsets.only(left: 3.0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Text(S.of(context).pageSettingsFormLanguages, style: Theme.of(context).textTheme.bodyText1,),
                DropdownButton<String>(
                    value: state.language,
                    onChanged: (value) { context.bloc<SettingsBloc>().add(LanguageChanged(language: value)); },
                    items: createDropdownLanguageItems(Constants.languages)),
              ],
            ),
          );
        });
  }

  List<DropdownMenuItem<String>> createDropdownLanguageItems(Map<String, String> languages) {
    return languages.keys.map<DropdownMenuItem<String>>((String key) =>
            DropdownMenuItem<String>(value: key, child: Text(languages[key])))
        .toList();
  }
<%_ } _%>

  submit(BuildContext context) {
    return BlocBuilder<SettingsBloc, SettingsState>(
        buildWhen: (previous, current) => previous.formStatus != current.formStatus,
        builder: (context, state) {
        return RaisedButton(
          child: Container(
              width: MediaQuery.of(context).size.width,
              child: Center(
                child: Visibility(
                  replacement: CircularProgressIndicator(value: null),
                  visible: !state.formStatus.isSubmissionInProgress,
                  child: Text(<%_ if (enableTranslation) { _%> S.of(context).pageSettingsFormSave.toUpperCase() <%_ } else { _%> 'SAVE' <%_ } _%>),
                ),
              )),
          onPressed: state.formStatus.isValidated ? () => context.bloc<SettingsBloc>().add(FormSubmitted()) : null,
        );
      }
    );
  }

  Widget notificationZone() {
    return BlocBuilder<SettingsBloc, SettingsState>(
        buildWhen: (previous, current) => previous.formStatus != current.formStatus,
        builder: (context, state) {
          return Visibility(
              visible: state.formStatus.isSubmissionFailure ||  state.formStatus.isSubmissionSuccess,
              child: Center(
                child: generateNotificationText(state, context),
              ));
        });
  }

  Widget generateNotificationText(SettingsState state, BuildContext context) {
    String notificationTranslated = '';
    MaterialColor notificationColors;
    if(state.generalNotificationKey.compareTo(SettingsBloc.successKey) == 0) {
      notificationTranslated = <%_ if (enableTranslation) { _%> S.of(context).pageSettingsSave <%_ } else { _%> 'Settings saved !' <%_ } _%>;
      notificationColors = Theme.of(context).primaryColor;
    } else if(state.generalNotificationKey.compareTo(HttpUtils.errorServerKey) == 0) {
      notificationTranslated = <%_ if (enableTranslation) { _%> S.of(context).genericErrorBadRequest <%_ } else { _%> 'Something wrong happended with the data' <%_ } _%>;
      notificationColors = Theme.of(context).errorColor;
    } else if (state.generalNotificationKey.compareTo(HttpUtils.errorServerKey) == 0) {
      notificationTranslated = <%_ if (enableTranslation) { _%> S.of(context).genericErrorServer <%_ } else { _%> 'Something wrong when calling the server, please try again' <%_ } _%>;
      notificationColors = Theme.of(context).errorColor;
    }

    return Text(
      notificationTranslated,
      style: TextStyle(color: notificationColors),
    );
  }
}