import 'dart:async';
import 'dart:typed_data';

import 'package:auto_size_text/auto_size_text.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_widget_from_html/flutter_widget_from_html.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:mapbox_maps_flutter/mapbox_maps_flutter.dart' as mapBox;
import 'package:manager_api/api.dart';
import 'package:tablet_app/Components/loading_common.dart';
import 'package:tablet_app/Components/video_viewer_youtube.dart';
import 'package:tablet_app/Models/agenda.dart'; // Assurez-vous d'importer votre modèle d'agenda
import 'package:intl/intl.dart';
import 'package:tablet_app/constants.dart';
import 'dart:ui' as ui;

class EventPopup extends StatefulWidget {
  final EventAgenda eventAgenda;
  final MapProvider mapProvider;

  EventPopup({Key? key, required this.eventAgenda, required this.mapProvider}) : super(key: key);

  @override
  State<EventPopup> createState() => _EventPopupState();
}

class _EventPopupState extends State<EventPopup> {
  final DateFormat formatter = DateFormat('dd/MM/yyyy hh:mm');
  Completer<GoogleMapController> _controller = Completer();
  Set<Marker> markers = {};
  bool init = false;

  mapBox.MapboxMap? mapboxMap;
  mapBox.PointAnnotationManager? pointAnnotationManager;

  Set<Marker> getMarkers() {
      markers = {};

      if (widget.eventAgenda.address!.lat != null && widget.eventAgenda.address!.lng != null) {
        markers.add(Marker(
            draggable: false,
            markerId: MarkerId(widget.eventAgenda.address!.lat.toString() +
                widget.eventAgenda.address!.lng.toString()),
            position: LatLng(
              double.parse(widget.eventAgenda.address!.lat!.toString()),
              double.parse(widget.eventAgenda.address!.lng!.toString()),
            ),
            icon: BitmapDescriptor.defaultMarker,
            infoWindow: InfoWindow.noText));
      }
    return markers;
  }

  _onMapCreated(mapBox.MapboxMap mapboxMap, Uint8List icon) {
    this.mapboxMap = mapboxMap;

    mapboxMap.annotations.createPointAnnotationManager().then((pointAnnotationManager) async {
      this.pointAnnotationManager = pointAnnotationManager;
      pointAnnotationManager.createMulti(createPoints(LatLng(widget.eventAgenda.address!.lat, widget.eventAgenda.address!.lng), icon));
      init = true;
    });
  }

  createPoints(LatLng position, Uint8List icon) {
    var options = <mapBox.PointAnnotationOptions>[];
    options.add(mapBox.PointAnnotationOptions(
      geometry: mapBox.Point(
          coordinates: mapBox.Position(
            position.longitude,
            position.latitude,
          )).toJson(),
      iconSize: 1.3,
      iconOffset: [0.0, 0.0],
      symbolSortKey: 10,
      iconColor: 0,
      iconImage: null,
      image: icon, //widget.selectedMarkerIcon,
    ));
    print(options.length);

    return options;
  }

  getByteIcon() async {
    final ByteData bytes = await rootBundle.load('assets/icons/marker.png');
    var icon = await getBytesFromAsset(bytes, 25);
    return icon;
  }

  Future<Uint8List> getBytesFromAsset(ByteData data, int width) async {
    //ByteData data = await rootBundle.load(path);
    ui.Codec codec = await ui.instantiateImageCodec(data.buffer.asUint8List(),
        targetWidth: width);
    ui.FrameInfo fi = await codec.getNextFrame();
    return (await fi.image.toByteData(format: ui.ImageByteFormat.png))
    !.buffer
        .asUint8List();
  }

