var tags = new Array("object", "select", "embed");

function GenerateEtracker() {
	var etracker = document.createElement("iframe");
	var etrackerid = document.createAttribute("id");
	etrackerid.nodeValue = "etracker_frame";
	etracker.setAttributeNode(etrackerid);
	
	var body = document.getElementsByTagName("body");
	
	body[0].appendChild(etracker);
}

function ReloadEtracker() {
	if (!document.getElementById('etracker_frame')) {
		GenerateEtracker();
	}
	
	var tracker = document.getElementById('etracker_frame');
	tracker.src = "etracker.php";
	tracker.style.display = "none";
}

function DisplayLayer(id, path)
{
	for (i = 0; i < tags.length; i++) {
		var elem = document.getElementsByTagName(tags[i]);
		for (j = 0; j < elem.length; j++) {
			elem[j].style.visibility = "hidden";
		}
	}

	window.scrollTo(0,240);
	CreateDomAttributes();
	
	var req = CreateAjaxRequest();
	
	if (!req)  {
		return;
	}
	
	var stripes = "";
	
	for (i = 0; i < path; i++) {
		stripes = stripes + "../";
	}
	
	url = stripes + "layer_ajax.php?id="+id;
	
	req.open("GET", url, true);  
	req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
	req.onreadystatechange = function() {
		switch (req.readyState) {
			case 4:
				if(req.status != 200) {
					return;
				} 
				else {					
					var child = eval("("+req.responseText+")");
					
					var bg = document.getElementById('layer_bg');
					bg.style.height = ((document.getElementsByTagName('body')[0].scrollHeight*1)+20 - 240) + "px";
					bg.align = "center";
						
					var html = '';
					html += '<div id="child">';
						html += '<div align="right" style="margin-top:5px; margin-bottom:5px;"><a style="color:#FF0000;" href="javascript:HideLayer();">schlie&szlig;en <img style="border:0px;" src="'+stripes+'_images/close.jpg" /></a></div>';
						html += '<div class="'+child['geschlecht']+'" style="height:30px; padding-top:15px; font-size:13px; font-weight:bold; color:#FFFFFF;">';
							html += '<div align="left" style="float:left; padding-left:10px;">'+child['vorname_kind']+ ' ' + child['nachname_kind'] + '</div>';
							html += '<div style="float:right; padding-right:10px;" align="right">geboren: '+child['geburtsdatum']+', '+child['uhrzeit']+'</div>';
						html += '</div>';
						
						html += '<div class="child_img '+child['geschlecht']+'" style="margin:10px 0 10px 0">';
							html += '<div align="left" style="float:left; padding:10px 0px 10px 10px; color:#FFFFFF;">Gro&szlig;ansicht</div>';
							html += '<div align="right" style="float:right; padding:10px 0px 10px 10px; margin-right:10px; color:#FFFFFF;">';
								html += '<a style="font-weight:bold; color:#FFFFFF;" href="/unterhaltung/wonneproppen/ecard/index.php?id='+child['fiona_ID']+'"><img style="border:0px;" src="/unterhaltung/wonneproppen/_images/brief.jpg" alt="Brief" /> Gru&szlig;karte versenden &raquo;</a>';
							html += '</div>';
							html += '<div id="layer_img"><img src="'+stripes+'_images/loading_gross.gif" /></div>';
							
							html += '<div style="background-color:#FFFFFF; width:610px; margin-top:15px;">';
								html += '<div style="width:175px;" class="daten" align="left">';
									html += '<div align="center" style="margin-top:10px; padding:10px 0 10px 0; font-size:13px; font-weight:bold;">Meine Daten:</div>';
									
									html += '<table border="0" cellpadding="0" cellspacing="0">';
									html += '<tr><td width="65">Gewicht:</td><td>'+child['gewicht']+' Gramm</td></tr>';
									html += '<tr><td>Gr&ouml;&szlig;e:</td><td>'+child['groesse']+' Zentimeter</td></tr>';
									html += '<tr valign="top"><td>Eltern:</td><td>'+child['eltern']+'</td></tr>';
									html += '</table><div style="height:10px;"></div>';
								html += '</div>';
							html += '</div>';
							html += '<div style="height:10px">&nbsp;</div>';
						html += '</div>';
						
					html += '</div>';
					
					var div = document.getElementById("layer");
					div.align = "center";
					div.innerHTML = html;
					div.style.display = "block";
					
					var bild = new Image();
					bild.src = child['bild'];
					
					bild.onload = function() {
						document.getElementById('layer_img').innerHTML = '<img width="600" src="'+child['bild']+'" />';
					}
					
					if(bild.complete && document.all) {
						bild.onload();
					}
					
					ReloadEtracker();
				}
				break;
			default:
				break;
		}
	}; 
	req.send(null);
}

function HideLayer()
{
	for (i = 0; i < tags.length; i++) {
		var elem = document.getElementsByTagName(tags[i]);
		for (j = 0; j < elem.length; j++) {
			elem[j].style.visibility = "visible";
		}
	}
	
	var div = document.getElementById("layer");
	var bg = document.getElementById('layer_bg');
	
	div.style.display = "none";
	bg.style.display = "none";
	
	//Erstelle DOM Objekte entfernen
	
	var bg = document.getElementById('layer_bg');
	var div = document.getElementById("layer");
	var body = document.getElementsByTagName("body");
	
	body[0].removeChild(div);
	body[0].removeChild( bg);
}

function CreateDomAttributes()
{	
	var background = document.createElement("div");
	var backgroundid = document.createAttribute("id");
	backgroundid.nodeValue = "layer_bg";
	background.setAttributeNode(backgroundid);
	
	var layer  = document.createElement("div");
	var layerid = document.createAttribute("id");
	layerid.nodeValue = "layer";
	layer.setAttributeNode(layerid);
	
	var body = document.getElementsByTagName("body");
	
	body[0].appendChild(layer);
	body[0].appendChild(background);
}

function CreateAjaxRequest() {
	if(window.XMLHttpRequest) {
		request = new XMLHttpRequest(); // Mozilla, Safari, Opera
	} 
	else if(window.ActiveXObject) {
		try {
			request = new ActiveXObject('Msxml2.XMLHTTP'); // IE 5
		} 
		catch (e) {
			try {
				request = new ActiveXObject('Microsoft.XMLHTTP'); // IE 6
			} 
			catch (e) { }
		}
	}
	return request;
}