import 'package:diameter/components/forms.dart';
import 'package:diameter/config.dart';
import 'package:diameter/settings.dart';
import 'package:diameter/utils/utils.dart';
import 'package:flutter/material.dart';

class LogEntryForm extends StatefulWidget {
  final GlobalKey<FormState> formState;
  final Map<String, TextEditingController> controllers;

  const LogEntryForm(
      {Key? key, required this.formState, required this.controllers})
      : super(key: key);

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

class _LogEntryFormState extends State<LogEntryForm> {
  void convertBetweenMgPerDlAndMmolPerL({GlucoseMeasurement? calculateFrom}) {
    int? mgPerDl;
    double? mmolPerL;
    final _mgPerDlController = widget.controllers['mgPerDl'];
    final _mmolPerLController = widget.controllers['mmolPerL'];

    if (calculateFrom != GlucoseMeasurement.mmolPerL &&
        _mgPerDlController!.text != '') {
      mgPerDl = int.tryParse(_mgPerDlController.text);
    }
    if (calculateFrom != GlucoseMeasurement.mgPerDl &&
        _mmolPerLController!.text != '') {
      mmolPerL = double.tryParse(_mmolPerLController.text);
    }

    if (mgPerDl != null && mmolPerL == null) {
      setState(() {
        _mmolPerLController!.text =
            Utils.convertMgPerDlToMmolPerL(mgPerDl!).toString();
      });
    }
    if (mmolPerL != null && mgPerDl == null) {
      setState(() {
        _mgPerDlController!.text =
            Utils.convertMmolPerLToMgPerDl(mmolPerL!).toString();
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    // final _timeController = widget.controllers['time'];
    final _mgPerDlController = widget.controllers['mgPerDl'];
    final _mmolPerLController = widget.controllers['mmolPerL'];
    final _bolusGlucoseController = widget.controllers['bolusGlucose'];
    final _delayedBolusRateController = widget.controllers['delayedBolusRate'];
    final _delayedBolusDurationController =
        widget.controllers['delayedBolusDuration'];
    final _notesController = widget.controllers['notes'];

    return SingleChildScrollView(
      child: Column(crossAxisAlignment: CrossAxisAlignment.stretch, children: <
          Widget>[
        StyledForm(
          formState: widget.formState,
          fields: [
            // TODO: insert time picker
            // Expanded(
            //   child: StyledTimeOfDayFormField(
            //     label: 'Time',
            //     controller: _timeController,
            //     onChanged: (newEndTime) {
            //       if (newEndTime != null) {
            //         setState(() {
            //           _endTime = newEndTime;
            //         });
            //         updateEndTime();
            //       }
            //),
            Row(
              children: [
                glucoseMeasurement == GlucoseMeasurement.mgPerDl ||
                        glucoseDisplayMode == GlucoseDisplayMode.both ||
                        glucoseDisplayMode == GlucoseDisplayMode.bothForDetail
                    ? Expanded(
                        child: TextFormField(
                          decoration: const InputDecoration(
                            labelText: 'mg/dl',
                            suffixText: 'mg/dl',
                          ),
                          controller: _mgPerDlController,
                          onChanged: (_) => convertBetweenMgPerDlAndMmolPerL(
                              calculateFrom: GlucoseMeasurement.mgPerDl),
                          keyboardType: const TextInputType.numberWithOptions(),
                          validator: (value) {
                            if (value!.trim().isEmpty &&
                                _mmolPerLController!.text.trim().isEmpty) {
                              return 'How many mg/dl or mmol/l does the rate make up for?';
                            }
                            return null;
                          },
                        ),
                      )
                    : Container(),
                glucoseDisplayMode == GlucoseDisplayMode.both ||
                        glucoseDisplayMode == GlucoseDisplayMode.bothForDetail
                    ? IconButton(
                        onPressed: () => convertBetweenMgPerDlAndMmolPerL(
                            calculateFrom: GlucoseMeasurement.mmolPerL),
                        icon: const Icon(Icons.calculate),
                      )
                    : Container(),
                glucoseMeasurement == GlucoseMeasurement.mmolPerL ||
                        glucoseDisplayMode == GlucoseDisplayMode.both ||
                        glucoseDisplayMode == GlucoseDisplayMode.bothForDetail
                    ? Expanded(
                        child: TextFormField(
                          decoration: const InputDecoration(
                            labelText: 'mmol/l',
                            suffixText: 'mmol/l',
                          ),
                          controller: _mmolPerLController,
                          onChanged: (_) => convertBetweenMgPerDlAndMmolPerL(
                              calculateFrom: GlucoseMeasurement.mmolPerL),
                          keyboardType: const TextInputType.numberWithOptions(
                              decimal: true),
                          validator: (value) {
                            if (value!.trim().isEmpty &&
                                _mgPerDlController!.text.trim().isEmpty) {
                              return 'How many mg/dl or mmol/l does rhe rate make up for?';
                            }
                            return null;
                          },
                        ),
                      )
                    : Container(),
                glucoseDisplayMode == GlucoseDisplayMode.both ||
                        glucoseDisplayMode == GlucoseDisplayMode.bothForDetail
                    ? IconButton(
                        onPressed: () => convertBetweenMgPerDlAndMmolPerL(
                            calculateFrom: GlucoseMeasurement.mgPerDl),
                        icon: const Icon(Icons.calculate),
                      )
                    : Container(),
              ],
            ),
            TextFormField(
              decoration: const InputDecoration(
                labelText: 'Bolus Units',
                suffixText: 'U',
              ),
              controller: _bolusGlucoseController,
              keyboardType:
                  const TextInputType.numberWithOptions(decimal: true),
            ),
            // TODO: change field functionality according to time format
            TextFormField(
              decoration: const InputDecoration(
                labelText: 'Delayed Bolus Duration',
                suffixText: ' min',
              ),
              controller: _delayedBolusDurationController,
              keyboardType: TextInputType.number,
            ),
            TextFormField(
              decoration: const InputDecoration(
                labelText: 'Delayed Bolus Units',
              ),
              controller: _delayedBolusRateController,
              keyboardType:
                  const TextInputType.numberWithOptions(decimal: true),
            ),
            TextFormField(
              controller: _notesController,
              decoration: const InputDecoration(
                labelText: 'Notes',
                alignLabelWithHint: true,
              ),
              keyboardType: TextInputType.multiline,
            ),
          ],
        ),
      ]),
    );
  }
}