document.write('<scr' + 'ipt type="text/javascript" src="' + VGJS + '/json/area.js"></scr' + 'ipt>');
	var nbarea = 4;
	var tabarea = new Array();

	function ShowArea(name, id) {
		if (id == undefined) { id = ''; }
		document.write('<input id="i' + name + '" type="hidden" name="' + name + '" value="" />');
		for (var i = 0; i < nbarea; i++) {
			document.write('<div id="z' + name + '_' + i + '" style="display: inline;"></div>');
		}

		if (id != '') {
			var tab = id.split('-');
			for (var i = 0; i < tab.length; i++) {
				tabarea[i] = tab[i];
			}
		}

		SetArea(name);
		for (var i = 0; i < tabarea.length; i++) {
			if (tabarea[i] != '') {
				SetArea(name, tabarea[i], i + 1);
			}
		}
	}

	function SetArea(name, id, cpt) {
		if (cpt == '' || cpt == undefined) { cpt = '0'; }
		if (id == undefined || id == '0') { id = ''; }
		var ident = name + '_' + cpt;
		var tab = document.getElementById('i' + name).value.split('-');
		var setid = '';


		for (var i = 0; i < nbarea; i++) {
			if (i < cpt - 1) {
				if (setid != '') { setid += '-'; }
				if (tab[i] == undefined) { tab[i] = ''; }
				setid += tab[i];
			} else if (i >= cpt) {
				document.getElementById('z' + name + '_' + i).innerHTML = '';
			}
		}
		if (setid != '') { setid += '-'; }
		setid += id;
		document.getElementById('i' + name).value = setid;

		tabdiv.push('select' + ident);

		var str = '';
		str = '<div style="display: inline;">';

		if (cpt < nbarea && ((cpt == 0 && id == '') || (cpt > 0 && id != ''))) {
			var object = eval('jarea' + id);

			if (object) {
				while (object.length <= 2 && cpt < nbarea - 1) {
					var object = eval('jarea' + object[1].ref);
					cpt++;
				} 
				if (object.length > 2) { 
					var txtdefault = '';
					if (cpt > 0) {
						str += '<img src="' + VGIMG + '/fleche_droite.gif" width="7" height="9" border="0" alt="" style="margin: 0px 5px;" />';
					}
					str += '<span class="select" onClick="SelectShow(\'select' + ident + '\')"><span id="t' + ident + '"><h5>' + object[0].name + '</h5></span><img id="select' + ident + '_fleche" src="' + VGIMG + '/fleche_off.gif" width="13" height="14" border="0" style="vertical-align: middle; margin-left: 2px;" onMouseOver="this.src=\'' + VGIMG + '/fleche_on.gif\'" onMouseOut="this.src=\'' + VGIMG + '/fleche_off.gif\'" />';
					str += '<div id="select' + ident + '" style="z-index: 101; position: absolute; border: dashed 1px #999; margin-left: -2px; background: #FFF; padding: 1px; display: none;">';
					for (var i = 0; i < object.length; i++) {
						var item = object[i];

						if (tabarea[cpt] == item.ref) {
							txtdefault = '<h5>' + addslashes(item.name) + '</h5>';
						}

						str += '<div class="selectelt" onClick="document.getElementById(\'t' + ident + '\').innerHTML=\'<h5>' + addslashes(item.name) + '</h5>\';SetArea(\'' + name + '\', ' + item.ref + ', ' + (+cpt + 1) + ')"><h5>' + item.name + '</h5></div>';
					}
					str += '</div>';
		
					str += '</div>';
					document.getElementById('z' + ident).innerHTML = str;
					if (txtdefault != '') {
						document.getElementById('t' + ident).innerHTML = '<h5>' + addslashes(txtdefault) + '</h5>';
					}
				}
			}
		}
	}