var VERNIS_NORMAL = 1;
var VERNIS_MAT = 2;
var VERNIS_HUILE = 3;
var VERNIS_SATINE = 4;
var BRUT = 5;

function in_array(arr, value) {
    for(var indice in arr)
        if(arr[indice] == value)
            return true;
    return false;
}

function is_array(input){
    return typeof(input)=='object'&&(input instanceof Array);
}

function Feature(dimensionP,epaisseurP,vernisP){
    this.dimension = dimensionP;
    this.epaisseur = epaisseurP;
    this.vernis = vernisP;
}

function Essence(nameP, pathP, features){
    this.name = nameP;
    this.path = pathP;
    this.listFeature = features;
}

function Type(nameP, essencesP){
    this.name = nameP;
    this.listEssence = essencesP;
}

function Teinte(nameP, pathP){
    this.name = nameP;
    this.path = pathP;
}

function GroupeTeinte(nameP,listTeinteP){
    this.name = nameP;
    this.listTeinte = listTeinteP;
}


function displayGammeNuancier(){
    var parent = document.getElementById('nuancier');
    var h5 = null
    var divItem = null;
    var divItemTitre = null;
    var divStopClear = null;
    var divItemPhoto = null;
    var divItemPhotoImg = null;
    for(var type in listType){
        h5 = document.createElement('h5');
        h5.appendChild(document.createTextNode(listType[type].name));
        parent.appendChild(h5);
        
        for(var essence in listType[type].listEssence){
            divItem = document.createElement('div');
            divItem.className = 'nuancier_item';
            divItem._id = type+'-'+essence;
            divItem.onclick = function(){
                loadFeature(this._id);
            }

            divItemPhotoImg = document.createElement('img');
            divItemPhotoImg.alt='';
            divItemPhotoImg.src='resource/pict/gamme/essence/'+listType[type].listEssence[essence].path;

            divItemPhoto = document.createElement('div');
            divItemPhoto.className = 'nuancier_item_photo';

            divItemTitre = document.createElement('div');
            divItemTitre.className = 'nuancier_item_titre';
            divItemTitre.appendChild(document.createTextNode(listType[type].listEssence[essence].name));
            
            divStopClear = document.createElement('div');
            divStopClear.className = 'stopClear';

            divItemPhoto.appendChild(divItemPhotoImg);

            divItem.appendChild(divItemPhoto);
            divItem.appendChild(divItemTitre);
            divItem.appendChild(divStopClear);
            parent.appendChild(divItem);
        }
    }
}

function displayListTeinte(){
    var parent = document.getElementById('nuancier');
    var h5 = null
    var divItem = null;
    var divItemTitre = null;
    var divStopClear = null;
    var divItemPhoto = null;
    var divItemPhotoImg = null;

    h5 = document.createElement('h5');
    h5.appendChild(document.createTextNode(groupeTeinte.name));
    parent.appendChild(h5);

    for(var teinte in groupeTeinte.listTeinte){
        divItem = document.createElement('div');
        divItem.className = 'nuancier_item';

        divItemPhotoImg = document.createElement('img');
        divItemPhotoImg.alt='';
        divItemPhotoImg.src='resource/pict/gamme/teinte/'+groupeTeinte.listTeinte[teinte].path;

        divItemPhoto = document.createElement('div');
        divItemPhoto.className = 'nuancier_item_photo';

        divItemTitre = document.createElement('div');
        divItemTitre.className = 'nuancier_item_titre';
        divItemTitre.appendChild(document.createTextNode(groupeTeinte.listTeinte[teinte].name));

        divStopClear = document.createElement('div');
        divStopClear.className = 'stopClear';

        divItemPhoto.appendChild(divItemPhotoImg);

        divItem.appendChild(divItemPhoto);
        divItem.appendChild(divItemTitre);
        divItem.appendChild(divStopClear);
        parent.appendChild(divItem);
    }

}

