import 'dart:convert';
import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:mymuseum_visitapp/Models/resourceModel.dart';
import 'package:mymuseum_visitapp/app_context.dart';
import 'package:mymuseum_visitapp/constants.dart';
import 'package:provider/provider.dart';
import 'package:photo_view/photo_view.dart';

class SliderImagesWidget extends StatefulWidget {
  final List<ResourceModel?> resources;
  final double height;
  SliderImagesWidget({required this.resources, required this.height});

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

class _SliderImagesWidget extends State<SliderImagesWidget> {
  late CarouselController? sliderController;
  int currentIndex = 1;

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

  @override
  void dispose() {
    print("COUCOU DISPOSE");
    sliderController = null;
    super.dispose();
    print("COUCOU DISPOSE AFTER");
  }

  @override
  Widget build(BuildContext context) {
    final appContext = Provider.of<AppContext>(context);
    Size size = MediaQuery.of(context).size;
    return Stack(
        children: [
          Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: [
              if(widget.resources.isNotEmpty)
                CarouselSlider(
                  carouselController: sliderController,
                  options: CarouselOptions(
                    onPageChanged: (int index, CarouselPageChangedReason reason) {
                      setState(() {
                        currentIndex = index + 1;
                      });
                    },
                    height: widget.height * 0.95,
                    enlargeCenterPage: true,
                    reverse: false,
                  ),
                  items: widget.resources.map<Widget>((i) {
                    return Builder(
                      builder: (BuildContext context) {
                        return Container(
                            width: size.width,
                            height: widget.height,
                            /*decoration: BoxDecoration(
                              //color: appContext.getContext().configuration == null ? kBackgroundGrey : appContext.getContext().configuration.secondaryColor != null ? new Color(int.parse(appContext.getContext().configuration.secondaryColor.split('(0x')[1].split(')')[0], radix: 16)): kBackgroundGrey,
                              borderRadius: BorderRadius.circular(5.0),
                              //border: Border.all(width: 0.3, color: kSecondGrey),
                            ),*/
                            child: Container(
                              height: widget.height * 1,
                              width: size.width * 0.95,
                              child: AspectRatio(
                                aspectRatio: 16 / 9,
                                child: ClipRRect(
                                  borderRadius: BorderRadius.circular(35.0),
                                  child: PhotoView(
                                    imageProvider: Image.memory(base64Decode(i!.data!)).image,
                                    minScale: PhotoViewComputedScale.contained * 0.8,
                                    maxScale: PhotoViewComputedScale.contained * 3.0,
                                    backgroundDecoration: BoxDecoration(
                                      color: Colors.transparent,
                                      /*shape: BoxShape.rectangle,
                                      borderRadius: BorderRadius.circular(15.0),*/
                                    ),
                                  ),
                                ),
                              ),
                            ),/*Column(
                              //crossAxisAlignment: CrossAxisAlignment.center,
                              //mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                              children: [
                                Padding(
                                  padding: const EdgeInsets.all(10.0),
                                  child: Container(
                                    height: widget.height * 0.5,
                                    width: size.width * 1,
                                    child: Stack(
                                      children: [
                                        Center(
                                          child: /*Container(
                                            height: widget.height * 1,
                                            width: size.width * 0.95,
                                            child: AspectRatio(
                                              aspectRatio: 16 / 9,
                                              child: ClipRect(
                                                child: PhotoView(
                                                  imageProvider: Image.memory(base64Decode(i!.data!)).image,
                                                  minScale: PhotoViewComputedScale.contained * 0.8,
                                                  maxScale: PhotoViewComputedScale.contained * 3.0,
                                                  backgroundDecoration: BoxDecoration(
                                                    color: kBackgroundSecondGrey,
                                                    shape: BoxShape.rectangle,
                                                    borderRadius: BorderRadius.circular(15.0),
                                                  ),
                                                ),
                                              ),
                                            ),
                                          ),*/
                                        ),
                                      ]
                                    ),
                                  ),
                                ),
                              ],
                            )*/
                        );
                      },
                    );
                  }).toList(),
                ),
            ],
          ),
          if(widget.resources.length > 1)
            Positioned(
              top: widget.height * 0.45,
              right: 0,
              child: InkWell(
                onTap: () {
                  sliderController!.nextPage(duration: const Duration(milliseconds: 500), curve: Curves.fastOutSlowIn);
                },
                child: const Icon(
                  Icons.chevron_right,
                  size: 45,
                  color: kMainColor,
                ),
              )
          ),
          if(widget.resources.length > 1)
            Positioned(
              top: widget.height * 0.45,
              left: 0,
              child: InkWell(
                onTap: () {
                  if (widget.resources.isNotEmpty) {
                    sliderController!.previousPage(duration: const Duration(milliseconds: 500), curve: Curves.fastOutSlowIn);
                  }
                },
                child: const Icon(
                  Icons.chevron_left,
                  size: 45,
                  color: kMainColor,
                ),
              )
          ),
          if(widget.resources.isNotEmpty)
            Padding(
              padding: const EdgeInsets.only(bottom: 2.5),
              child: Align(
                  alignment: Alignment.bottomCenter,
                  child: InkWell(
                    onTap: () {
                      sliderController!.previousPage(duration: const Duration(milliseconds: 500), curve: Curves.fastOutSlowIn);
                    },
                    child: Text(
                      currentIndex.toString()+'/'+widget.resources.length.toString(),
                      style: const TextStyle(fontSize: kArticleContentSize, fontWeight: FontWeight.w500, color: kMainColor),
                    ),
                  )
              ),
            ),
          if(widget.resources.isEmpty)
              const Center(child: Text("Aucune image à afficher", style: TextStyle(fontSize: kNoneInfoOrIncorrect),))
        ]
    );
  }
}