function handleEvent(el, ev, funct)
{
	if (window.addEventListener)	
	{
		el.addEventListener(ev, funct, false);
	}
	else if (window.attachEvent)
	{
		el.attachEvent("on" + ev, funct);
	}
}

var datos;
var conexion;
function ajaxConnect(uri, query)
{
	if (window.XMLHttpRequest)
	{
		conexion = new XMLHttpRequest();
	}
	else
	{
		if (window.ActiveXObject)
		{
			conexion = new ActiveXObject("Microsoft.XMLHTTP");
		}
	}

	conexion.onreadystatechange = function()
	{
		if (conexion.readyState == 4)
		{
			if (conexion.status == 200)
			{
				datos = conexion.responseText;
				window.document.getElementById("display").innerHTML = datos;
				pageTop();
			}
		}
	}

	conexion.open("POST", uri, true);
	conexion.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
	if (query)
	{
		conexion.send(query);
	}
	else
	{
		conexion.send(null);
	}
}

function computeStyle(el, prop)
{
	if (window.getComputedStyle)
	{
		return parseInt(window.getComputedStyle(el, null).getPropertyValue(prop));
	}	
	else if (el.currentStyle)
	{
		var camelProp;
		(function toCamel()
		{
			var str = prop;
			var subs1 = str.substring(0, str.indexOf("-"));
			var subs2 = str.substring((str.indexOf("-") + 1), str.length);
			var camel = subs2.substring(0, 1);
			camelProp = subs1 + camel.toUpperCase() + subs2.substring(1, subs2.length);
		})();
		return parseInt(el.currentStyle[camelProp]);
	}
}

