import 'dart:convert';

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/widgets.dart';
import 'package:manager_api_new/api.dart';
import 'package:provider/provider.dart';
import 'package:tablet_app/Helpers/translationHelper.dart';
import 'package:tablet_app/Models/WeatherData.dart';
import 'package:tablet_app/Models/tabletContext.dart';
import 'package:tablet_app/app_context.dart';
import 'package:tablet_app/constants.dart';
import 'package:intl/intl.dart';

class WeatherView extends StatefulWidget {
  final WeatherDTO section;
  WeatherView({required this.section});

  @override
  State<WeatherView> createState() => _WeatherViewState();
}

class _WeatherViewState extends State<WeatherView> {
  WeatherDTO weatherDTO = WeatherDTO();
  WeatherData? weatherData = null;
  int nbrNextHours = 5;

  @override
  void initState() {
    /*print(widget.section!.data);
    weatherDTO = WeatherDTO.fromJson(jsonDecode(widget.section!.data!))!;
    print(weatherDTO);*/
    weatherDTO = widget.section;
    if(weatherDTO.result != null) {
      Map<String, dynamic> weatherResultInJson = jsonDecode(weatherDTO.result!);
      weatherData = WeatherData.fromJson(weatherResultInJson);
    }

    super.initState();
  }

  String formatTimestamp(int timestamp, AppContext appContext, bool isHourOnly, bool isDateOnly) {

    DateTime dateTime = DateTime.fromMillisecondsSinceEpoch(timestamp * 1000);

    // Determine the date format based on the application language
    String dateFormat = appContext.getContext().language.toString().toUpperCase() == "EN" ?
    'MM/dd/yyyy HH:mm'
        : 'dd/MM/yyyy HH:mm';

    if(isHourOnly) {
      dateFormat = 'HH:mm';
    }

    if(isDateOnly) {
      dateFormat = dateFormat.replaceAll('/yyyy HH:mm', '');
    }

    String formattedDate = DateFormat(dateFormat).format(dateTime);

    return formattedDate;
  }

  String getTranslatedDayOfWeek(int timestamp, AppContext appContext, bool isDate) {
    DateTime dateTime = DateTime.fromMillisecondsSinceEpoch(timestamp * 1000);

    String dayToPrint = "";

    print("dateTime.weekday");
    print(dateTime.weekday);

    switch(dateTime.weekday) {
      case 1:
        dayToPrint = TranslationHelper.getFromLocale("monday", appContext.getContext());
        break;
      case 2:
        dayToPrint = TranslationHelper.getFromLocale("tuesday", appContext.getContext());
        break;
      case 3:
        dayToPrint = TranslationHelper.getFromLocale("wednesday", appContext.getContext());
        break;
      case 4:
        dayToPrint = TranslationHelper.getFromLocale("thursday", appContext.getContext());
        break;
      case 5:
        dayToPrint = TranslationHelper.getFromLocale("friday", appContext.getContext());
        break;
      case 6:
        dayToPrint = TranslationHelper.getFromLocale("saturday", appContext.getContext());
        break;
      case 7:
        dayToPrint = TranslationHelper.getFromLocale("sunday", appContext.getContext());
        break;
    }

    return isDate ? "${dayToPrint} ${formatTimestamp(timestamp, appContext, false, true)}" : dayToPrint;
  }

