import 'package:aitrainer_app/localization/app_localization.dart';
import 'package:aitrainer_app/viewmodel/customer_changing_view_model.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';

// ignore: must_be_immutable
class CustomerFitnessPage extends StatefulWidget{
  _CustomerFitnessPageState _state;

  _CustomerFitnessPageState createState() {
    _state = _CustomerFitnessPageState();
    return _state;
  }
}

class FitnessItem {
  static String beginner = "beginner";
  static String intermediate = "intermediate";
  static String advanced = "advanced";
  static String professional = "professional";
}

//TODO
// dropbox for professional sport

class _CustomerFitnessPageState extends State<CustomerFitnessPage> {
  String selected;

  @override
  Widget build(BuildContext context) {
    final double cWidth = MediaQuery.of(context).size.width*0.75;
    final CustomerChangingViewModel changingViewModel = ModalRoute.of(context).settings.arguments;
    selected = changingViewModel.customer.fitnessLevel;
    return Scaffold(
        appBar: AppBar(
          title: Row(
            mainAxisAlignment: MainAxisAlignment.end,
            children: <Widget>[

              Image.asset(
                'asset/image/WT_long_logo.png',
                fit: BoxFit.cover,
                height: 65.0,
              ),
            ],
          ),
          backgroundColor: Colors.transparent,
          ),
          body: SingleChildScrollView(
            scrollDirection: Axis.vertical,
            child: Container(

              padding: EdgeInsets.only(bottom: 200),
              decoration: BoxDecoration(
                image: DecorationImage(
                  image: AssetImage('asset/image/WT_light_background.png'),
                  fit: BoxFit.cover,
                  alignment: Alignment.center,
                ),
              ),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Divider(),
                  Wrap(
                    //runAlignment: WrapAlignment.center,
                    alignment: WrapAlignment.center,
                    children: [
                      Text(
                        AppLocalizations.of(context).translate("Your Fitness State"),
                        textAlign: TextAlign.center,
                        style: TextStyle(color: Colors.orange,
                            fontSize: 42, fontFamily: 'Arial',
                            fontWeight: FontWeight.w900 ),)
                    ]
                  ),


                  Divider(),
                    FlatButton(
                      child: Container(
                        width: cWidth,
                        child: Column(
                          children: [
                            Text(AppLocalizations.of(context).translate("Beginner"),
                                textWidthBasis: TextWidthBasis.longestLine,
                                style: TextStyle(color: Colors.blue,
                                  fontSize: 32, fontFamily: 'Arial',
                                  fontWeight: FontWeight.w900 )),
                            Text(AppLocalizations.of(context).translate("I am beginner"),
                              style: TextStyle(color: Colors.black,
                                  fontSize: 20, fontFamily: 'Arial',
                                  fontWeight: FontWeight.w100 ),),
                          ],
                        )
                        ),
                        padding: EdgeInsets.all(10.0),
                        shape: getShape(changingViewModel, FitnessItem.beginner ),
                        onPressed:() =>
                        {
                          setState((){
                            selected = FitnessItem.beginner;
                            changingViewModel.customer.setFitnessLevel(selected);
                            print(selected);
                          }),

                        }

                    ),
                  Divider(),
                    FlatButton(
                      child: Container(
                          width: cWidth,
                          child: Column(
                          children: [
                            InkWell(
                              child: Text(AppLocalizations.of(context).translate("Intermediate"),
                                style: TextStyle(color: Colors.blue,
                                    fontSize: 32, fontFamily: 'Arial',
                                    fontWeight: FontWeight.w900 ),),
                              highlightColor: Colors.white,
                            ),
                            InkWell(
                              child: Text(AppLocalizations.of(context).translate("I am intermediate"),
                                style: TextStyle(color: Colors.black,
                                    fontSize: 20, fontFamily: 'Arial',
                                    fontWeight: FontWeight.w100 ),),
                              highlightColor: Colors.white,
                            ),
                          ],
                        ),
                      ),
                        padding: EdgeInsets.all(10.0),
                        shape: getShape(changingViewModel, FitnessItem.intermediate ),

                        onPressed:() =>
                        {
                          setState((){
                            selected = FitnessItem.intermediate;
                            changingViewModel.customer.setFitnessLevel(selected);
                            print(selected);
                          }),

                        }
                    ),
                  Divider(),
                    FlatButton(
                      child: Container(
                          width: cWidth,
                        child: Column(
                          children: [
                            InkWell(
                              child: Text(AppLocalizations.of(context).translate("Advanced"),
                                style: TextStyle(color: Colors.blue,
                                    fontSize: 32, fontFamily: 'Arial',
                                    fontWeight: FontWeight.w900 ),),
                              highlightColor: Colors.white,
                            ),
                            InkWell(
                              child: Text(AppLocalizations.of(context).translate("I am advanced"),
                                style: TextStyle(color: Colors.black,
                                    fontSize: 20, fontFamily: 'Arial',
                                    fontWeight: FontWeight.w100 ),),
                              highlightColor: Colors.white,
                            ),
                          ],
                        ),
                      ),
                        padding: EdgeInsets.all(10.0),
                        shape: getShape(changingViewModel, FitnessItem.advanced ),
                        onPressed:() =>
                        {
                          setState((){
                            selected = FitnessItem.advanced;
                            changingViewModel.customer.setFitnessLevel(selected);
                            print(selected);
                          }),

                        }
                    ),
                  Divider(),
                    FlatButton(
                      child: Container(
                          width: cWidth,
                        child: Column(
                          children: [
                            InkWell(
                              child: Text(AppLocalizations.of(context).translate("Professional"),
                                style: TextStyle(color: Colors.blue,
                                    fontSize: 32, fontFamily: 'Arial',
                                    fontWeight: FontWeight.w900 ),),
                              highlightColor: Colors.white,
                            ),
                            InkWell(
                              child: Text(AppLocalizations.of(context).translate("I am professional"),
                                style: TextStyle(color: Colors.black,
                                    fontSize: 20, fontFamily: 'Arial',
                                    fontWeight: FontWeight.w100 ),),
                              highlightColor: Colors.white,
                            ),
                          ],
                        ),
                      ),
                        padding: EdgeInsets.all(10.0),
                        shape: getShape(changingViewModel, FitnessItem.professional ),
                        onPressed:() =>
                        {
                          setState((){
                            selected = FitnessItem.professional;
                            changingViewModel.customer.setFitnessLevel(selected);
                            print(selected);
                          }),

                        }
                    ),
                  Divider(),
                    RaisedButton(

                      color: Colors.orange,
                      textColor: Colors.white,
                      child: InkWell(
                          child: Text(AppLocalizations.of(context).translate("Next"))),
                      onPressed: () => {
                        changingViewModel.saveCustomer(),
                        Navigator.of(context).pop(),
                        Navigator.of(context).pushNamed("customerBodyTypePage", arguments: changingViewModel)
                      },
                    )
                  ],
              ),
          ),
       )
    );
  }

  dynamic getShape( CustomerChangingViewModel changingViewModel, String fitnessLevel ) {
    String selected = changingViewModel.customer.fitnessLevel;
    dynamic returnCode = ( selected == fitnessLevel ) ?
    RoundedRectangleBorder(
      side: BorderSide(width: 4, color: Colors.orange),
    )
        :
    RoundedRectangleBorder(
      side: BorderSide(width: 1, color: Colors.blue),
    );
    //return
    return returnCode;
  }

}