var idFicheVoie = "ficheVoie";
var idImgLoad = "loader";
var Gmap;

function accordion(_id){
	new Accordion($('accordion'), 'h3.toggler', 'div.element', {
		display: _id,
		alwaysHide: true,
		opacity: false,
		onActive: function (toggler, element) {
			toggler.setStyle('color', '#75A3D0');
		},
		onBackground: function (toggler, element) {
			toggler.setStyle('color', '#FFFFFF');
		}
	});
}

window.addEvent('domready', function () {

	if ($('accordion')){
		accordion(0);
	}
	
	if ($('welcomeTitle')){
		$('welcomeTitle').addEvent('click', function(e){
			e.stop();
			
			var morph = new Fx.Morph('contentWelcome', {duration: 'long'});
			
			if ($('contentWelcome').style.height == '0px')		{
				morph.start({
					'height': '180px',
				}); 			
			}
			else{
				morph.start({
					'height': '0px',
				});		
			}
		});
	}
});

function hideColLeft() {
	$("leftColumn").destroy();
 	$("textContent").set('styles', {
		'width': '100%'
	});

}

function changeTdColor(_s){
	var items = $(_s).getParent('tr').getChildren('td');
	for (var i = 0; i < items.length; i++) {
		items[i].style.color = "#8F8E94";
	}
	$(_s).set('styles',{
		'color':'#FFF'
	});
}

function getVoies(_val, _sender) {
	var myurl = "";
	if (_sender == "tab-voie") {
		myurl = './lib/req/req_voie.php?c=' + _val;
	} else if (_sender == "tab-bestof") {
		myurl = './lib/req/req_bestofvoie.php';
	} else if (_sender == "tab-gvoie") {
		myurl = './lib/req/req_gvoie.php';
	}
	new Request({
		url: myurl,
		method: 'get',
		onSuccess: function (txt, xml) {
			$("ajaxtable").empty();
			if ($("accordion")) {
				$("accordion").destroy();
			}
			
			changeTdColor(_sender);
			
			if (_sender == "tab-voie") {
				$("submenu").set('styles', {'border-bottom': '1px solid #808080'});
				changeTdColor('tab'+_val);
				$("cote-line").style.display = "";
				createTable(xml);
			} else if (_sender == "tab-bestof") {
				$("submenu").set('styles', {'border-bottom': '1px solid #808080'});
				$("cote-line").set('styles', {'display': 'none'});
				createTable(xml);
			} else if (_sender == "tab-gvoie") {
				$("cote-line").set('styles', {'display': 'none'});
				createTableGvoie(xml);
			}
		},
		onComplete: function () {
			$("ajaxtable").get('tween', {
				property: 'opacity',
				duration: 'short'
			}).start(0, 1);
		},
		onRequest: function () {
			$("ajaxtable").get('tween', {
				property: 'opacity',
				duration: 'long'
			}).start(1, 0);
		}
	}).send();
}

function getPalmares(_sender) {
 	var id = _sender.substr(3, 1);
	new Request({
		url: "./lib/req/req_palmares.php?a=" + id,
		method: 'get',
		onSuccess: function (txt, xml) {
				changeTdColor(_sender);
				$("ajaxtable").empty();
				createTable(xml);
		},
		onComplete: function () {
			$("ajaxtable").get('tween', {
				property: 'opacity',
				duration: 'short'
			}).start(0, 1);
		},
		onRequest: function () {
			$("ajaxtable").get('tween', {
				property: 'opacity',
				duration: 'long'
			}).start(1, 0);
		}
	}).send();
}

