/**
 * Ensemble des fonctions JavaScript appelées sur les boxes.
 */
function Box() {
    this.regional = [];

    /* 
     * Ajoute la gestion des expand/collapse sur les boxes.
     */
    this.initialize = function() {

    orion.event.listenToUsingSelector("click", 'div[data-o-role="box-header"]', orion.box.showHideBoxContent);

        $("*[data-o-role='box-header-icon'] > i").attr("title", orion.box.regional["orion.box.hideBoxContent"]);

        // Déterminer si le contenu de la box sera affiché/masqué selon son état initial
        // On met à jour le title ainsi que le texte alternatif à l'icône.
        $("*[data-o-role='box-header-icon'] > i").each(function() {
            // Mantis 628 : Debut
            var boxContentElem = $(this).parents("*[data-o-role='box']").first().find("*[data-o-role='box-content']").first();
            if (boxContentElem.is(":visible")) {
                $(this).attr("title", orion.box.regional["orion.box.hideBoxContent"]);
                // On modifie le texte alternatif affiché pour l'accessibilité
                $(this).children(".o-invisible").text(orion.box.regional["orion.box.hideBoxContent"]);
            }
            else {
                $(this).attr("title", orion.box.regional["orion.box.showBoxContent"]);
                // On modifie le texte alternatif affiché pour l'accessibilité
                $(this).children(".o-invisible").text(orion.box.regional["orion.box.showBoxContent"]);
            }
            // Mantis 628 : Fin
        });

        $("*[data-o-role='box'][data-o-folded='true'][data-o-remember='false']").each(function() {
            var toggleIconElem = $(this).find("*[data-o-role='box-header-icon'] > i").first();
            orion.box.showHideBoxContent.apply(toggleIconElem);
        });

        $("*[data-o-role='box'][data-o-remember='true']").each(function() {
            var boxHiddenInLocalStorage = orion.box.isBoxHiddenInLocalStorage($(this));
            if (boxHiddenInLocalStorage
                    || (boxHiddenInLocalStorage === null && $(this).attr("data-o-folded") === 'true')) {
                var toggleIconElem = $(this).find("*[data-o-role='box-header-icon'] > i").first();
                orion.box.showHideBoxContent.apply(toggleIconElem);
            }
        });        
    };

    /**
     * Alternativement masque ou affiche le contenu d'une box et son résumé.
     */
    this.showHideBoxContent = function() {
        // La méthode JQuery parents() traverse l'ensemble des ancêtres.
        // La méthode JQuery children() ne descend que d'un seul niveau dans la hiérarchie.

        // On vérifie si le prochain div est visible, pour mettre à jour le title ainsi que le texte alternatif à l'icône.
        orion.box.defineToggleTexts($(this));

        // On sélectionne les 2 div enfants du contenu :
        // - le premier correspond au contenu global, affiché par défaut, 
        // - le second correspond au résumé, masqué par défaut. 
        // --> On inverse l'affichage de ces 2 div, en masquant celui qui est affiché et en affichant celui qui est masqué.
        var boxElem = $(this).parents("*[data-o-role='box']");
        var boxBodyElem = boxElem.first().find("*[data-o-role='box-body']").first();
        var boxContentElem = boxBodyElem.children('*[data-o-role="box-content"]');
        var icon = boxElem.first().find("*[data-o-role='box-header-icon']").first().children();
        // test est-ce que le header de la box contient une icone
        if (icon.length === 1){
            boxContentElem.toggleClass("show hide");

            var isVisible = boxContentElem.hasClass("show");
            var mustRemember = boxElem.attr("data-o-remember");
            if (mustRemember === "true") {
                orion.box.saveBoxState(boxElem, !isVisible);
            }

            boxBodyElem.children('*[data-o-role="box-alt-content"]').toggleClass("show hide");

            // On modifie l'icône associée
            icon.toggleClass("fa-chevron-up fa-chevron-down");
            if(isVisible) {
                icon.attr("title", orion.box.regional["orion.box.hideBoxContent"]);
            } else {
                icon.attr("title", orion.box.regional["orion.box.showBoxContent"]);
            }
            orion.event.fireEvent(orion.event.BOX_TOGGLED);
        }
    };

    /**
     * Définit le texte affiché sur l'icône permettant de plier/déplier l'en-tête.
     * 
     * @param elem l'évènement qui a déclenché l'appel à la fonction --> la balise "i icon-Xxx".
     */
    this.defineToggleTexts = function(elem) {
        // La méthode JQuery parents() traverse l'ensemble des ancêtres.
        // La méthode JQuery children() ne descend que d'un seul niveau dans la hiérarchie.

        // On vérifie si le prochain div est visible, pour déterminer si le contenu de la box est affiché.
        if (elem.parents("*[data-o-role='box']").first()
                .find("*[data-o-role='box-content']").first().is(":visible")) {
            elem.attr("title", orion.box.regional["orion.box.showBoxContent"]);
            // On modifie le texte alternatif affiché pour l'accessibilité
            elem.children(".o-invisible").text(orion.box.regional["orion.box.showBoxContent"]);
        } else {
            elem.attr("title", orion.box.regional["orion.box.hideBoxContent"]);
            // On modifie le texte alternatif affiché pour l'accessibilité
            elem.children(".o-invisible").text(orion.box.regional["orion.box.hideBoxContent"]);
        }
    };

    /**
     * Enregistre le fait que la box est masquée.
     */
    this.saveBoxState = function(element, state) {
        var currentStorageKey = orion.box.getLocalStorageKey(element);
        orion.storeInLocalStorage(currentStorageKey, state);

    };

    /**
     * Récupère la clef permettant de stocker/récupérer l'état (affiché/masqué) de la box.
     * 
     * @returns {String} la clef de stockage permettant d'identifier la box .
     */
    this.getLocalStorageKey = function(boxElem) {
        var boxId = boxElem.attr("id");
        var currentStorageKey = 'box_' + boxId + "_hidden";
        return currentStorageKey;
    };

    /**
     * Récupère l'état, affiché ou masqué du boxbody.
     * 
     * @return true si le boxbody est masqué.
     */
    this.isBoxHiddenInLocalStorage = function(boxElem) {
        var currentStorageKey = orion.box.getLocalStorageKey(boxElem);
        var isHidden = orion.getFromLocalStorage(currentStorageKey);

        // Le stockage dans le local n'est pas fait au format booléen mais au format string.
        if (isHidden === "true") {
            return true;
        } else if (isHidden === "false") {
            return false;
        }

        return null;
    };

}

orion.box = new Box();

// liste des événements du composant
orion.event.BOX_TOGGLED = "orion.box.toggled";
orion.event.listenToBoxToggled = function(handler) {
    orion.event.listenTo(orion.event.BOX_TOGGLED, handler);
};

$(document).ready(function() {
    orion.box.initialize();
});