var Scroller = new Class({
	Binds: ['moveLeft','moveRight', 'moveUp', 'moveDown'],
	Implements: [Events, Options],
	options:{
		numVisibleBoxes : 3,
		moveLeftButtonId : 'move-left',
		moveRightButtonId : 'move-right',
		variableWidth : false,
		vertical : false
	},
	
	/*********************************
	* Mootools dependancies : Core, More [Class.Bind]
	*
	*
	*
	*********************************/
	
	initialize:function(scrollInnerId, boxClass, options){
		
		this.setOptions(options);
		
		this.busy = false;		
		this.numVisibleBoxes = this.options.numVisibleBoxes;
		this.boxClass = boxClass;
		this.scrollInnerId = scrollInnerId;
		this.scrollInner = $(scrollInnerId);			
		
		this.numBoxes = this.scrollInner.getElements(boxClass).length;				
		//initialise maxLeft & maxTop variable to 0
		this.maxLeft = 0;
		this.maxTop = 0;
		
		if(!this.options.vertical){
			/**
			* sideways scroller
			*/
			
			//variable width stuff
			this.elementPosition = 0;	
			if(this.options.variableWidth){					
				
				//create an array holding all the widths of the elements in the slider
				this.widthArray = $$(boxClass).map(function(el,index){						
					//get the element size and any margins
					var x = el.getSize().x;
					var ml = el.getStyle('margin-left').toInt();
					var mr = el.getStyle('margin-right').toInt();
					
					//tot up the total width of the element including margins
					var total = x + ml + mr;
					//add this box to the maxLeft value
					this.maxLeft += total;
					//pass the total element width including margins back into the width array
					return total;
				},this);
				this.maxLeft = this.maxLeft - (this.scrollInner.getParent().getSize().x);
				this.maxLeft = this.maxLeft * -1;
			} else {
				this.boxWidth = $$(boxClass)[0].getSize().x + $$(boxClass)[0].getStyle('margin-left').toInt() + $$(boxClass)[0].getStyle('margin-right').toInt();					
				this.maxLeft = (this.numBoxes - this.numVisibleBoxes ) * this.boxWidth * -1;					
			}
			
			this.scrollInner.setStyles({'left':0, 'position':'relative'});
			
			$(this.options.moveLeftButtonId).addEvent('click',this.moveRight.bind(this));
			$(this.options.moveRightButtonId).addEvent('click',this.moveLeft.bind(this));
			
		} else {
			/**
			* vertical scroller
			*/
			this.elementPosition = 0;
			
			//variable height stuff
			if(this.options.variableWidth){					
				
				//create an array holding all the widths of the elements in the slider
				this.heightArray = $$(boxClass).map(function(el,index){						
					//get the element size and any margins
					var y = el.getSize().y;
					var ml = el.getStyle('margin-top').toInt();
					var mr = el.getStyle('margin-bottom').toInt();							
					//tot up the total width of the element including margins
					var total = y + ml + mr;
					//add this box to the maxTop value
					this.maxTop += total;		
					
					//pass the total element width including margins back into the width array
					return total;
				},this);
				
				
				//when used in a vertical manner, just need to get the height of the inner scroll element because it should be set to auto;
				this.maxTop = this.scrollInner.getSize().y;
				
				this.maxTop = this.maxTop - (this.scrollInner.getParent().getSize().y);
				this.maxTop = this.maxTop * -1;
				
			} else {
				this.boxHeight = $$(boxClass)[0].getSize().y + $$(boxClass)[0].getStyle('margin-top').toInt() + $$(boxClass)[0].getStyle('margin-bottom').toInt();					
				this.maxTop = (this.numBoxes - this.numVisibleBoxes ) * this.boxHeight * -1;					
			}
			
			this.scrollInner.setStyles({'top':0, 'position':'relative'});
			
			$(this.options.moveLeftButtonId).addEvent('click',this.moveUp.bind(this));
			$(this.options.moveRightButtonId).addEvent('click',this.moveDown.bind(this));
			
			
		}				
		
						
		
		this.scrollInner.set('tween',{ 
			onComplete: function(){
				this.busy = false;
			}.bind(this)			
		});
	},
	
	moveLeft:function(){
		//console.log('moveleft');
		if(this.busy) return false;
		this.busy = true;			
		
		var left = this.scrollInner.getStyle('left').toInt();
			
		if(left > this.maxLeft){
			this.options.variableWidth ? this.scrollInner.tween('left',left - this.widthArray[this.elementPosition]) : this.scrollInner.tween('left',left - this.boxWidth);
			this.elementPosition += 1;
		} else {
			this.busy = false;
		}
		
		return false;
		
	},
	
	moveRight:function(){
		//console.log('moveright');
		if(this.busy) return false;
		this.busy = true;
		
		var left = this.scrollInner.getStyle('left').toInt();
		
		if(left < 0){
			this.elementPosition -= 1;					
			this.options.variableWidth ? this.scrollInner.tween('left',left + this.widthArray[this.elementPosition]) : this.scrollInner.tween('left',left + this.boxWidth) ;
			
		} else {
			this.busy = false;
		}
		
		return false;
		
	},
	
	moveUp:function(){
		//console.log('moveup');
		
		if(this.busy) return false;
		this.busy = true;			
		
		var top = this.scrollInner.getStyle('top').toInt();
		
		if(top >= this.maxTop){
			this.options.variableWidth ? this.scrollInner.tween('top',top - this.heightArray[this.elementPosition]) : this.scrollInner.tween('top',top - this.boxHeight);
			this.elementPosition += 1;
		} else {
			this.busy = false;
		}
		
		return false;
		
	},
	
	moveDown:function(){
		//console.log('movedown');
		
		if(this.busy) return false;
		this.busy = true;
		
		var top = this.scrollInner.getStyle('top').toInt();
		
		if(top < 0){
			this.elementPosition -= 1;					
			this.options.variableWidth ? this.scrollInner.tween('top',top + this.heightArray[this.elementPosition]) : this.scrollInner.tween('top',top+ this.boxHeight) ;
			
		} else {
			this.busy = false;
		}
		
		return false;
		
	}
});


