<?php
	header("Content-Type: application/javascript");
?>

// ---------------------------------------------------
// Si un élément est stocké, le surligner apres chargement new page
// ---------------------------------------------------
window.addEventListener('load', function () {
	debugLocal=0;
	const id=localStorage.getItem('selectedElementId');
	if (!id) return;

	const el=document.getElementById(id);
	if (el) {
		el.classList.add('element-selected');
		if (debugLocal==1) alert('classe element-selected ajoutée');
	}
});

// ---------------------------------------------------
// Si un élément est stocké, le retirer et enlever sa classe
// ---------------------------------------------------
function deselectElementAll () {
	document.querySelectorAll('.element-selected')
	.forEach(el => el.classList.remove('element-selected'));
	alert('fin deselect');
}

// ---------------------------------------------------
// Si un élément est stocké, le retirer et enlever sa classe
// ---------------------------------------------------
function deselectElement (element) {
	const storedId=localStorage.getItem('selectedElementId'); 	
	if (storedId) {
		const prevEl=document.getElementById(storedId);
		if (prevEl) {
			prevEl.classList.remove('element-selected');
		}
		localStorage.removeItem('selectedElementId');
	}
}

// ---------------------------------------------------
// Si clic sur menu contextuel, ajouter la class selected
// ---------------------------------------------------
function selectElement (element) {
	if(element) {
		element.classList.add('element-selected');
		// Sauvegarde l'élément sélectionné
		localStorage.setItem('selectedElementId', element.id);
	}
}

// ---------------------------------------------------
// Gérer la position
// ---------------------------------------------------
function gererPos (d,e) {
	var debugLocal=0;
	var leftPosition=0;
	var topPosition=0;

	// const menuWidth=d.offsetWidth;
	// const menuHeight=d.offsetHeight;

	const windowWidth=window.innerWidth;
	const windowHeight=window.innerHeight;

	menuWidth=290;
	menuHeight=60;
	// leftPosition=event.clientX;
	// topPosition=event.clientY;
	if (e && e.clientX) { leftPosition=e.clientX; } else if (e && e.pageX) { leftPosition=e.pageX; }

	// prise en compte scroll
	// leftPosition=e.pageX;
	// topPosition =e.pageY;
	if (e && e.pageY) { topPosition=e.pageY; } else if (e && e.clientY) { topPosition=e.clientY; }

	if (debugLocal == 1 ) alert ("X : " +leftPosition+ " Y : " +topPosition+ " menuWidth : " +menuWidth+ " windowWidth : " +windowWidth+ " menuHeight : " +menuHeight+ " windowHeight : " +windowHeight);
	
	// --------------------------------------
	// left position
	// --------------------------------------
	if (leftPosition !== null && leftPosition !== undefined) {
		if (leftPosition + menuWidth > windowWidth) {
			leftPosition=windowWidth - menuWidth ;
		}
		if (leftPosition < 10) leftPosition=menuWidth;
		d.style.left= leftPosition+ "px";
	}

	// --------------------------------------
	// top position
	// --------------------------------------
	if (topPosition !== null && topPosition !== undefined) {
		// const left=e.pageX; // clientX + scrollX
		// topPosition =e.pageY; // clientY + scrollY
		// if (topPosition + menuHeight > windowHeight) {
		//   topPosition=windowHeight - 30;
		// }
		if (topPosition < 10) {topPosition=menuHeight };
		d.style.top=(topPosition+20)+"px";
	}
	
	if (debugLocal == 1 ) alert ("X2 : " +leftPosition+ " Y2 : " +topPosition+ " menuWidth : " +menuWidth+ " windowWidth : " +windowWidth+ " menuHeight : " +menuHeight+ " windowHeight : " +windowHeight);
}

// ---------------------------------------------------
// Menus contextuels
// ---------------------------------------------------
document.addEventListener("contextmenu", function (event) {
	event.preventDefault(); // empêche le menu contextuel du navigateur
});

function resetMenuContextuel() {
    if (element.parentNode) {
        d.onclick = function(e) {
            element.parentNode.removeChild(d);
        };
    }

    document.body.onclick = function(e) {
        try {
            document.body.removeChild(d);
        } catch (err) {}
    };
}

