import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:provider/provider.dart';
import 'package:fcs/model/language_model.dart';
import 'package:fcs/model/main_model.dart';
import 'package:fcs/pages/phone_input.dart';
import 'package:fcs/pages/util.dart';
import 'package:fcs/theme/theme.dart';
import 'package:fcs/vo/setting.dart';
import 'package:fcs/widget/local_text.dart';
import 'package:fcs/widget/local_text_field.dart';
import 'package:fcs/widget/localization/app_translations.dart';
import 'package:fcs/widget/progress.dart';

class ContactEditor extends StatefulWidget {
  final Setting setting;
  const ContactEditor({this.setting});
  @override
  _ContactEditorState createState() => _ContactEditorState();
}

class _ContactEditorState extends State<ContactEditor> {
  TextEditingController _email = new TextEditingController();
  TextEditingController _facebook = new TextEditingController();
  TextEditingController _website = new TextEditingController();
  TextEditingController _address = new TextEditingController();
  TextEditingController _deliveryPhone = new TextEditingController();

  final _formKey = GlobalKey<FormState>();
  bool _isLoading = false;

  List<String> phones = new List();
  List<String> _initPhones = new List();

  @override
  void initState() {
    super.initState();
    if (widget.setting != null) {
      this._initPhones = widget.setting.phones;
      _email.text = widget.setting.email;
      _facebook.text = widget.setting.facebook;
      _website.text = widget.setting.website;
      _deliveryPhone.text = widget.setting.deliveryPhone;
      _address.text = widget.setting.address;

      phones.clear();
      _initPhones.forEach((p) {
        phones.add(p);
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    var languageModel = Provider.of<LanguageModel>(context);

    final emailBox = TextFormField(
      controller: _email,
      autofocus: false,
      cursorColor: primaryColor,
      style: textStyle,
      decoration: new InputDecoration(
        labelText: AppTranslations.of(context).text('contact.email'),
        labelStyle: languageModel.isEng ? labelStyle : labelStyleMM,
        icon: Icon(
          Icons.email,
          color: primaryColor,
        ),
        enabledBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: primaryColor, width: 1.0)),
        focusedBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: primaryColor, width: 1.0)),
      ),
      validator: (value) {
        if (value.isEmpty) {
          return AppTranslations.of(context).text('contact.email.empty');
        }
        return null;
      },
    );

    final faceBookBox = TextFormField(
      controller: _facebook,
      autofocus: false,
      cursorColor: primaryColor,
      style: textStyle,
      decoration: new InputDecoration(
        labelText: AppTranslations.of(context).text('contact.facebook'),
        labelStyle: languageModel.isEng ? labelStyle : labelStyleMM,
        icon: Icon(
          FontAwesomeIcons.facebook,
          color: primaryColor,
        ),
        enabledBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: primaryColor, width: 1.0)),
        focusedBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: primaryColor, width: 1.0)),
      ),
      validator: (value) {
        if (value.isEmpty) {
          return AppTranslations.of(context).text('contact.facebook.empty');
        }
        return null;
      },
    );

    final googleBox = TextFormField(
      controller: _website,
      autofocus: false,
      cursorColor: primaryColor,
      style: textStyle,
      decoration: new InputDecoration(
        labelText: AppTranslations.of(context).text('contact.google'),
        labelStyle: languageModel.isEng ? labelStyle : labelStyleMM,
        icon: Icon(
          FontAwesomeIcons.chrome,
          color: primaryColor,
        ),
        enabledBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: primaryColor, width: 1.0)),
        focusedBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: primaryColor, width: 1.0)),
      ),
      validator: (value) {
        if (value.isEmpty) {
          return AppTranslations.of(context).text('contact.google.empty');
        }
        return null;
      },
    );

    final addPhoneNumber = ListTile(
        contentPadding: EdgeInsets.only(top: 15),
        title: ButtonTheme(
          height: 45,
          child: RaisedButton(
            color: Colors.white,
            onPressed: () async {
              var phone = await showDialog(
                  context: context, builder: (_) => PhoneEditor());
              _save(phone);
            },
            child: Text("Add Phone",
                style: TextStyle(
                  fontSize: 18,
                )),
          ),
        ));

    return LocalProgress(
        inAsyncCall: _isLoading,
        child: Scaffold(
          appBar: AppBar(
            backgroundColor: primaryColor,
            title: LocalText(
              context,
              "contact.title",
              fontSize: 20,
              color: Colors.white,
            ),
            actions: <Widget>[
              IconButton(
                  icon: Icon(Icons.send),
                  onPressed: () {
                    if (!_formKey.currentState.validate()) return;
                    showConfirmDialog(context, "contact.confrim", () {
                      _submit();
                    });
                  })
            ],
          ),
          body: Form(
            key: _formKey,
            child: ListView(
              shrinkWrap: true,
              padding: EdgeInsets.only(left: 24.0, right: 24.0),
              children: <Widget>[
                this.phones.isNotEmpty
                    ? ConstrainedBox(
                        constraints: BoxConstraints(maxHeight: 1000),
                        child: ListView.builder(
                          shrinkWrap: true,
                          itemBuilder: (context, index) {
                            return Stack(
                              alignment: const Alignment(1.0, 1.0),
                              children: <Widget>[
                                new TextField(
                                  controller: new TextEditingController(
                                      text: this.phones[index]),
                                  cursorColor: primaryColor,
                                  readOnly: true,
                                  decoration: new InputDecoration(
                                    border: InputBorder.none,
                                    focusedBorder: InputBorder.none,
                                    icon: Icon(
                                      Icons.phone,
                                      color: primaryColor,
                                    ),
                                  ),
                                ),
                                new FlatButton(
                                    onPressed: () {
                                      setState(() {
                                        this.phones.remove(this.phones[index]);
                                      });
                                    },
                                    child: new Icon(
                                      Icons.cancel,
                                      size: 25,
                                    ))
                              ],
                            );
                          },
                          itemCount: this.phones.length,
                        ),
                      )
                    : Container(),
                addPhoneNumber,
                LocalTextField(
                  textEditingController: _deliveryPhone,
                  icon: Icon(
                    Icons.phone_forwarded,
                    color: primaryColor,
                  ),
                  labelKey: "contact.delivery.phone",
                ),
                emailBox,
                faceBookBox,
                googleBox,
                LocalTextField(
                  textEditingController: _address,
                  icon: Icon(
                    Icons.location_on,
                    color: primaryColor,
                  ),
                  labelKey: "contact.address",
                  maxLines: 3,
                ),
              ],
            ),
          ),
        ));
  }

  _save(String phone) {
    if (phone == null) return;
    setState(() {
      this.phones.add(phone);
    });
  }

  _submit() async {
    setState(() {
      _isLoading = true;
    });
    try {
      widget.setting.email = _email.text;
      widget.setting.facebook = _facebook.text;
      widget.setting.website = _website.text;
      widget.setting.phones = this.phones;
      widget.setting.address = _address.text;
      widget.setting.deliveryPhone = _deliveryPhone.text;
      var mainModel = Provider.of<MainModel>(context);
      await mainModel.updateContact(widget.setting);
      Navigator.pop(context);
    } catch (e) {
      showMsgDialog(context, "Error", e.toString());
    } finally {
      setState(() {
        _isLoading = false;
      });
    }
  }
}