import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:diplomaticquarterapp/widgets/buttons/button.dart';
import 'package:diplomaticquarterapp/widgets/buttons/secondary_button.dart';
import 'package:diplomaticquarterapp/widgets/data_display/text.dart';
import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

const activeCardColor = Color(0xff515a5d);
const activeTextColor = Color(0xffFAFAFA);
const inactiveCardColor = Color(0xffFAFAFA);
const inactiveTextColor = Color(0xff60686B);

class BloodSugar extends StatefulWidget {
  @override
  _BloodSugarState createState() => _BloodSugarState();
}

Color color;

class _BloodSugarState extends State<BloodSugar> {
  Color cardMGColor = inactiveCardColor;
  Color cardMMOLColor = inactiveCardColor;
  Color textMGColor = inactiveTextColor;
  Color textMMOLColor = inactiveTextColor;

  void updateColor(int type) {
    //MG/DLT card
    if (type == 1) {
      if (cardMGColor == inactiveCardColor) {
        cardMGColor = activeCardColor;
        cardMMOLColor = inactiveCardColor;
      } else {
        cardMGColor = inactiveCardColor;
      }
      textMGColor = activeTextColor;
      textMMOLColor = inactiveTextColor;
    }
    if (type == 2) {
      if (cardMMOLColor == inactiveCardColor) {
        cardMMOLColor = activeCardColor;
        cardMGColor = inactiveCardColor;
      } else {
        cardMMOLColor = inactiveCardColor;
      }
      textMGColor = inactiveTextColor;
      textMMOLColor = activeTextColor;
    }
  }

  void calculateBloodSugar() {
    if (textController.text.isEmpty) return;
    if (cardMGColor == activeCardColor) {
      inputValue = double.parse(textController.text);
      inputValue = inputValue / 18;
      unit = 'mmol/l';
    } else if (cardMMOLColor == activeCardColor) {
      inputValue = double.parse(textController.text);
      inputValue = inputValue * 18;
      unit = 'mg/dlt';
    }
  }

  bool _visible = false;
  TextEditingController textController = new TextEditingController();
  String finalValue;

  double inputValue = 0;
  String unit;

