/**
 * LAYER INDEX : the order of the z-index's
 *
 * 10 - Public Layer contains items that are removed from the flow to be positioned.
 * 20 - Lightbox overlay
 * 30 - Subnavigation (as long as the main link is above the lightbox it will not get shown)
 * 40 - Lightbox window container
 **/

/**
 * VARIABLES
 **/

var lightBox = null;	// dynamically created lightbox
var currentBox = null;	// box currently visible via lightbox

/**
* Make any tag into a clickable link. Just give it an href attribute.
*
* @return	null
* @access public
*/

function setLinks() {
	/* make any non <a> tag with an href into a link */
	/* <div href='http://www.google.com'>Click Me</div> */
	var links = $(document.body).getElements('*[href]');	// get the elements with an href
	links.each(
		function(el,i) {
			if(el.get('tag') != 'a' && el.get('class') != 'selected') {	// if it is not a <a> tag and it is not currently selected
				if(!el.get('lightbox')) el.addEvents(					// if it is not a lightbox link
					{
						'click' : function() {
									document.location = this.getProperty('href');
								  }
					}
				);
				if(!$(el.getProperty('nav'))) {												// if it does not have a subnav in the dom
					el.addEvents(
						{
							'mouseover': function(){
											el.set('class','selected');						// add the selected class
											el.setStyles({'cursor':'pointer'});				// give it a pointer
										 },
							'mouseout' : function() {
											el.removeClass('selected');
										 }
						}
					);
				}
			}
		}
	);
}

/**
* Create subnav / link association. Takes care of all the pointers, links and positioning.
*
* @param xxx $xxx	xxx
* @param xxx $xxx	xxx
* @return	xxx
* @access public
*/
function setSubnavs(pos,padding) {
	/* associate sublinks with their parents */
	/* example <a href='#' nav='myDivID' />Navigation</a><div id='myDivID'>Sublinks</div> */

	var linkTimer;		// subnav hide timer
	var currentNav;		// last subnav shown
	var links = $(document.body).getElements('*[nav]');	// get the navigation links with defined subnavs

	links.each(			// go through all the found links
		function(el,i) {
			var subnav = $(el.getProperty('nav'));	// get the id of the subnav from the attribute 'nav'
			if(subnav) {
				subnav.store('nav', el);
				el.addEvents(
					{
						'mouseover': function(){
										$clear(linkTimer);					// clear the linkTimer
                                                                        	if(currentNav) {
											currentNav.setStyle('display','none');		// hide the previous subnav
											currentNav.retrieve('nav').removeClass('selected');
										}
										el.set('class','selected');	// add the selected class
										el.setStyles({'cursor':'pointer'});
										currentNav = subnav;					// set it globally
										subnav.setStyle('display','block');						// show the current subnav
									 },
						'mouseout' : function() {
										// linkTimer = currentNav.hide.delay(50,currentNav);	// hide the subnav on a timer
										if(currentNav) linkTimer = (
															function(){
																currentNav.setStyle('display','none');
																currentNav.retrieve('nav').removeClass('selected');
															}
														).delay(150,currentNav);
									 }
					}
				);

				if(subnav) {
					subnav.addEvents(
						{
							'mouseover' : function() {
											$clear(linkTimer);					// clear the timer
										  },
							'mouseout' :  function() {
											// if(currentNav) linkTimer = currentNav.hide.delay(50,currentNav);	// hide the subnav on a timer
											if(currentNav) linkTimer = (
																function(){
																	currentNav.setStyle('display','none');
																	currentNav.retrieve('nav').removeClass('selected');
																}
															).delay(50,currentNav);
										  }
						}
					);
				}
			}
		}
	);
	setSubnavPositions(links);

	// sometimes the subnav's are not positioned correctly because all the images are not loaded - this will go through them again
	// and reset their position after the images have loaded - so subnav's maybe positioned incorrectly until all the images are loaded.
	window.addEvent('load', function(){
		setSubnavPositions(links);
	});
}

