$(document).ready(function() {
    
    // First load :
    $('[data-avatar-category="05"]').addClass('actif').removeClass('lien').siblings().addClass('lien').removeClass('actif');
    $('#categorie05').show().siblings().hide();
        
    // On click
    $('[data-avatar-category]').click(function(){
        $(this).addClass('actif').removeClass('lien').siblings().addClass('lien').removeClass('actif');
        var category_id = $(this).attr('data-avatar-category');
        $('#categorie'+category_id).show().siblings().hide();
        
    })
});


function avatarCategorie(selection){
	var i = 0;
	while (i <= 65) {
		if (i != selection) {
			if (document.getElementById('categorie' + i)) {document.getElementById('categorie' + i).style.display='none';}
			if (document.getElementById('avatarLien' + i)) {document.getElementById('avatarLien' + i).className="lien";}

		}
		i = i+5;;
	}
	document.getElementById('categorie' + selection).style.display='block';
	document.getElementById('avatarLien' + selection).className="actif";
	document.getElementById('dossierCouleur').value=selection;
        if(selection == 50) {
            $('#gardeRobeMenuSubTop').slideDown();
        }
        else {
            $('#gardeRobeMenuSubTop').slideUp();
        }
}

String.prototype.filename=function(extension){
    var s= this.replace(/\\/g, '/');
    s= s.substring(s.lastIndexOf('/')+ 1);
    return extension? s.replace(/[?#].+$/, ''): s.split('.')[0];
}

function changeSkin(skinId) {
    
    // On génère l'extension de skin à partir de l'ID demandé
    if(skinId == '3') skinExtension = '';
    else if(skinId == '3b') skinExtension = 'b';
    else if(skinId == '3c') skinExtension = 'c';
    
    
    // On modifie si nécessaire toutes les parties de l'avatar :
    var categories = [20,25,30,35,40,45];

    for (var id in categories) {
        // On retrouve l'URL de l'article original (sans l'extension .gif et sans le supplément 'b' ou 'c' en fonction de la peau)
        var originalArticlePath = $('#calque' + categories[id]).attr('src').slice(0, -4);            
        var lastChar = originalArticlePath.substring(originalArticlePath.length - 1, originalArticlePath.length);
        if(lastChar == 'b' || lastChar == 'c') {
            originalArticlePath = originalArticlePath.slice(0,-1);
        }
        
        // On créé la nouvelle URL vers l'article (avec peau si nécessaire)
        var newArticlePath = originalArticlePath + skinExtension + '.gif';
        
        // On actualise l'URL de l'image
        $('#calque' + categories[id]).attr('src',newArticlePath);

    }


}
            
function avatarApercu(dossierId,dossierNom,ressourceNumero,commerce,tendance) {
    //----------------------
    // Initialisation
    //----------------------
    
    var img = new Image();
    var calqueId = dossierId;   
    var corps = $('#calque05').attr('src').split('/');
        corps = corps[corps.length-1].split('.')[0];
        
    //----------------------
    // Stockage
    //----------------------
    if (commerce != 1) {
        /* Changement de calque pour le maquillage */
        if(dossierNom == 'maquillage')
            calqueId = $('#subMenuMaquillage .subChoiceSelected').attr('data-layer-id');

        /* Changement de l'input */
        $('#fieldCalque' + calqueId).val(ressourceNumero);
    }
 
    //----------------------
    // Peau
    //----------------------
    
    // Corps
    if(dossierId == 5) {
        changeSkin(ressourceNumero);
    }
    // Haut, Visage, Bouche, Nez, Sourcils
    else if(dossierId >= 20 && dossierId <= 45) { 
        if(corps == '3b') {ressourceNumero += 'b';}
        else if(corps == '3c') {ressourceNumero += 'c';}
    }
    
    //----------------------
    // Changement d'image'
    //----------------------



    /*
     * Chambre des tendances
     */
    if (tendance == 1) {            
        if (dossierNom == 'cheveux') {
            img.src= '/temp/' + ressourceNumero + '_1.gif';
            document.getElementById('calque03').src = '/temp/' + ressourceNumero + '_2.gif';
        }
        else {
            img.src= '/temp/' + ressourceNumero + '.gif';
        }
    }
    /*
     * Hors-chambre des tendances
     */
    else {
        if (dossierNom == 'cheveux') {
            // On traite le calque de cheveux en arri�re-plan
            img.src= 'http://www.sailorfuku.com/static/images/avatar/' + dossierId + ' - ' + dossierNom + '/' + ressourceNumero + '_2.gif';
            if (document.getElementById('calque03'))   document.getElementById('calque03').src=img.src;         

            // On traite le calque de cheveux en premier plan
            img.src= 'http://www.sailorfuku.com/static/images/avatar/' + dossierId + ' - ' + dossierNom + '/' + ressourceNumero + '_1.gif';
        }
        // Hors-cheveux :
        else {
            img.src= 'http://www.sailorfuku.com/static/images/avatar/' + dossierId + ' - ' + dossierNom + '/' + ressourceNumero + '.gif';  
        }


    }

    /* Modification sur l'avatar */
    if((dossierNom == 'haut' || dossierNom == 'bas') && ressourceNumero > 1309129200)  {
        $('#calque' + calqueId).addClass('layer-width-250');
        if($('#calque05').attr('src').filename() != '3b' && $('#calque05').attr('src').filename() != '3c') {
            $('#calque05').attr('src','http://www.sailorfuku.com/static/images/avatar/05 - corps/3.gif');
        }
    }
    else if((dossierNom == 'haut' || dossierNom == 'bas') && ressourceNumero <= 1309129200)  {
        $('#calque' + calqueId).removeClass('layer-width-250');
        $('#calque05').attr('src','http://www.sailorfuku.com/static/images/avatar/05 - corps/1.gif');
    }
    
    if(dossierNom == 'cheveux' && ressourceNumero > 1310787000)  {
        $('#calque' + calqueId).addClass('layer-width-250');
        $('#calque03').addClass('layer-width-250');
    }
    else if(dossierNom == 'cheveux' && ressourceNumero <= 1310787000)  {        
        $('#calque' + calqueId).removeClass('layer-width-250');
        $('#calque03').removeClass('layer-width-250');
    }


    $('#calque' + calqueId).attr('src',img.src);

    

}