import 'package:aitrainer_app/bloc/exercise_new/exercise_new_bloc.dart';
import 'package:aitrainer_app/util/app_localization.dart';
import 'package:aitrainer_app/util/trans.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:syncfusion_flutter_gauges/gauges.dart';
import 'app_bar.dart';
import 'package:keyboard_actions/keyboard_actions.dart';

// ignore: must_be_immutable
class BMI extends StatefulWidget {
  final ExerciseNewBloc exerciseBloc;
  BMI({required this.exerciseBloc});

  @override
  _BMIState createState() => _BMIState();
}

class _BMIState extends State<BMI> with Trans {
  final FocusNode _nodeText1 = FocusNode();
  final FocusNode _nodeText2 = FocusNode();

  KeyboardActionsConfig _buildConfig(BuildContext context) {
    return KeyboardActionsConfig(
      keyboardActionsPlatform: KeyboardActionsPlatform.ALL,
      keyboardBarColor: Colors.grey[200],
      keyboardSeparatorColor: Colors.black26,
      nextFocus: true,
      actions: [
        KeyboardActionsItem(focusNode: _nodeText2, toolbarButtons: [
          (node) {
            return GestureDetector(
              onTap: () => node.unfocus(),
              child: Container(
                padding: EdgeInsets.all(8.0),
                color: Colors.orange[500],
                child: Text(
                  AppLocalizations.of(context)!.translate("Done"),
                  style: TextStyle(color: Colors.white),
                ),
              ),
            );
          }
        ]),
        KeyboardActionsItem(
          focusNode: _nodeText1,
          toolbarButtons: [
            //button 2
            (node) {
              return GestureDetector(
                onTap: () => node.unfocus(),
                child: Container(
                  color: Colors.orange,
                  padding: EdgeInsets.all(8.0),
                  child: Text(
                    AppLocalizations.of(context)!.translate("Done"),
                    style: TextStyle(color: Colors.white),
                  ),
                ),
              );
            }
          ],
        ),
      ],
    );
  }