// ---------------------------------------------------
// Styles + contenu
// ---------------------------------------------------
function mContextuel ( element, nomCss, sectionTxtNom, numTxt, event ) {

	// ---------------------------------------------------
	// element : l'item ou le menu apparait
	// nomCss : nom du style final
	// sectionTxtNom : tableau de langueNav ou famille de style -> pour contenu
	// numTxt : numero dans le tableau sectionTxtNom / N° de produit / categorie ou s.categorie. 

	// On déduit :
	// ==> textesAffSection (integer) sera determiné aussi par sous_menu_mapping dans agencement en fonction du N° de sous-menu
	// ==> voletCss sera determiné aussi par agencement en fonction du nom du style
	// ==> les N° menus, previewObject, agencementOnglet...
	// car on ne les a pas dans les fonctionsGene, et ici on veut une fonction le plus générique possible, donc on peut pas d'appels en dur spécifique
	// ---------------------------------------------------
	
	debugLocal=0;
	if (debugLocal==1) alert('mContextuel : param reçus => element=' +element.id+ '  |  nomCss=' +nomCss+ '  |  sectionTxtNom=' +sectionTxtNom+ '  |  numTxt=' +numTxt);

	// ---------------------------------------------------
	// Ne pas ouvrir plusieurs à la fois si parents
	// ---------------------------------------------------
	if (event) {
		event.stopPropagation(); // ← Arrête la propagation vers les parents
		event.preventDefault(); // ← Optionnel : bloque le menu natif
	}

	// ---------------------------------------------------
	// Ne supporte pas les #
	// ---------------------------------------------------
	if (nomCss.substr(0,1 )=="#") {nomCss=nomCss.substr(1, nomCss.length); }
	if (debugLocal==2) alert("nomCss sans #=" + nomCss);

	// ---------------------------------------------------
	// Créer le menu
	// ---------------------------------------------------
	var d=document.createElement('div');
	d.setAttribute('class', 'mContextMenu');
	d.setAttribute('id', 'menuContextuel');
	element.style.border="2px dashed purple";
	element.style.zIndex=102; 
	if(element.parentNode) element.parentNode.style.zIndex=101; 

	// ---------------------------------------------------
	// Supprimer le menu contextuel on click body ou lui même
	// ---------------------------------------------------
	if(element.parentNode) d.onclick=function(e) { element.parentNode.removeChild(d); }
	document.body.onclick=function(e) { try{ element.parentNode.removeChild(d); } finally{} }

	// ---------------------------------------------------
	// Gérer la position
	// ---------------------------------------------------	
	gererPos(d, event);

	// ---------------------------------------------------
	// Gérer les parametres d'appel complémentaires par defaut
	// ---------------------------------------------------
	numeroMenuPrpal=0;
	numeroSousMenu=1;
	previewObject=0;
	isEspace=0;
	agencementOnglet=2;
	action='';
	textesAffSection=1;
	theNumCss=0;
	theVoletCss='';
	idLanguenav='';

	// ---------------------------------------------------
	// Créer le sous menu contenu
	// ---------------------------------------------------	
	var p10=document.createElement('p');
	d.appendChild(p10);
	p10.setAttribute('class', 'mContextItem');

	//libellé par defaut
	p10.innerHTML="Modifier le texte";

	// ---------------------------------------------------
	// Déduire les param manquants
	// ---------------------------------------------------

	// On utilise sectionTxtNom pour definir les parametres d'appels, puis on utilisera le nom de style après si besoin de sous styles
	switch (sectionTxtNom) {

		//titre en img, titre en txt, logo
		case 'Eléments entête':
		case 'titre':
			theVoletCss="Eléments d'entête";
			textesAffSection=6;
			numeroMenuPrpal=0;
			break;

		case 'menu':
			//accueil
			if(numTxt==0 ) {
				numeroSousMenu=1;
				numeroMenuPrpal=0;
				// idLanguenav=79;
			}
			//catalogue
			else if(numTxt==1 || numTxt==2 || numTxt==3 || numTxt==4 || numTxt==5 || numTxt==28 || numTxt==30 || numTxt==35 ) {
				// if(numTxt==2) numeroSousMenu=10;
				// else if(numTxt==3) numeroSousMenu=11;
				// else 
				if(numTxt!=1) numeroSousMenu=numTxt;
				else { numeroSousMenu=0;}
				numeroMenuPrpal=1;
				idLanguenav=1;
			}
			//client
			else if(numTxt==6 || numTxt==7 || numTxt==8 || numTxt==9 || numTxt==10 || numTxt==11 ) {
				if(numTxt!=6) numeroSousMenu=numTxt;
				else { numeroSousMenu=0;}
				numeroMenuPrpal=6;
				idLanguenav=298;
			}			
			//panier
			else if(numTxt==12 || numTxt==13 || numTxt==14 || numTxt==15 ) {
				if(numTxt!=12) numeroSousMenu=numTxt;	//mdepaie
				else numeroSousMenu=0;	//panier
				numeroMenuPrpal=12;	//espace panier
				idLanguenav=79;
			}
			//infos
			else if(numTxt==16 || numTxt==17 || numTxt==18 || numTxt==19 ) {
				numeroSousMenu=numTxt;//ksm
				numeroMenuPrpal=16;
				idLanguenav=85;
			}
			else {
				numeroMenuPrpal=0;
				numeroSousMenu=101;
			}

			if(numTxt==0 || numTxt==1 || numTxt==6 || numTxt==12 || numTxt==16) { isEspace =1; agencementOnglet=1; }
			else { isEspace =0; agencementOnglet=2 }
			
			//il faut mettre le volet que si menu deroulant pas dans les pages
			if(nomCss!='titresInfos' && nomCss!='panierTitre' && nomCss !='titresCli' && nomCss !='titresCat' && nomCss !='connTitre' ) theVoletCss="Menu déroulant";
			textesAffSection=5; //menu
			break;

		case 'Catalogue':
		case 'catalogue':
		case 'catalog':
			theVoletCss="Catalogue"; // pour produits / gondoles, sinon sera chargé en menu familles
			textesAffSection=1;
			numeroMenuPrpal=1;
			numeroSousMenu=1;
			break;

		case 'client':
			theVoletCss="Clients";
			textesAffSection=3;
			numeroMenuPrpal=6;
			numeroSousMenu=7;//par defaut connection
			break;

		case 'nav':
			theVoletCss="Connexion";
			textesAffSection=2;
			numeroMenuPrpal=6;
			numeroSousMenu=7;	
			break;

		case 'panier':
			theVoletCss="Panier";
			textesAffSection=4;
			numeroSousMenu=13;
			numeroMenuPrpal=12;

		case 'cde':
			theVoletCss="Commandes";
			textesAffSection=4;
			numeroSousMenu=13;
			numeroMenuPrpal=12;
			break;

		case 'contact':					
			theVoletCss="Informations";
			if(numTxt > 0 && numTxt < 17) { numeroSousMenu=17; }//ksn en dessous de 61 ( au dessus = infos de banque)
			if(numTxt==61) { 	numeroSousMenu=18; }//contact-->utilise des chams client (mauvaise pratique...), titre=celui de menu. 61 seul champ de contact utilisé
			if(numTxt==0) { 	numeroSousMenu=19; }//cdv-->sont dans pages pas dans languenav, titre=celui de menu. 0 ne cooresponds pas c'est un flag pour aller sur pages
			numeroMenuPrpal=16;
			p10.innerHTML="Modifier le texte";
			break;

		case 'bouton':
			textesAffSection=10;
			break;

		// case 'transverse':
		// 	numeroMenuPrpal=40;
		// 	break;
	}

	// debugLocal=0;
	if (debugLocal==2) alert('Fin switch sectionTxtNom');
	

	// ici on utilise nomCss pour les param qui sont unitaires
	switch (nomCss) {

		case 'body':
		case 'bodyImg':
			theNumCss=0;
			p10.innerHTML="Modifier le corps de page";
			break;

		// Entête - logo -> modale
		case 'logo':
			theVoletCss="Eléments d'entête";
			theNumCss=0;
			numeroSousMenu=102;
			p10.innerHTML="Modifier le logo";
			// d.style.left='60px';
			// d.style.top='34px';
			break;

		// Entête titre Img -> en modale
		case 'eCol2':
			theVoletCss="Structure d'entête";
			nomCss='eCol2';
			theNumCss=1;
			textesAffSection=6;
			numeroSousMenu=103;
			p10.innerHTML="Modifier le titre";
			break;

		// Entête titre en Txt 
		case 'imgTitre':
			theVoletCss="Eléments d'entête";
			theNumCss=10;
			textesAffSection=6;
			numeroSousMenu=103;
			p10.innerHTML="Modifier le titre";
			break;

		// Entête conteneur musique -< modale
		case 'player':
			theVoletCss="Eléments d'entête";
			theNumCss=4;
			numeroMenuPrpal=0; //site
			numeroSousMenu=106; // musique
			p10.innerHTML="Modifier la musique";
			break;

		// Entête - langue -> modale / le txt est menu
		case 'drapeaux':
			theVoletCss="Eléments d'entête";
			numeroSousMenu=107;
			p10.innerHTML="Modifier les langues";
			d.style.width= '250px';
			break;

		// Entête - bannière -> modale
		case 'bandeauImg':
			theVoletCss="Eléments d'entête";
			theNumCss=9;
			numeroSousMenu=104;
			p10.innerHTML="Modifier l'image bannière";
			break;

		// --------------------------------------------------
		// Menu déroulant
		// --------------------------------------------------			
		case 'menuDeroulantItem':
			theNumCss=1;
			p10.innerHTML="Modifier le menu";
			break;

		case 'textePpauxMenuDeroulant':
			theNumCss=2;
			agencementOnglet=1;
			if(numTxt==0 || numTxt==1 || numTxt==6 || numTxt==12 || numTxt==16) { p10.innerHTML="Modifier l'espace"; }
			else p10.innerHTML="Modifier le menu";
			break;

		case 'iconesPpauxMenuDeroulant':
			theNumCss=3;
			p10.innerHTML="Modifier l'icône";
			break;

		case 'sousMenuTexte':
			theNumCss=10;
			p10.innerHTML="Modifier le sous menu";
			break;

		// --------------------------------------------------
		// Catalogue
		// --------------------------------------------------
		case 'rechBarre-container':
			theVoletCss="Barre rechercher";
			theNumCss=0;
			numeroSousMenu=5;
			// p10.innerHTML="Modifier la barre de recherche";
			break;

		case 'rechItem':
		case 'rechInput':
		case 'rechBtn':
			theVoletCss="Barre rechercher";
			theNumCss=2;	
			numeroSousMenu=5;
			// p10.innerHTML="Modifier la zone de recherche";
			break;

		case 'affRes':
			theNumCss=19;
			break;

		// Barre des promos : txt:menus, style:boutons
		// itemBarrePromo n'est jamais appelé car il est conteneur dans fonction gene : voir after pour ajoputer MC dans ce cas mais risque usne agaz	
		case 'itemBarrePromo':
			theVoletCss="Barre des promos";
			theNumCss=1;
			numeroMenuPrpal=1;
			numeroSousMenu=2;
			break;

		case 'iconeBarrePromo':
			theVoletCss="Barre des promos";
			theNumCss=3;
			textesAffSection=5;
			numeroMenuPrpal=1;
			numeroSousMenu=2;
			p10.innerHTML="Modifier l'icône";
			break;

		case 'txtBarrePromo':
			theVoletCss="Barre des promos";
			theNumCss=2;
			textesAffSection=5;
			numeroMenuPrpal=1;
			numeroSousMenu=2;
			p10.innerHTML="Modifier le bouton";
			break;

		// Catégories
		case 'familles-libelle':
			theVoletCss="Menu familles";
			theNumCss=3;
			p10.innerHTML="Modifier la catégorie";
			break;		
		
		case 'familles-img':
			theVoletCss="Menu familles";
			theNumCss=4;
			p10.innerHTML="Modifier la catégorie";
			break;	

		case 'categoriesItems':
			theVoletCss="Menu catégories";
			theNumCss=3;
			p10.innerHTML="Modifier la sous-catégorie";
			break;

		case 'categoriesImages':
			theVoletCss="Menu catégories";
			theNumCss=4;
			p10.innerHTML="Modifier la sous-catégorie";
			break;

		// Produits
		case 'titresPrd':
			theNumCss=4;
			p10.innerHTML="Modifier le produit";
			break;

		case 'catalogueImgPrd':
			theNumCss=5;
			p10.innerHTML="Modifier le produit";
			break;

		case 'descProduits':
			theNumCss=6;
			p10.innerHTML="Modifier le produit";
			break;

		case 'prix':
			theNumCss=12;
			break;

		case 'libCatalogueCell':
			theNumCss=8;
			p10.innerHTML="Modifier le produit";
			break;
		case 'libCatalogueCell':
			theNumCss=9;
			p10.innerHTML="Modifier le produit";
			break;

		case 'champsCatalogueCell':
			theNumCss=10;
			p10.innerHTML="Modifier le produit";
			break;

		case 'champsCatalogue':
			theNumCss=11;
			p10.innerHTML="Modifier le produit";
			break;


		// --------------------------------------------------
		// Nav
		// --------------------------------------------------
		// les champs clients mails et pwd sont issus de client, et le css de connexion ( une mauvaise économie de l'époque...)

		case 'connTitre':
			theVoletCss="Connexion";
			theNumCss=1; 
			break;

		case 'messageConnect':
			theNumCss=2; 
			break;		

		case 'libConnCell':
			theNumCss=5; 
			break;

		case 'libConn':
			theNumCss=6; //email
			break;

		case 'champsConnCell':
			theNumCss=7; //pwd
			break;

		case 'champsConn': theNumCss=8; //pwd
			break;

		// --------------------------------------------------
		// Clients
		// --------------------------------------------------
		case 'titresCli':
			theVoletCss="Clients";
			theNumCss=1;
			break;
		case 'libClientsCell':
			theNumCss=2;
			numeroSousMenu=11;//inscription
			break;
		case 'libClients':
			theNumCss=3;
			numeroSousMenu=11;//inscription
			break;
		case 'champsCliCell':
			theNumCss=4;
			numeroSousMenu=11;//inscription
			break;
		case 'champsCli':
			theNumCss=5;
			numeroSousMenu=11;//inscription
			break;
		case 'msgCli':
			theNumCss=6;
			numeroSousMenu=11;//inscription
			break;
		case 'listeDeroulanteCli':
			theNumCss=7;
			if(numTxt==89 || numTxt==90) numeroSousMenu=9;//modifier mon compte
			else { numeroSousMenu=11; }//inscription
			if(numTxt==89) p10.innerHTML="Modifier les modes de livraison";
			if(numTxt==90) p10.innerHTML="Modifier les moyens de paiement";	
			numeroMenuPrpal=6; //client
			break;
		case 'cliLignes':
			theNumCss=8;
			numeroSousMenu=11;//inscription
			break;
		case 'detailsOnglets':
			theNumCss=9;
			numeroSousMenu=11;//inscription
			break;
		case 'detailsOnglets li':
			theNumCss=10;
			numeroSousMenu=11;//inscription
			break;
		case 'detailsOnglets li':
			theNumCss=10;
			numeroSousMenu=11;//inscription
			break;			
		// --------------------------------------------------
		// Panier
		// --------------------------------------------------			
		case 'panierTitre':
			theVoletCss='Panier';
			theNumCss=0;
			numeroMenuPrpal=12;
			if(numTxt==1) {numeroSousMenu=131;} //modif adresse fact le txt est sur client
			if(numTxt==2) {numeroSousMenu=132;} //modif adresse LIV le txt est sur client
			if(numTxt==13) {numeroSousMenu=13;} //panier
			if(numTxt==14) {numeroSousMenu=134; } //modePaie panier
			if(numTxt==15) {numeroSousMenu=133; } //modeLiv panier
			if(numTxt==30) {numeroSousMenu=135; } //recap
			// if(numTxt==82) {numeroSousMenu=13; } //panier affcde a tester...affcde est dans chaque etape
			break;

		case 'tablePanier':
			theVoletCss='Panier';
			theNumCss=1;
			if(numTxt==0) {numeroSousMenu=13;} 
			break;

		case 'libPanier':
			theVoletCss='Panier';
			theNumCss=5;
			break;

		case 'champsPanierCell':
			theVoletCss='Panier';
			theNumCss=6;
			p10.innerHTML="Modifier le produit";
			break;

		case 'champsPanier':
			theVoletCss='Panier';
			theNumCss=7;
			if(sectionTxtNom=='cde' && numTxt==4) { //mode paie- cheq- infos 
				numeroSousMenu=13;
				p10.innerHTML="Modifier les options du produit";
			}			
			else if(sectionTxtNom=='contact') { //mode paie- cheq- infos 
				numeroSousMenu=134;
				p10.innerHTML="Modifier les informations commerçant";
				}
			else p10.innerHTML="Modifier le produit";
			break;

		case 'itemPanier': //utilisé dans commandes donc forcer le volet ici
			if(numTxt==38 || numTxt==19) numeroSousMenu=133;//mode liv
			else if(numTxt==68) numeroSousMenu=134;//mode paie
			else if(numTxt==21 || numTxt==23 || numTxt==32 || numTxt==33 || numTxt==31 ) numeroSousMenu=135;//recap
			else numeroSousMenu=13;			
			theVoletCss='Panier';
			theNumCss=9;
			p10.innerHTML="Modifier le produit";
			break;

		case 'msgPanier': //utilisé dans commandes donc forcer le volet ici
			if(numTxt==38 || numTxt==19) numeroSousMenu=133;//mode liv
			else if(numTxt==68) numeroSousMenu=134;//mode paie
			else if(numTxt==7 || numTxt==13 || numTxt==30 ) numeroSousMenu=135; // recap si pas connecté : boutons connexion et ouvrir compte
			else numeroSousMenu=13;
			theVoletCss='Panier';
			theNumCss=12;
			break;

		case 'panierConteneurItem':
			theVoletCss='Panier';
			theNumCss=14;
			textesAffSection=4;
			numeroMenuPrpal=12; //Panier espace
			if(sectionTxtNom=='liv') {
				numeroSousMenu=133;
				p10.innerHTML="Modifier les modes de livraison";
			}
			else {
				numeroSousMenu=134;
				p10.innerHTML="Modifier les moyens de paiement";
			}
			break;
		
		case 'blocItemPanier':
			theVoletCss='Panier';
			theNumCss=15;
			break;

		// --------------------------------------------------
		// Etapes
		// --------------------------------------------------			
		case 'champEtapesTodo':
			theVoletCss="Étapes";
			theNumCss=3;
			textesAffSection=4;
			numeroSousMenu=13;//panier
			numeroMenuPrpal=12;//espace commandes
			break;

		case 'champEtapesDone':
			theVoletCss="Étapes";	
			theNumCss=3;
			textesAffSection=4;
			numeroSousMenu=13;//panier
			numeroMenuPrpal=12;//espace commandes
			break;

		// --------------------------------------------------
		// Informations : on a des styles et des champs transverses...c'est un peu le bazar ici...
		// --------------------------------------------------
		case 'titresInfos': // la section est menu et pas contact
			theVoletCss="Informations"
			theNumCss=0;
			numeroSousMenu=numTxt;//ksm
			numeroMenuPrpal=16;
			break;
		case 'tableInfos':
			theNumCss=1;
			break;
		case 'msgInfos'://ira dans le contenu
			theNumCss=2;
			agencementOnglet=4;
			previewObject=1;
			if (numTxt ==75) {p10.innerHTML="Modifier le contenu"; numeroMenuPrpal=12; numeroSousMenu=14; agencementOnglet=4; previewObject=1; }
			if (numTxt ==77) {p10.innerHTML="Modifier le contenu"; numeroMenuPrpal=12; numeroSousMenu=15; agencementOnglet=4; previewObject=1; }			
			p10.innerHTML="Modifier la page information";
			break;			
		case 'libInfosCell':
			theNumCss=3;
			if (numTxt > 0 && numTxt < 17) p10.innerHTML="Modifier les informations commerçant";
			break;	
		case 'libInfos':
			theNumCss=4;
			if (numTxt > 0 && numTxt < 17) p10.innerHTML="Modifier les informations commerçant";
			break;			
		case 'champsInfosCell':
			if (numTxt > 0 && numTxt < 17) p10.innerHTML="Modifier les informations commerçant";
			if (numTxt ==75) {p10.innerHTML="Modifier le contenu"; numeroMenuPrpal=12; numeroSousMenu=14; agencementOnglet=4; previewObject=1; }
			if (numTxt ==77) {p10.innerHTML="Modifier le contenu"; numeroMenuPrpal=12; numeroSousMenu=15; agencementOnglet=4; previewObject=1; }
			theNumCss=5;
			break;			
		case 'champsInfos':					
			theNumCss=6;
			if (numTxt > 0 && numTxt < 17) p10.innerHTML="Modifier les informations commerçant";
			break;
		case 'lignesInfos':					
			theNumCss=7;
			if (numTxt > 0 && numTxt < 17) p10.innerHTML="Modifier les informations commerçant";
			break;

		// --------------------------------------------------
		// transverse
		// --------------------------------------------------
		case 'tablePages': // normalement devrait que sur mConStyle, mais pour les pages infos, ce sont des contenus dynamiques, donc on n'aura pas la fonction géné pour mContetxtuel, donc on le mets ici pour pourvoir aller sut contenu/txt
			theVoletCss="Transverses site";
			theNumCss=1;			
			if (sectionTxtNom == 'contact') {
				if (numTxt > 0 && numTxt < 17) { numeroSousMenu=17; }//ksn en dessous de 61 ( au dessus = infos de banque)
				if(numTxt==61) { 	numeroSousMenu=18; }//contact-->utilise des chams client (mauvaise pratique...), titre=celui de menu. 61 seul champ de contact utilisé
				if(numTxt==0) { 	numeroSousMenu=19; }//cdv-->sont dans pages pas dans languenav, titre=celui de menu. 0 ne cooresponds pas c'est un flag pour aller sur pages
				numeroMenuPrpal=16;
				p10.innerHTML="Modifier la page information";
			}

			else {
				numeroSousMenu=1; numeroMenuPrpal=1;				
			}
			break;

		case 'pageNavigation': 
			theVoletCss="Transverses site";
			theNumCss=3;
			break;

		case 'a': 
			theVoletCss="Transverses site";
			theNumCss=4;
			break;

		case 'a': 
			theVoletCss="Transverses site";
			theNumCss=4;
			break;


		// icones 
		case 'icones':
			if (sectionTxtNom == 'contact') {
				if (numTxt > 0 && numTxt < 17) { numeroSousMenu=17; }//ksn en dessous de 61 ( au dessus = infos de banque)
				if (numTxt==61) { 	numeroSousMenu=18; }//contact-->utilise des chams client (mauvaise pratique...), titre=celui de menu. 61 seul champ de contact utilisé
				if (numTxt==0) { 	numeroSousMenu=19; }//cdv-->sont dans pages pas dans languenav, titre=celui de menu. 0 ne cooresponds pas c'est un flag pour aller sur pages
				numeroMenuPrpal=16;
			}
			else if (sectionTxtNom == 'cde') {
				numeroSousMenu=13;
				numeroMenuPrpal=12;
				
			}			
			else if (sectionTxtNom == 'menu') {
				if (numTxt==13) { numeroSousMenu=13; } //Panier//titre//icone
				numeroMenuPrpal=12; agencementOnglet=1; previewObject=0;
			}
			else {
				numeroMenuPrpal=0;
				numeroSousMenu=1;
			}
			theVoletCss="Transverses site";
			theNumCss=8;
			break;

	
		// boutons
		case 'boutons:hover':
		case 'boutons':
		case 'bouton':
			theVoletCss="Transverses site";
			theNumCss=9;
			textesAffSection=10;
			if(numTxt==17) { // bouton autres achats ?
				numeroSousMenu=13;
				numeroMenuPrpal=12;
			}
			else {
				numeroSousMenu=108;
				numeroMenuPrpal=0;
			}
			p10.innerHTML="Modifier le bouton";
			break;

		case 'message':
			theVoletCss="Transverses site";
			theNumCss=11;
			break;

		case 'msgOk':
			theVoletCss="Transverses site";
			theNumCss=12;
			break;

		case 'msgKo':
			theVoletCss="Transverses site";
			theNumCss=13;
			break;

		case 'input:focus':
			theVoletCss="Transverses site";
			theNumCss=14;
			break;			

		// Mesage commercial
		case 'messCom':
			theVoletCss="Transverses site";
			theNumCss=16;
			if (sectionTxtNom == 'contact') {
				if (numTxt > 0 && numTxt < 17) { numeroSousMenu=17; }//ksn en dessous de 61 ( au dessus = infos de banque)
				if (numTxt==61) { 	numeroSousMenu=18; }//contact-->utilise des chams client (mauvaise pratique...), titre=celui de menu. 61 seul champ de contact utilisé
				if (numTxt==0) { numeroSousMenu=19; }//cdv-->sont dans pages pas dans languenav, titre=celui de menu. 0 ne cooresponds pas c'est un flag pour aller sur pages
				numeroMenuPrpal=16;
			}
			else {
				numeroSousMenu=0;
				numeroMenuPrpal=0;	
			}			
			p10.innerHTML="Modifier l'annonce";
			break;

		case 'onlyInResponsive':
			theVoletCss="Transverses site";
			theNumCss=17;
			numeroMenuPrpal=40;
			break;

		case 'mdpIco':
			theVoletCss="Transverses site";
			theNumCss=18;
			break;

		case 'propuls':
			theNumCss=19;
			numeroMenuPrpal=40;
			break;
		
		// --------------------------------------------------
		// Publicité pas de contenu on definit txt sur accueil par defaut
		// --------------------------------------------------	
		case 'pub-table':
			theVoletCss="Publicité";
			theNumCss=1;
			textesAffSection=7;
			numeroMenuPrpal=20; // pub espace
			numeroSousMenu='2' + String(numTxt) ; // pub 1 - 2 - 3
			isEspace=0;
			previewObject=1;
			agencementOnglet=4;
			p10.innerHTML="Modifier la publicité";
			numTxt=0;
			break;

		// PDP-> transverse
		case 'pdpBarre':
		case 'pdpItem':
		case 'pdpIcone':
		case 'pdpTxt':
		case 'whatsapp-barre':
			numeroMenuPrpal=0;
			numeroSousMenu=109;
			break;
	}

	if (debugLocal==2) alert('Fin switch styles - numeroSousMenu=' + numeroSousMenu);

	// dans certains cas on a des styles partagés ce qui fausse la navigation, avec affPAgeSite on peut savoir
	let affPageSite='';
	if(document.getElementById('affPageSite')) {
		// alert('affPageSite mContextuel= '+document.getElementById('affPageSite').value);
		affPageSite=document.getElementById('affPageSite').value;
		switch (affPageSite) {
			case '11': numeroSousMenu=131; numeroMenuPrpal=12; break;//saisie adresse fact panier
			case '12': numeroSousMenu=132; numeroMenuPrpal=12; break;//saisie adresse liv panier
			case '13': numeroSousMenu=133; numeroMenuPrpal=12; break;//saisie mode liv panier
			case '14': numeroSousMenu=134; numeroMenuPrpal=12; break;//saisie mode paie panier
			case '17': numeroSousMenu=134; numeroMenuPrpal=12; break;//saisie mode paie panier - rib
			case '18': numeroSousMenu=134; numeroMenuPrpal=12; break;//saisie mode paie panier - cheque
		}
		// if (document.getElementById('affPageSite2')) document.getElementById('affPageSite2').value=affPageSite;
	}

	// ---------------------------------------------------
	// Déduire le lien final
	// ---------------------------------------------------	
	trouve=false;
	switch (p10.innerHTML) {
		case "Modifier le titre":
			action="./admin/frmModale.php?affAdmin=2&affModale=2-6";
			trouve=true;
			break;

		case "Modifier le logo":
			action="./admin/frmModale.php?affAdmin=2&affModale=2-5";
			trouve=true;
			break;

		case "Modifier la musique":
			action="./admin/frmModale.php?affAdmin=2&affModale=2-9";
			trouve=true;
			break;

		case "Modifier les langues":
			action="./admin/frmAdmin.php?affAdmin=6&optAff=6";
			trouve=true;
			break;

		case "Modifier l'image bannière":
			action="./admin/frmModale.php?affAdmin=2&affModale=2-7";
			trouve=true;
			break;

		case "Modifier l'annonce":
			action="./admin/frmModale.php?affAdmin=2&affModale=2-10";
			trouve=true;
			break;

		case "Modifier la catégorie":
		case "Modifier la sous-catégorie":
			action="./admin/frmAdmin.php?affAdmin=8&ongletCatalog=2&idFam="+numTxt;
			trouve=true;
			break;

		case "Modifier le produit":
			action="./admin/frmAdmin.php?affAdmin=8&affOngArt=4&ongletCatalog=4&idPrdRech="+numTxt+"&codeOpe=idPrd";
			trouve=true;
			break;

		case "Modifier les options du produit":
			action="./admin/frmAdmin.php?affAdmin=8&ongletCatalog=5&affLV=8";
			trouve=true;
			break;

		case "Modifier les informations commerçant":
			action="./admin/frmAdmin.php?affAdmin=6&optAff=5&typeOfCommercant=1";
			trouve=true;
			break;

		case "Modifier les modes de livraison":
			action="./admin/frmAdmin.php?affAdmin=6&optAff=2";
			trouve=true;
			break;
			
		case "Modifier les moyens de paiement":
			action="./admin/frmAdmin.php?affAdmin=6&optAff=1";
			trouve=true;
			break;

	}

	// cas ou on redirige vers les pages modales ou liens spécifiques
	if(trouve==true) {
		p10.onclick=function (e) { 
			e.stopPropagation();
			e.preventDefault();
			top.location.href=action;
			deselectElement(element);
			selectElement(element);
		}
	}
	// par defaut appeler editContenu
	else {
		p10.onclick=function (e) { 
			e.stopPropagation();
			e.preventDefault();
			editContenu ( theVoletCss, nomCss, theNumCss, sectionTxtNom, textesAffSection, numTxt, numeroMenuPrpal, numeroSousMenu, agencementOnglet, previewObject, isEspace, affPageSite ) 
			deselectElement(element);
			selectElement(element);
		} ; 
	}	

	debugLocal=0;
	if (debugLocal==3) alert('mContextuel param fin => theVoletCss= ' +theVoletCss+ '  |  nomCss=' +nomCss+ '  |  theNumCss= ' +theNumCss+ '  |  sectionTxtNom=' +sectionTxtNom+ '  |  textesAffSection=' +textesAffSection+ '  |  numTxt= ' +numTxt+ '  |  numeroMenuPrpal= ' +numeroMenuPrpal+ '  |  numeroSousMenu= ' +numeroSousMenu+ '  |  agencementOnglet= ' +agencementOnglet+ '  |  previewObject= ' +previewObject+ '  |  isEspace= ' +isEspace+ '  |  affPageSite= ' +affPageSite);

	// debugLocal=0;
	if (debugLocal==1) alert('contenu action => action= ' +action);

	// ---------------------------------------------------------------------------------------------------------------------------------------------------------
	// Créer le sous menu Style (element, style, numeroMenuPrpal, sectionTxtNom)
	// ---------------------------------------------------------------------------------------------------------------------------------------------------------
	var p11=document.createElement('p');
	d.appendChild(p11);
	p11.setAttribute('class', 'mContextItem');
	p11.innerHTML="Modifier le style";

	// ---------------------------------------------------
	// Déduire le libellé du sous menu style selon nomCss
	// ---------------------------------------------------
	switch (nomCss) {
		// Menus famille
		case 'menuIndep-container':
			p11.innerHTML="Modifier le style du menu indépendant";
			break;

		case 'rechBarre-container':
			p11.innerHTML="Modifier la barre de recherche";
			break;
			
		case 'rechItem':
		case 'rechInput':
		case 'rechBtn':
			p11.innerHTML="Modifier la zone de recherche";
			break;

		case 'txtBarrePromo':
			p11.innerHTML="Modifier la barre des promos";
			break;

		case 'champsInfosCell':
			//annuler le preview du menu precedent le cas echeant
			previewObject=0;
			break;
	}

	// ---------------------------------------------------
	// Appeler la fonction
	// ---------------------------------------------------
	p11.onclick=function(e) { 
		e.stopPropagation();
		e.preventDefault();
		editStyle ( theVoletCss, nomCss, theNumCss, sectionTxtNom, textesAffSection, numTxt, numeroMenuPrpal, numeroSousMenu, agencementOnglet, previewObject, isEspace, affPageSite )
		deselectElement(element);
		selectElement(element);
	};

	debugLocal=0;
	if (debugLocal==1) alert('contenu action => action= ' +action);

	// ---------------------------------------------------
	// Fin function
	// ---------------------------------------------------
	element.parentNode.appendChild(d);
	return false;
}

