import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:fcs/model/manual_model.dart';
import 'package:fcs/vo/manual.dart';

class MoveableStackItem extends StatefulWidget {
  Instruction instruction;
  final int instIndex;
  final int slideIndex;
  final int manIndex;
  final bool isEng;

  MoveableStackItem(
      {this.instIndex,
      this.slideIndex,
      this.manIndex,
      this.instruction,
      this.isEng,
      Key key})
      : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return _MoveableStackItemState();
  }
}

class _MoveableStackItemState extends State<MoveableStackItem> {
  TextEditingController _textFieldController = TextEditingController();
  double xPosition = 0;
  double yPosition = 0;

  @override
  void initState() {
    super.initState();
    _textFieldController.text = widget.instruction.text;
    yPosition =
        widget.instruction.top != null ? widget.instruction.top : yPosition;
    xPosition =
        widget.instruction.left != null ? widget.instruction.left : xPosition;
  }

  @override
  Widget build(BuildContext context) {
    var manualModel = Provider.of<ManualModel>(context);
    return Positioned(
      top: yPosition,
      left: xPosition,
      child: GestureDetector(
          onPanUpdate: (tapInfo) {
            setState(() {
              xPosition += tapInfo.delta.dx;
              yPosition += tapInfo.delta.dy;
            });
            var data = Instruction(
              id: widget.instruction.id,
              top: yPosition,
              left: xPosition,
              text: _textFieldController.text,
            );
            manualModel.saveInstruction(widget.manIndex, widget.slideIndex,
                widget.instIndex, data, widget.instruction, widget.isEng);
          },
          child: Container(
              width: 250,
              color: Colors.grey,
              child: InkWell(
                  onTap: () {
                    _displayDialog(context, manualModel);
                  },
                  child: Container(
                      child: Text(
                    _textFieldController.text,
                    maxLines: null,
                    style:
                        TextStyle(fontSize: 15.0, fontWeight: FontWeight.w700),
                  ))))),
    );
  }

  _displayDialog(BuildContext context, ManualModel manualModel) async {
    return showDialog(
        context: context,
        builder: (context) {
          return AlertDialog(
            title: new Text('Instruction'),
            content: Container(
              height: 100,
              child: Column(
                children: <Widget>[
                  TextField(
                    controller: _textFieldController,
                    decoration: InputDecoration(hintText: "Enter Instruction"),
                    maxLines: null,
                    style: TextStyle(fontSize: 13.0),
                  ),
                ],
              ),
            ),
            actions: <Widget>[
              new FlatButton(
                  onPressed: () {
                    var data = Instruction(
                      id: widget.instruction.id,
                      top: yPosition,
                      left: xPosition,
                      text: _textFieldController.text,
                    );
                    manualModel.saveInstruction(
                        widget.manIndex,
                        widget.slideIndex,
                        widget.instIndex,
                        data,
                        widget.instruction,
                        widget.isEng);
                    Navigator.pop(context);
                  },
                  child: new Text('Save'))
            ],
          );
        });
  }
}