// -- GESTION DU FORMULAIRE PERMETTANT DE SAISIR / ÉDITER LES INFOS DES GROUPES DE QUIZS

/// Vérifie que l'utilisateur est bien connecté, a le bon statut et le redirige vers le formulaire d'inscription si ce n'est pas le cas.
/// Si c'est ok, propose un moteur de recherche permettant de chercher un groupe.
/// Si un id est passé par l'url on affiche les informations du groupe dans un formulaire permettant de l'éditer/supprimer.
/// Si pas d'id passé par l'url, on affiche un formulaire vide permettant d'en saisir un nouveau.

// Fichier de configuration côté client :
import { apiUrl, availableLangs, theme } from "../../config/instance.js";
const lang=availableLangs[0];
const configQuestionnaires = require("../../config/questionnaires.js");
const configTemplate = require("../../views/"+theme+"/config/"+lang+".js");

// Fonctions utiles au script :
import { getLocaly, removeLocaly } from "./tools/clientstorage.js";
import { addElement } from "./tools/dom.js";
import { helloDev, updateAccountLink } from "./tools/everywhere.js";
import { empyForm, getDatasFromInputs, setAttributesToInputs } from "./tools/forms.js";
import { dateFormat, isEmpty, replaceAll } from "../../tools/main";
import { getUrlParams } from "./tools/url.js";
import { checkSession } from "./tools/users.js";

// Dictionnaires :
const { addOkMessage, serverError } = require("../../lang/"+lang+"/general");
const { infosGroupForAdmin, searchWithoutResult } = require("../../lang/"+lang+"/group");
const { needBeConnected } = require("../../lang/"+lang+"/user");

// Principaux éléments du DOM manipulés :
const divMain = document.getElementById("main-content");
const divMessage = document.getElementById("message");
const divResponse = document.getElementById("response");
const divCrash = document.getElementById("crash");
const divGroupIntro = document.getElementById("groupIntro");
const formGroup = document.getElementById("groups");
const deleteCheckBox = document.getElementById("deleteOkLabel");
const btnNewGroup = document.getElementById("wantNewGroup");
const formSearch = document.getElementById("search");
const divSearchResult = document.getElementById("searchResult");

helloDev();