function createTable(_xml) {
	var heads = _xml.getElementsByTagName('listing')[0].getElementsByTagName('head')[0].getElementsByTagName('item');
	var bodys = _xml.getElementsByTagName('listing')[0].getElementsByTagName('data')[0].getElementsByTagName('item');
	
	new Element('thead').inject($("ajaxtable"));
	
	new Element('tr').inject($$('#ajaxtable thead')[0]);
	for (var i = 0; i < heads.length; i++) {
		new Element('th').set({
			'html' : (heads[i].getElementsByTagName('value')[0].firstChild) ? heads[i].getElementsByTagName('value')[0].firstChild.nodeValue : '',
			'styles':{
				'width':(heads[i].getElementsByTagName('width')[0].firstChild) ? heads[i].getElementsByTagName('width')[0].firstChild.nodeValue : '',
				'text-align':(heads[i].getElementsByTagName('text-align')[0].firstChild) ? heads[i].getElementsByTagName('text-align')[0].firstChild.nodeValue : ''
			},
		}).inject($$('#ajaxtable thead tr')[0]);
	}
	
	new Element('tbody').inject($("ajaxtable"));
	
	var bool = 0;
	var td;
	for (var i = 0; i < bodys.length; i++) {
		var tr = new Element('tr').set({
			'class': 'line'+bool
		}).inject($$('#ajaxtable tbody')[0]);
		
		for (var j = 0; j < bodys[i].childNodes.length; j++) {
		
			if (!bodys[i].childNodes[j].getAttribute('hidden')){
				td = new Element('td').set({
					'html': bodys[i].childNodes[j].firstChild.nodeValue
				}).inject(tr);
			}
			
			if (bodys[i].childNodes[j].nodeName == "site_name"){
				td.set({'html':''});

				new Element('a').set({
					'html': bodys[i].getElementsByTagName('site_name')[0].firstChild.nodeValue,
					'href': './site-'+bodys[i].getElementsByTagName('site_id')[0].firstChild.nodeValue+'.html'
				}).inject(td);
			}
			
			if (bodys[i].childNodes[j].nodeName == "quality"){
				td.set({'html':''});

				new Element('img').set({
					'src': './img/star'+bodys[i].getElementsByTagName('quality')[0].firstChild.nodeValue+'.png',
					'alt': ''
				}).inject(td);
			}			
		}
		
		if (bodys[i].getElementsByTagName('id').length > 0)
		{
			td = new Element('td').inject(tr);
			new Element('img').set({
				'src': './img/zoom.png',
				'alt': '',
				'onclick' :'ficheVoie('+bodys[i].getElementsByTagName('id')[0].firstChild.nodeValue+', this);',
				'styles':{
					'cursor':'pointer'
				}
			}).inject(td);
		}

		if(bool){bool=0;}else{bool=1;}
	}
}

function createFirstLine(_inc, _target) {
	if (!_target) {
		_target = "ajaxtable";
	}
	var thead = document.createElement("thead");
	thead.setAttribute("class", "headlist");
	$(_target).appendChild(thead);
	var tr = document.createElement("tr");
	thead.appendChild(tr);
	if (_inc == "bestof" || _inc == "gvoie") {
		var tdcote = document.createElement("td");
		tdcote.appendChild(text("Cote"));
		tdcote.style.width = "50px";
		tdcote.style.textAlign = "center";
		tr.appendChild(tdcote);
	}
	if (_inc == "bestof" || _inc == "voie" || _inc == "gvoie") {
		var tddate = document.createElement("td");
		tddate.appendChild(text("Date"));
		tddate.style.width = "50px";
		tddate.style.textAlign = "center";
		tr.appendChild(tddate);
	}
	if (_inc == "bestof" || _inc == "voie" || _inc == "gvoie") {
		var tdnom = document.createElement("td");
		tdnom.appendChild(text("Nom"));
		tdnom.style.textAlign = "left";
		tr.appendChild(tdnom);
	}
	if (_inc == "bestof" || _inc == "voie" || _inc == "gvoie") {
		var tdlieu = document.createElement("td");
		tdlieu.appendChild(text("Lieu"));
		tdlieu.style.width = "150px";
		tdlieu.style.textAlign = "left";
		tr.appendChild(tdlieu);
	}
	if (_inc == "bestof" || _inc == "voie" || _inc == "gvoie") {
		var tdnote = document.createElement("td");
		tdnote.appendChild(text("Note"));
		tdnote.style.width = "60px";
		tdnote.style.textAlign = "center";
		tr.appendChild(tdnote);
	}
	if (_inc == "bestof" || _inc == "voie" || _inc == "gvoie") {
		var tdloupe = document.createElement("td");
		tdloupe.appendChild(text(" "));
		tdloupe.style.width = "20px";
		tdloupe.style.textAlign = "left";
		tr.appendChild(tdloupe);
	}
}

