import 'package:flutter/material.dart';
import 'package:manager_app/Components/check_input_container.dart';
import 'package:manager_app/Components/confirmation_dialog.dart';
import 'package:manager_app/Components/fetch_section_icon.dart';
import 'package:manager_app/Components/image_input_container.dart';
import 'package:manager_app/Components/loading_common.dart';
import 'package:manager_app/Components/message_notification.dart';
import 'package:manager_app/Components/multi_string_input_container.dart';
import 'package:manager_app/Components/number_input_container.dart';
import 'package:manager_app/Components/rounded_button.dart';
import 'package:manager_app/Components/string_input_container.dart';
import 'package:manager_app/Models/managerContext.dart';
import 'package:manager_app/Screens/Configurations/Section/SubSection/WebOrVideo/web_video_config.dart';
import 'package:manager_app/app_context.dart';
import 'package:manager_app/client.dart';
import 'package:manager_app/constants.dart';
import 'package:manager_api_new/api.dart';
import 'package:provider/provider.dart';
import 'package:intl/intl.dart';

import 'SubSection/Article/article_config.dart';
import 'SubSection/Article/download_pdf.dart';
import 'SubSection/Map/map_config.dart';
import 'SubSection/Menu/menu_config.dart';
import 'SubSection/Quizz/quizz_config.dart';
import 'SubSection/Slider/slider_config.dart';
import 'package:qr_flutter/qr_flutter.dart';

class SectionDetailScreen extends StatefulWidget {
  final String id;
  SectionDetailScreen({Key? key, required this.id}) : super(key: key);

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

class _SectionDetailScreenState extends State<SectionDetailScreen> {

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

    return FutureBuilder(
        future: getSection(widget.id, (appContext.getContext() as ManagerAppContext).clientAPI!),
        builder: (context, AsyncSnapshot<dynamic> snapshot) {
          if (snapshot.connectionState == ConnectionState.done) {
            return Stack(
              children: [
                bodySection(snapshot.data, size, appContext, context),
                Align(
                  alignment: AlignmentDirectional.bottomCenter,
                  child: Container(
                    height: 80,
                    child: getButtons(snapshot.data, appContext),
                  ),
                )
              ],
            );
          } else if (snapshot.connectionState == ConnectionState.none) {
            return Text("No data");
          } else {
            return Center(
                child: Container(
                    height: size.height * 0.2,
                    child: LoadingCommon()
                )
            );
          }
        }
    );
  }