const initialise = async () =>
{
    try
    {
        const isConnected=await checkSession(["manager", "admin"], "/"+configTemplate.connectionPage, { message: needBeConnected, color:"error" }, window.location);
        if(isConnected)
        {
            const user=getLocaly("user", true);
            updateAccountLink(user.status, configTemplate);
            divMain.style.display="block";
            if(!isEmpty(getLocaly("message")))
            {
                addElement(divMessage, "p", getLocaly("message", true).message, "", [getLocaly("message", true).color], "", false);
                removeLocaly("message");
            }
             // Initialisation du formulaire de recherche :
            setAttributesToInputs(configQuestionnaires, formSearch);
            
            // Fonction utile pour vider le formulaire, y compris les champs hidden, etc.
            // Cache aussi certains champs en mode création
            const emptyGroupForm = () =>
            {
                empyForm(formGroup);
                // Case de suppression cachée par défaut, car inutile pour formulaire de création
                deleteCheckBox.style.display="none";
            }
            emptyGroupForm();
            // Initialise les contraintes du formulaire :
            setAttributesToInputs(configQuestionnaires.Group, formGroup);
            
            // Fonction affichant les infos connues concernant un utilisateur et son abonnement
            const showFormGroupInfos = (id) =>
            {
                // on commence par tout vider, des fois que... :
                emptyGroupForm();
                const xhrGetInfos = new XMLHttpRequest();
                xhrGetInfos.open("GET", apiUrl+configQuestionnaires.groupRoutes+configQuestionnaires.getGroupRoute+id);
                xhrGetInfos.onreadystatechange = function()
                {
                    if (this.readyState == XMLHttpRequest.DONE)
                    {
                        let response=JSON.parse(this.responseText);
                        if (this.status === 200 && response.Group != undefined)
                        {
                            const mapText =
                            {
                                GROUP_ID : response.Group.id,
                                DATE_CREA : dateFormat(response.Group.createdAt),
                                DATE_UPDATE : dateFormat(response.Group.updatedAt),
                                NB_ELEMENTS : (response.Group.Questionnaires!==undefined) ? response.Group.Questionnaires.length : 0
                            };
                            const groupIntro=replaceAll(infosGroupForAdmin, mapText);
                            addElement(divGroupIntro, "p", groupIntro, "", ["info"]);
                            for(let data in response.Group)
                            {
                                if(formGroup.elements[data]!==undefined)
                                {
                                    if(data==="publishingAt" && response.Group[data]!==null)
                                        formGroup.elements[data].value=dateFormat(response.Group[data], "form");// !! revoir car format pouvant poser soucis si navigateur ne gère pas les champs de type "date"
                                    else
                                       formGroup.elements[data].value=response.Group[data];
                                }
                            }
                            deleteCheckBox.style.display="block";
                        }
                    }
                }
                xhrGetInfos.setRequestHeader("Authorization", "Bearer "+user.token);
                xhrGetInfos.send();
            }

            // Si un id est passé par l'url, on essaye d'afficher les infos :
            let urlDatas=getUrlParams();
            if(urlDatas && urlDatas.id!==undefined)
                showFormGroupInfos(urlDatas.id);

            // Besoin d'un coup de Kärcher ? 
            btnNewGroup.addEventListener("click", function(e)
            {
                emptyGroupForm();
            });
            
            // Envoi du formulaire des infos du groupe
            formGroup.addEventListener("submit", function(e)
            {
                e.preventDefault();
                divResponse.innerHTML="";
                let datas=getDatasFromInputs(formGroup);
                const xhrGroupDatas = new XMLHttpRequest();
                if(!isEmpty(datas.id) && (datas.deleteOk!==undefined))
                    xhrGroupDatas.open("DELETE", apiUrl+configQuestionnaires.groupRoutes+"/"+datas.id);
                else if(!isEmpty(datas.id))
                    xhrGroupDatas.open("PUT", apiUrl+configQuestionnaires.groupRoutes+"/"+datas.id);
                else
                    xhrGroupDatas.open("POST", apiUrl+configQuestionnaires.groupRoutes);
                xhrGroupDatas.onreadystatechange = function()
                {
                    if (this.readyState == XMLHttpRequest.DONE)
                    {
                        let response=JSON.parse(this.responseText);
                        if (this.status === 201 && response.id!=undefined)
                        {
                            addElement(divResponse, "p", addOkMessage, "", ["success"]);
                            datas.id=response.id;
                        }
                        else if (this.status === 200 && response.message!=undefined)
                        {
                            if(Array.isArray(response.message))
                                response.message = response.message.join("<br>");
                            else
                                response.message = response.message;
                            addElement(divResponse, "p", response.message, "", ["success"]);
                        }
                        else if (response.errors)
                        {
                            if(Array.isArray(response.errors))
                                response.errors = response.errors.join("<br>");
                            else
                                response.errors = serverError;
                            addElement(divResponse, "p", response.errors, "", ["error"]);
                        }
                        else
                            addElement(divResponse, "p", serverError, "", ["error"]);
                        if(isEmpty(response.errors))
                        {
                            if(datas.deleteOk===undefined)
                                showFormGroupInfos(datas.id);
                            else
                                emptyGroupForm();
                        }
                    }
                }
                xhrGroupDatas.setRequestHeader("Content-Type", "application/json");
                xhrGroupDatas.setRequestHeader("Authorization", "Bearer "+user.token);
                if(datas)
                    xhrGroupDatas.send(JSON.stringify(datas));
            });

            // Traitement du lancement d'une recherche
            formSearch.addEventListener("submit", function(e)
            {
                e.preventDefault();
                let datas=getDatasFromInputs(formSearch);
                const xhrSearch = new XMLHttpRequest();
                xhrSearch.open("POST", apiUrl+configQuestionnaires.groupRoutes+configQuestionnaires.searchGroupsRoute);
                xhrSearch.onreadystatechange = function()
                {
                    if (this.readyState == XMLHttpRequest.DONE)
                    {
                        let response=JSON.parse(this.responseText);
                        if (this.status === 200 && Array.isArray(response))
                        {
                            if(response.length===0)
                                addElement(divSearchResult, "p", searchWithoutResult, "", ["info"]);// vérifier et importer texte
                            else
                            {
                                let selectHTML="<option value=''></option>";
                                for(let i in response)
                                    selectHTML+="<option value='"+response[i].id+"'>"+response[i].title+"</option>";
                                addElement(divSearchResult, "select", selectHTML, "selectSearch");
                                const searchSelect=document.getElementById("selectSearch");
                                searchSelect.addEventListener("change", function()
                                {
                                    if(searchSelect.value!=="")
                                        showFormGroupInfos(searchSelect.value);
                                });
                            }
                        }
                        else if (response.errors)
                        {
                            if(Array.isArray(response.errors))
                                response.errors = response.errors.join("<br>");
                            else
                                response.errors = serverError;
                            addElement(divSearchResult, "p", response.errors, "", ["error"]);
                        }
                        else
                            addElement(divSearchResult, "p", serverError, "", ["error"]);
                    }
                }
                xhrSearch.setRequestHeader("Content-Type", "application/json");
                xhrSearch.setRequestHeader("Authorization", "Bearer "+user.token);
                if(datas)
                    xhrSearch.send(JSON.stringify(datas));
            });
        }
    }
    catch(e)
    {
        addElement(divCrash, "p", serverError, "", ["error"]);
        console.error(e);
    }
}
initialise();