function createTableGvoie(_xml) {
	var root = _xml.getElementsByTagName("listing")[0];
	$('ajaxtable').empty();
 	var div = new Element('div',{
		'id':'accordion'
	}).inject($("ajaxtable"), 'after');
	
	var list_gvoie = root.getElementsByTagName("gvoie");
	for (var i = 0; i < list_gvoie.length; i++) {
		var h3 = document.createElement("h3");
		h3.setAttribute("class", "toggler");
		if (i == 0) {
			h3.style.borderTop = "0";
		}
		h3.appendChild(text(list_gvoie[i].getElementsByTagName("title")[0].firstChild.nodeValue + " - " + list_gvoie[i].getElementsByTagName("site_name")[0].firstChild.nodeValue));
		div.appendChild(h3);
		var loupe_div = document.createElement("div");
		loupe_div.style.styleFloat = "right";
		loupe_div.style.cssFloat = "right";
		loupe_div.style.paddingTop = "2px";
		h3.appendChild(loupe_div);
		var quali_img = document.createElement("img");
		quali_img.setAttribute("src", "./img/star" + list_gvoie[i].getElementsByTagName("quality")[0].firstChild.nodeValue + ".png");
		quali_img.style.marginRight = "7px";
		quali_img.style.marginBottom = "3px";
		loupe_div.appendChild(quali_img);
		var list_voie = list_gvoie[i].getElementsByTagName("list_voie")[0].getElementsByTagName("voie");
		var subdiv = document.createElement("div");
		subdiv.setAttribute("class", "element");
		div.appendChild(subdiv);
		var table = document.createElement("table");
		table.style.borderTop = "1px solid #808080";
		table.cellSpacing = "0px";
		table.cellPadding = "0px";
		subdiv.appendChild(table);
		table.setAttribute("id", "tablegvoie" + i);
		table.setAttribute("class", "ajaxtable");
		//Header
		createFirstLine("gvoie", "tablegvoie" + i);
		//createFirstLine(_inc);
		//Body
		var tbody = document.createElement("tbody");
		table.appendChild(tbody);
		var k = 0;
		//alert("lol");
		for (var j = 0; j < list_voie.length; j++) {
			var tr = document.createElement("tr");
			tr.setAttribute("class", "line" + k);
			if (k == 0) {
				k = 1;
			} else {
				k = 0;
			}
			tbody.appendChild(tr);
			var tdcote = document.createElement("td");
			tr.appendChild(tdcote);
			tdcote.appendChild(text(list_voie[j].getElementsByTagName("cote")[0].firstChild.nodeValue));
			tdcote.style.textAlign = "center";
			var tddate = document.createElement("td");
			tr.appendChild(tddate);
			tddate.appendChild(text(list_voie[j].getElementsByTagName("date")[0].firstChild.nodeValue));
			tddate.style.textAlign = "center";
			var tdnom = document.createElement("td");
			tr.appendChild(tdnom);
			tdnom.appendChild(text(list_voie[j].getElementsByTagName("title")[0].firstChild.nodeValue));
			var tdlieu = document.createElement("td");
			var alieu = document.createElement("a");
			alieu.setAttribute("href", "site-" + list_gvoie[i].getElementsByTagName("site_id")[0].firstChild.nodeValue + ".html");
			alieu.appendChild(text(list_gvoie[i].getElementsByTagName("site_name")[0].firstChild.nodeValue));
			tdlieu.appendChild(alieu);
			tr.appendChild(tdlieu);
			var tdqual = document.createElement("td");
			var imgqual = document.createElement("img");
			imgqual.setAttribute("src", "./img/star" + list_voie[j].getElementsByTagName("quality")[0].firstChild.nodeValue + ".png");
			tdqual.appendChild(imgqual);
			tr.appendChild(tdqual);
			var tdzoom = document.createElement("td");
			var imgzoom = document.createElement("img");
			imgzoom.setAttribute("src", "./img/zoom.png");
			imgzoom.style.cursor = "pointer";
			imgzoom.setAttribute("onclick", "ficheVoie(" + list_voie[j].getElementsByTagName("id")[0].firstChild.nodeValue + ", this);");
			tdzoom.appendChild(imgzoom);
			tr.appendChild(tdzoom);
		}
	}

	accordion(-1);
}

function menu(_i) {
	for (var i = 1; i <= 8; i++) {
		$("item" + i).set({'class':''});
	}
	$("item" + _i).set({'class':'item_active'});
}

function text(_s) {
	return document.createTextNode(_s);
}

