/********************************************************************

	FOREX.COM - GUIDED TOUR
	
	=========================================
	Author: Chris Erwin (chris@teehanlax.com)
	Agency: teehan+lax
	Date: July 16, 2008
	=========================================	
	
	Description
	-------------------------------------------------------------
	There are two parts for the guided tour
	
	1. GuidedTourSteps - an object for each step in the tour
	2. GuidedTour - an array of all the steps and methods to move through them
	
	
	HTML Markup Sample
	-------------------------------------------------------------
	_widget_samples/guided_tour.html
	
	
	Dependencies
	-------------------------------------------------------------
	- MooTools 1.2

*********************************************************************/






/********************************************************************
	
	GUIDED TOUR STEP
	
	Public Methods
	-------------------------------------------------------------
	initialize (constructor)
		Arguments:
			- tourStepID (string) : the ID of the HTML element for the tour step
			- xPos (integer) : the number of pixels from the left of the page to position the tour step
			- yPos (integer) : the number of pixels from the top of the page to position the tour step
			- notchPos (string) : the position the notch on the tourstep should be ('right' or 'left')
			
	hide
		Description: fades out the tour step element
		Arguments: none
		Returns: null
		
	show
		Description: fades in the tour step element
		Arguments: none
		Returns: null
	
	
*********************************************************************/

var GuidedTourStep = new Class({
     initialize: function(tourStepID, xPos, yPos, notchPos) {
		this.tourStepID = tourStepID;		
		this.tourStep = $(this.tourStepID);
		this.xPos = xPos;
		this.yPos = yPos;
		this.notchPos = notchPos;
		
		this.animation =  new Fx.Morph(this.tourStep, {duration: 300, transition: 'cubic:in:out'});
		
		if (this.notchPos == 'right') {
			this.tourStep.addClass('right');		
		}
		else {
			this.tourStep.addClass('left');	
		}
		
		this.tourStep.setStyles({
			opacity: 0,
			top : this.yPos,
			left: this.xPos
		});
		
		
    },
	
	hide : function() {
		this.animation.start({
			'opacity': 0, 
			'top': this.yPos + 50  
		});

		
		$('iframe_shim').setStyles({
			'top' : -1000000,
			'left' : -1000000
		});
	},
	
	show : function() {
		this.tourStep.setStyle('display', 'block');
		this.tourStep.setStyle('left', this.xPos);
		
		if(Browser.Engine.trident4) {
			$('iefix').scrollTo(0, (this.yPos- 150));	
		}
		else {
			window.scrollTo(0, (this.yPos- 150));
		}
		
		this.animation.start({
			'opacity': 1, 
			'top': [this.yPos - 50,  this.yPos] 
		});
		
		
		
		$('iframe_shim').setStyles({
			'top' : this.yPos,
			'left' : this.xPos,
			'height' : this.tourStep.getSize().y -4,
			'width' : this.tourStep.getSize().x - 4
		});
	}
});




/********************************************************************
	
	GUIDED TOUR
	
	Public Methods
	-------------------------------------------------------------
	initialize (constructor)
		Arguments:
			- arrTourSteps (array) : and array of GuidedTourStep instances
			
	start
		Description: fires the show method of the first object in the array 
		Arguments: none
		Returns: null
		
	end
		Description: fires the hide method of the current tour step object
		Arguments: none
		Returns: null
		
	nextStep
		Description: hides the current tour step object and shows the next one in the array
		Arguments:
		Returns:
	
	previousStep
		Description: hides the current tour step object and show the previous one in the array
		Arguments:
		Returns:
		
		
*********************************************************************/

var GuidedTour = new Class({
	initialize: function(arrTourSteps) {
		this.arrTourSteps = arrTourSteps;
		this.tourLength = this.arrTourSteps.length;
		this.currStepNum = null;
	},
	start : function() {
		this.arrTourSteps[0].show();
		this.currStepNum = 0;
	},
	end : function() {
		this.arrTourSteps[this.currStepNum].hide();
		this.currStepNum = null;
	},
	nextStep : function() {
		if( this.currStepNum + 1 < this.tourLength ) {
			var currStep = this.arrTourSteps[this.currStepNum];
			var nextStep = this.arrTourSteps[this.currStepNum + 1];
			
			currStep.hide();
			nextStep.show();
			
			this.currStepNum = this.currStepNum + 1;
		}
	},
	previousStep : function() {
		if( this.currStepNum - 1 >= 0 ) {
			var currStep = this.arrTourSteps[this.currStepNum];
			var nextStep = this.arrTourSteps[this.currStepNum - 1];
			
			currStep.hide();
			nextStep.show();
			
			this.currStepNum = this.currStepNum - 1;
		}
	}
});