import 'package:aitrainer_app/bloc/exercise_new/exercise_new_bloc.dart';
import 'package:aitrainer_app/library/custom_icon_icons.dart';
import 'package:aitrainer_app/model/property.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 'app_bar.dart';
import 'input_dialog_widget.dart';

// ignore: must_be_immutable
class SizeWidget extends StatefulWidget {
  final ExerciseNewBloc exerciseBloc;

  SizeWidget({this.exerciseBloc});

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

class _SizeState extends State<SizeWidget> with Trans {
  @override
  Widget build(BuildContext context) {
    setContext(context);
    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.png'),
                  fit: BoxFit.fill,
                  alignment: Alignment.center,
                ),
              ),
              child: SafeArea(
                  child: Container(
                      padding: EdgeInsets.only(top: 10),
                      child: Column(crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center, children: [
                        Stack(
                          alignment: Alignment.center,
                          children: getSizeFigure(),
                        )
                      ]))),
            )));
  }

  List<Widget> getSizeFigure() {
    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.setMediaDimensions(mediaWidth, mediaHeight);
    List<Widget> list = List();
    list.add(SizedBox(
      //child: Container(color: Colors.black87),
      width: mediaWidth,
      height: mediaHeight,
    ));
    list.add(
      Positioned(
          top: mediaHeight * .07,
          left: widget.exerciseBloc.isMan ? mediaWidth * .62 : mediaWidth * .65,
          child: Stack(
            alignment: Alignment.topLeft,
            children: [
              SizedBox(height: 80, width: 100),
              Text(t("Your Sizes"),
                  style: GoogleFonts.archivoBlack(
                    shadows: <Shadow>[
                      Shadow(
                        offset: Offset(5.0, 5.0),
                        blurRadius: 3.0,
                        color: Colors.black54,
                      ),
                    ],
                    fontSize: 20,
                    color: Colors.orange[500],
                  )),
              Positioned(
                  top: 30,
                  left: 60,
                  child: IconButton(
                      padding: EdgeInsets.zero,
                      icon: Icon(Icons.save),
                      iconSize: 40,
                      hoverColor: Colors.blueAccent,
                      color: widget.exerciseBloc.changedSizes ? Colors.orange[300] : Colors.black87,
                      onPressed: () => {print("Save"), widget.exerciseBloc.add(ExerciseNewSaveWeight())}))
            ],
          )),
    );
    list.add(
      widget.exerciseBloc.isMan
          ? Image.asset(
              "asset/image/man_sizes.png",
              height: mediaHeight,
              width: mediaWidth,
            )
          : Image.asset(
              "asset/image/woman_sizes.png",
              height: mediaHeight,
              width: mediaWidth,
            ),
    );

    list.addAll(getSizeElements());
    return list;
  }

  List<Widget> getSizeElements() {
    List<Widget> list = List();

    widget.exerciseBloc.manSizes.forEach((element) {
      list.add(
        Positioned(
            top: element.top.toDouble(),
            left: element.left.toDouble(),
            child: element.value != 0
                ? Container(
                    width: 20,
                    height: 20,
                    decoration: BoxDecoration(
                      color: widget.exerciseBloc.isMan ? Colors.green[800] : Color(0xFFEA776C),
                      borderRadius: BorderRadius.all(
                        Radius.circular(20),
                      ),
                    ),
                    padding: EdgeInsets.zero,
                    child: IconButton(
                      icon: Icon(CustomIcon.ok_circled),
                      padding: EdgeInsets.zero,
                      color: Colors.green[200],
                      onPressed: () => onPressed(element),
                    ))
                : Container(
                    width: 20,
                    height: 20,
                    padding: EdgeInsets.zero,
                    decoration: BoxDecoration(
                      color: widget.exerciseBloc.isMan ? Color(0xFF369fb9) : Color(0xFFEA776C),
                      borderRadius: BorderRadius.all(
                        Radius.circular(20),
                      ),
                    ),
                    child: IconButton(
                      icon: Icon(
                        CustomIcon.help_circled,
                      ),
                      padding: EdgeInsets.zero,
                      color: Colors.red[800],
                      splashColor: Colors.amber,
                      onPressed: () => onPressed(element),
                    ))),
      );
    });

    return list;
  }

  void onPressed(Property element) {
    print(element.propertyName);
    showDialog(
        context: context,
        builder: (context) => InputDialog(
              title: t("Size Of Your"),
              subtitle: element.propertyNameTranslation,
              initialValue: element.value,
              onChanged: (value) {
                widget.exerciseBloc.add(ExerciseNewSizeChange(propertyName: element.propertyName, value: value));
              },
            ));
  }
}