var image;
function zoomImage(file, width, title, desc, date)
{
	this.width = width;
	var bg = document.createElement("div");
	bg.setAttribute("class", "zoom");
	if (navigator.appName.indexOf("Microsoft") != -1)
	{
		//Needs better detection
		bg.style.filter = "alpha(opacity=90)";
	}
	bg.style.position = "absolute";
	bg.style.top = "0px";
	bg.style.left = "0px";
	bg.style.width = window.document.body.offsetWidth +  "px";
	var addedHeight = computeStyle(document.getElementById("content"), "margin-top");
	addedHeight += computeStyle(document.getElementById("content"), "margin-bottom");
	bg.style.height = (window.document.body.offsetHeight + addedHeight) + "px";
	bg.style.backgroundColor = "black";
	bg.style.zIndex = 10;
	bg.style.opacity = ".9";
	window.document.body.appendChild(bg);

	var div = document.createElement("div");
	div.setAttribute("class", "zoom");
	div.style.position = "absolute";
	div.style.fontFamily = "'Verdana', 'Arial', sans-serif";
	div.style.backgroundColor = "black";
	div.style.color = "white";
	div.style.padding = "12px";
	div.style.paddingTop = 0;
	if (window.pageYOffset !== undefined)
	{
		div.style.top = (30 + window.pageYOffset) + "px";
	}
	else
	{
		div.style.top = (30 + document.body.parentNode.scrollTop) + "px";
	}
	div.style.left = (Math.ceil(window.document.body.clientWidth / 2) - (width / 2)) + "px";
	div.style.zIndex = 11;

	window.document.body.appendChild(div)

	image = new Image();
	image.src = file;

	var closeDiv = document.createElement("div");
	closeDiv.style.position = "relative";
	closeDiv.style.left = "auto";
	closeDiv.style.height = "12px";
	div.appendChild(closeDiv);
	closeDiv.style.minWidth = this.width + "px";
	closeDiv.style.marginBottom = "1px";
//	closeDiv.style.backgroundColor = "cornflowerblue";

	var closeButton = new Image();
	closeButton.setAttribute("id", "closeButton");
	closeButton.src = "grafics/close.jpg";
	closeButton.style.position = "relative";
	closeButton.style.left = "100%";
	closeButton.style.width = "12px";
	closeButton.style.height = "12px";
	closeButton.style.cursor = "pointer";
	closeButton.style.display = "none";
	handleEvent(closeButton, "click", function()
	{
		closeZoom();
	});

	closeDiv.appendChild(closeButton);

	handleEvent(div, "mouseover", function()
	{
		closeButton.style.display = "block";
		document.getElementById("lang").style.display = "block";
	});
	handleEvent(div, "mouseout", function()
	{
		closeButton.style.display = "none";
		document.getElementById("lang").style.display = "none";
	});

	var imgDiv = document.createElement("div");
	imgDiv.style.border = "solid 1px black";
	imgDiv.style.zIndex = 12;
	imgDiv.appendChild(image);
	div.appendChild(imgDiv);

	var textDiv = document.createElement("div");
	textDiv.style.cssFloat = "left";
	textDiv.style.marginTop = "6px";
	textDiv.style.width = width + "px";

	var descDiv = document.createElement("div");
	descDiv.style.cssFloat = "left";
	descDiv.style.width = "100%";
	descDiv.style.fontSize = "10px";
	descDiv.style.minHeight = "60px";

	var langDiv = document.createElement("div");
	langDiv.setAttribute("id", "lang");
	langDiv.style.cssFloat = "left";
	langDiv.style.width = "100%";
	langDiv.style.marginTop = "6px";
	langDiv.style.fontSize = ".7em";
	langDiv.style.display = "none";
	langDiv.style.textAlign = "right";
	
	var langs = ['cat', 'es'];
	for (var i = 0; i < langs.length; i++)
	{
		var item = document.createElement("span");
		item.appendChild(document.createTextNode(langs[i]));
		item.style.position = "relative";
		item.style.padding = "1px";
		item.style.margin = "1px";
		item.style.textAlign = "center";
		item.style.cursor = "pointer";
		item.style.backgroundColor = "gray";
		item.style.color = "#2f2f30";
		langDiv.appendChild(item);
	}

	var langItems = langDiv.getElementsByTagName("span");
	handleEvent(langItems[0], "click", function()
	{
		descP.innerHTML = desc[0];
	});
	handleEvent(langItems[1], "click", function()
	{
		descP.innerHTML = desc[1];
	});

	var docFragment = document.createDocumentFragment();

	var titleP = document.createElement("p");
	titleP.style.margin = 0;
	titleP.style.padding = "3px";
	titleP.style.fontWeight = "bold";
	titleP.appendChild(document.createTextNode(title));

	var descP = document.createElement("p");
	descP.innerHTML = desc[0];
	descP.style.margin = 0;
	descP.style.width = "70%";
	descP.style.marginTop = "4px";
	descP.style.padding = "4px";

	var dateP = document.createElement("p");
	dateP.appendChild(document.createTextNode(date));
	dateP.style.margin = 0;
	dateP.style.marginTop = "6px";

	docFragment.appendChild(titleP);
	docFragment.appendChild(descP);
	docFragment.appendChild(dateP);

	descDiv.appendChild(docFragment);

	textDiv.appendChild(descDiv);
	textDiv.appendChild(langDiv);

	div.appendChild(textDiv);
}

function closeZoom()
{
	var divEls = document.getElementsByTagName("div");
	var zoomClass = new Array();
	for (var i = 0; i < divEls.length; i++)
	{
		if (divEls[i].getAttribute("class") == "zoom") zoomClass.push(divEls[i]);
	}

	if (zoomClass.length > 0)
	{
		for (var i = 0; i < zoomClass.length; i++)
		{
			window.document.body.removeChild(zoomClass[i]);
		}
	}
	image = undefined;
}

function pageTop()
{
	var timeout;
	timeout = window.setTimeout(function()
	{
		window.location.href = "#top";
		window.clearTimeout(timeout);
	}, 100);
}

handleEvent(window, "keypress", function()
{
	if (arguments[0].keyCode == 27)
	{
		closeZoom();
	}
});

handleEvent(window, "load", function()
{

	var pageTop = document.createElement("a");
	pageTop.name = "top";
	window.document.body.insertBefore(pageTop, window.document.body.childNodes.item(0));

	// XHR CURRICULUM
	var cvLink = document.getElementById("cv");
	handleEvent(cvLink, "mouseover", function()
	{
		cvLink.style.textDecoration = "underline";
	});
	handleEvent(cvLink, "mouseout", function()
	{
		cvLink.style.textDecoration = "none";
	});
	handleEvent(cvLink, "click", function()
	{
		ajaxConnect("cv.php", null);
	})
});