//  *****************************************
//  *                                       *
//  *  LOW ARCHITECTEN - NAVIGATION SCRIPT  *
//  *                                       *
//  *  DEPENDS ON MOOTOOLS LIBRARY          *
//  *                                       *
//  *****************************************


//  INIT: MOVE TO JS-ON STATUS, SET EVENT BINDINGS
//
function lowInit()
{
	// Setup main menu and add events.
	var menu = new Element('ul', {'id': 'menu'}).injectInside(document.body);
	var menuReset = new Element('li', {'id': 'menu-reset'}).injectInside(menu);
	var menuResetLink = new Element('a', {'href': '#'}).appendText("alles uit").injectInside(menuReset);
	var menuResetText = new Element('span').appendText("toon alleen projectnamen").injectInside(menuReset);
	var menuNoord = new Element('li', {'id': 'menu-noord'}).injectInside(menu);
	var menuNoordLink = new Element('a', {'href': '#'}).appendText("N").injectInside(menuNoord);
	var menuNoordText = new Element('span').appendText("onze projecten in\u00A0kaart").injectInside(menuNoord);
	var menuNoordPijl = new Element('b').appendText("\u00A0").injectInside(menuNoord);
	
	menuReset.addEvent("click", resetProjects);
	menuReset.addEvent("mouseenter", toggleMenu);
	menuReset.addEvent("mouseleave", toggleMenu);
	menuNoord.addEvent("click", freezeMap);
	menuNoord.addEvent("mouseenter", toggleMap);
	menuNoord.addEvent("mouseleave", toggleMap);

	// Fetch project headers and attach events.
	$$(".project h3").each(function(el)
	{
		el.addEvent("mouseenter", toggleSingleMap);
		el.addEvent("mouseleave", toggleSingleMap);
		el.addEvent("click", showContent);
	});
	
	// Fetch 'low' header and attach events.
	$E("h3", "over-low").addEvent("mouseenter", toggleSingleMap);
	$E("h3", "over-low").addEvent("mouseleave", toggleSingleMap);
	$E("h3", "over-low").addEvent("click", showContent);
	
	$ES("a", "over-low").each(function(elem)
	{
		if (elem.rel == "popup") elem.target = "_blank";
	});
	
	// Set splash action if a splash image is present.
	$("splash").addEvent("click", hideSplash);
	
	window.scroll = new Fx.Scroll(window);
}



//  HELPER: Togglefunctions for menu mouseover/mouseout/click event
//
function toggleMap()
{
	this.toggleClass("over");
	$("content").toggleClass("noordover");
}

function toggleSingleMap()
{
	this.toggleClass("over");
	this.getParent().toggleClass("noordover");
}

function toggleMenu()
{
	this.toggleClass("over");
}

function freezeMap()
{
	this.toggleClass("actief");
	$("content").toggleClass("noordactief");

	if (typeof(this.blur) == 'function') this.blur();
}





//  HELPER: Show all project texts + images, but
//          turn off image and text visibility
function resetProjects()
{
	// Turf off all open content.
	$$(".actief").each(function(elem)
	{
		elem.removeClass("actief");
	});
	
	// Turn lightbox off.
	if (Lightbox) Lightbox.close();

	// Turn maps off.
	$("content").removeClass("noordactief");

	// Turn IE version of 'about low' view off.
	$("content").removeClass("over-low-actief");
	
	if (typeof(this.blur) == 'function') this.blur();
}



//  HELPER: Hide all project texts + images
//
function showContent()
{
	var divItem = this.getParent();

	if (divItem.id == "over-low")
	{
		if (divItem.hasClass("actief"))
		{
			divItem.setStyle('zIndex', 4);
		}
		else
		{
			// Close lightbox if it's open
			if ((typeof(Lightbox) == 'object') && 
			    (Lightbox.center.style.display == ''))
			{
				Lightbox.close();
			}
			
			divItem.setStyle('zIndex', 30);
		}
		
		$("content").toggleClass("over-low-actief");
	}

	// Close lightbox if it's open and 
	// its parent project is closed
	var controls = $ES(".controls a", divItem);
	if ((divItem.id != "over-low") &&
	    divItem.hasClass("actief") && 
	    (typeof(Lightbox) == 'object') && 
	    (Lightbox.center.style.display == '') &&
	    (controls[0].rel == Lightbox.lowRel))
	{
		Lightbox.close();
	}

	var divCoords = divItem.getCoordinates();
	if ((divItem.id != "over-low") && 
	    !divItem.hasClass("actief") &&
	    (divCoords['top'] > (window.getHeight() - 300)))
	{
		window.scroll.scrollTo(0, divCoords['top'] - 20);
	}

	divItem.toggleClass("actief");
	if (typeof(this.blur) == 'function') this.blur();
}


//  SPLASH: Hide splash image
//
function hideSplash()
{
  this.remove();
}



//  DOMREADY: Attach init routine to domready event
//
window.addEvent("domready", lowInit);