  @override
  void initState() {
    updateColor(1);
    unit = 'mmol/l';
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return AppScaffold(
      isShowAppBar: true,
      isShowDecPage: false,
      appBarTitle: TranslationBase.of(context).bloodSugarConversion,
      body: Container(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          children: [
            Expanded(
              child: SingleChildScrollView(
                child: Column(
                  //crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      margin: EdgeInsets.symmetric(horizontal: 8),
                      child: Text(
                        TranslationBase.of(context).convertBloodSugarStatement,
                        //textAlign: TextAlign.center,
                        style: TextStyle(fontSize: 20.0),
                      ),
                    ),
                    SizedBox(
                      height: 12.0,
                    ),
                    Container(
                      color: Colors.white,
                      child: Padding(
                        padding: const EdgeInsets.symmetric(
                            vertical: 16.0, horizontal: 8),
                        child: Column(
                          children: [
                            Padding(
                              padding:
                                  const EdgeInsets.symmetric(horizontal: 16.0),
                              child: Row(
                                children: [
                                  Texts(
                                    TranslationBase.of(context).convertFrom,
                                  )
                                ],
                              ),
                            ),
                            SizedBox(
                              height: 8.0,
                            ),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                              crossAxisAlignment: CrossAxisAlignment.center,
                              children: [
                                SizedBox(
                                  width: 16.0,
                                ),
                                Expanded(
                                  child: GestureDetector(
                                    onTap: () {
                                      setState(() {
                                        updateColor(1);
                                        calculateBloodSugar();
                                      });
                                    },
                                    child: Container(
                                      height: 65.0,
                                      decoration: BoxDecoration(
                                        boxShadow: [
                                          BoxShadow(
                                            color: Colors.grey.withOpacity(0.5),
                                            spreadRadius: 3,
                                            blurRadius: 7,
                                            offset: Offset(0,
                                                3), // changes position of shadow
                                          ),
                                        ],
                                        color: cardMGColor,
                                        borderRadius:
                                            BorderRadius.circular(3.0),
                                      ),
                                      child: Padding(
                                        padding: const EdgeInsets.symmetric(
                                            vertical: 0.0, horizontal: 18.0),
                                        child: Texts(
                                          'MG/DLt TO \nMMOL/L',
                                          color: textMGColor,
                                        ),
                                      ),
                                    ),
                                  ),
                                ),
                                SizedBox(
                                  width: 12.0,
                                ),
                                Expanded(
                                  child: GestureDetector(
                                    onTap: () {
                                      setState(() {
                                        updateColor(2);
                                        calculateBloodSugar();
                                      });
                                    },
                                    child: Container(
                                      height: 65.0,
                                      decoration: BoxDecoration(
                                        color: cardMMOLColor,
                                        borderRadius:
                                            BorderRadius.circular(3.0),
                                        boxShadow: [
                                          BoxShadow(
                                            color: Colors.grey.withOpacity(0.5),
                                            spreadRadius: 3,
                                            blurRadius: 7,
                                            offset: Offset(0,
                                                3), // changes position of shadow
                                          ),
                                        ],
                                      ),
                                      child: Padding(
                                        padding: const EdgeInsets.symmetric(
                                            horizontal: 16.0),
                                        child: Texts(
                                          'MMOL/L TO MG/DLt ',
                                          color: textMMOLColor,
                                        ),
                                      ),
                                    ),
                                  ),
                                ),
                                SizedBox(
                                  width: 16.0,
                                ),
                              ],
                            ),
                          ],
                        ),
                      ),
                    ),
                    SizedBox(
                      height: 24.0,
                    ),
                    Container(
                      height: 65.0,
                      padding: EdgeInsets.symmetric(horizontal: 8),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(6.0),
                        color: Colors.white,
                      ),
                      child: TextFormField(
                        controller: textController,
                        inputFormatters: <TextInputFormatter>[
//                      FilteringTextInputFormatter.digitsOnly
                        ],
                        keyboardType: TextInputType.number,
                        decoration: InputDecoration(
                          labelText:
                              TranslationBase.of(context).enterReadingValue,
                          enabledBorder: UnderlineInputBorder(
                            borderSide: BorderSide(color: Colors.white),
                          ),
                          disabledBorder: UnderlineInputBorder(
                            borderSide: BorderSide(color: Colors.white),
                          ),
                          focusedBorder: UnderlineInputBorder(
                            borderSide: BorderSide(color: Colors.white),
                          ),
                          border: UnderlineInputBorder(
                              borderSide: BorderSide(color: Colors.white)),
                          labelStyle: TextStyle(
                            color: Colors.black87,
                          ),
                        ),
                      ),
                    ),
                    SizedBox(
                      height: 24.0,
                    ),
                    Visibility(
                      visible: _visible,
                      child: Container(
                        height: 115.0,
                        width: 350.0,
                        decoration: BoxDecoration(
                          color: Colors.white,
                          border: Border.all(color: Colors.black),
                          borderRadius: BorderRadius.circular(15.0),
                        ),
                        child: Padding(
                          padding: const EdgeInsets.all(8.0),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Texts(TranslationBase.of(context).result + ": "),
                              Row(
                                children: [
                                  Text(
                                    inputValue.toStringAsFixed(2),
                                    style: TextStyle(fontSize: 35.0),
                                  ),
                                  Padding(
                                    padding:
                                        EdgeInsets.only(left: 4.0, top: 10.0),
                                    child: Text(
                                      unit.toString(),
                                      style: TextStyle(
                                        color: Color(0xffC5273A),
                                        fontSize: 15.0,
                                        fontWeight: FontWeight.w500,
                                      ),
                                    ),
                                  ),
                                ],
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
            Container(
              margin: EdgeInsets.symmetric(horizontal: 16),
              child: SecondaryButton(
                label: TranslationBase.of(context).calculate,
                color: Color(0XFF515A5D),
                onTap: () {
                  setState(() {
                    _visible == false
                        ? _visible = !_visible
                        : _visible = _visible;
                    calculateBloodSugar();
                  });
                },
              ),
            ),
          ],
        ),
      ),
    );
  }
}
