window.onload = function() {

	nb = 10;
	ToutFermer();
	// Masquer les chapeaux
	EcouterMap();
}

function ToutFermer() {
	// Tout fermer


	for(var i = 0; i < nb; i++) {
		PermuterClass('none', $('vignette_'+ i))
	}
}

function EcouterMap() {

	var map = $('map_rue');

	var tab = map.getElementsByTagName('area');

	for(var i = 0; i < tab.length; i++) {

		tab[i].onmouseover = function() {
			
			for(var i = 0; i < nb; i++) {
				if(!TesterClass('none',  $('vignette_'+ i))) {
					PermuterClass('none', $('vignette_'+ i))
				}
	
			}

			EffacerClass($('encadre'));
			PermuterClass('area_cadre_'+ this.id.substring(5), $('encadre'));
			
			$('encadre').onclick = function() {
				location.href = $('area_'+ $('encadre').className.substring(11)).href;
			}
			
			PermuterClass('none', $('vignette_'+ this.id.substring(5)));
			EffacerClass($('cliquer_ici'));
			PermuterClass('area_'+ this.id.substring(5), $('cliquer_ici'));
			$('lien_cliquer_ici').href = this.href;

		}

	}
}


function $(id) {
	return document.getElementById(id);
}


/**
* Applique ou enleve une classe CSS au noeud
* Retourne false si la classe est supprimée
* Retourne true si la classe est appliquée
*/
function PermuterClass(class_css, noeud)
{
	// Pas d'attribut class, le definir
	if(!noeud.className) {
		noeud.className = class_css;
		return true;
	}

	if(!TesterClass(class_css, noeud)) {
		noeud.className += ' '+ class_css;
		return true;
	}

	noeud.className = noeud.className.replace(new RegExp("[ ]?"+ class_css +"[ ]?"), '');
	return false;
}

/**
* Vérifie si la classe 'class_css' est définie dans le noeud
*/
function TesterClass(class_css, noeud) {
	if(noeud.className.indexOf(class_css, 0) == '-1')
		return false;
	return true;
}

function EffacerClass(noeud) {
	noeud.className = '';
	return true;
}