// ---------------------------------------------------------------------------------------------------------------------------------------------------------
// Fonction editContenu
// ---------------------------------------------------------------------------------------------------------------------------------------------------------
function editContenu ( theVoletCss, nomCss, theNumCss, sectionTxtNom, textesAffSection, numTxt, numeroMenuPrpal, numeroSousMenu, agencementOnglet, previewObject, isEspace , affPageSite ) {
	debugLocal=0;

	// gerer le chemin selon qu'on est dans le backoffice, ou une page objet
	if (location.pathname.indexOf('/admin/') !== -1) {
			actionPrefixe='frmAdmin.php?';
			if(debugLocal==1) alert('actionPrefixe=' + actionPrefixe);
	} else {
			actionPrefixe='./admin/frmAdmin.php?';
		 if(debugLocal==1) alert('actionPrefixe=' + actionPrefixe);
	}
	
	action=actionPrefixe +'affAdmin=2&theVoletCss=' +theVoletCss+ '&nomCss=' +nomCss+ '&theNumCss=' +theNumCss+ '&sectionTxtNom=' +sectionTxtNom+ '&textesAffSection=' +textesAffSection+ '&numTxt=' +numTxt+ '&numeroMenuPrpal=' +numeroMenuPrpal+ '&numeroSousMenu=' +numeroSousMenu+ '&agencementOnglet=' +agencementOnglet+ '&previewObject=' +previewObject+ '&isEspace=' +isEspace+ '&affPageSite=' +affPageSite;
	if(debugLocal==1) alert('fonction editContenu => action=' +action );
	top.location.href=action;
}