  @override
  Widget build(BuildContext context) {

    var dateToShow = widget.eventAgenda.dateFrom!.isAtSameMomentAs(widget.eventAgenda.dateTo!) ? "${formatter.format(widget.eventAgenda.dateFrom!)}": "${formatter.format(widget.eventAgenda.dateFrom!)} - ${formatter.format(widget.eventAgenda.dateTo!)}";
    Size size = MediaQuery.of(context).size;

    if(!init) {
      print("getmarkers in build");
      getMarkers();
      init = true;
    }

    return AlertDialog(
      shape: const RoundedRectangleBorder(
          borderRadius: BorderRadius.all(Radius.circular(20.0))
      ),
      contentPadding: EdgeInsets.zero,
      // title: Text(eventAgenda.name!),
      content: Container(
        decoration: BoxDecoration(
          borderRadius: BorderRadius.all(Radius.circular(20.0)),
          color: kBackgroundColor,
        ),
        height: size.height * 0.8,
        child: Stack(
          children: [
            Positioned(
              right: 5,
              top: 5,
              child: InkWell(
                onTap: () {
                  Navigator.of(context).pop();
                },
                child: Container(
                  width: 50,
                  height: 50,
                  decoration: BoxDecoration(
                    color: kMainGrey,
                    shape: BoxShape.circle,
                    boxShadow: [
                      BoxShadow(
                        color: kMainGrey,
                        spreadRadius: 0.5,
                        blurRadius: 1.1,
                        offset: Offset(0, 1.1), // changes position of shadow
                      ),
                    ],
                  ),
                  child: Icon(
                    Icons.close,
                    size: 25,
                    color: Colors.white,
                  ),
                ),
              ),
            ),
            Row(
              children: [
                widget.eventAgenda.image != null ? ClipRRect(
                  borderRadius: const BorderRadius.only(topLeft: Radius.circular(20.0), bottomLeft: Radius.circular(20.0)),
                  child: Container(
                      child: Center(
                        child: Container(
                          decoration: BoxDecoration(
                              border: Border(right: BorderSide(width: 0.05, color: kMainGrey)),
                              color: Colors.grey,
                          ),
                          width: size.width * 0.17,
                          height: size.height,
                          child: CachedNetworkImage(
                            imageUrl: widget.eventAgenda.image!,
                            width: size.width,
                            fit: BoxFit.cover,
                            progressIndicatorBuilder: (context, url, downloadProgress) {
                              return Center(
                                child: SizedBox(
                                  width: 50,
                                  height: 50,
                                  child: LoadingCommon(),
                                ),
                              );
                            },
                            errorWidget: (context, url, error) => Icon(Icons.error),
                          ),
                        ),
                      )
                  ),
                ): SizedBox(),
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: SizedBox(
                        height: size.height * 0.11,
                        width: size.width * 0.7,
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            SizedBox(
                              height: size.height * 0.06,
                              child: HtmlWidget(
                                widget.eventAgenda.name!,
                                textStyle: TextStyle(fontSize: 23.0),
                              ),/*AutoSizeText(
                                widget.eventAgenda.name!,
                                style: TextStyle(fontSize: 23),
                                maxFontSize: 23,
                              ),*/
                            ),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.start,
                              children: [
                                Padding(
                                  padding: const EdgeInsets.only(top: 4.0, left: 2.0, right: 4.0, bottom: 6.0),
                                  child: Icon(Icons.calendar_today_rounded, color: kTestSecondColor, size: 18),
                                ),
                                Padding(
                                  padding: const EdgeInsets.all(2.0),
                                  child: Text(dateToShow, style: TextStyle(fontSize: 18, color: kTestSecondColor, fontWeight: FontWeight.w500)),
                                )
                              ],
                            ),
                          ],
                        ),
                      ),
                    ),
                    Row(
                      children: [
                        Padding(
                          padding: const EdgeInsets.only(left: 15),
                          child: Container(
                            height: size.height * 0.65,
                            width: size.width * 0.38,
                            decoration: BoxDecoration(
                              color: kBackgroundLight,
                              borderRadius: BorderRadius.all(Radius.circular(20.0))
                            ),
                            child: Padding(
                              padding: const EdgeInsets.only(left: 20, right: 10, bottom: 10, top: 15),
                              child: Scrollbar(
                                thumbVisibility: true,
                                thickness: 2.0,
                                child: SingleChildScrollView(
                                  child: Padding(
                                    padding: const EdgeInsets.all(8.0),
                                    child: Column(
                                      crossAxisAlignment: CrossAxisAlignment.start,
                                      mainAxisAlignment: MainAxisAlignment.start,
                                      children: [
                                        HtmlWidget(
                                          widget.eventAgenda.description!,
                                          customStylesBuilder: (element) {
                                            return {'text-align': 'left'};
                                          },
                                          textStyle: TextStyle(fontSize: kDescriptionSize),
                                        ),
                                        widget.eventAgenda.idVideoYoutube != null && widget.eventAgenda.idVideoYoutube!.isNotEmpty ?
                                        Padding(
                                          padding: const EdgeInsets.all(8.0),
                                          child: SizedBox(
                                            height: 250,
                                            width: 350,
                                            child: VideoViewerYoutube(videoUrl: "https://www.youtube.com/watch?v=${widget.eventAgenda.idVideoYoutube}", isAuto: false, webView: true)
                                          ),
                                        ) :
                                        SizedBox(),
                                      ],
                                    ),
                                  ),
                                ),
                              ),
                            ),
                          ),
                        ),
                        SizedBox(
                          width: size.width * 0.32,
                          height: size.height * 0.65,
                          child: Padding(
                            padding: const EdgeInsets.all(8.0),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              mainAxisAlignment: MainAxisAlignment.start,
                              children: [
                                widget.eventAgenda.address!.lat != null && widget.eventAgenda.address!.lng != null ?
                                SizedBox(
                                  width: size.width * 0.28,
                                  height: size.height * 0.2,
                                  child: widget.mapProvider == MapProvider.Google ?
                                  GoogleMap(
                                    mapToolbarEnabled: false,
                                    initialCameraPosition: CameraPosition(
                                      target: LatLng(double.parse(widget.eventAgenda.address!.lat!.toString()), double.parse(widget.eventAgenda.address!.lng!.toString())),
                                      zoom: 14,
                                    ),
                                    onMapCreated: (GoogleMapController controller) {
                                      _controller.complete(controller);
                                    },
                                    markers: markers,
                                  ) :
                                  FutureBuilder(
                                    future: getByteIcon(),
                                    builder: (context, AsyncSnapshot<dynamic> snapshot) {
                                      if (snapshot.connectionState == ConnectionState.done) {
                                        Uint8List icon = snapshot.data!;
                                        return mapBox.MapWidget(
                                          key: ValueKey("mapBoxWidget"),
                                          styleUri: mapBox.MapboxStyles.STANDARD,
                                          onMapCreated: (maBoxMap) {
                                            _onMapCreated(maBoxMap, icon);
                                          },
                                          cameraOptions: mapBox.CameraOptions(
                                              center: mapBox.Point(coordinates: mapBox.Position(double.parse(widget.eventAgenda.address!.lng!.toString()), double.parse(widget.eventAgenda.address!.lat!.toString()))).toJson(),
                                              zoom: 14
                                          ),
                                        );
                                      } else if (snapshot.connectionState == ConnectionState.none) {
                                        return Text("No data");
                                      } else {
                                        return Center(
                                            child: Container(
                                                child: LoadingCommon()
                                            )
                                        );
                                      }
                                    }
                                  ),
                                ): SizedBox(),
                                SizedBox(
                                  width: size.width * 0.28,
                                  height: size.height * 0.35,
                                  child: Column(
                                    mainAxisAlignment: MainAxisAlignment.start,
                                    children: [
                                      widget.eventAgenda.address!.address != null && widget.eventAgenda.address!.address!.isNotEmpty ? Row(
                                        mainAxisAlignment: MainAxisAlignment.start,
                                        children: [
                                          Icon(Icons.location_on, size: 13),
                                          Padding(
                                            padding: const EdgeInsets.all(4.0),
                                            child: SizedBox(
                                                width: size.width*0.25,
                                                child: AutoSizeText(widget.eventAgenda.address!.address!, style: TextStyle(fontSize: 12), maxLines: 3)
                                            ),
                                          )
                                        ],
                                      ): SizedBox(),
                                      widget.eventAgenda.phone != null && widget.eventAgenda.phone!.isNotEmpty ? Row(
                                        mainAxisAlignment: MainAxisAlignment.start,
                                        children: [
                                          Icon(Icons.phone, size: 13),
                                          Padding(
                                            padding: const EdgeInsets.all(4.0),
                                            child: Text(widget.eventAgenda.phone!, style: TextStyle(fontSize: 12)),
                                          )
                                        ],
                                      ): SizedBox(),
                                      widget.eventAgenda.email != null && widget.eventAgenda.email!.isNotEmpty ? Row(
                                        mainAxisAlignment: MainAxisAlignment.start,
                                        children: [
                                          Icon(Icons.email, size: 13),
                                          Padding(
                                            padding: const EdgeInsets.all(4.0),
                                            child: SizedBox(
                                                width: size.width*0.25,
                                                child: AutoSizeText(widget.eventAgenda.email!, style: TextStyle(fontSize: 12), maxLines: 3)
                                            ),
                                          )
                                        ],
                                      ): SizedBox(),
                                      widget.eventAgenda.website != null && widget.eventAgenda.website!.isNotEmpty ? Row(
                                        mainAxisAlignment: MainAxisAlignment.start,
                                        children: [
                                          Icon(Icons.public, size: 13),
                                          Padding(
                                            padding: const EdgeInsets.all(4.0),
                                            child: SizedBox(
                                                width: size.width*0.25,
                                                child: AutoSizeText(widget.eventAgenda.website!, style: TextStyle(fontSize: 12), maxLines: 3)
                                            ),
                                          )
                                        ],
                                      ): SizedBox(),
                                    ],
                                  ),
                                ),
                              ],
                            ),
                          ),
                        )
                      ],
                    )
                  ],
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}