var touchMenu = new Class({
	Binds: [],
	Implements: [Events, Options],
	options:{	
		pageContainer: 'page-container'			
	},
	
	/*********************************
	* Mootools dependancies : Core, More [Class.Bind]
	*
	*
	*
	*********************************/
	
	initialize:function(topLevelMenu, options){
		this.setOptions(options);
		
		this.topLevelMenu = $(topLevelMenu) ? $(topLevelMenu) : $$(topLevelMenu)[0];
		
		if(!this.topLevelMenu) return false;
		
		this.liWithChildren = this.topLevelMenu.getChildren('li.haschildren');
		this.liWithChildren.each(function(el,index){
			el.set('data-open','0');
			var anc = el.getChildren('a')[0];
			
			anc.addEvent('click',this.handleClick.bind(this));
			$$('html')[0].addEvent('click',this.windowClickHandler.bind(this));
			$(this.options.pageContainer) ? $('page-container').addEvent('click',this.windowClickHandler.bind(this)) : null;
			
		},this);
	},
	
	handleClick:function(e){
		
		
		el = $(e.target.getParent('li'));
		
		//close the other menus if open
		this.liWithChildren.each(function(li){
			li.removeClass('sfhover');
			li != el ? li.set('data-open','0') : null;
		});
		
		//get the state of the clicked menu
		var open = el.get('data-open');
		
		if(open == '0'){					
			e.stop();
			el.set('data-open','1');
			el.addClass('sfhover');						
		} else {
			//follow link
		}	
	},
	
	windowClickHandler:function(e){
		
		e.stopPropagation();
		//console.log('window event fired');
		//close the other menus if open
		this.liWithChildren.each(function(li){
			li.removeClass('sfhover');
			li.set('data-open','0');
		});
		
	}
});

var SimpleCarousel = new Class({ Implements: [Options, Events], options: { slideInterval: 4000, transitionDuration: 700, startIndex: 0, buttonOnClass: "selected", buttonOffClass: "off", rotateAction: "none", rotateActionDuration: 100, autoplay: true }, initialize: function(container, slides, buttons, options) { this.container = document.id(container); var instance = this.container.retrieve('SimpleCarouselInstance'); if (instance) return instance; this.container.store('SimpleCarouselInstance', this); this.setOptions(options); this.container.addClass('hasCarousel'); this.slides = $$(slides); this.buttons = $$(buttons); this.createFx(); this.showSlide(this.options.startIndex); if (this.options.autoplay) this.autoplay(); if (this.options.rotateAction != 'none') this.setupAction(this.options.rotateAction); return this; }, toElement: function() { return this.container; }, setupAction: function(action) { this.buttons.each(function(el, idx) { document.id(el).addEvent(action, function() { this.slideFx.setOptions(this.slideFx.options, { duration: this.options.rotateActionDuration }); if (this.currentSlide != idx) this.showSlide(idx); this.stop(); } .bind(this)); }, this); }, createFx: function() { if (!this.slideFx) this.slideFx = new Fx.Elements(this.slides, { duration: this.options.transitionDuration }); this.slides.each(function(slide) { slide.setStyle('opacity', 0); }); }, showSlide: function(slideIndex) { var action = {}; this.slides.each(function(slide, index) { if (index == slideIndex && index != this.currentSlide) { if (document.id(this.buttons[index])) document.id(this.buttons[index]).swapClass(this.options.buttonOffClass, this.options.buttonOnClass); action[index.toString()] = { opacity: 1 }; } else { if (document.id(this.buttons[index])) document.id(this.buttons[index]).swapClass(this.options.buttonOnClass, this.options.buttonOffClass); action[index.toString()] = { opacity: 0 }; } }, this); this.fireEvent('onShowSlide', slideIndex); this.currentSlide = slideIndex; this.slideFx.start(action); return this; }, autoplay: function() { this.slideshowInt = this.rotate.periodical(this.options.slideInterval, this); this.fireEvent('onAutoPlay'); return this; }, stop: function() { $clear(this.slideshowInt); this.fireEvent('onStop'); return this; }, rotate: function() { var current = this.currentSlide; var next = (current + 1 >= this.slides.length) ? 0 : current + 1; this.showSlide(next); this.fireEvent('onRotate', next); return this; } });