function displayListTeinte2(){
    var parent = document.getElementById('nuancier2');
    var h5 = null
    var divItem = null;
    var divItemTitre = null;
    var divStopClear = null;
    var divItemPhoto = null;
    var divItemPhotoImg = null;

    h5 = document.createElement('h5');
    h5.appendChild(document.createTextNode(groupeTeinte2.name));
    parent.appendChild(h5);

    for(var teinte in groupeTeinte2.listTeinte){
        divItem = document.createElement('div');
        divItem.className = 'nuancier_item';

        divItemPhotoImg = document.createElement('img');
        divItemPhotoImg.alt='';
        divItemPhotoImg.src='resource/pict/gamme/teinte/'+groupeTeinte2.listTeinte[teinte].path;

        divItemPhoto = document.createElement('div');
        divItemPhoto.className = 'nuancier_item_photo';

        divItemTitre = document.createElement('div');
        divItemTitre.className = 'nuancier_item_titre';
        divItemTitre.appendChild(document.createTextNode(groupeTeinte2.listTeinte[teinte].name));

        divStopClear = document.createElement('div');
        divStopClear.className = 'stopClear';

        divItemPhoto.appendChild(divItemPhotoImg);

        divItem.appendChild(divItemPhoto);
        divItem.appendChild(divItemTitre);
        divItem.appendChild(divStopClear);
        parent.appendChild(divItem);
    }

}


