import 'dart:ui';

import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import 'package:manager_app/Components/rounded_button.dart';
import 'package:manager_app/Components/text_form_input_container.dart';
import 'package:manager_app/Models/managerContext.dart';
import 'package:manager_app/Screens/Resources/select_resource_modal.dart';
import 'package:manager_app/app_context.dart';
import 'package:manager_app/constants.dart';
import 'package:manager_api_new/api.dart';
import 'package:collection/collection.dart';
import 'package:provider/provider.dart';
import 'package:quill_html_editor/quill_html_editor.dart';

import 'audio_input_container.dart';


showMultiStringInputHTML (String label, String modalLabel, bool isTitle, List<TranslationDTO> values, List<TranslationDTO> newValues, Function onGetResult, int maxLines, bool isAudio, BuildContext context) { /*Function onSelect,*/
  QuillEditorController controllerQuill = QuillEditorController();
  showDialog(
    builder: (BuildContext context) => AlertDialog(
      shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.all(Radius.circular(20.0))
      ),
        title: Center(child: Text(modalLabel)),
        content: SingleChildScrollView(
        child: Column(
          children: [
            Container(
              child: SingleChildScrollView(
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  children: getTranslations(context, Provider.of<AppContext>(context), controllerQuill, label, isTitle, isAudio, newValues),
                ),
              ),
            ),
            /*Container(
              width: 500,
              height: 200,
              child: TranslationTab(
                translations: newValues,
                maxLines: maxLines
              )
            ),*/
            /*Column(
              children: showValues(newValues),
            ),*/
          ],
        )
      ),
      actions: <Widget>[
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            Container(
              width: 180,
              height: 70,
              child: RoundedButton(
                text: "Annuler",
                icon: Icons.undo,
                color: kSecond,
                press: () {
                  onGetResult(values);
                  Navigator.of(context).pop();
                },
                fontSize: 20,
              ),
            ),
            Container(
              width: 180,
              height: 70,
              child: RoundedButton(
                text: "Valider",
                icon: Icons.check,
                color: kPrimaryColor,
                textColor: kWhite,
                press: () {
                  Function deepEq = const DeepCollectionEquality().equals;
                  if (!deepEq(values, newValues)) {
                    onGetResult(newValues);
                  }
                  Navigator.of(context).pop();
                },
                fontSize: 20,
              ),
            ),
          ],
        ),
      ],
    ), context: context
  );
}

getTranslations(BuildContext context, AppContext appContext, QuillEditorController controllerQuill, String label, bool isTitle, bool isAudio, List<TranslationDTO> newValues) {
  List<Widget> translations = <Widget>[];
  ManagerAppContext managerAppContext = appContext.getContext();
  final customToolBarList = isTitle ? [
    ToolBarStyle.bold,
    ToolBarStyle.italic,
    ToolBarStyle.color,
    ToolBarStyle.background,
    ToolBarStyle.clean
    ] : [
    ToolBarStyle.bold,
    ToolBarStyle.italic,
    ToolBarStyle.align,
    ToolBarStyle.color,
    ToolBarStyle.background,
    ToolBarStyle.listBullet,
    ToolBarStyle.listOrdered,
    ToolBarStyle.clean
  ];

  var language = managerAppContext.selectedConfiguration!.languages![0];
  //for(var language in managerAppContext.selectedConfiguration!.languages!) {
    translations.add(
        Padding(
          padding: const EdgeInsets.all(8.0),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              Container(
                  width: MediaQuery.of(context).size.width *0.05,
                  height: MediaQuery.of(context).size.height *0.10,
                  decoration: BoxDecoration(
                    border: Border(
                      right: BorderSide(width: 1.5, color: kSecond),
                    ),
                  ),
                  child: Center(child: AutoSizeText(language.toUpperCase()))
              ),
              Padding(
                padding: const EdgeInsets.only(left: 8.0),
                child: Container(
                  width: MediaQuery.of(context).size.width *0.5,
                  height: MediaQuery.of(context).size.height *0.5,
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      !isAudio ?
                      Column(
                        children: [
                          ToolBar(
                            toolBarColor: Colors.cyan.shade50,
                            activeIconColor: Colors.green,
                            padding: const EdgeInsets.all(8),
                            iconSize: 20,
                            toolBarConfig: customToolBarList,
                            controller: controllerQuill,
                            customButtons: [],
                          ),
                          QuillHtmlEditor(
                              text: newValues.where((element) => element.language == language).first.value!,
                              hintText: 'Hint text goes here',
                              controller: controllerQuill,
                              isEnabled: true,
                              minHeight: 300,
                              /*textStyle: _editorTextStyle,
                              hintTextStyle: _hintTextStyle,*/
                              hintTextAlign: TextAlign.start,
                              padding: const EdgeInsets.only(left: 10, top: 5),
                              hintTextPadding: EdgeInsets.zero,
                              backgroundColor: kSecond,
                              onFocusChanged: (hasFocus) => debugPrint('has focus $hasFocus'),
                              //onTextChanged: (text) => debugPrint('widget text change $text'),
                              onTextChanged: (value) {
                                newValues.where((element) => element.language == language).first.value = value;
                              },
                              onEditorCreated: () => debugPrint('Editor has been loaded'),
                              onEditorResized: (height) =>
                                  debugPrint('Editor resized $height'),
                              onSelectionChanged: (sel) =>
                                  debugPrint('${sel.index},${sel.length}'),
                          ),
                        ],
                      )
                      /*HtmlEditor(
                        controller: controller,
                        htmlEditorOptions: HtmlEditorOptions(
                          hint: "Your text here...",
                          initialText: newValues.where((element) => element.language == language).first.value!,
                          shouldEnsureVisible: true,
                        ),
                        htmlToolbarOptions: HtmlToolbarOptions(
                          toolbarPosition: ToolbarPosition.aboveEditor, //required to place toolbar anywhere!
                          //other options
                        ),
                        otherOptions: OtherOptions(
                          height: 400,
                        ),
                      )*/
                      /*TextFormInputContainer(
                        label: label,
                        color: kWhite,
                        isTitle: isTitle,
                        initialValue: newValues.where((element) => element.language == language).first.value!,
                        onChanged: (value) {
                          newValues.where((element) => element.language == language).first.value = value;
                        },
                      )*/ :
                      Container(
                        width: 250,
                        height: 120,
                        child: AudioInputContainer(
                          label: "Audio :",
                          initialValue: newValues.where((element) => element.language == language).first.value,
                          color: kPrimaryColor,
                          onChanged: (ResourceDTO resource) {
                            newValues.where((element) => element.language == language).first.value = resource.id;
                          },
                        ),
                      ),
                    ],
                  ),
                ),
              )
            ],
          ),
        )
    );
  //}
  return translations;
}
/*
showValues(List<TranslationDTO> newValues) {
  List<Widget> valuesToShow = new List<Widget>();
  newValues.forEach((newValue) {
    valuesToShow.add(
        new StringInputContainer(
            color: Colors.lightBlue,
            label: newValue.language,
            initialValue: newValue.value,
            onChanged: (String value)  {
              newValue.value = value;
            },
        ));
  });
  return valuesToShow;
}*/