jQuery( document ).ready(function($) {
    $(".measure-wrapper .measure-title").click(function() {
        $(this).next(".measure-content").slideToggle(500, "swing");
    })




    /** Filtrage des propositions **/

    // Au clic sur un des titres des catégories : on crée le div de filtre correspondnt (avec le slug en attr "statut") et on trigger l'event filtre
    $(".home-graph-item .status-title").click(function(){
        var stat = $(this).attr("status");

        // on conditionne l'action au fait que le filtre ne soit pas déjà actif
        if ( $("div.filters-container .filter-" + stat).length === 0) {
            var htmlFilter = "<div class='measure-filter filter-" + stat +"' status='" + stat + "'><p class='name'>"+ $(this).text() + "</p><div class='filter-close'>+</div></div>";
            $("div.filters-container").append(htmlFilter);
            $("div.filters-container").trigger("filters-change");
        }
    }
    );

    // Au clic sur une croix d'un filtre on supprime le div concerné et on trigger l'event filtre
    $("body").on("click", "div.filters-container .filter-close",  function (){
        $(this).closest('.measure-filter').remove();

        $("div.filters-container").trigger("filters-change");
        console.log($("div.filters-container").length);
    });



    // Event filtre : on récupère les slugs des catégories présente dans la div des filtres, et on masque tous les autres. Si il n'y a aucun filtre on affiche tout.
    $("div.filters-container").on("filters-change", function() {
        // d'abord on remasque tout
        $(".measure-wrapper").hide();
        $(".measure-wrapper + hr").hide();
        // si aucun filtre on affiche tout
        if (!$.trim($("div.filters-container").html() )) {
            $(".measure-wrapper").show();
            $(".measure-wrapper + hr").show();
        }

        //sinon on parcourt les filtres et on affiche les éléments correspondants
        else {

            $("div.filters-container > .measure-filter").each(function () {
                var stat = $(this).attr("status");
                $(".measure-wrapper.measure-"+ stat).show();
                $(".measure-wrapper.measure-"+ stat + " + hr").show();
            })
        }
    });

});