import 'package:flutter/material.dart';
import 'package:manager_app/Components/message_notification.dart';
import 'package:manager_app/Components/multi_string_input_and_resource_container.dart';
import 'package:manager_app/Components/number_input_container.dart';
import 'package:manager_app/Components/resource_input_container.dart';
import 'package:manager_api_new/api.dart';
import 'dart:convert';

import 'package:manager_app/constants.dart';

class PuzzleConfig extends StatefulWidget {
  final String? color;
  final String? label;
  final String initialValue;
  final ValueChanged<String> onChanged;
  const PuzzleConfig({
    Key? key,
    this.color,
    this.label,
    required this.initialValue,
    required this.onChanged,
  }) : super(key: key);

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

class _PuzzleConfigState extends State<PuzzleConfig> {
  late PuzzleDTO puzzleDTO;

  @override
  void initState() {
    PuzzleDTO test = PuzzleDTO.fromJson(json.decode(widget.initialValue))!;
    if(test.image == null) {
      test.image = PuzzleDTOImage();
    }
    puzzleDTO = test;
    puzzleDTO.rows = puzzleDTO.rows == null ? 3 : puzzleDTO.rows;
    puzzleDTO.cols = puzzleDTO.cols == null ? 3 : puzzleDTO.cols;

    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: [
              ResourceInputContainer(
                  label: "Image du puzzle :",
                  initialValue: puzzleDTO.image!.resourceId == null ? '': puzzleDTO.image!.resourceId,
                  onChanged: (ResourceDTO resourceDTO) {
                    setState(() {
                      puzzleDTO.image!.resourceId = resourceDTO.id;
                      puzzleDTO.image!.resourceType = resourceDTO.type;
                      puzzleDTO.image!.resourceUrl = resourceDTO.url;
                      print(puzzleDTO.image);
                      widget.onChanged(jsonEncode(puzzleDTO).toString());
                    });
                  }
              ),
              Container(
                height: 100,
                  child: MultiStringInputAndResourceContainer(
                      label: "Message départ :",
                      modalLabel: "Message départ",
                      fontSize: 20,
                      color: kPrimaryColor,
                      initialValue: puzzleDTO.messageDebut != null ? puzzleDTO.messageDebut! : [],
                      resourceTypes: [ResourceType.Image, ResourceType.ImageUrl],
                      onGetResult: (value) {
                        print("Mess depart test");
                        print(value);
                        if (puzzleDTO.messageDebut != value) {
                          setState(() {
                            print(puzzleDTO.messageDebut);
                            puzzleDTO.messageDebut = value;
                            widget.onChanged(jsonEncode(puzzleDTO).toString());
                          });
                        }
                      },
                      maxLines: 1,
                      isTitle: false
                  )
              ),
              Container(
                  height: 100,
                  child: MultiStringInputAndResourceContainer(
                      label: "Message fin :",
                      modalLabel: "Message fin",
                      fontSize: 20,
                      color: kPrimaryColor,
                      initialValue: puzzleDTO.messageFin != null ? puzzleDTO.messageFin! : [],
                      resourceTypes: [ResourceType.Image, ResourceType.ImageUrl],
                      onGetResult: (value) {
                        if (puzzleDTO.messageFin != value) {
                          setState(() {
                            puzzleDTO.messageFin = value;
                            widget.onChanged(jsonEncode(puzzleDTO).toString());
                          });
                        }
                      },
                      maxLines: 1,
                      isTitle: false
                  )
              ),
            ],
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: [
              Container(
                  height: 100,
                  child: NumberInputContainer(
                    label: "Nombre de lignes :",
                    initialValue: puzzleDTO.rows!,
                    isSmall: true,
                    maxLength: 2,
                    onChanged: (value) {
                      try {
                        puzzleDTO.rows = int.parse(value);
                        setState(() {
                          widget.onChanged(jsonEncode(puzzleDTO).toString());
                        });
                      } catch (e) {
                        print('Puzzle rows not a number');
                        showNotification(Colors.orange, kWhite, 'Cela doit être un chiffre', context, null);
                      }
                    },
                  ),
              ),
              Container(
                height: 100,
                child: NumberInputContainer(
                  label: "Nombre de colonnes :",
                  initialValue: puzzleDTO.cols!,
                  isSmall: true,
                  maxLength: 2,
                  onChanged: (value) {
                    try {
                      puzzleDTO.cols = int.parse(value);
                      setState(() {
                        widget.onChanged(jsonEncode(puzzleDTO).toString());
                      });
                    } catch (e) {
                      print('Puzzle rows not a number');
                      showNotification(Colors.orange, kWhite, 'Cela doit être un chiffre', context, null);
                    }
                  },
                ),
              ),
            ],)
        ],
      ),
    );
  }
}