function setSubnavPositions(links) {
	if(!links) return;
	links.each(			// go through all the found links
		function(el,i) {
			var subnav = $(el.getProperty('nav'));	// get the id of the subnav from the attribute 'nav'
			var pos = el.getProperty('nav_pos');	// get position
			var pad = el.getProperty('nav_pad').toInt();	// get padding
			if(subnav) {
				var coords = el.getCoordinates(subnav.getParent());			// get location of the element
				var size = subnav.getSize();
				switch(pos) {
					case 'top':
						subnav.setStyles(
                                                	{
								'z-index' : '30',
								'position' : 'absolute',
								'top' : coords.top-(size.y+pad),
								'left' : coords.left
							}
						).setStyle('display','none');
						break;
					case 'left':
						subnav.setStyles(
							{
								'z-index' : '30',
								'position' : 'absolute',
								'top' : coords.top,
								'left' : coords.left-(size.x+pad)
							}
						).setStyle('display','none');
						break;
					case 'right':
						subnav.setStyles(
							{
								'z-index' : '30',
								'position' : 'absolute',
								'top' : coords.top,
								'left' : coords.left+(size.x-pad)
							}
						).setStyle('display','none');
						break;
					default :
						subnav.setStyles(										// remove and position the element
							{
								'z-index' : '30',
								'position' : 'absolute',
								'top' : coords.bottom+pad,
								'left' : coords.left
							}
						).setStyle('display','none');
						break;
			   }
			}
	});
}

function setToolTips() {
	/* Add a tooltip to all elements with a tip attribute */
	/* Example <a href='#' tip='Title::Text' /> */

	var as = $(document.body).getElements('*[tip]');	// get all the items with a tip attribute
	as.each(
		function(el,i) {
			var c = el.getProperty('tip').split('::');
			el.store('tip:title', c[0]);
			el.store('tip:text', c[1]);
		}
	);

	var tip = new Tips(									// add the tip to all of the items
		as,
		{
			fixed: false,
			hideDelay: 50,
			showDelay: 50
		}
	);

	tip.addEvents({										// fade them in and out
			'show': function(t) {
						t.fade('in');
					},
			'hide': function(t) {
						t.fade('out');
					}
	});
}

function setAdminMenu() {
	var myDrag = new Drag('admin_menu', {
		snap: 0
	});
}

function setLoginBox(el) {
	var win = window.getSize();
	var sz = $('login_container').getSize();
	var el = $('login_container').dispose();
	el.inject($(document.body));
	el.setStyles({
		'z-index' : 40,
		position : 'absolute',
		top : (win.y/2)-(sz.y/2),
		left : (win.x/2)-(sz.x/2)
	});
	el.setStyle('display','none');
}

function setLightbox() {
	var win = $(document.body).getSize();
	var lt = new Element('div', {
							styles: {
							   'height' : win.y,
							   'width' : win.x,
							   'z-index' : 20,
							   'background-color' : '#000',
							   'position' : 'absolute',
							   'top' : 0,
							   'left' : 0,
							   'opacity' : 0
							},
							'events' : {
								'click' : hideLightbox
							}
						}
					);
	lt.inject($(document.body));
	lightBox = lt;
}

function setLightboxLinks() {
	var lbs = $$('*[lightbox]');
	lbs.each(
		function(el,i){
			el.set(
				{
					'events' : {
						click: showLightbox
					},
					styles : {
						'cursor' : 'pointer'
					}
				}
			);
			$(el.get('lightbox')).setStyle('display', 'none');
		}
	);
	setLightbox();
}

function hideLightbox(t) {
	if($chk(currentBox)) currentBox.setStyle('display', 'none');;
	lightBox.fade(0);
	$(document.body).setStyle('overflow', 'auto');
	$(document.html).setStyle('overflow', 'auto');
}

function showLightbox(el) {
	var el = $(this.get('lightbox'));
	el.setStyle('display', 'block');
	lightBox.fade(.7);
	currentBox = el;
	currentBox.adopt(
		new Element('img',
			{
				src : '../images/universal/cancel.png',
				styles : {
					'position' : 'absolute',
					'top' : 24,
					'right' : 24,
					'cursor' : 'pointer'
				},
				events : {
					'click' : hideLightbox
				}
			}
		)
	);
	$(document.body).setStyle('overflow', 'hidden');
	$(document.html).setStyle('overflow', 'hidden');
}