  @override
  Widget build(BuildContext context) {
    setContext(context);
    double mediaWidth = MediaQuery.of(context).size.width * .8;
    double mediaHeight = MediaQuery.of(context).size.height * .8;
    //print("w " + mediaWidth.toString() + "h " + mediaHeight.toString());
    widget.exerciseBloc.customerRepository.setMediaDimensions(mediaWidth, mediaHeight);
    widget.exerciseBloc.getBMI();
    return Form(
        child: Scaffold(
            resizeToAvoidBottomInset: true,
            appBar: AppBarNav(depth: 1),
            body: Container(
                width: MediaQuery.of(context).size.width,
                height: MediaQuery.of(context).size.height,
                decoration: BoxDecoration(
                  image: DecorationImage(
                    image: AssetImage('asset/image/WT_black_background.jpg'),
                    fit: BoxFit.fill,
                    alignment: Alignment.center,
                  ),
                ),
                child: KeyboardActions(
                    config: _buildConfig(context),
                    child: SingleChildScrollView(
                        child:
                            Column(crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center, children: [
                      getWeightInput(),
                      Text(t("Body Mass Index"),
                          style: GoogleFonts.archivoBlack(
                            shadows: <Shadow>[
                              Shadow(
                                offset: Offset(5.0, 5.0),
                                blurRadius: 3.0,
                                color: Colors.black54,
                              ),
                            ],
                            fontSize: 30,
                            color: Colors.orange[500],
                          )),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Text(widget.exerciseBloc.bmi.toStringAsFixed(1),
                              style: GoogleFonts.archivoBlack(
                                shadows: <Shadow>[
                                  Shadow(
                                    offset: Offset(5.0, 5.0),
                                    blurRadius: 3.0,
                                    color: Colors.black54,
                                  ),
                                ],
                                fontSize: 60,
                                color: Colors.orange[500],
                              )),
                          Text(" kg/m2",
                              style: GoogleFonts.archivoBlack(
                                shadows: <Shadow>[
                                  Shadow(
                                    offset: Offset(5.0, 5.0),
                                    blurRadius: 3.0,
                                    color: Colors.black54,
                                  ),
                                ],
                                fontSize: 30,
                                color: Colors.orange[500],
                              )),
                        ],
                      ),
                      Divider(color: Colors.transparent),
                      SfRadialGauge(
                        enableLoadingAnimation: true,
                        animationDuration: 2500,
                        axes: <RadialAxis>[
                          RadialAxis(
                            axisLabelStyle: GaugeTextStyle(fontWeight: FontWeight.w500, fontSize: 12, color: Colors.white),
                            showLabels: true,
                            showAxisLine: true,
                            showTicks: true,
                            ticksPosition: ElementsPosition.outside,
                            labelsPosition: ElementsPosition.outside,
                            ranges: <GaugeRange>[
                              GaugeRange(
                                  label: '<18,5',
                                  labelStyle: GaugeTextStyle(fontSize: 20, color: Colors.white, fontWeight: FontWeight.bold),
                                  startValue: 15,
                                  endValue: 18.5,
                                  sizeUnit: GaugeSizeUnit.factor,
                                  startWidth: 0.45,
                                  endWidth: 0.45,
                                  color: Colors.blue),
                              GaugeRange(
                                  label: '18,5 - 25',
                                  labelStyle: GaugeTextStyle(fontSize: 20, color: Colors.white, fontWeight: FontWeight.bold),
                                  startValue: 18.5,
                                  endValue: 25,
                                  sizeUnit: GaugeSizeUnit.factor,
                                  startWidth: 0.45,
                                  endWidth: 0.45,
                                  color: Colors.green),
                              GaugeRange(
                                  label: '25-30',
                                  labelStyle: GaugeTextStyle(fontSize: 20, color: Colors.white, fontWeight: FontWeight.bold),
                                  startValue: 25,
                                  endValue: 30,
                                  sizeUnit: GaugeSizeUnit.factor,
                                  startWidth: 0.45,
                                  endWidth: 0.45,
                                  color: Colors.yellow),
                              GaugeRange(
                                  label: '30-35',
                                  labelStyle: GaugeTextStyle(fontSize: 20, color: Colors.white, fontWeight: FontWeight.bold),
                                  startValue: 30,
                                  endValue: 35,
                                  sizeUnit: GaugeSizeUnit.factor,
                                  startWidth: 0.45,
                                  endWidth: 0.45,
                                  color: Colors.orange),
                              GaugeRange(
                                  label: '35<',
                                  labelStyle: GaugeTextStyle(fontSize: 20, color: Colors.white, fontWeight: FontWeight.bold),
                                  startValue: 35,
                                  endValue: 40,
                                  sizeUnit: GaugeSizeUnit.factor,
                                  startWidth: 0.45,
                                  endWidth: 0.45,
                                  color: Colors.red[700])
                            ],
                            minimum: 15,
                            maximum: 40,
                            pointers: [
                              NeedlePointer(
                                needleColor: Colors.grey,
                                value: widget.exerciseBloc.bmi,
                                enableAnimation: true,
                                knobStyle:
                                    KnobStyle(color: Colors.white, borderColor: Color(0xFFDADADA), knobRadius: 0.06, borderWidth: 0.04),
                              )
                            ],
                          )
                        ],
                      ),
                      Divider(color: Colors.transparent),
                      Container(
                        padding: EdgeInsets.only(left: 65, right: 65),
                        alignment: Alignment.center,
                        child: Text(t("Based on your weight and height your goal for BMI and weight:"),
                            textAlign: TextAlign.center,
                            style: GoogleFonts.inter(
                              fontSize: 16,
                              color: Colors.yellow[200],
                            )),
                      ),
                      Text("BMI" + " " + t("first step") + ": " + widget.exerciseBloc.goalMilestoneBMI.toStringAsFixed(1),
                          style: GoogleFonts.archivoBlack(
                            fontSize: 20,
                            color: Colors.orange[200],
                            shadows: <Shadow>[
                              Shadow(
                                offset: Offset(2.0, 2.0),
                                blurRadius: 5.0,
                                color: Colors.black54,
                              ),
                            ],
                          )),
                      Text(
                          t("Bodyweight") +
                              " " +
                              t("first step") +
                              ": " +
                              widget.exerciseBloc.goalMilestoneWeight.toStringAsFixed(0) +
                              " kg",
                          style: GoogleFonts.archivoBlack(
                            fontSize: 20,
                            color: Colors.orange[200],
                            shadows: <Shadow>[
                              Shadow(
                                offset: Offset(2.0, 2.0),
                                blurRadius: 5.0,
                                color: Colors.black87,
                              ),
                            ],
                          )),
                      Text("BMI" + " " + t("goal") + ": " + widget.exerciseBloc.goalBMI.toStringAsFixed(1),
                          style: GoogleFonts.archivoBlack(
                            fontSize: 20,
                            color: Colors.orange[500],
                            shadows: <Shadow>[
                              Shadow(
                                offset: Offset(2.0, 2.0),
                                blurRadius: 5.0,
                                color: Colors.black87,
                              ),
                            ],
                          )),
                      Text(t("Bodyweight") + " " + t("goal") + ": " + widget.exerciseBloc.goalWeight.toStringAsFixed(0) + " kg",
                          style: GoogleFonts.archivoBlack(
                            fontSize: 20,
                            color: Colors.orange[500],
                            shadows: <Shadow>[
                              Shadow(
                                offset: Offset(2.0, 2.0),
                                blurRadius: 5.0,
                                color: Colors.black54,
                              ),
                            ],
                          )),
                    ]))))));
  }

  Widget buildAnimatedPointer() {
    return TweenAnimationBuilder(
      tween: IntTween(begin: 0, end: 30),
      duration: Duration(milliseconds: 2000),
      curve: Curves.linear,
      builder: (context, val, child) {
        return Image.asset(
          "asset/image/BMI_mutato.png",
          width: 65,
        );
      },
    );
  }

  Widget getHeightInput() {
    if (widget.exerciseBloc.customerRepository.customer!.birthYear! < 2003) {
      return Flexible(
        child: TextFormField(
            focusNode: _nodeText2,
            decoration: InputDecoration(
              contentPadding: EdgeInsets.only(left: 15, top: 5, bottom: 5),
              labelText: AppLocalizations.of(context)!.translate("Actual Height"),
              labelStyle: GoogleFonts.inter(fontSize: 16, color: Colors.yellow[50]),
              fillColor: Colors.black38,
              filled: true,
              border: OutlineInputBorder(
                gapPadding: 4.0,
                borderRadius: BorderRadius.circular(12.0),
                borderSide: BorderSide(color: Colors.white12, width: 0.4),
              ),
            ),
            initialValue: widget.exerciseBloc.height.toStringAsFixed(0),
            keyboardType: TextInputType.numberWithOptions(decimal: false),
            textInputAction: TextInputAction.done,
            style: GoogleFonts.archivoBlack(fontSize: 20, color: Colors.yellow[300]),
            onChanged: (value) => {
                  if (value.isNotEmpty)
                    {
                      value = value.replaceFirst(",", "."),
                      value = value.replaceAll(RegExp(r'[^0-9.]'), ""),
                      widget.exerciseBloc.add(ExerciseNewHeightChange(value: double.parse(value))),
                    }
                }),
      );
    } else {
      return Container();
    }
  }

  Widget getWeightInput() {
    return Container(
        padding: EdgeInsets.only(top: 15, left: 65, right: 65, bottom: 10),
        alignment: Alignment.center,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.start,
          children: [
            getHeightInput(),
            SizedBox(
              width: 10,
            ),
            Flexible(
              child:
                  /* SfLinearGauge(
                  minimum: widget.exerciseBloc.weight > 0 ? (widget.exerciseBloc.weight - 10).floor().toDouble() : 40,
                  maximum: widget.exerciseBloc.weight > 0 ? (widget.exerciseBloc.weight + 10).ceil().toDouble() : 150,
                  labelPosition: LinearLabelPosition.outside,
                  tickPosition: LinearElementPosition.outside,
                  markerPointers: [
                    LinearWidgetPointer(
                      value: widget.exerciseBloc.weight,
                      offset: 5,
                      position: LinearElementPosition.outside,
                      markerAlignment: LinearMarkerAlignment.center,
                      child: Container(
                        height: 14,
                        width: 44,
                        color: Colors.transparent,
                        child: Text(widget.exerciseBloc.weight.toStringAsFixed(1),
                            style: GoogleFonts.inter(
                              fontSize: 12,
                              fontWeight: FontWeight.bold,
                              color: Colors.white,
                            )),
                      ),
                    ),
                    LinearShapePointer(
                      position: LinearElementPosition.inside,
                      shapeType: LinearShapePointerType.triangle,
                      value: widget.exerciseBloc.weight,
                      height: 45,
                      width: 20,
                      color: Colors.yellow[200],
                      onValueChanged: (value) => {widget.exerciseBloc.add(ExerciseNewWeightChange(value: value))},
                    ),
                  ],
                  orientation: LinearGaugeOrientation.horizontal,
                  majorTickStyle: LinearTickStyle(length: 20, color: Colors.yellow[50]),
                  axisLabelStyle: TextStyle(fontSize: 12.0, color: Colors.yellow[50]),
                  axisTrackStyle: LinearAxisTrackStyle(
                      color: Colors.cyan,
                      edgeStyle: LinearEdgeStyle.bothFlat,
                      thickness: 1.0,
                      borderColor: Colors
                          .grey)), */
                  TextFormField(
                focusNode: _nodeText1,
                decoration: InputDecoration(
                  contentPadding: EdgeInsets.only(left: 15, top: 5, bottom: 5),
                  labelText: AppLocalizations.of(context)!.translate("Actual Weight"),
                  labelStyle: GoogleFonts.inter(fontSize: 16, color: Colors.yellow[50]),
                  fillColor: Colors.black38,
                  filled: true,
                  border: OutlineInputBorder(
                    gapPadding: 2.0,
                    borderRadius: BorderRadius.circular(12.0),
                    borderSide: BorderSide(color: Colors.white12, width: 0.4),
                  ),
                ),
                initialValue: widget.exerciseBloc.weight.toStringAsFixed(1),
                keyboardType: TextInputType.numberWithOptions(decimal: true),
                textInputAction: TextInputAction.done,
                style: GoogleFonts.archivoBlack(fontSize: 20, color: Colors.yellow[300]),
                onChanged: (value) => {
                  if (value.isNotEmpty)
                    {
                      value = value.replaceFirst(",", "."),
                      value = value.replaceAll(RegExp(r'[^0-9.]'), ""),
                      widget.exerciseBloc.add(ExerciseNewWeightChange(value: double.parse(value))),
                    }
                },
              ),
            ),
            IconButton(
                icon: Icon(Icons.save),
                hoverColor: Colors.blueAccent,
                color: widget.exerciseBloc.changedWeight ? Colors.blue[200] : Colors.black54,
                onPressed: () => {widget.exerciseBloc.add(ExerciseNewSaveWeight())})
          ],
        ));
  }
}