var active_desc = null;
var triggerOnHover = true;
var hotZones = new Array('skills', 'specials');

function registerMouse(e)
{
	e.onmouseover = activate;
	e.onmouseout  = deactivate;
}

function unregisterMouse(e)
{
	e.onmouseover = null;
	e.onmouseout  = null;
}

function startTriggerOnHover()
{
	triggerOnHover = true;
	var skills = document.getElementsByTagName("img");
	for (var i = 0; i < skills.length; i++)
		if (skills[i].id != '') registerMouse(skills[i]);
}

function stopTriggerOnHover()
{
	triggerOnHover = false;
	var skills = document.getElementsByTagName("img");
	for (var i = 0; i < skills.length; i++)
		if (skills[i].id != '') unregisterMouse(skills[i]);
}

function init_toggle() {
	var skills = document.getElementsByTagName("img");
	for (var i = 0; i < skills.length; i++) {
		if (skills[i].id != '') {
			if (triggerOnHover) registerMouse(skills[i]);
			skills[i].onclick = toggle;
		}
	}
	if (document.addEventListener) {
		document.addEventListener("mousedown", pageMousedown, true);
	} else if (attachEvent) {
		document.attachEvent("onmousedown", pageMousedown);
	}
	
	var more = document.getElementsByTagName("div");
	for (var i = 0; i < more.length; i++) {
		if ((more[i].className == 'more') || (more[i].className == 'less')) {
			more[i].onclick = toggle_more;
		}
	}
	if (more = document.getElementById('all_more'))
		more.onclick = set_all_more;
	if (more = document.getElementById('all_less'))
		more.onclick = set_all_less;
}

function toggle() {
	var e = document.getElementById(this.id + "_desc");
	if (e && (e.className == 'desc')) {
		if (e == active_desc) {
			if (triggerOnHover) stopTriggerOnHover();
			else {
				startTriggerOnHover();
				this.className = '';
				e.style.visibility = 'hidden';
				active_desc = null;
			}
		} else {
			if (active_desc != null) {
				var active_img = document.getElementById(active_desc.id.slice(0, -5));
				active_img.className = '';
				active_desc.style.visibility = 'hidden';
			}
			this.className = 'active';
			e.style.visibility = 'visible';
			active_desc = e;
		}
	}
	return false;
}

function toggle_more()
{
	var hidden = (this.className == 'more');
	var reqs = this.parentNode.getElementsByTagName("li");
	for (var i = 0; i < reqs.length; i++) {
		if (reqs[i].className == 'extended') {
			if (hidden) {
				reqs[i].style.display = 'block';
				this.className = 'less';
			} else {
				reqs[i].style.display = 'none';
				this.className = 'more';
			}
		}
	}
}

function set_all_more()
{
	var reqs = document.getElementsByTagName("li");
	for (var i = 0; i < reqs.length; i++) {
		if (reqs[i].className == 'extended') reqs[i].style.display = 'block';
	}
	var more = document.getElementsByTagName("div");
	for (var i = 0; i < more.length; i++) {
		if (more[i].className == 'more') more[i].className = 'less';
	}
}

function set_all_less()
{
	var reqs = document.getElementsByTagName("li");
	for (var i = 0; i < reqs.length; i++) {
		if (reqs[i].className == 'extended') reqs[i].style.display = 'none';
	}
	var more = document.getElementsByTagName("div");
	for (var i = 0; i < more.length; i++) {
		if (more[i].className == 'less') more[i].className = 'more';
	}
}

/*********************** MouseOver Behavior ***********************/
function activate() {
	var e = document.getElementById(this.id + "_desc");
	if (e && (e.className == 'desc')) {
		if (e != active_desc) {
			if (active_desc != null) {
				var active_img = document.getElementById(active_desc.id.slice(0, -5));
				active_img.className = '';
				active_desc.style.visibility = 'hidden';
			}
			this.className = 'active';
			e.style.visibility = 'visible';
			active_desc = e;
		}
	}
	return false;
}

function deactivate() {
	var e = document.getElementById(this.id + "_desc");
	if (e && (e.className == 'desc')) {
		if (e == active_desc) {
			this.className = '';
			active_desc.style.visibility = 'hidden';
			active_desc = null;
		}
	}
	return false;
}

function inHotZone(el)
{
	for (var i = 0; i < hotZones.length; i++) {
		if (el.id == hotZones[i]) return true;
	}
	return false;
}

function pageMousedown(event)
{
	if (active_desc == null) return false;
	
//	var el = (event.target.tagName ? event.target : event.target.parentNode);
	var el;
	if (!event) var event = window.event;
	if (event.target) el = event.target;
	else if (event.srcElement) el = event.srcElement;
	if (el.nodeType == 3) el = el.parentNode;
	
	var container = el.parentNode;
	while (container != null && !inHotZone(container))
	  container = container.parentNode;
	if (container == null) {
		var active_img = document.getElementById(active_desc.id.slice(0, -5));
		active_img.className = '';
		active_desc.style.visibility = 'hidden';
		active_desc = null;
		
		startTriggerOnHover();
	}
}

addOnLoad(init_toggle);