  List<WeatherForecast> getNextFiveDaysForecast(List<WeatherForecast> allForecasts) {
    List<WeatherForecast> nextFiveDaysForecast = [];
    DateTime today = DateTime.now();

    List<WeatherForecast> nextDay1All = allForecasts.where((af) => (DateTime.fromMillisecondsSinceEpoch(af.dt! * 1000)).day == (today.add(Duration(days: 1))).day).toList();
    List<WeatherForecast> nextDay2All = allForecasts.where((af) => (DateTime.fromMillisecondsSinceEpoch(af.dt! * 1000)).day == (today.add(Duration(days: 2))).day).toList();
    List<WeatherForecast> nextDay3All = allForecasts.where((af) => (DateTime.fromMillisecondsSinceEpoch(af.dt! * 1000)).day == (today.add(Duration(days: 3))).day).toList();
    List<WeatherForecast> nextDay4All = allForecasts.where((af) => (DateTime.fromMillisecondsSinceEpoch(af.dt! * 1000)).day == (today.add(Duration(days: 4))).day).toList();
    List<WeatherForecast> nextDay5All = allForecasts.where((af) => (DateTime.fromMillisecondsSinceEpoch(af.dt! * 1000)).day == (today.add(Duration(days: 5))).day).toList();

    var nextDay1MiddayTest = nextDay1All.where((nd) => (DateTime.fromMillisecondsSinceEpoch(nd.dt! * 1000)).hour == 12).firstOrNull;
    if(nextDay1All.isNotEmpty) {
      WeatherForecast nextDay1AllSummary = nextDay1MiddayTest != null ? nextDay1MiddayTest : nextDay1All.last;
      nextFiveDaysForecast.add(nextDay1AllSummary);
    }

    var nextDay2MiddayTest = nextDay2All.where((nd) => (DateTime.fromMillisecondsSinceEpoch(nd.dt! * 1000)).hour == 12).firstOrNull;
    if(nextDay2All.isNotEmpty) {
      WeatherForecast nextDay2Midday = nextDay2MiddayTest != null ? nextDay2MiddayTest : nextDay2All.last;
      nextFiveDaysForecast.add(nextDay2Midday);
    }

    var nextDay3MiddayTest = nextDay3All.where((nd) => (DateTime.fromMillisecondsSinceEpoch(nd.dt! * 1000)).hour == 12).firstOrNull;
    if(nextDay3All.isNotEmpty) {
      WeatherForecast nextDay3Midday = nextDay3MiddayTest != null ? nextDay3MiddayTest : nextDay3All.last;
      nextFiveDaysForecast.add(nextDay3Midday);
    }

    var nextDay4MiddayTest = nextDay4All.where((nd) => (DateTime.fromMillisecondsSinceEpoch(nd.dt! * 1000)).hour == 12).firstOrNull;
    if(nextDay4All.isNotEmpty) {
      WeatherForecast nextDay4Midday = nextDay4MiddayTest != null ? nextDay4MiddayTest : nextDay4All.last;
      nextFiveDaysForecast.add(nextDay4Midday);
    }

    var nextDay5MiddayTest = nextDay5All.where((nd) => (DateTime.fromMillisecondsSinceEpoch(nd.dt! * 1000)).hour == 12).firstOrNull;
    if(nextDay5All.isNotEmpty) {
      WeatherForecast nextDay5Midday = nextDay5MiddayTest != null ? nextDay5MiddayTest : nextDay5All.last;
      nextFiveDaysForecast.add(nextDay5Midday);
    }

    return nextFiveDaysForecast;
  }

  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    final appContext = Provider.of<AppContext>(context);
    TabletAppContext tabletAppContext = appContext.getContext();