  Widget bodySection(SectionDTO? sectionDTO, Size size, AppContext appContext, BuildContext context)  {
    return SingleChildScrollView(
      child: Column(
        //mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: [
          Container(
            //color: Colors.orangeAccent,
            height: 75,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Align(
                    alignment: AlignmentDirectional.bottomStart,
                    child: Padding(
                      padding: const EdgeInsets.all(3.0),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Row(
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: [
                              Padding(
                                padding: const EdgeInsets.all(8.0),
                                child: Icon(
                                  sectionDTO != null ? getSectionIcon(sectionDTO.type) :  Icons.add,
                                  color: kPrimaryColor,
                                  size: 25,
                                ),
                              ),
                              Text(sectionDTO != null ? sectionDTO.label! : "", style: TextStyle(fontSize: 30, fontWeight: FontWeight.w400)),
                              if((appContext.getContext() as ManagerAppContext).selectedConfiguration!.isMobile!)
                                DownloadPDF(sections: [sectionDTO!]),
                            ],
                          ),
                          Padding(
                            padding: const EdgeInsets.all(5.0),
                            child: Text(sectionDTO != null ? DateFormat('dd/MM/yyyy').format(sectionDTO.dateCreation!) : "", style: TextStyle(fontSize: 15, fontWeight: FontWeight.w200)),
                          ),
                        ],
                      ),
                    )
                ),
                Padding(
                  padding: const EdgeInsets.all(5.0),
                  child: Align(
                    alignment: AlignmentDirectional.centerEnd,
                    child: InkWell(
                        onTap: () {
                          ManagerAppContext managerAppContext = appContext.getContext();
                          managerAppContext.selectedSection = null;
                          appContext.setContext(managerAppContext);
                        },
                        child: Container(
                            child: Icon(
                              Icons.arrow_back,
                              color: kPrimaryColor,
                              size: 50.0,
                            )
                        )
                    ),
                  ),
                )
              ],
            ),
          ), // TITLE
          Container(
            //color: Colors.blue,
            child: Padding(
              padding: const EdgeInsets.all(5.0),
              child: Container(
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceAround,
                        children: [
                          if((appContext.getContext() as ManagerAppContext).selectedConfiguration!.isMobile!)
                            Column(
                              mainAxisAlignment: MainAxisAlignment.spaceAround,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Row(
                                  crossAxisAlignment: CrossAxisAlignment.center,
                                  children: [
                                    Container(
                                      width: size.width *0.1,
                                      height: 125,
                                      child: QrImage(
                                        padding: EdgeInsets.only(left: 0.0, top: 5.0, bottom: 5.0),
                                        data: sectionDTO!.id!,
                                        version: QrVersions.auto,
                                        size: 50.0,
                                      ),
                                    ),
                                    SelectableText(sectionDTO.id!, style: new TextStyle(fontSize: 15))
                                  ],
                                ),
                                CheckInputContainer(
                                  label: "Beacon :",
                                  isChecked: sectionDTO.isBeacon!,
                                  fontSize: 25,
                                  onChanged: (value) {
                                    setState(() {
                                      sectionDTO.isBeacon = value;
                                      save(true, sectionDTO, appContext);
                                    });
                                  },
                                ),
                                if(sectionDTO.isBeacon!)
                                  NumberInputContainer(
                                    label: "Identifiant Beacon :",
                                    initialValue: sectionDTO.beaconId != null ? sectionDTO.beaconId! : 0,
                                    isSmall: true,
                                    onChanged: (value) {
                                      try {
                                        sectionDTO.beaconId = int.parse(value);
                                      } catch (e) {
                                        print('BeaconId not a number');
                                        showNotification(Colors.orange, kWhite, 'Cela doit être un chiffre', context, null);
                                      }
                                    },
                                  ),
                              ],
                            ),
                          Column(
                            mainAxisAlignment: MainAxisAlignment.spaceAround,
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              StringInputContainer(
                                label: "Identifiant :",
                                initialValue: sectionDTO != null ? sectionDTO.label : "",
                                onChanged: (String value) {
                                  sectionDTO!.label = value;
                                },
                              ),
                              MultiStringContainer(
                                label: "Titre affiché:",
                                modalLabel: "Titre",
                                color: kPrimaryColor,
                                initialValue: sectionDTO != null ? sectionDTO.title! : [],
                                onGetResult: (value) {
                                  if (sectionDTO!.title! != value) {
                                    sectionDTO.title = value;
                                    save(true, sectionDTO, appContext);
                                  }
                                },
                                maxLines: 1,
                                isTitle: true,
                              ),
                              if(!(appContext.getContext() as ManagerAppContext).selectedConfiguration!.isMobile!)
                                MultiStringContainer(
                                  label: "Description affichée:",
                                  modalLabel: "Description",
                                  color: kPrimaryColor,
                                  initialValue: sectionDTO != null ? sectionDTO.description! : [],
                                  onGetResult: (value) {
                                    if (sectionDTO!.description != value) {
                                      sectionDTO.description = value!;
                                      save(true, sectionDTO, appContext);
                                    }
                                  },
                                  maxLines: 2,
                                  isTitle: true,
                                ),
                            ],
                          ),
                          Column(
                            mainAxisAlignment: MainAxisAlignment.start,
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              ImageInputContainer(
                                label: "Image :",
                                initialValue: sectionDTO != null ? sectionDTO.imageId : null,
                                color: kPrimaryColor,
                                onChanged: (ResourceDTO resource) {
                                  if(resource.id == null) {
                                    sectionDTO!.imageId = null;
                                    sectionDTO.imageSource = null;
                                  } else {
                                    sectionDTO!.imageId = resource.id;
                                    sectionDTO.imageSource = resource.type == ResourceType.ImageUrl ? resource.data : (appContext.getContext() as ManagerAppContext).clientAPI!.resourceApi!.apiClient.basePath+"/api/Resource/"+ resource.id!;
                                  }
                                },
                              ),
                            ],
                          )
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ),// FIELDS SECTION
          Container(
            //width: size.width * 0.8,
            height: size.height * 0.5,
            child: Padding(
              padding: const EdgeInsets.all(10.0),
              child: sectionDTO != null ? getSpecificData(sectionDTO, appContext) : null,
            ),
            decoration: BoxDecoration(
                //color: Colors.lightGreen,
                borderRadius: BorderRadius.circular(30),
                border: Border.all(width: 1.5, color: kSecond)
            ),
          ),
        ],
      ),
    );
  }

  getButtons(SectionDTO sectionDTO, AppContext appContext) {
    return Align(
      alignment: AlignmentDirectional.bottomCenter,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.end,
        children: [
          Padding(
            padding: const EdgeInsets.all(10.0),
            child: RoundedButton(
              text: "Annuler",
              icon: Icons.undo,
              color: Colors.grey,
              textColor: Colors.white,
              fontSize: 15,
              press: () {
                cancel(sectionDTO, appContext);
              },
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: RoundedButton(
              text: "Supprimer",
              icon: Icons.delete,
              color: kError,
              textColor: Colors.white,
              fontSize: 15,
              press: () {
                delete(sectionDTO, appContext);
              },
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: RoundedButton(
              text: "Sauvegarder",
              icon: Icons.done,
              color: kSuccess,
              textColor: Colors.white,
              fontSize: 15,
              press: () {
                save(false, sectionDTO, appContext);
              },
            ),
          ),
        ],
      ),
    );
  }

  Future<void> cancel(SectionDTO sectionDTO, AppContext appContext) async {
    ManagerAppContext managerAppContext = appContext.getContext();
    SectionDTO? section = await (appContext.getContext() as ManagerAppContext).clientAPI!.sectionApi!.sectionGetDetail(sectionDTO.id!);
    managerAppContext.selectedSection = section;
    appContext.setContext(managerAppContext);
  }

  Future<void> delete(SectionDTO sectionDTO, AppContext appContext) async {
    showConfirmationDialog(
        "Êtes-vous sûr de vouloir supprimer cette section ?",
            () {},
            () async {
          ManagerAppContext managerAppContext = appContext.getContext();
          await managerAppContext.clientAPI!.sectionApi!.sectionDelete(sectionDTO.id!);
          managerAppContext.selectedSection = null;
          appContext.setContext(managerAppContext);
        },
        context
    );
  }

  Future<void> save(bool isTraduction, SectionDTO sectionDTO, AppContext appContext) async {
    if (sectionDTO != null) {
      SectionDTO? section = await (appContext.getContext() as ManagerAppContext).clientAPI!.sectionApi!.sectionUpdate(sectionDTO);
      ManagerAppContext managerAppContext = appContext.getContext();
      managerAppContext.selectedSection = section;
      appContext.setContext(managerAppContext);

      if (isTraduction) {
        showNotification(Colors.green, kWhite, 'Les traductions de la section ont été sauvegardées avec succès', context, null);
      } else {
        showNotification(Colors.green, kWhite, 'La section a été sauvegardée avec succès', context, null);
      }
    }
  }

  getSpecificData(SectionDTO sectionDTO, AppContext appContext) {
    switch(sectionDTO.type) {
      case SectionType.Map:
        return MapConfig(
          initialValue: sectionDTO.data!,
          onChanged: (String data) {
            sectionDTO.data = data;
            //save(false, sectionDTO, appContext);
          },
        );
      case SectionType.Slider:
        return SliderConfig(
          initialValue: sectionDTO.data!,
          onChanged: (String data) {
            sectionDTO.data = data;
            save(false, sectionDTO, appContext);
          },
        );
      case SectionType.Video:
      case SectionType.Web:
        return WebOrVideoConfig(
          label: sectionDTO.type == SectionType.Video ? "Url de la vidéo:": "Url du site web:",
          initialValue: sectionDTO.data!,
          onChanged: (String data) {
            sectionDTO.data = data;
          },
        );
      case SectionType.Menu:
        return MenuConfig(
          initialValue: sectionDTO.data!,
          onChanged: (String data) {
            //print("Received info in parent");
            //print(data);
            sectionDTO.data = data;
          },
        );
      case SectionType.Quizz:
        return QuizzConfig(
          initialValue: sectionDTO.data!,
          onChanged: (String data) {
            //print("Received info in parent - quizz");
            //print(data);
            sectionDTO.data = data;
          },
        );
      case SectionType.Article:
        return ArticleConfig(
          initialValue: sectionDTO.data!,
          onChanged: (String data) {
            //print("Received info in parent - article");
            //print(data);
            sectionDTO.data = data;
            save(false, sectionDTO, appContext);
          },
        );
    }
  }
}

Future<SectionDTO?> getSection(String sectionId, Client client) async {
  SectionDTO? section = await client.sectionApi!.sectionGetDetail(sectionId);
  //print(section);
  return section;
}