/**
* Assign the view handler
*/

viewHandler = Home;

/**
* Creates a new object with methods used by the Home page
*
* @author				Matt Gifford
* @copyright			2007 Timeshifting Interactive Limited
*/
function Home()
	{
	// Step 1. Define Properties

	var _instance = this;
	var _TOTAL_IMAGES = 3;

	this.rotationTimeout = 6000;
	this.previousImage = {};
	this.currentImage = {};


	// Step 2. Define Public Methods

	/**
	* Sets up the initial page state and event handlers
	*/
	this.init = function()
		{
		// Call generic page init method
		this.base.init.call(this);

		// Start the image set rotations
		var sets = ['homeContentFashionablesSlides', 'homeContentStackablesSlides', 'homeContentEngraveablesSlides'];
		for (var x = 0; x < sets.length; x++)
			{
			this.previousImage[sets[x]] = _TOTAL_IMAGES;
			this.currentImage[sets[x]] = 1;
			setTimeout("xhtml.advance('" + sets[x] + "');", 2000 * (x+1) );
			}		
		}


	/**
	* Fades Out The Slide and moves the next one
	*
	* @param		type		set		The image set to advance
	*/
	this.advance = function(set)
		{
		// Advance image numbers
		this.previousImage[set]++;
		this.currentImage[set]++;
		if (_TOTAL_IMAGES < this.previousImage[set])
			{
			this.previousImage[set] = 1;
			}
		if (_TOTAL_IMAGES < this.currentImage[set])
			{
			this.currentImage[set] = 1;
			}

		// Update positions
		document.getElementById(set + this.previousImage[set]).style.zIndex = 100;
		document.getElementById(set + this.currentImage[set]).style.zIndex = 200;

		// Set new image visible but with an opacity of 0%
		this.setOpacity(document.getElementById(set + this.currentImage[set]), 0);
		document.getElementById(set + this.currentImage[set]).style.visibility = 'visible';

		// Start fade in for new image
		this.fadeIn(set, 0);

		// Continue the content rotation
		setTimeout("xhtml.advance('" + set + "');", this.rotationTimeout);
		}


	/**
	* Fades in the current image
	*
	* @param		type		set		The image set to advance
	* @param		percentage		The current percentage level
	* @return		void
	*/
	this.fadeIn = function(set, percentage)
		{
		// Set new opacity
		percentage += 2;
		this.setOpacity(document.getElementById(set + this.currentImage[set]), percentage);

		// Check if we are at 100%
		if (percentage < 100)
			{
			// If not, continue the fade in
			setTimeout("xhtml.fadeIn('" + set + "', " + percentage + ");", 10);
			}
		else
			{
			// Otherwise hide the old image
			document.getElementById(set + this.previousImage[set]).style.visibility = 'hidden';
			}
		}


	/**
	* Sets the opacity of an object
	*
	* @param		obj							The object to set the opacity of
	* @param		opacityPercent			The opacity for the object as an integer from: 0 to 100
	*/
	this.setOpacity = function(obj, opacityPercent)
		{
		if ( !!(window.attachEvent && !window.opera) )
			{
			// IE
			try
				{
				// Add filter if it hasn't been initialized
				if (obj.getAttribute('alphaEnabled') != 1)
					{
					obj.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(opacity=' + opacityPercent + ')';
					obj.filters.item("DXImageTransform.Microsoft.Alpha").enabled = 1;
					obj.setAttribute('alphaEnabled', 1);
					}
				obj.filters.item("DXImageTransform.Microsoft.Alpha").opacity = opacityPercent;
				}
			catch (err)
				{
				// DirectX filters are unavailable, and since they're only way of doing opacity in Internet Explorer sliently ignore and return
				return;
				}
			}
		else
			{
			// FF, Opera & Safari
			var opacityNumeric = opacityPercent/100;
			obj.style.MozOpacity = opacityNumeric;
			obj.style.KhtmlOpacity = opacityNumeric;
			obj.style.opacity = opacityNumeric;
			}
		}
	}