// Utilisation de jQuery
// Ce js sert à fair fonctionner le système d'onglets
            

// Cette fonction fait un simple "hide" sur un élément ayant un id passé en argument
function montrerContenuOnglet(local_id){                
    // On cache les div que l'on ne souhaite pas voir apparaître
    var contenuOnglet;
    for(i=1 ; i<=9 ; i++){
        contenuOnglet = document.getElementById('contenuOnglet'+i);
        if(contenuOnglet!=null && i!=local_id){
            $(contenuOnglet).hide();
        }
    }
                                   
    // On fait apparaître le bon avec "show"
    $('#contenuOnglet'+local_id).show();
    changerClassOnglets(local_id);
}


// Cette fonction gère la sélection des onglets, via l'ajout et la suppression de la classe "selected"
function changerClassOnglets(local_id){
    for(i=1 ; i<=9 ; i++){
        monOnglet = document.getElementById('onglet'+i);
        if(monOnglet!=null && i!=local_id){
            $(monOnglet).removeClass('selected');
        }else{
            $(monOnglet).addClass('selected');
        }
    }
}


// Fonction principal
$(document).ready(function(event){
     
    // Lorsque l'on clique sur un onglet :
    $('ul.tab_onglets > li').click(function(event){
        
        // Récupération de l'id de l'onglet cliqué (actif)
        var expressionReguliere = /onglet(\d+)/;
        var ongletId = $(this).find('a').attr('id');
        var res = expressionReguliere.exec(ongletId);
        
        montrerContenuOnglet(res[1]);
    	// Mettre le focus sur le premier élément de l'onglet actif
    	// Dans notre cas un h2 ayant une ancre #titre+id
        $('#titre'+ongletId).focus();
    });
    
});