function loadFeature(id){
    if(document.getElementById('gamme_img_presentation').style.display != 'none')
       document.getElementById('gamme_img_presentation').style.display = 'none';


    var arrayArg = id.split('-');

    var parent = document.getElementById('detail_essence');
    parent.innerHTML = '';

    //Bloc
    var divEssenceFeature = document.createElement('div');
    divEssenceFeature.id = 'gamme_essence_feature';

    //Titre
    var divEssenceFeatureTitre = document.createElement('div');
    divEssenceFeatureTitre.id='gamme_essence_feature_titre';
    divEssenceFeatureTitre.appendChild(document.createTextNode(listType[arrayArg[0]].name+' '+listType[arrayArg[0]].listEssence[arrayArg[1]].name));
    divEssenceFeature.appendChild(divEssenceFeatureTitre);

    //Photo
    var divGammeEssencePhotoImg = document.createElement('img');
    divGammeEssencePhotoImg.src = 'resource/pict/gamme/essence/'+listType[arrayArg[0]].listEssence[arrayArg[1]].path;
    var divGammeEssencePhoto = document.createElement('div');
    divGammeEssencePhoto.id = 'gamme_essence_feature_detail_photo';
    divGammeEssencePhoto.appendChild(divGammeEssencePhotoImg);
    divEssenceFeature.appendChild(divGammeEssencePhoto);



    var currentFeature = null;
    var divFeatureItem = null;
    var divFeatureItemText = null;
    var divFeatureItemFinition = null;
    for(feature in listType[arrayArg[0]].listEssence[arrayArg[1]].listFeature){
        currentFeature = listType[arrayArg[0]].listEssence[arrayArg[1]].listFeature[feature];

        divFeatureItem = document.createElement('div');
        divFeatureItem.className = 'gamme_essence_feature_item';

        divFeatureItemText = document.createElement('div');
        divFeatureItemText.id ='gamme_essence_feature_item_text';

        var divDimension = document.createElement('div');
        var divDimensionLabel = document.createElement('span');
        divDimensionLabel.className = 'gamme_essence_feature_detail_titre';
        divDimensionLabel.appendChild(document.createTextNode('Dimensions: '));
        divDimension.appendChild(divDimensionLabel);
        divDimension.appendChild(document.createTextNode(currentFeature.dimension));

        var divEpaisseur = document.createElement('div');
        var divEpaisseurLabel = document.createElement('span');
        divEpaisseurLabel.className = 'gamme_essence_feature_detail_titre';
        divEpaisseurLabel.appendChild(document.createTextNode('Epaisseur: '));
        divEpaisseur.appendChild(divEpaisseurLabel);
        divEpaisseur.appendChild(document.createTextNode(currentFeature.epaisseur));

        /*var divSupport = document.createElement('div');
        var divSupportLabel = document.createElement('span');
        divSupportLabel.className = 'gamme_essence_feature_detail_titre';
        divSupportLabel.appendChild(document.createTextNode('Support: '));
        divSupport.appendChild(divSupportLabel);
        divSupport.appendChild(document.createTextNode(currentFeature.support));*/

        divFeatureItemText.appendChild(divDimension);
        divFeatureItemText.appendChild(divEpaisseur);
        //divFeatureItemText.appendChild(divSupport);
        divFeatureItem.appendChild(divFeatureItemText);
        

        //Finition
        divFeatureItemFinition = document.createElement('div');
        divFeatureItemFinition.id='gamme_essence_feature_item_vernis';

            //Finition texte
            /*var divFeatureItemFinitionText = document.createElement('div');
            divFeatureItemFinitionText.className='gamme_essence_feature_detail_titre';
            divFeatureItemFinitionText.appendChild(document.createTextNode('Finitions'));*/

            //Finition pictures
                var imgBrut = document.createElement('img');
				imgBrut.src= (currentFeature.vernis==BRUT || (is_array(currentFeature.vernis) && in_array(currentFeature.vernis,BRUT)))? 'resource/pict/gamme/picto/brut.jpg':'resource/pict/gamme/picto/brut_off.jpg';
				imgBrut.alt='brut';
				imgBrut.title = 'Brut'; 
				
                var imgVerniNormal = document.createElement('img');
                imgVerniNormal.src= (currentFeature.vernis==VERNIS_NORMAL || (is_array(currentFeature.vernis) && in_array(currentFeature.vernis,VERNIS_NORMAL)))? 'resource/pict/gamme/picto/vernisbrillant.jpg':'resource/pict/gamme/picto/vernisbrillant_off.jpg';
                imgVerniNormal.alt='vernis';
                imgVerniNormal.title = 'Vernis';

                var imgVerniMat = document.createElement('img');
                imgVerniMat.src= (currentFeature.vernis==VERNIS_MAT || (is_array(currentFeature.vernis) && in_array(currentFeature.vernis,VERNIS_MAT)))? 'resource/pict/gamme/picto/vernismat.jpg':'resource/pict/gamme/picto/vernismat_off.jpg';
                imgVerniMat.alt='mat';
                imgVerniMat.title = 'Vernis mat';

                var imgVerniHuile = document.createElement('img');
                imgVerniHuile.src=(currentFeature.vernis==VERNIS_HUILE || (is_array(currentFeature.vernis) && in_array(currentFeature.vernis,VERNIS_HUILE)))?'resource/pict/gamme/picto/parqhuile.jpg':'resource/pict/gamme/picto/parqhuile_off.jpg';
                imgVerniHuile.alt= 'huile';
                imgVerniHuile.title = 'Huilé';

                /*
                var imgVerniS = document.createElement('img');
                imgVerniS.src='resource/pict/gamme/picto/vernissatine.jpg';
                imgVerniS.alt='verni';
                divFeatureItemFinition.appendChild(imgVerniS);
                */

            //divFeatureItemFinition.appendChild(divFeatureItemFinitionText);
            divFeatureItemFinition.appendChild(imgBrut);
            divFeatureItemFinition.appendChild(imgVerniNormal);
            divFeatureItemFinition.appendChild(imgVerniMat);
            divFeatureItemFinition.appendChild(imgVerniHuile);
            

        
        divFeatureItem.appendChild(divFeatureItemFinition);
        divEssenceFeature.appendChild(divFeatureItem);
    }

    //Stop flottant
    var divStopClear = document.createElement('div');
    divStopClear.className = 'stopClear';
    divEssenceFeature.appendChild(divStopClear);

    parent.appendChild(divEssenceFeature);
    
}
function display_gamme_img_presentation(){
    document.getElementById('detail_essence').innerHTML='';
    document.getElementById('gamme_img_presentation').style.display = 'block';
}