// Wapple.net scroller.js v1.0.1, Mon Aug 04 2008
var Scroller = Class.create({
	
	/**
	 * Variable to hold scroll position
	 */
	scrollPosition: 1,
	
	/**
	 * Variable to let us know if we can scroll or not
	 */
	canScroll: true,
	
	/**
	 * Scrolling speed of text
	 */
	scrollSpeed: 1.5,
	
	/**
	 * Scroll direction - left or right
	 */
	scrollDirection: null,
	
	/**
	 * How many slides we want to jump across
	 */
	scrollMultiplier: 1,
	
	/**
	 * The name of the scroll div that has the big long scroll bar
	 */
	scrollDiv: 'scroller',
	
	/**
	 * Turn auto scroll on or off
	 */
	autoScroll: true,
	
	/**
	 * Number of slides
	 */
	scrollSlides: 0,
	
	/**
	 * Auto scroll speed
	 */
	autoScrollSpeed: 10000,
	
	/**
	 * Auto scroll interval ID
	 */
	autoScrollIntervalId: null,
	
	/**
	 * Scroller window width
	 */
	scrollerWindowWidth: null,
	
	/**
	 * Initialize scroller
	 */
	initialize: function()
	{
		// Work out the number of slides
		this.scrollSlides = $(this.scrollDiv).childElements().length;
		
		// Get the scroller window width
		this.scrollerWindowWidth = $('scrollerWindow').getWidth();
		
		if(this.autoScroll == true)
		{
			this.autoScrollIntervalId = setInterval(function()
			{
				if(this.scrollPosition == (this.scrollSlides))
				{
					// If we're the last slide - move back to the first one
					if(this.canScroll == true) this.scrollerLeft((this.scrollSlides) - 1, true);
				} else
				{
					// Otherwise, just scroll to the right
					if(this.canScroll == true) this.scrollerRight(1, true);
				}
			}.bind(this), this.autoScrollSpeed);
		}
		
		// Setup event observer for the menu block
		$('scrollerMenu').observe('click', this.scrollerGoTo.bind(this));
		
		// Setup event observers for Next links
		$$('a.scrollerControlRight').invoke('observe', 'click', this.scrollerRight.bind(this, 1));
	
		// Setup event observers for left and right controls
		$('scrollerWindowControlLeft').observe('click', function(e){
			if(this.canScroll == true)
			{
				this.scrollerLeft(1);
			}
			
		}.bind(this));
		$('scrollerWindowControlRight').observe('click', function(e){ 
			if(this.canScroll == true)
			{
				this.scrollerRight(1);
			}
			
		}.bind(this));
		
		// Deaden the first slider control
    /*
		$('scrollerWindowControlLeft').setStyle({backgroundPosition: '0 -72px'});
    */
	},
		
	/**
	 * Set the scroll container widths so they match that of the scroller window element
	 * @param {boolean} resizing Holds whether we are resizing the window or an initial call
	 * @return void
	 */
	scrollerSetScrollContainerWidths: function(resizing)
	{
		// Get the scroller window width from the 'scrollerWindow' width
		var scrollerWindowWidth = $('scrollerWindow').getWidth();
		
		// Go through each container and set the width
		$$('div.scrollerSlide').invoke('setStyle', {width: scrollerWindowWidth + 'px'});
		
		if(resizing == true)
		{
			// If we're resizing, set a scroller position
			var scrollerPosition = 0 - ((this.scrollPosition - 1) * scrollerWindowWidth);
			$('scroller').setStyle({left : scrollerPosition + 'px'});
		}
	},
	
	/**
	 * Set the current slide position
	 * @param {integer} currentSlide Set the current slide position
	 */
	setCurrentSlide: function(currentSlide)
	{
		if(currentSlide > 1)
		{
			this.scrollPosition = currentSlide;
			
			// If we're in a scroll position less than the number of slide containers and we can scroll, scroll away!
			if((this.scrollPosition < this.scrollSlides) && this.canScroll == true)
			{
				// Get how many slides we need to move by
				var moveBy =  this.scrollMultiplier * (0 - (this.scrollerWindowWidth - 5));
				Element.setStyle(this.scrollDiv, {left: moveBy+'px'});
			}
		}
	},
	
	/**
	 * Clicking on a link will take you to a position
	 * @param {integer} elementId This is the element of the main scroll element
	 * @param {integer} goToPosition Which slide do we want to scroll to 
	 * @return void
	 */
	scrollerGoTo: function(event)
	{
		if(this.canScroll == true)
		{
			var goToPosition = Event.element(event).up().readAttribute('id').replace('scrollerMenuItem', '');
			
			// Get a multiplier of number of slides we want to jump across
			this.scrollMultiplier = Math.abs(goToPosition - this.scrollPosition);
			
			if(goToPosition < this.scrollPosition)
			{
				this.scrollerLeft()
			} else if(goToPosition > this.scrollPosition)
			{
				this.scrollerRight()
			}
			return false;
		}
		return false;
	},
	
	/**
	 * Scroll left
	 * @param {integer} multipler This is the number of slides we want to jump
	 * @return void
	 */
	scrollerLeft: function(multiplier, autoScroll)
	{
		if(!autoScroll || autoScroll == false)
		{
			clearInterval(this.autoScrollIntervalId);
		}
		
		if(multiplier)
		{
			this.scrollMultiplier = multiplier;
		}
		
		// If we're above scroll position 1 and we can scroll, scroll away!
		if(this.scrollPosition > 1 && this.canScroll == true)
		{
			// Disable scrolling until we've finished
			this.canScroll = false;
			
			// Set the scroll direction
			this.scrollDirection = 'left';
			
			// Get how many slides we need to move by
			var moveBy =  this.scrollMultiplier * (this.scrollerWindowWidth + 10);
			
			// Setup effect options
			this.options = {
				x: moveBy,
				duration: this.scrollSpeed,
				beforeStart: this.beforeScrolling.bind(this),
				afterFinish: this.afterScrolling.bind(this),
				transition: Effect.Transitions.exponential
			}
			
			new Effect.Move($(this.scrollDiv), this.options);
		}
	},
	
	/**
	 * Scroll right
	 * @param {integer} elementId This is the element of the main scroll element
	 * @param {integer} multipler This is the number of slides we want to jump
	 * @return void
	 */
	scrollerRight: function(multiplier, autoScroll)
	{
		if(!autoScroll || autoScroll == false)
		{
			clearInterval(this.autoScrollIntervalId);
		}
		
		if(multiplier)
		{
			this.scrollMultiplier = multiplier;
		}
		
		// If we're in a scroll position less than the number of slide containers and we can scroll, scroll away!
		if((this.scrollPosition < this.scrollSlides) && this.canScroll == true)
		{
			// Disable scrolling until we've finished
			this.canScroll = false;
			
			// Set the scroll direction
			this.scrollDirection = 'right';
			
			// Get how many slides we need to move by
			var moveBy =  this.scrollMultiplier * (0 - (this.scrollerWindowWidth + 10));
			
			// Setup effect options
			this.options = {
				x: moveBy,
				duration: this.scrollSpeed,
				beforeStart: this.beforeScrolling.bind(this),
				afterFinish: this.afterScrolling.bind(this),
				transition: Effect.Transitions.EaseFromTo
			}
			
			new Effect.Move($(this.scrollDiv), this.options);
		}
	},
	
	/**
	 * Anything to do before we start scrolling
	 * @return void
	 */
	beforeScrolling: function()
	{
		// Move scroll pointer
		if(this.scrollDirection == 'left')
		{
			var scrollPosition = this.scrollPosition - this.scrollMultiplier;
		} else
		{
			var scrollPosition = this.scrollPosition + this.scrollMultiplier;
		}
		
		new Effect.Move($('scrollerSlidePointer'), {
			x: 60 + (158 * (scrollPosition - 1)),
			mode: 'absolute'
		});
	},
	
	/**
	 * Bit of tidy up after scrolling, also hides all how+why docs and shows the one that matches the current slide
	 * @return void
	 */
	afterScrolling: function()
	{
		// Correct the scroll position so it's in the new position
		if(this.scrollDirection == 'left')
		{
			this.scrollPosition = this.scrollPosition - this.scrollMultiplier;
		} else
		{
			this.scrollPosition = this.scrollPosition + this.scrollMultiplier;
		}
		
		// Set the active scroll link
		$$('div.scrollerMenuItem').invoke('removeClassName', 'active');
		
		if($('scrollerMenuItem'+this.scrollPosition))
		{
			$('scrollerMenuItem'+this.scrollPosition).addClassName('active');
		}
		
		// Deaden / enable scroller
    /*
		if(this.scrollPosition == 1)
		{
			// Disable the left control if we're on the 1st slide
			$('scrollerWindowControlLeft').setStyle({backgroundPosition: '0 -72px'});
			$('scrollerWindowControlRight').setStyle({backgroundPosition: ''});
		} else if(this.scrollPosition == this.scrollSlides)
		{
			// Disable the right control if we're on the last slide
			$('scrollerWindowControlLeft').setStyle({backgroundPosition: ''});
			$('scrollerWindowControlRight').setStyle({backgroundPosition: '0 -72px'});
		} else
		{
			// All other slides - enable the controls
			$('scrollerWindowControlLeft').setStyle({backgroundPosition: ''});
			$('scrollerWindowControlRight').setStyle({backgroundPosition: ''});
		}
    */
		
		// We can now scroll again, hooray!
		this.canScroll = true;	
	}
});