import 'package:flutter/material.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.dart';
import 'package:manager_app/Components/message_notification.dart';
import 'package:manager_app/Components/multi_string_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:managerapi/api.dart';
import 'package:provider/provider.dart';
import 'package:intl/intl.dart';

import 'SubSection/Article/article_config.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().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: Loading()
                )
            );
          }
        }
    );
  }

  Widget bodySection(SectionDTO sectionDTO, Size size, AppContext appContext, BuildContext context)  {
    return 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)),
                          ],
                        ),
                        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: [
                        Column(
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            StringInputContainer(
                              label: "Nom :",
                              initialValue: sectionDTO != null ? sectionDTO.label : "",
                              onChanged: (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,
                            ),
                            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,
                            ),
                          ],
                        ),
                        Column(
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            if(sectionDTO.type != SectionType.article)
                              ImageInputContainer(
                                label: "Image :",
                                initialValue: sectionDTO != null ? sectionDTO.imageId : "",
                                color: kPrimaryColor,
                                onChanged: (ResourceDTO resource) {
                                  sectionDTO.imageId = resource.id;
                                  sectionDTO.imageSource = resource.type == ResourceType.imageUrl ? resource.data : appContext.getContext().clientAPI.resourceApi.apiClient.basePath+"/api/Resource/"+ resource.id;
                                },
                              )
                            else
                              QrImage(
                                data: sectionDTO.id,
                                version: QrVersions.auto,
                                size: 200.0,
                              ),
                          ],
                        )
                      ],
                    ),
                  ),
                ],
              ),
            ),
          ),
        ),// FIELDS SECTION
        Container(
          //width: size.width * 0.8,
          height: size.height * 0.45,
          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)
          ),
        ),
        SizedBox(
          height: size.height*0.05,
        )
      ],
    );
  }

  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: kPrimaryColor,
              textColor: Colors.white,
              fontSize: 15,
              press: () {
                print(sectionDTO);
                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().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 appContext.getContext().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().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:
        print(sectionDTO.data);
        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;
}