// ---------------------------------------------------------------------------------------------------------------------------------------------------------
// Fonction editStyle
// ---------------------------------------------------------------------------------------------------------------------------------------------------------
function editStyle ( theVoletCss, nomCss, theNumCss, sectionTxtNom, textesAffSection, numTxt, numeroMenuPrpal, numeroSousMenu, agencementOnglet, previewObject, isEspace, affPageSite ) {
	// on envoi aussi les param de txt au cas ou apres on clic sur l'onglet txt
	debugLocal=0;

	// gerer le chemin selon qu'on est dans le backoffice, ou une page objet
	if (location.pathname.indexOf('/admin/') !== -1) {
		actionPrefixe='frmAdmin.php?';
		if(debugLocal==1)alert('actionPrefixe=' + actionPrefixe);
	} else {
		actionPrefixe='./admin/frmAdmin.php?';
		if(debugLocal==1) alert('actionPrefixe=' + actionPrefixe);
	}

	action=actionPrefixe +'affAdmin=2&theVoletCss=' +theVoletCss+ '&nomCss=' +nomCss+ '&theNumCss=' +theNumCss+ '&sectionTxtNom=' +sectionTxtNom+ '&textesAffSection=' +textesAffSection+ '&numTxt=' +numTxt+ '&numeroMenuPrpal=' +numeroMenuPrpal+ '&numeroSousMenu=' +numeroSousMenu+ '&agencementOnglet=3'+ '&previewObject=' +previewObject+ '&isEspace=' +isEspace+ '&affPageSite=' +affPageSite;
	if (debugLocal==1) alert('fonction editStyle => action=' +action);

	top.location.href=action;
}

