import 'dart:convert';
import 'dart:developer';
import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:managerapi/api.dart';
import 'package:provider/provider.dart';
import 'package:tablet_app/Models/ResponseSubDTO.dart';
import 'package:tablet_app/app_context.dart';
import 'package:tablet_app/constants.dart';



class ShowReponsesWidget extends StatefulWidget {
  List<QuestionSubDTO> questionsSubDTO;
  ShowReponsesWidget({this.questionsSubDTO});

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

class _ShowReponsesWidget extends State<ShowReponsesWidget> {
  List<QuestionSubDTO> _questionsSubDTO = <QuestionSubDTO>[];
  CarouselController sliderController;
  int currentIndex = 1;

  @override
  void initState() {
    super.initState();
    sliderController = CarouselController();
    _questionsSubDTO = widget.questionsSubDTO;
  }

  @override
  void dispose() {
    sliderController = null;
    currentIndex = 1;
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    Size sizeAll = MediaQuery.of(context).size;

    Size size = Size(sizeAll.width * 0.65, sizeAll.height * 0.32);
    final appContext = Provider.of<AppContext>(context);

    return Stack(
        children: [
          if(_questionsSubDTO != null && _questionsSubDTO.length > 0)
            CarouselSlider(
              carouselController: sliderController,
              options: CarouselOptions(
                onPageChanged: (int index, CarouselPageChangedReason reason) {
                  setState(() {
                    currentIndex = index + 1;
                  });
                },
                height: size.height,
                enlargeCenterPage: true,
                //scrollPhysics: NeverScrollableScrollPhysics(),
                reverse: false,
              ),
              items: _questionsSubDTO.map<Widget>((i) {
                return Builder(
                  builder: (BuildContext context) {
                    return Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Container(
                          width: size.width,
                          height: size.height,
                          margin: EdgeInsets.symmetric(horizontal: 5.0),
                          decoration: BoxDecoration(
                            color: kBackgroundLight,
                            shape: BoxShape.rectangle,
                            borderRadius: BorderRadius.circular(20.0),
                            image: i.source_ != null ? new DecorationImage(
                              fit: BoxFit.contain,
                              opacity: 0.35,
                              image: new NetworkImage(
                                i.source_,
                              ),
                            ): null,
                            boxShadow: [
                              BoxShadow(
                                color: kBackgroundSecondGrey,
                                spreadRadius: 0.5,
                                blurRadius: 5,
                                offset: Offset(0, 1.5), // changes position of shadow
                              ),
                            ],
                          ),
                          child: Column(
                            //crossAxisAlignment: CrossAxisAlignment.center,
                            //mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                            children: [
                              Padding(
                                padding: const EdgeInsets.all(10.0),
                                child: Container(
                                  //width: MediaQuery.of(context).size.width *0.65,
                                  height: size.height *0.25,
                                  child: Stack(
                                      children: [
                                        Center(
                                            child: Container(
                                              decoration: BoxDecoration(
                                                color: kBackgroundLight,
                                                shape: BoxShape.rectangle,
                                                borderRadius: BorderRadius.circular(10.0),
                                                boxShadow: [
                                                  BoxShadow(
                                                    color: kBackgroundSecondGrey,
                                                    spreadRadius: 0.3,
                                                    blurRadius: 4,
                                                    offset: Offset(0, 2), // changes position of shadow
                                                  ),
                                                ],
                                              ),
                                              width: size.width *0.8,
                                              height: size.height *0.18,
                                              child: Center(
                                                child: SingleChildScrollView(
                                                  child: Padding(
                                                    padding: const EdgeInsets.all(1.0),
                                                    child: Text(i.label.firstWhere((translation) => translation.language == appContext.getContext().language).value != null ? i.label.firstWhere((translation) => translation.language == appContext.getContext().language).value : "", textAlign: TextAlign.center, style: TextStyle(fontSize: kDescriptionSize)),
                                                  ),
                                                ),
                                              ),
                                            )
                                        ),
                                      ]
                                  ),
                                ),
                              ),
                              Expanded(
                                child: Padding(
                                  padding: const EdgeInsets.all(1.0),
                                  child: Container(
                                    height: size.height * 0.5,
                                    width: size.width * 0.88,
                                    //color: Colors.green,
                                    child: Padding(
                                      padding: const EdgeInsets.all(5.0),
                                      child: GridView.builder(
                                          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                                            crossAxisCount: 2,
                                            mainAxisExtent: 125,
                                            mainAxisSpacing: 15,
                                            crossAxisSpacing: 5,
                                          ),
                                          itemCount: i.responsesSubDTO.length,
                                          itemBuilder: (BuildContext ctx, index) {
                                            return Padding(
                                              padding: const EdgeInsets.all(5.0),
                                              child: Container(
                                                alignment: Alignment.center,
                                                child: Text(i.responsesSubDTO[index].label.firstWhere((translation) => translation.language == appContext.getContext().language).value != null ? i.responsesSubDTO[index].label.firstWhere((translation) => translation.language == appContext.getContext().language).value : "", textAlign: TextAlign.center, style: TextStyle(fontSize: kDescriptionSize, color: i.chosen == index ? Colors.white : Colors.black)),
                                                decoration: BoxDecoration(
                                                  color: i.responsesSubDTO[index].isGood ? kGreen : i.chosen == index ? kMainRed : kBackgroundLight,
                                                  shape: BoxShape.rectangle,
                                                  borderRadius: BorderRadius.circular(10.0),
                                                  boxShadow: [
                                                    BoxShadow(
                                                      color: kBackgroundSecondGrey,
                                                      spreadRadius: 0.3,
                                                      blurRadius: 4,
                                                      offset: Offset(0, 2), // changes position of shadow
                                                    ),
                                                  ],
                                                ),
                                              ),
                                            );
                                          }),
                                    ),
                                  ),
                                ),
                              ),
                            ],
                          )
                      ),
                    );
                  },
                );
              }).toList(),
            ),
          if(_questionsSubDTO != null && _questionsSubDTO.length > 1 && currentIndex != _questionsSubDTO.length && _questionsSubDTO[currentIndex-1].chosen != null && widget.questionsSubDTO.length > 0)
            Positioned(
                top: size.height * 0.35,
                right: 60,
                child: InkWell(
                  onTap: () {
                    if(_questionsSubDTO[currentIndex-1].chosen != null && widget.questionsSubDTO.length > 0) {
                      sliderController.nextPage(duration: new Duration(milliseconds: 500), curve: Curves.fastOutSlowIn);
                      /*Fluttertoast.showToast(
                          msg: "Vous n'avez pas répondu à cette question",
                          toastLength: Toast.LENGTH_SHORT,
                          gravity: ToastGravity.BOTTOM,
                          timeInSecForIosWeb: 1,
                          backgroundColor: kMainRed,
                          textColor: Colors.white,
                          fontSize: 35.0
                      );*/
                    }
                  },
                  child: Icon(
                    Icons.chevron_right,
                    size: 150,
                    color: kMainRed,
                  ),
                )
            ),
          if(_questionsSubDTO != null && _questionsSubDTO.length > 1 && currentIndex != 1)
            Positioned(
                top: size.height * 0.35,
                left: 60,
                child: InkWell(
                  onTap: () {
                    if(currentIndex > 1)
                      sliderController.previousPage(duration: new Duration(milliseconds: 500), curve: Curves.fastOutSlowIn);
                  },
                  child: Icon(
                    Icons.chevron_left,
                    size: 150,
                    color: kMainRed,
                  ),
                )
            ),
          if(_questionsSubDTO != null && _questionsSubDTO.length > 0)
            Padding(
              padding: const EdgeInsets.only(bottom: 0),
              child: Align(
                  alignment: Alignment.bottomCenter,
                  child: InkWell(
                    child: Text(
                      currentIndex.toString()+'/'+ widget.questionsSubDTO.length.toString(),
                      style: TextStyle(fontSize: 30, fontWeight: FontWeight.w500),
                    ),
                  )
              ),
            ),
          if(_questionsSubDTO == null || _questionsSubDTO.length == 0)
            Center(child: Text("Aucune question à afficher", style: TextStyle(fontSize: kNoneInfoOrIncorrect),))
        ]
    );
  }
}