function setcookie(name, value, expires, path, domain, secure) 
{ 
document.cookie= name + "=" + escape(value) + 
((expires)? "; expires=" + expires.toGMTString() : "") + 
((path)? "; path=" + path : "") + 
((domain)? "; domain=" + domain : "") + 
((secure)? "; secure" : ""); 
}

window.addEvent('domready', function(){
	
	window.addEvent('load',function(f){
		
		var float = (getHeight().toInt()-$('container').getStyle('height').toInt())/2;
		
		if (float < 20) {
			setcookie ("small_version", "true");
			var myCSS = new Asset.css ('css/small.css', {});
		}
		
		var float = (getHeight().toInt()-$('container').getStyle('height').toInt())/2;
		if (float < 0) {
			$('container').setStyle ('top', '0');
			$('container').setStyle ('margin-top', '0px');
		}
		
		
		
	});


	window.addEvent('resize',function(e){

	});
});


/* MENU FUNCTIONALITY */
  window.addEvent('domready', function() { //starten van het dom event hoort bij mootools
	
	var currentMargin = 0;
	var showTheNext = 1;
	
			
			// Again we are able to create a morph instance
			
			
			var currEle = $('menuholder');
			
			var startOfPage = currEle.getPosition().x;
			
			if ($('menu_1')) { 
				
				var menuWidth = 0;
				$('menu_1').getChildren('li').each(function(el){
					menuWidth += el.getSize().x;
				});
				
				$('menu_1').setStyle ('width', menuWidth);
				
				if (menuWidth > 500 ) { 
	
					currMenu = $('menu_1');
					currWidth = currMenu.getSize().x - 30;
					
					widthOfContainer = $('menuholder').getSize().x;
					var bMorphIsDone = true;
					
								
					var selectedEle;
					
					if (selectedEle = $('menu_1').getElement('.selected')) { 
						var positionOfSelected = selectedEle.getParent('li').getCoordinates('menuholder').left + selectedEle.getSize().x;

				//	window.status = "pos selected " + positionOfSelected + " width of container " +widthOfContainer ;
					} else {
						positionOfSelected = currMenu.getCoordinates('menuholder').left;
					}
					if (positionOfSelected > (widthOfContainer)) {
						bMorphIsDone = false;
						
						currLeft = currMenu.getCoordinates('container').left;
					
						startHeight = (currMenu.getCoordinates().top)+'px';
						var stillToGoRight = currWidth + currLeft - widthOfContainer;
						
						var newMargin = (-1) * (Math.ceil((positionOfSelected-widthOfContainer)/500) * 500);
						
						currentMargin = newMargin;
						
						var morph = new Fx.Morph('menu_1');
						
						morph.start({
								duration: 0,
								'margin-left': (newMargin) + 'px'
						});
						morph.addEvent ('onComplete', function (el) {
							bMorphIsDone = true;
						});
					}

					
					$('menu_1').addEvent('mouseover', function(e) {

						if (bMorphIsDone) { 
							bMorphIsDone = false;
							currLeft = currMenu.getCoordinates('container').left;
						
							startHeight = (currMenu.getCoordinates().top)+'px';
							var stillToGoRight = currWidth + currLeft - widthOfContainer;
							var stillToGoLeft = currWidth - stillToGoRight - widthOfContainer;
					//		window.status = 'still left ' + stillToGoLeft + ' still right ' + stillToGoRight + ' currwidth = ' + currWidth + ' currLeft ' + currLeft + ' width of container ' + widthOfContainer;

							var bNext, bPrev;

							bNext = false;
							bPrev = false;
							if (stillToGoRight > 0) {
								bNext = true; 
							} 
							if (stillToGoLeft > 0)  {

								bPrev = true;
							}
						
							e.stop();

							if (e.client.x > (startOfPage)+500 && bNext) {
								currentMargin = currentMargin + (-500);
							
							} else if (e.client.x < (startOfPage+150) && bPrev) {
								currentMargin = currentMargin + 500;
							}
							var morph = new Fx.Morph('menu_1');
						
							morph.start({
									duration: 2000,
									'margin-left': currentMargin + 'px'
							});
							morph.addEvent ('onComplete', function (el) {
								bMorphIsDone = true;
							});
						} 
					});
					

					

					
			
				}
			}
			
		
				
				
			

	});
	window.addEvent('domready', function() { //starten van het dom event hoort bij mootools

		var currentMargin2 = 0;
		var showTheNext2 = 1;


				// Again we are able to create a morph instance


				var currEle = $('menuholder');

				var startOfPage = currEle.getPosition().x;

				if ($('menu_2')) { 

					var menuWidth = 0;
					$('menu_2').getChildren('li').each(function(el){
						menuWidth += el.getSize().x;
					});

					$('menu_2').setStyle ('width', menuWidth);

					if (menuWidth > 500 ) { 

						currMenu2 = $('menu_2');
						currWidth = currMenu2.getSize().x - 30;


						widthOfContainer = $('menuholder').getSize().x;
						var bMorphIsDone = true;

						var selectedEle = $('menu_2').getElement('.selected');
						var positionOfSelected = selectedEle.getParent('li').getCoordinates('menuholder').left + selectedEle.getSize().x;

						window.status = "pos selected " + positionOfSelected + " width of container " +widthOfContainer ;

						if (positionOfSelected > (widthOfContainer)) {
							bMorphIsDone = false;

							currLeft = currMenu2.getCoordinates('container').left;

							startHeight = (currMenu2.getCoordinates().top)+'px';
							var stillToGoRight = currWidth + currLeft - widthOfContainer;

							var newMargin = (-1) * (Math.ceil((positionOfSelected-widthOfContainer)/500) * 500);

							currentMargin2 = newMargin;

							var morph = new Fx.Morph('menu_2');

							morph.start({
									duration: 0,
									'margin-left': (newMargin) + 'px'
							});
							morph.addEvent ('onComplete', function (el) {
								bMorphIsDone = true;
							});
						}


						$('menu_2').addEvent('mouseover', function(e) {

							if (bMorphIsDone) { 
								bMorphIsDone = false;
								currLeft = currMenu2.getCoordinates('container').left;

								startHeight = (currMenu2.getCoordinates().top)+'px';
								var stillToGoRight = currWidth + currLeft - widthOfContainer;
								var stillToGoLeft = currWidth - stillToGoRight - widthOfContainer;
						//		window.status = 'still left ' + stillToGoLeft + ' still right ' + stillToGoRight + ' currwidth = ' + currWidth + ' currLeft ' + currLeft + ' width of container ' + widthOfContainer;

								var bNext, bPrev;

								bNext = false;
								bPrev = false;
								if (stillToGoRight > 0) {
									bNext = true; 
								} 
								if (stillToGoLeft > 0)  {

									bPrev = true;
								}

								e.stop();

								if (e.client.x > (startOfPage)+500 && bNext) {
									currentMargin2 = currentMargin2 + (-500);

								} else if (e.client.x < (startOfPage+150) && bPrev) {
									currentMargin2 = currentMargin2 + 500;
								}
								var morph = new Fx.Morph('menu_2');

								morph.start({
										duration: 2000,
										'margin-left': currentMargin2 + 'px'
								});
								morph.addEvent ('onComplete', function (el) {
									bMorphIsDone = true;
								});
							} 
						});






					}
				}






		});

	

	var startHeight;
	
	function showNextPrevious(startOfPage, currMenu) {
		
		// if margin does not match with width etc
		
		currWidth = currMenu.getSize().x;
		currLeft = currMenu.getCoordinates('container').left;

		startHeight = (currMenu.getCoordinates().top)+'px';
		widthOfContainer = $('menuholder').getSize().x;
		
		var stillToGoRight = currWidth + currLeft - widthOfContainer;
		var stillToGoLeft = currWidth - stillToGoRight - widthOfContainer;
		
		//var stillToGoLeft = 0;
		var bNext, bPrev;
		
	
		if (stillToGoRight > 0) {
			bNext = true; 
			bPrev = false;
		} 
		if (stillToGoLeft > 0)  {
		
			bNext = false;
			bPrev = true;
		}
		
		$('showNext').style.display = 'none';
		$('showPrevious').style.display = 'none';
		
		if (bNext) {
			
			$('showNext').style.display = 'block';
			$('showNext').style.left = (startOfPage+770)+'px';
			$('showNext').style.top = startHeight;
			
		}
		if (bPrev)	{

			$('showPrevious').style.display = 'block';
			$('showPrevious').style.left = (startOfPage-35)+'px';
			$('showPrevious').style.top = startHeight;
			
		}
		
//		window.status = "stilltogoleft = " + stillToGoLeft + " stilltogoright = " + stillToGoRight + " menu width="+currWidth + " startOfPage = " + startOfPage + " menu holder width = " + widthOfContainer + " currLeft = " + currLeft + " scrollsize = " + currMenu.getScrollSize().x + " currentScroll = " + currMenu.getScroll().x ;

		
	}