    return weatherData == null ? Center(child: Text("Aucune donnée à afficher")) : Container(
      decoration: BoxDecoration(
          borderRadius: BorderRadius.all(Radius.circular(tabletAppContext.configuration!.roundedValue?.toDouble() ?? 20.0)),
          gradient: LinearGradient(
              begin: Alignment.topRight,
              end: Alignment.bottomLeft,
              stops: [
                0.2,
                0.5,
                0.9,
                0.95
              ],
              colors: [
                Colors.blue[50]!,
                Colors.blue[100]!,
                Colors.blue[200]!,
                Colors.blue[300]!
              ]
          )
      ),
      //color: Colors.yellow,
      //height: 300,
      //width: 300,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Padding(
            padding: const EdgeInsets.all(10.0),
            child: Center(child: Text(weatherDTO.city!, style: TextStyle(fontSize: kSectionTitleDetailSize, fontWeight: FontWeight.w500, color: Colors.black54, fontFamily: "Roboto"))),
          ),
          Row(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Text("${weatherData!.list!.first.main!.temp!.round().toString()}°", style: TextStyle(fontSize: 55.0, fontWeight: FontWeight.w400, color: Colors.black54, fontFamily: "Roboto")),
                ),
                Container(
                  //color: Colors.red,
                    height: size.height * 0.2,
                    width: size.width * 0.2,
                    child: Center(
                        child: CachedNetworkImage(imageUrl: "https://openweathermap.org/img/wn/${weatherData!.list!.first.weather!.first.icon!}@4x.png")
                    )
                ),
                Container(
                  // color: Colors.green,
                  width: size.width * 0.1,
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Column(
                          children: [
                            Icon(Icons.water_drop_outlined, color: kTestSecondColor),
                            Text("${weatherData!.list!.first.pop!.round().toString()}%", style: TextStyle(fontSize: 15.0, fontWeight: FontWeight.w400, color: Colors.black54, fontFamily: "Roboto")),
                          ],
                        ),
                      ),
                      Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Column(
                          children: [
                            Icon(Icons.air, color: kTestSecondColor),
                            Text("${(weatherData!.list!.first.wind!.speed! * 3.6).toStringAsFixed(1)}km/h", style: TextStyle(fontSize: 15.0, fontWeight: FontWeight.w400, color: Colors.black54, fontFamily: "Roboto")),
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
              ]),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Container(
              height: size.height * 0.25,
              width: size.width * 0.6,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.all(Radius.circular(tabletAppContext.configuration!.roundedValue?.toDouble() ?? 20.0)),
                //color: Colors.grey,
              ),
              child: Column(
                children: [
                  Padding(
                    padding: const EdgeInsets.only(left: 15, bottom: 10),
                    child: Align(alignment: Alignment.centerLeft, child: Text(TranslationHelper.getFromLocale("weather.hourly", appContext.getContext()), style: TextStyle(fontSize: 22, fontWeight: FontWeight.w400, color: Colors.black54, fontFamily: "Roboto"))),
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: List.generate(
                      nbrNextHours,
                          (index) {
                        final weatherForecast = weatherData!.list!.sublist(1)[index];
                        return Padding(
                          padding: const EdgeInsets.all(8.0),
                          child: Container(
                            height: size.height * 0.15,
                            width: size.width * 0.1,
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.all(Radius.circular(tabletAppContext.configuration!.roundedValue?.toDouble() ?? 20.0)),
                              color: Colors.lightBlueAccent,
                              boxShadow: [
                                BoxShadow(
                                  color: kBackgroundGrey.withValues(alpha: 0.6),
                                  spreadRadius: 0.75,
                                  blurRadius: 3.1,
                                  offset: Offset(0, 2.5), // changes position of shadow
                                ),
                              ],
                            ),
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.spaceAround,
                              crossAxisAlignment: CrossAxisAlignment.center,
                              children: [
                                Text('${formatTimestamp(weatherForecast.dt!, appContext, true, false)}', style: TextStyle(fontSize: 12.0, fontWeight: FontWeight.w400, color: Colors.white, fontFamily: "Roboto")),
                                Center(child: CachedNetworkImage(imageUrl: "https://openweathermap.org/img/wn/${weatherForecast.weather!.first.icon!}.png")),
                                Text('${weatherForecast.main!.temp!.round().toString()}°', style: TextStyle(fontSize: 20.0, fontWeight: FontWeight.w600, color: Colors.white, fontFamily: "Roboto")),
                              ],
                            ),
                          ),
                        );
                      },
                    ),
                  ),
                ],
              ),
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(0.0),
            child: Container(
              height: size.height * 0.3,
              width: size.width * 0.75,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.all(Radius.circular(tabletAppContext.configuration!.roundedValue?.toDouble() ?? 20.0)),
                //color: Colors.amber,
              ),
              child: Column(
                children: [
                  Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: Align(alignment: Alignment.centerLeft, child: Text(TranslationHelper.getFromLocale("weather.nextdays", appContext.getContext()), style: TextStyle(fontSize: 20, fontWeight: FontWeight.w400, color: Colors.black54, fontFamily: "Roboto"))),
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: List.generate(
                      getNextFiveDaysForecast(weatherData!.list!).length, // nbrNextHours
                          (index) {
                        final weatherForecastNextDay = getNextFiveDaysForecast(weatherData!.list!)[index];
                        return Padding(
                          padding: const EdgeInsets.all(8.0),
                          child: Container(
                            height: size.height * 0.22,
                            width: size.width * 0.125,
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.all(Radius.circular(tabletAppContext.configuration!.roundedValue?.toDouble() ?? 20.0)),
                              color: Colors.lightBlue,
                              boxShadow: [
                                BoxShadow(
                                  color: kBackgroundGrey.withValues(alpha: 0.5),
                                  spreadRadius: 0.75,
                                  blurRadius: 3.1,
                                  offset: Offset(0, 2.5), // changes position of shadow
                                ),
                              ],
                            ),
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.spaceAround,
                              crossAxisAlignment: CrossAxisAlignment.center,
                              children: [
                                Center(child: CachedNetworkImage(imageUrl: "https://openweathermap.org/img/wn/${weatherForecastNextDay.weather!.first.icon!}@2x.png")),
                                Text('${weatherForecastNextDay.main!.temp!.round().toString()}°', style: TextStyle(fontSize: 25.0, fontWeight: FontWeight.w600, color: Colors.white, fontFamily: "Roboto")),
                                Text('${getTranslatedDayOfWeek(weatherForecastNextDay.dt!, appContext, true)}', style: TextStyle(fontSize: 16.0, fontWeight: FontWeight.w400, color: Colors.white, fontFamily: "Roboto")),
                              ],
                            ),
                          ),
                        );
                      },
                    ),
                  ),
                ],
              ),
            ),
          )
        ],
      ),
    );
    /*return InkWell(
      onTap: () {
        showDialog(
          context: context,
          builder: (BuildContext context) {
            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)),
          gradient: LinearGradient(
              begin: Alignment.topRight,
              end: Alignment.bottomLeft,
              stops: [
                0.2,
                0.5,
                0.9,
                0.95
              ],
              colors: [
                Colors.blue[50]!,
                Colors.blue[100]!,
                Colors.blue[200]!,
                Colors.blue[300]!
              ]
          )
      ),
      height: size.height * 0.9,
      width: size.width * 0.8,
      child: Stack(
        children: [
          Positioned(
            right: 5,
            top: 5,
            child: InkWell(
              onTap: () {
                Navigator.of(context).pop();
              },
              child: Container(
                width: 50,
                height: 50,
                child: Icon(
                  Icons.close,
                  size: 25,
                  color: Colors.black54,
                ),
              ),
            ),
          ),
          SizedBox(
            //height: 300,
            //width: 300,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Padding(
                  padding: const EdgeInsets.all(10.0),
                  child: Center(child: Text(tabletAppContext.configuration!.weatherCity!, style: TextStyle(fontSize: kSectionTitleDetailSize, fontWeight: FontWeight.w500, color: Colors.black54))),
                ),
                Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Text("${weatherData.list!.first.main!.temp!.round().toString()}°", style: TextStyle(fontSize: 55.0, fontWeight: FontWeight.w400, color: Colors.black54)),
                      ),
                      Container(
                        //color: Colors.red,
                          height: size.height * 0.2,
                          width: size.width * 0.2,
                          child: Center(
                              child: CachedNetworkImage(imageUrl: "https://openweathermap.org/img/wn/${weatherData.list!.first.weather!.first.icon!}@4x.png")
                          )
                      ),
                      Container(
                        // color: Colors.green,
                        width: size.width * 0.1,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          children: [
                            Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: Column(
                                children: [
                                  Icon(Icons.water_drop_outlined, color: kTestSecondColor),
                                  Text("${weatherData.list!.first.pop!.round().toString()}%", style: TextStyle(fontSize: 15.0, fontWeight: FontWeight.w400, color: Colors.black54)),
                                ],
                              ),
                            ),
                            Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: Column(
                                children: [
                                  Icon(Icons.air, color: kTestSecondColor),
                                  Text("${(weatherData.list!.first.wind!.speed! * 3.6).toStringAsFixed(1)}km/h", style: TextStyle(fontSize: 15.0, fontWeight: FontWeight.w400, color: Colors.black54)),
                                ],
                              ),
                            ),
                          ],
                        ),
                      ),
                    ]),
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Container(
                    height: size.height * 0.25,
                    width: size.width * 0.6,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.all(Radius.circular(20.0)),
                      //color: Colors.grey,
                    ),
                    child: Column(
                      children: [
                        Padding(
                          padding: const EdgeInsets.only(left: 15, bottom: 10),
                          child: Align(alignment: Alignment.centerLeft, child: Text(TranslationHelper.getFromLocale("weather.hourly", appContext.getContext()), style: TextStyle(fontSize: 22, fontWeight: FontWeight.w400, color: Colors.black54))),
                        ),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          children: List.generate(
                            nbrNextHours,
                                (index) {
                              final weatherForecast = weatherData.list!.sublist(1)[index];
                              return Padding(
                                padding: const EdgeInsets.all(8.0),
                                child: Container(
                                  height: size.height * 0.15,
                                  width: size.width * 0.1,
                                  decoration: BoxDecoration(
                                    borderRadius: BorderRadius.all(Radius.circular(20.0)),
                                    color: Colors.lightBlueAccent,
                                    boxShadow: [
                                      BoxShadow(
                                        color: kBackgroundGrey.withOpacity(0.6),
                                        spreadRadius: 0.75,
                                        blurRadius: 3.1,
                                        offset: Offset(0, 2.5), // changes position of shadow
                                      ),
                                    ],
                                  ),
                                  child: Column(
                                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                                    crossAxisAlignment: CrossAxisAlignment.center,
                                    children: [
                                      Text('${formatTimestamp(weatherForecast.dt!, appContext, true, false)}', style: TextStyle(fontSize: 12.0, fontWeight: FontWeight.w400, color: Colors.white)),
                                      Center(child: CachedNetworkImage(imageUrl: "https://openweathermap.org/img/wn/${weatherForecast.weather!.first.icon!}.png")),
                                      Text('${weatherForecast.main!.temp!.round().toString()}°', style: TextStyle(fontSize: 20.0, fontWeight: FontWeight.w600, color: Colors.white)),
                                    ],
                                  ),
                                ),
                              );
                            },
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Container(
                    height: size.height * 0.3,
                    width: size.width * 0.75,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.all(Radius.circular(20.0)),
                      //color: Colors.amber,
                    ),
                    child: Column(
                      children: [
                        Padding(
                          padding: const EdgeInsets.all(8.0),
                          child: Align(alignment: Alignment.centerLeft, child: Text(TranslationHelper.getFromLocale("weather.nextdays", appContext.getContext()), style: TextStyle(fontSize: 20, fontWeight: FontWeight.w400, color: Colors.black54))),
                        ),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          children: List.generate(
                            getNextFiveDaysForecast(weatherData.list!).length, // nbrNextHours
                                (index) {
                              final weatherForecastNextDay = getNextFiveDaysForecast(weatherData.list!)[index];
                              return Padding(
                                padding: const EdgeInsets.all(8.0),
                                child: Container(
                                  height: size.height * 0.22,
                                  width: size.width * 0.125,
                                  decoration: BoxDecoration(
                                    borderRadius: BorderRadius.all(Radius.circular(20.0)),
                                    color: Colors.lightBlue,
                                    boxShadow: [
                                      BoxShadow(
                                        color: kBackgroundGrey.withOpacity(0.5),
                                        spreadRadius: 0.75,
                                        blurRadius: 3.1,
                                        offset: Offset(0, 2.5), // changes position of shadow
                                      ),
                                    ],
                                  ),
                                  child: Column(
                                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                                    crossAxisAlignment: CrossAxisAlignment.center,
                                    children: [
                                      Center(child: CachedNetworkImage(imageUrl: "https://openweathermap.org/img/wn/${weatherForecastNextDay.weather!.first.icon!}@2x.png")),
                                      Text('${weatherForecastNextDay.main!.temp!.round().toString()}°', style: TextStyle(fontSize: 25.0, fontWeight: FontWeight.w600, color: Colors.white)),
                                      Text('${getTranslatedDayOfWeek(weatherForecastNextDay.dt!, appContext, true)}', style: TextStyle(fontSize: 16.0, fontWeight: FontWeight.w400, color: Colors.white)),
                                    ],
                                  ),
                                ),
                              );
                            },
                          ),
                        ),
                      ],
                    ),
                  ),
                )
              ],
            ),
          ),
        ],
      ),
    )
            );
          },
        );
      },
      child: Container(
        //color: Colors.amber,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.all(Radius.circular(10.0)),
            gradient: LinearGradient(
                begin: Alignment.topRight,
                end: Alignment.bottomLeft,
                stops: [
                  0.2,
                  0.5,
                  1.0,
                  1.0
                ],
                colors: [
                  Colors.blue[50]!,
                  Colors.blue[100]!,
                  Colors.blue[200]!,
                  Colors.blue[300]!
                ]
            )
        ),
        width: 70,
        child: Column(
          children: [
            CachedNetworkImage(imageUrl: "https://openweathermap.org/img/wn/${weatherData.list!.first.weather!.first.icon!}.png"),
            Container(child: AutoSizeText("${weatherData.list!.first.main!.temp!.round().toString()}°")),
            //AutoSizeText(weatherData.city!.name!),
          ],
        ),
      ),
    );*/
  }
}

//_webView