// ---------------------------------------------------------------------------------------------------------------------------------------------------------
// Styles seul : mais on envoi les param txt pour être sûr compatibilité du clic apres sur onglet txt
// ---------------------------------------------------------------------------------------------------------------------------------------------------------
function mConStyle ( element, theVoletCss, nomCss, theNumCss, sectionTxtNom, textesAffSection, numTxt, event ) {
	numeroMenuPrpal='';
	numeroSousMenu='';
	previewObject=0;
	isEspace=0;
	debugLocal=0;
	if (debugLocal==1) alert('mConStyle param entree => element=' + element.id + '  |  theVoletCss=' + theVoletCss + '  |  nomCss=' + nomCss + '  |  theNumCss=' + theNumCss + '  |  sectionTxtNom=' + sectionTxtNom + '  |  textesAffSection=' + textesAffSection + '  |  numTxt=' + numTxt );

	// ---------------------------------------------------
	// Ne supporte pas les #
	// ---------------------------------------------------
	if (nomCss.substr(0,1 )=="#") {nomCss=nomCss.substr(1, nomCss.length); }
	if (debugLocal==1) alert("nomCss=" + nomCss);

	if (event) {
		event.stopPropagation(); // ← Arrête la propagation vers les parents
		event.preventDefault(); // ← Optionnel : bloque le menu natif
	}

	// ---------------------------------------------------
	// Créer le menu
	// ---------------------------------------------------
	var d=document.createElement('div');
	d.setAttribute('class', 'mContextMenu');
	d.setAttribute('id', 'menuContextuel');
	element.style.border="2px dashed purple";
	element.style.zIndex=101; 
	if(element.parentNode) element.parentNode.style.zIndex=101; 

	// ---------------------------------------------------
	// Supprimer le menu contextuel on click body ou lui même
	// ---------------------------------------------------
	if(element.parentNode) d.onclick=function(e) { element.parentNode.removeChild(d); }
	document.body.onclick=function(e) { try{ element.parentNode.removeChild(d); } finally{} }

	// ---------------------------------------------------
	// Créer le sous menu style
	// ---------------------------------------------------
	var p11=document.createElement('p');
	d.appendChild(p11);
	p11.setAttribute('class', 'mContextItem');
	p11.innerHTML="Modifier le style";
	
	// ---------------------------------------------------
	// Gérer la position
	// ---------------------------------------------------
	gererPos(d,event);


	// ---------------------------------------------------
	// Corriger theVoletCss pour les cas d'apostrophe
	// ---------------------------------------------------
	switch (theVoletCss) {

		case 'Structure entête':
			theVoletCss="Structure d'entête";
			break;
	
		case 'Eléments entête':
			theVoletCss="Eléments d'entête";
			break;
	}
	
	if (debugLocal==1) alert('fin 1');

	// ---------------------------------------------------
	// Compléter les params selon les cas : numeroMenuPrpal, numeroSousMenu
	// ---------------------------------------------------	
	switch (nomCss) {

		case 'body':
		case 'bodyImg':
			numeroMenuPrpal=0;
			numeroSousMenu=100;//Accueil
			p11.innerHTML="Modifier le style du corps de page";
			break;

		case 'site-container':
			numeroMenuPrpal=0; //site
			numeroSousMenu=100; //Accueil
			p11.innerHTML="Modifier le style du conteneur global";
			d.style.left='0px';
			d.style.top='5px';
			d.style.position='absolute';
			break;

		// j'ai un doute car il est unique donc sera toujours sur accueil// voir si possible affPageSite dans preview ? 
		case 'page-container':
			// if(sectionTxtNom == 'contact') {
			// 	numeroSousMenu=numTxt;//ksm-contact-cdv
			// 	numeroMenuPrpal=16;//infos
			// }
			// if(sectionTxtNom == 'cde') {
			// 	numeroSousMenu=135;//
			// 	numeroMenuPrpal=12;//panier
			// }			
			// else {
				numeroMenuPrpal=0; //site
				numeroSousMenu=100; //Accueil
			// }			

			p11.innerHTML="Modifier le conteneur page";
			break;

		// Entête titre Img - 
		case 'header-containerImg':
			numeroMenuPrpal=0; //site
			numeroSousMenu=103; //titre			
			p11.innerHTML="Modifier le conteneur du titre";
			break;

		// Entête logo - Ici il faut aller sur accueil car sinon la page logo prends le dessus sur le voletCss ( c'est cohérent car ici c'est conteneur, pas logo)
		case 'eCol1':
			numeroMenuPrpal=0; //site
			numeroSousMenu=100; //accueil
			p11.innerHTML="Modifier le conteneur logo";
			break;
		
		// Entête titre 
		case 'eCol2':
			numeroMenuPrpal=0; //site
			numeroSousMenu=103; //titre
			p11.innerHTML="Modifier la cellule";
			theNumCss=1;
			break;

		// Entête conteneur musique
		case 'eCol4':
			numeroMenuPrpal=0; //site
			numeroSousMenu=106; // musique
			p11.innerHTML="Modifier le conteneur player";
			break;

		// Entête - conteneur langue
		case 'eCol5':
			numeroMenuPrpal=0; //site
			numeroSousMenu=100; // accueil
			p11.innerHTML="Modifier le conteneur langue";
			break;

		case 'bandeau-container':
			numeroMenuPrpal=0; //site
			numeroSousMenu=104;
			p11.innerHTML="Modifier le conteneur bannière";
			break;


		// Menus deroulant
		case 'menuD-container':
			numeroMenuPrpal=0;
			numeroSousMenu=1;
			p11.innerHTML="Modifier le conteneur menu déroulant";
			d.style.width='400px';
			break;

		// Menus deroulant
		case 'menuDeroulantBarre':
			numeroMenuPrpal=0;
			numeroSousMenu=1;
			p11.innerHTML="Modifier la barre du menu déroulant";
			d.style.width='400px';
			break;

		//--------------------------------------------
		// Catalogue
		//--------------------------------------------
		// Menu independant
		case 'menuIndep-container':
			numeroMenuPrpal=1;
			numeroSousMenu=1;
			p11.innerHTML="Modifier le conteneur menu indépendant";
			d.style.width='400px';
			break;

		// Famille conteneur
		case 'familles-container':
			numeroMenuPrpal=1;
			numeroSousMenu=1;
			p11.innerHTML="Modifier le conteneur global des catégories";
			d.style.width='400px';
			break;

		// Famille boite
		case 'familles-boite':
			numeroMenuPrpal=1;
			numeroSousMenu=1;
			p11.innerHTML="Modifier la barre de chaque catégorie";
			d.style.width='400px';
			break;

		// Sous cat boite
		case 'categories-boite':
			numeroMenuPrpal=1;
			numeroSousMenu=1;
			p11.innerHTML="Modifier la barre de chaque sous-catégorie";
			d.style.width='400px';
			break;
		
		case 'promos-container':
			// va dans menus pour txt
			numeroMenuPrpal=1;
			numeroSousMenu=1;
			p11.innerHTML="Modifier le conteneur barre des promos";
			d.style.width='400px';
			break;

		case 'zoneAcheter':
			// va dans menus pour txt
			numeroMenuPrpal=1;
			numeroSousMenu=1;
			p11.innerHTML="Modifier la zone acheter";
			break;

		//--------------------------------------------
		// transverse
		//--------------------------------------------			
		case 'tablePages':
			theVoletCss="Transverses site";
			theNumCss=1;
			if (sectionTxtNom == 'contact') {
				if (numTxt > 0 && numTxt < 17) { numeroSousMenu=17; }//ksn en dessous de 61 ( au dessus = infos de banque)
				if(numTxt==61) { 	numeroSousMenu=18; }//contact-->utilise des chams client (mauvaise pratique...), titre=celui de menu. 61 seul champ de contact utilisé
				if(numTxt==0) { 	numeroSousMenu=19; }//cdv-->sont dans pages pas dans languenav, titre=celui de menu. 0 ne cooresponds pas c'est un flag pour aller sur pages
				numeroMenuPrpal=16;
			}
			else if (sectionTxtNom == 'menus') { // ici menus est un mot clé, car ce sont des pages avec contenus et pas txt
				numeroSousMenu=numTxt; //14 et 15 menu liv et paie
			}
			else if (sectionTxtNom == 'client') {
				numeroSousMenu=9;
				numeroMenuPrpal=6;
			}	
			else if (sectionTxtNom == 'cde') {
				numeroMenuPrpal=12;
				if (numTxt==46) { 	numeroSousMenu=134; }//rib
				else if (numTxt==47) { 	numeroSousMenu=18; }//cheque
				else if (numTxt==0) { 	numeroSousMenu=135; }//recap
				else { 		numeroSousMenu=13;	}
			}						
			else {
				numeroSousMenu=1;
				numeroMenuPrpal=1;		
			}
			p11.innerHTML="Modifier le conteneur tableau";
		break;
	
		case 'ongletBarre li':
			theVoletCss='Onglets';
			numeroSousMenu=9;
			numeroMenuPrpal=6;		
			numcss=1;
			break;

		case 'ongActv':
			theVoletCss='Onglets';
			numeroSousMenu=9;
			numeroMenuPrpal=6;		
			numcss=5;
			break;

		//--------------------------------------------
		// informations
		//--------------------------------------------
		case 'tableInfos':
		case 'msgInfos':
		case 'libInfosCell':
		case 'champsInfosCell':
		case 'champsInfos':
			theVoletCss="Informations";
			if (numTxt > 0 && numTxt < 17) { numeroMenuPrpal=16;numeroSousMenu=17; }//ksn en dessous de 61 ( au dessus = infos de banque)
			if (numTxt==61)		{ numeroMenuPrpal=16; numeroSousMenu=18; }//contact-->utilise des champs client (mauvaise pratique...), titre=celui de menu. 61 seul champ de contact utilisé
			if (numTxt==0)	 	{ numeroMenuPrpal=16; numeroSousMenu=19; }//cdv-->sont dans pages pas dans languenav, titre=celui de menu. 0 ne cooresponds pas c'est un flag pour aller sur pages
			if (numTxt==68|| numTxt==75)		{ numeroMenuPrpal=6; numeroSousMenu=14; }//menu mode paie
			if (numTxt==73 || numTxt==77)		{ numeroMenuPrpal=6; numeroSousMenu=15; }//menu mode liv
			
			break;
		
		//--------------------------------------------
		// Panier
		//--------------------------------------------
		case 'syntheseLignes':
			numeroMenuPrpal=12; //Panier espace
			numeroSousMenu=13;
			break;
		// Panier
		case 'recapContainer':
			if(numTxt==78 ) {numeroSousMenu=135;} //recap
			else {numeroSousMenu=13;}
			numeroMenuPrpal=12; //Panier espace
			break;
		case 'etapesContainer':
			numeroMenuPrpal=12; //Panier espace
			numeroSousMenu=13;
			break;
		// Panier
		case 'tablePanier':
			numeroMenuPrpal=12; //Panier espace
			if(numTxt==0) {numeroSousMenu=13;} 
			if(numTxt==15) {numeroSousMenu=131;} //adr fact
			if(numTxt==3) {numeroSousMenu=132;} //adr liv
			if(numTxt==38) {numeroSousMenu=133;} //mode liv
			if(numTxt==46 || numTxt==47 || numTxt==68) {numeroSousMenu=134} //rib- cheq - mode paie -
			if(numTxt==30) {numeroSousMenu=135} //recap
			numeroSousMenu=13;
			break;			
		// Panier
		case 'blocItemPanier':
			numeroMenuPrpal=12; //Panier espace
			if(numTxt==106 ) numeroSousMenu=133;//mode liv
			else if(numTxt==68) numeroSousMenu=134;//mode paie
			else if(numTxt==1 || numTxt==90 || numTxt==89) numeroSousMenu=135;//recap
			else numeroSousMenu=13;
			break;
		// Panier
		case 'panierConteneurItem':
			numeroMenuPrpal=12; //Panier espace
			numeroSousMenu=13;
			break;
			// Panier
		case 'listeDeroulantePanier':
			numeroMenuPrpal=12; //Panier espace
			numeroSousMenu=13;
			break;
		case 'champsPanierCell':
			numeroMenuPrpal=12; //Panier espace
			numeroSousMenu=13;
			break;
		case 'champsPanier':
			numeroMenuPrpal=12; //Panier espace
			if(sectionTxtNom=='contact' ) numeroSousMenu=134;//mode paie- cheq- infos
			else numeroSousMenu=13;
			break;
		
		//--------------------------------------------
		// client : 
		// on peut etre dans panier pour le adresses
		// on peut venir ici par le champs, ils ont pas le voletCSS 
		//--------------------------------------------
		case 'syntheseLignes':
			theVoletCss="Clients";
			numeroSousMenu=13;
			numeroMenuPrpal=6; //client espace
			break;
		// Dans les champs on ne connait pas le numCSS
		case 'champsCliCell':
			theVoletCss="Clients";
			theNumCss = 4;
			if(textesAffSection==0){
				numeroSousMenu=9;
				numeroMenuPrpal=6; //client espace
			}
			else {
				numeroSousMenu=13;
				numeroMenuPrpal=12; //panier espace				
			}
			break;
		
		//--------------------------------------------
		// nav
		//--------------------------------------------
		case 'champsConnCell':
		case 'champsConn':
		case 'connLignes':
			numeroSousMenu=7; // connexion
			numeroMenuPrpal=6; //client espace			
			break;

		//--------------------------------------------
		// Pub
		//--------------------------------------------
		case 'pub-container':
			numeroMenuPrpal=20; //pub espace
			numeroSousMenu=21; //pub1
			theNumCss=8;
			isEspace=1;
			p11.innerHTML="Modifier le conteneur publicité";
			break;

		//--------------------------------------------
		// Pied de page
		//--------------------------------------------
		case 'pdp-container':
			p11.innerHTML="Modifier le conteneur pied de page";
			numeroSousMenu=109;
			break;
	}
	// dans certains cas on a des styles partagés ce qui fausse la navigation, avec affPAgeSite on peut savoir
	let affPageSite='';
	if(document.getElementById('affPageSite')) {
		// alert('affPageSite mConStyle = '+document.getElementById('affPageSite').value);
		affPageSite=document.getElementById('affPageSite').value;
		switch (affPageSite) {
			case '11': numeroSousMenu=131; numeroMenuPrpal=12; break;//saisie adresse fact panier
			case '12': numeroSousMenu=132; numeroMenuPrpal=12; break;//saisie adresse liv panier
			case '13': numeroSousMenu=133; numeroMenuPrpal=12; break;//saisie mode liv panier
			case '14': numeroSousMenu=134; numeroMenuPrpal=12; break;//saisie mode paie panier
			case '17': numeroSousMenu=134; numeroMenuPrpal=12; break;//saisie mode paie panier - rib
			case '18': numeroSousMenu=134; numeroMenuPrpal=12; break;//saisie mode paie panier - cheque
		}
		// if (document.getElementById('affPageSite2')) document.getElementById('affPageSite2').value=affPageSite;
	}

	debugLocal=0;
	if (debugLocal==1) alert('mConStyle param fin => theVoletCss= ' +theVoletCss+ '  |  nomCss= ' +nomCss+ '  |  theNumCss= ' +theNumCss+ '  |  sectionTxtNom= ' +sectionTxtNom+ '  |  textesAffSection= ' +textesAffSection+ '  |  numTxt= ' +numTxt+ '  |  numeroMenuPrpal= ' +numeroMenuPrpal+ '  |  numeroSousMenu= ' +numeroSousMenu+ '  |  previewObject= ' +previewObject+ '  |  isEspace= ' +isEspace+ '  |  affPageSite= ' +affPageSite);
	
	p11.onclick=function(e) { 
		e.stopPropagation();
		e.preventDefault();		
		editStyle( theVoletCss, nomCss, theNumCss, sectionTxtNom, textesAffSection, numTxt, numeroMenuPrpal, numeroSousMenu, previewObject, isEspace, affPageSite ) ;
		deselectElement(element);
		selectElement(element);
	};

	// ---------------------------------------------------
	// Créer le menu
	// ---------------------------------------------------	
	element.parentNode.appendChild(d);

	return false;
}