function ficheVoie(_id, _sender) {
	//Récupération de la taille disponible à l'écran
	var clientW =window.getWidth();
	var clientH = window.getHeight();
	
	//Si les calques sont déjà existants, on les supprime
	if (($(idDivBack) != null) && ($(idDivFront) != null)) {
		deleteLayers();
	}
	var myBody = $$("body")[0];
	//div arrière avec transparence
	var divBack = new Element('div', {
		'id': idDivBack,
	}).inject(myBody);
	//div de devant sans transparence pour afficher qqchose dedans
	var divFront = new Element('div', {
		'id': idDivFront,
	}).inject(myBody);
	//on supprime les calques au click sur le calque
	/* 	$(idDivFront).addEvent('click', function(){	

		deleteLayers();

	}); */
	// div de contenu
	var divFiche = new Element('div', {
		'id': idFicheVoie,
		'styles': {
			'top': (clientH / 2) - 25 + 'px',
			'left': (clientW / 2) - 25 + 'px',
			'font-weight': 'bold',
		},
	}).inject(divFront);
	var imgLoad = new Element('img', {
		'src': './img/circleloader.gif',
		'id': idImgLoad,
	}).inject(divFiche);
	// apparition du calque de contenu
	$(idFicheVoie).get('tween', {
		property: 'opacity',
		duration: 'short'
	}).start(0, 1).chain(function () {
		myurl = './lib/req/req_fichevoie.php?i=' + _id;
		new Request({
			url: myurl,
			method: 'get',
			onSuccess: function (Txt, XML) {
				// quand la requete est terminée, on fait disparaitre l'image
				$(idImgLoad).get('tween', {
					property: 'opacity',
					duration: 'short'
				}).start(1, 0).chain(function () {
					//quand l'image a disparue, on modifie la taille du calque de contenu
					var morph = new Fx.Morph(idFicheVoie, {
						duration: 'long'
					});
					morph.start({
						'width': '350px',
						'height': '228px',
						'left': (clientW / 2) - 175 + 'px',
						'top': (clientH / 2) - 114 + 'px',
					}).chain(function () {
						$(idFicheVoie).empty();
						$(idFicheVoie).set('styles', {
							'padding': '10px'
						});
						var list = XML.getElementsByTagName("listing")[0];
						var divHeader = new Element('div', {
							'styles': {
								'position': 'relative',
							},
							'html': 'Fiche de la voie : ' + list.getElementsByTagName("title")[0].firstChild.nodeValue,
						}).inject(divFiche);
						new Element('img', {
							'src': './img/close.png',
							'styles': {
								'position': 'relative',
								'float': 'right',
								'cursor': 'pointer',
							},
							'events': {
								'click': function () {
									$(idFicheVoie).empty();
									morph.start({
										'opacity': '0',
										'width': '0',
										'height': '0',
										'left': (clientW / 2) + 'px',
										'top': (clientH / 2) + 'px',
									}).chain(function () {
										deleteLayers();
									})
								},
							},
						}).inject(divHeader);
						new Element('hr', {
							'styles': {
								'background-color': '#8F8F8F',
								'color': '#8F8F8F',
								'border': '0',
								'height': '1px',
							},
						}).inject(divHeader);
						var vSite = new Element('span', {
							'html': 'Site : ',
						}).inject(divFiche);
						new Element('span').inject(divFiche);
						new Element('a', {
							'href': 'site-' + list.getElementsByTagName("site_id")[0].firstChild.nodeValue + '.html',
							'html': list.getElementsByTagName("site_title")[0].firstChild.nodeValue,
						}).inject(vSite);
						new Element('br').inject(divFiche);
						new Element('span', {
							'html': 'Réalisée le : ' + list.getElementsByTagName("date")[0].firstChild.nodeValue,
						}).inject(divFiche);
						new Element('br').inject(divFiche);
						new Element('span', {
							'html': 'Cotation : ' + list.getElementsByTagName("cote")[0].firstChild.nodeValue,
						}).inject(divFiche);
						if (list.getElementsByTagName("coteperso")[0].firstChild != null) {
							new Element('br').inject(divFiche);
							new Element('span', {
								'html': 'Cotation perso : ' + list.getElementsByTagName("coteperso")[0].firstChild.nodeValue,
							}).inject(divFiche);
						}
						new Element('br').inject(divFiche);
						new Element('span', {
							'html': 'Run : ' + list.getElementsByTagName("run")[0].firstChild.nodeValue,
						}).inject(divFiche);
						new Element('br').inject(divFiche);
						new Element('span', {
							'html': 'Note : ',
						}).inject(divFiche);
						new Element('img', {
							'src': './img/star' + list.getElementsByTagName("quality")[0].firstChild.nodeValue + ".png",
						}).inject(divFiche);
						new Element('br').inject(divFiche);
						new Element('span', {
							'html': 'Commentaire : ',
						}).inject(divFiche);
						new Element('br').inject(divFiche);
						var text = "";
						if (list.getElementsByTagName("text")[0].firstChild == null || list.getElementsByTagName("text")[0].firstChild.nodeValue == "") {
							text = " - ";
						} else {
							text = list.getElementsByTagName("text")[0].firstChild.nodeValue;
						}
						new Element('div', {
							'html': text,
							'styles': {
								'max-height': '68px',
								'overflow': 'auto',
								'border': '1px solid #8F8F8F',
								'padding': '8px',
								'text-align': 'justify',
								'background-color': '#7C7C7C',
							}
						}).inject(divFiche);
					});
				});
			}
		}).send();
	});
}

function initGmap(_lat, _long, _z)
{
	if (GBrowserIsCompatible()) {
		Gmap = new GMap2($("google-map"));
		Gmap.setCenter(new GLatLng(_lat, _long), _z);
		Gmap.setMapType(G_HYBRID_MAP);
		Gmap.setUIToDefault();
		Gmap.addOverlay(new GMarker(new GLatLng(_lat, _long)));
	}
}