	// for javascript dependant css
	document.observe("dom:loaded", function() 
	{
		
 			var head = document.getElementsByTagName("head")[0];
			if (head) {
				var scriptStyles = document.createElement("link");
				scriptStyles.rel = "stylesheet";
				scriptStyles.type = "text/css";
				scriptStyles.href = "/css/script-styles.css";
				head.appendChild(scriptStyles);
			}
 	});
		
	// observe the change - when a scroll button is pressed
	// should it or other scrollers be enabled/disabled
	document.observe("scr:change", checkCount);
	
	// initiates the scrolling functionality
	document.observe("dom:loaded", function() 
	{
		// get all the links that scroll 
    	var scrollr = $$('a.scr');
    	
    	// distance to move the window
   		var winWidth = 904;
		
		// counter
		var i = 0;
 
		
   		while (i < scrollr.length)
   		{
   			
   			// does the links scroll to the right or left?
   			// check it's class attribute for left and right and 
   			// assign the true/false values
   			scrollr[i].left = $(scrollr[i]).hasClassName('left');
   			
   			scrollr[i].right = $(scrollr[i]).hasClassName('right');
    		
    		// initially disable the scroller 
			disableItem(scrollr[i]);
			
			// we need to know which scroll window this scroller is for
			// so we look for src_windowId
			var scrPattern = new RegExp('^scr_','g');
			
			// look at the classes for this anchor
			var classes = scrollr[i].className.split(' ');

			var c = 0;
			
			// for each class if it matches the pattern we can extract the id of the 
			// associated window
			while (c < classes.length)
			{
				
				if (classes[c].match(scrPattern))
				{
					// elmId is the id of the associated window
					var elmId = classes[c].replace("scr_","");
				}
				
				c++;
			}
			
			
			// assign a var of window to the scroller which is a 
			// reference to the associated window
			scrollr[i].window = $(elmId);
   				
   			// if this scroller scrolls right and there are more that on windows worth of
   			// items we need to enable the right scroller
			if ((scrollr[i].right) && (scrollr[i].window.childNodes.length > 4 )) 
			{
 				enableItem(scrollr[i]);
			}

    		// we then define what should happen when you scroll right	
   			scrollr[i].onclick = function()
   			{
   				// if the scroller has been disabled do nothing
   				if(this.disabled) {return false;}
   				
   				// if we have an associated window
   				if (this.window)
   				{
   					
   					// if we don't have a window.count variable 
   					// initialise it
   					if (!this.window.count)
   					{
   						// count is used to determine the window position
   						this.window.count = 0;
   						// inc is used to determine where we are and therefore which scrollers should be enabled/disabled
   						this.window.inc = 1;
   					}
   					
   					// if this is a left scroller decrement the count by -1 otherwise decrement by 1
   					this.window.count -= (this.left) ? -1 : 1 ;
   					
					// move the window to a specific point calculated from its winWidth * count 
					// i.e. to scroll right the first time count is set to 0, then decremented by 1 (-1) then multiplied by winWidth = -904
    				new Effect.Move(this.window,{ x: winWidth * this.window.count, y: 0, mode: 'absolute', duration: 0.4});

					// if this is a left scroller we need to decrement the inc value so we know where we are
					// and vice versa for right scroller - so after scrolling to the right from start we're at position/inc = 1
   					if (this.hasClassName('left'))
   					{
   						this.window.inc--;
   					}
   					else
   					{
   						this.window.inc++;
   					}
					
					// we need to fire an event (scr:change) which will enable/disabled other scrollers e.g. when we've reached the
					// end of the window
					// passing a few params - the window, and the number of child items
   					this.window.fire('scr:change', { window: this.window, total: this.window.childNodes.length});
    					

   				}
   				// finally return false
   				return false;
   			}
   			i++;	
   		}
	});
	
	// checks the scrollers and enables/disables as required
	function checkCount(event) 
	{
 		// scroller id's are in the format src_windowId_l or left or src_windowId_r for right
		var sr = "scr_"+event.memo.window.id+"_r";
		var sl = "scr_"+event.memo.window.id+"_l";
		
		// if the total number of items less than or equal to item we could potentially see
		// at the current position then disble the right scroller
		if(event.memo.total <= (event.memo.window.inc * 4))
		{
			disableItem($(sr));		
		}
		else
		{
			enableItem($(sr));
		}

		// if we're not at the starting position enable the left scroller
		if (event.memo.window.inc > 1) 
		{						
			enableItem($(sl));
 		}

		// if we're at the starting position disable the left scroll 
		if (event.memo.window.inc == 1) 
		{						
			disableItem($(sl));
		}
	}


	function disableItem(i) 
	{
		if (i.hasClassName('left'))
		{
			i.addClassName('disabled');
		}else{
			i.addClassName('disabledr');
		}
		
		i.disabled = true;
	}


	function enableItem(i) 
	{
		if (i.hasClassName('left'))
		{
			i.removeClassName('disabled');
		}
		else
		{
			i.removeClassName('disabledr');
		}
		
		i.disabled = false;
	}
	
	
	
function setCurrent(elm) 
{
	$(elm).addClassName('current');
}


function createTabs(initialTab) 
{
	
	var tabs = $$('a.tab');
	
 	var i = 0;
 	
	currentTabContent = null;
	currentTab = null
	
 	if ($(initialTab)) {
 		currentTabContent = $(initialTab);
 		currentTab = $("t_"+initialTab);
  	}
	
	while (i < tabs.length){
	
	
		var tabPattern = new RegExp('^tab_','g');
			
		// look at the classes for this tab
		var classes = tabs[i].className.split(' ');
	
			var c = 0;
			
		// for each class if it matches the pattern we can extract the id of the 
		// associated content window
		while (c < classes.length)
		{
			
			if (classes[c].match(tabPattern))
			{
				// elmId is the id of the associated window
				var tabWinId = classes[c].replace("tab_","");
			}
			
			c++;
		}
		
		tabs[i].tabContent = $(tabWinId);
		
		tabs[i].onclick = function(){
			
 			if (currentTabContent)
			{
				currentTabContent.removeClassName('show');
				currentTabContent.addClassName('hide');
 			}

 			if (currentTab)
			{
 				currentTab.removeClassName('active');
			}

			if(this.tabContent)
			{
				this.tabContent.addClassName('show');
				this.tabContent.removeClassName('hide');
				this.addClassName('active');
				currentTabContent = this.tabContent;
				currentTab = this;
 			}
			
			return false;
		}
		
		i++;
	}
}	
