
/**
 *	A3non Tree Navigation System
 *	
 * @author Andi Dittrich <andi.dittrich@a3non.org>
 * @copyright 2009-2010 by a3non.org - Alle Rechte vorbehalten.	
 */

Sandbox.TreeNavigation = new Class({
	Implements: [Options, Events],
	
	options: {
		block0: null,
		blockl1: null,
		blockl2: null,
		blockr1: null,
		blockr2: null
	},
	
	level1ActiveElement: null,
	level2ActiveElement: null,
	
	initialize: function(options){
		this.setOptions(options);
		var THIS = this;

		// get all raw menu elements
		this.options.block0.getElements('a').each(function(element, index){
			// remove link handler
			element.removeEvents('click');
			
			// add event on a elements (only first level is accessable)
			element.addEvent('click', function(){
				// remove all highlighted items
				if (THIS.level1ActiveElement){
					THIS.level1ActiveElement.getParent().removeClass('treenaviTreeL1Active');
				}
									
				// check for parent items, if exists display branch
				if (element.getParent().getFirst('ul') != null) {
					// set background (tree l1 active) on parent li element
					element.getParent().addClass('treenaviTreeL1Active');
				}else{
					THIS.fireEvent('link', [element.get('href'), 0]);
				}
				
				// set active element
				THIS.level1ActiveElement = element;	
				
				// new level1 root nodes
				var l1Root = new Element('ul');
				var r1Root = new Element('ul');
				
				// get all parent a elements
				var childs = element.getParent().getElement('ul');
		
				// workaround...
				if (childs != null){
					childs = childs.getChildren().clone();
					
					// if direct link is avaible, add subitem
					if (element.get('href') && element.get('href').length > 0) {
						var li = new Element('li');
						li.grab(new Element('a', {
							'text': element.get('text'),
							'href': element.get('href')
						}));
					
						childs.unshift(li);
					}
					
					// get amount of elements for each side
					leftCount = Math.ceil(childs.length/2);
		
					// split elements into left/right side
					var l1Elements = childs.clone().slice(0, leftCount);
					var r1Elements = childs.clone().slice(leftCount);
					
					// add elements
					l1Root.adopt(l1Elements);
					r1Root.adopt(r1Elements);						
					
					// add left events
					l1Elements.each(function(element2, index2){
						element2.addEvent('click', function(){
							// remove l2 elements
							THIS.options.blockl2.setStyle('height', 10);
							THIS.options.blockr2.setStyle('height', 10);
							THIS.options.blockr2.getChildren().dispose();
							THIS.options.blockl2.getChildren().dispose();
							
							// remove active link
							if (THIS.level2ActiveElement){
								THIS.level2ActiveElement.removeClass('treenaviTreeL2Active');
								THIS.level2ActiveElement.getFirst('a').removeClass('treenaviElementL1Active');
							}
							
									
							// get sub navi elements
							subelement = element2.getFirst('ul');
							
							// check if subelements are avaible
							if (subelement != null){
								// add active link
								element2.addClass('treenaviTreeL2Active');
								element2.getElement('a').addClass('treenaviElementL1Active');
								
								// store active element
								THIS.level2ActiveElement = element2;
		
								subelement = subelement.clone();
								
								// if direct link is avaible, add subitem
								if (element2.getFirst('a').get('href') && element2.getFirst('a').get('href').length > 0) {
									var li = new Element('li');
									li.grab(new Element('a', {
										'text': element2.getFirst('a').get('text'),
										'href': element2.getFirst('a').get('href')
									}));
		
									subelement.adopt(li, 'top');
								}
							
								// append elements
								THIS.options.blockl2.setStyle('height', 'auto');
								THIS.options.blockl2.grab(subelement);
								
								// modifie events
								subelement.getChildren().each(function(element3, index3){
									element3.addEvent('click', function(){
										THIS.fireEvent('link', [element3.getFirst('a').get('href'), 2]);
										return false;
									});
								});
								
								// get element position relative to start of tree navi, offset 10px
								elementPosition1 = element2.getPosition($(THIS.options.block0)).y + 10;
			
								// set offset padding to l2 container
								offset = elementPosition1-subelement.getSize().y/2;	
								if (offset > 0) {
									subelement.setStyle('padding-top', offset);
								}
							}else{
								THIS.fireEvent('link', [element2.getFirst('a').get('href'), 1]);
							}
															
							// deny href by browser
							return false;
						});
					});
					
					// add right events
					r1Elements.each(function(element2, index2){
						element2.addEvent('click', function(){
							// remove r2 elements
							THIS.options.blockl2.setStyle('height', 10);
							THIS.options.blockr2.setStyle('height', 10);
							THIS.options.blockr2.getChildren().dispose();
							THIS.options.blockl2.getChildren().dispose();
							
							// remove active link
							if (THIS.level2ActiveElement){
								THIS.level2ActiveElement.removeClass('treenaviTreeL2Active');
								THIS.level2ActiveElement.getFirst('a').removeClass('treenaviElementL1Active');
							}
									
							// get sub navi elements
							subelement = element2.getFirst('ul');
							
							// check if subelements are avaible
							if (subelement != null){
								// add active link
								element2.addClass('treenaviTreeL2Active');
								element2.getElement('a').addClass('treenaviElementL1Active');
								
								// store active element
								THIS.level2ActiveElement = element2;
		
								subelement = subelement.clone();
								
								// if direct link is avaible, add subitem
								if (element2.getFirst('a').get('href') && element2.getFirst('a').get('href').length > 0) {
									var li = new Element('li');
									li.grab(new Element('a', {
										'text': element2.getFirst('a').get('text'),
										'href': element2.getFirst('a').get('href')
									}));
		
									subelement.adopt(li, 'top');
								}
							
								// append elements
								THIS.options.blockr2.setStyle('height', 'auto');
								THIS.options.blockr2.grab(subelement);
								
								// modifie events
								subelement.getChildren().each(function(element3, index3){
									element3.addEvent('click', function(){
										THIS.fireEvent('link', [element3.getFirst('a').get('href'), 2]);
										return false;
									});
								});
								
								// get element position relative to start of tree navi, offset 10px
								var elementPosition1 = element2.getPosition($(THIS.options.block0)).y + 10;
			
								// set offset padding to l2 container
								var offset = elementPosition1-subelement.getSize().y/2;	
								if (offset > 0) {
									subelement.setStyle('padding-top', offset);
								}
							}else{
								THIS.fireEvent('link', [element2.getFirst('a').get('href'), 1]);							
							}
															
							// deny href by browser
							return false;
						});
					});
					
					
				}
				
				// append root element to next level
				THIS.options.blockl1.getChildren().dispose();
				THIS.options.blockl2.getChildren().dispose();
				THIS.options.blockl2.setStyle('height', 10);
				THIS.options.blockl1.grab(l1Root);
				
				// append root element to next level
				THIS.options.blockr1.getChildren().dispose();
				THIS.options.blockr2.getChildren().dispose();
				THIS.options.blockr2.setStyle('height', 10);
				THIS.options.blockr1.grab(r1Root);
									
				// get element position relative to start of tree navi, offset 10px
				var elementPosition0 = element.getPosition($(THIS.options.block0)).y + 10;
		
				// set offset padding to l1 container
				var offset = elementPosition0-l1Root.getSize().y/2;	
				if (offset > 0) {
					l1Root.setStyle('padding-top', offset);
				}
				
				// set offset padding to r1 container					
				offset = elementPosition0-r1Root.getSize().y/2;	
				if (offset > 0) {
					r1Root.setStyle('padding-top', offset);
				}
				
				// deny href by browser
				return false;
			});
		});		
	}
});

