////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//
//
// FotoWeb JavaScript Marquee
//
//
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////



////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//
// Global variables
//

var fwPageMarquees = null; // Array of all FotoWeb marquees on the page.

//
//
//
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////


////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//
// Constants
//

var CONST_VISIBLILITY_BUFFER	= 50;					// Expansion of visible range in pixels.
var CONST_SCROLL_SPEED			= 2;					// Scroll speed.
var CONST_SCROLL_DELAY			= 50;					// Scroll delay.
var CONST_POSITION_LEFT			= -1;					// Flag for elements to the left of marquee range.
var CONST_POSITION_VISIBLE		= 0;					// Flag for elements in the marquee range.
var CONST_POSITION_RIGHT		= 1;					// Flag for element to the right of marquee range
var CONST_CSS_MARQUEE			= 'fwMarquee';			// Base Css class for the marquee.
var CONST_CSS_MARQUEE_ELEMENT	= 'fwMarqueeElement';	// Base Css class for the marquee elements.


//
//
//
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////


////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//
// Marquee routines
//
//
// Description: Initiates all marquees on the page.
// Arguments:   None.
// Returns:     None.
//
function fwMarquee_Initiate()
{
	// We only support DOM compatible browsers.
	// Do nothing if already loaded or if browser is not DOM compatible
	if(!g_browser.isDOM)
	{
		return;
	}
	
	
	// Create an array of elements that have the marque Css class name.
	fwPageMarquees = fwGetElementsByClassName(document, CONST_CSS_MARQUEE)
	if (!fwPageMarquees || !fwPageMarquees.length)
	{
		fwDebugPrint('fwMarquee_Initiate(): No marquees located on the page.');
		return;
	}
	
	var index= 0;
	while(fwPageMarquees[index])
	{
		// Initialize the marquee.
		fwMarquee_InitializeMarquee(fwPageMarquees[index]);
		
		// Set initial scroll speed.
		fwPageMarquees[index].scrollSpeed = CONST_SCROLL_SPEED;
		
		// Add events
		fwAddEvent(fwPageMarquees[index], 'mouseover', fwMarquee_OnMouseOver, false);
		fwAddEvent(fwPageMarquees[index], 'mouseout', fwMarquee_OnMouseOut, false);
		
		index++;
	}

	fwMarquee_ScrollAll();
}


//
// Description: Performs initial positioning of the marquee elements.
// Arguments:   marquee - The marquee element.
// Returns:     None.
//
function fwMarquee_InitializeMarquee(marquee)
{
	if (!marquee)
	{
		return;
	}
	
	// Create an array of all images in the marquee.
	var elements = fwGetElementsByClassName(marquee, CONST_CSS_MARQUEE_ELEMENT);
	if (!elements || !elements.length)
	{
		fwDebugPrint('fwMarquee_CreateMarquee(' +  marquee.id + '): No marquee images located.');
		return;
	}
	
	var index= 0;
	var nextLeft = 0;
	while(elements[index])
	{
		elements[index].style.left = nextLeft + 'px';
		
		nextLeft += parseInt(elements[index].offsetWidth);
		
		// Hide this element if it is out of visible range.
		if (CONST_POSITION_RIGHT == fwMarquee_IsInVisibleRange(marquee, elements[index]))
		{
			elements[index].style.visibility = 'hidden';
			elements[index].style.display = 'none';
		}
		
		index++;
	}
}


//
// Description: Starts scrolling all the marquees on the page.
// Arguments:   None.
// Returns:     None.
//
function fwMarquee_ScrollAll()
{
	var index= 0;
	while(fwPageMarquees[index] != null)
	{
		fwMarquee_Scroll(fwPageMarquees[index++]);
	}
	
	// Repeat the scroll function.
	var timer = setTimeout('fwMarquee_ScrollAll()', CONST_SCROLL_DELAY);
}


//
// Description: Scrolls a single marquee.
// Arguments:   marquee - The marquee to scroll.
// Returns:     None.
//
function fwMarquee_Scroll(marquee)
{
	if (!marquee)
	{
		return;
	}
	
	// Create an array of all images in the marquee.
	var elements = fwGetElementsByClassName(marquee, CONST_CSS_MARQUEE_ELEMENT);
	if (!elements || !elements.length)
	{
		fwDebugPrint('fwMarquee_CreateMarquee(' +  marquee.id + '): No marquee images located.');
		return;
	}
	
	var index= 0;
	while(elements[index])
	{
		var nextLeft = parseInt(elements[index].style.left);
		var position = fwMarquee_IsInVisibleRange(marquee, elements[index]);
		
		// If element is out of visible range to the left, then move it to the right.
		if (CONST_POSITION_LEFT == position)
		{
			elements[index].style.visibility = 'hidden';
			elements[index].style.display = 'none';
			
			nextLeft = fwMarquee_GetHighestLeft(marquee);
		}
		
		// If element is in the in the visible range, then scroll it to the left.
		if (CONST_POSITION_VISIBLE == position)
		{
			elements[index].style.visibility = 'visible';
			elements[index].style.display = 'block';
			
			nextLeft -= marquee.scrollSpeed;
		}
		
		// If element is out of visible range to the right, then scroll it to the left.
		if (CONST_POSITION_RIGHT == position)
		{
			nextLeft -= marquee.scrollSpeed;
			
			elements[index].style.visibility = 'hidden';
			elements[index].style.display = 'none';
		}
		
		elements[index].style.left = nextLeft + 'px';
		
		index++;
	}
}


//
// Description: Checks whether the specified element is in the visible range.
// Arguments:   marquee - The marquee element belongs to.
//              element - The element to evaluate.
// Returns:     -1 - If element is to the left of visible range.
//              0 - If element is in the visible range.
//              1 - If element is to the right of visible range.
//
function fwMarquee_IsInVisibleRange(marquee, element)
{
	var left = parseInt(element.style.left);
	var width = parseInt(element.offsetWidth);
	
	// Check the left edge.
	if (left + width < -CONST_VISIBLILITY_BUFFER)
	{
		return(CONST_POSITION_LEFT);
	}
	
	// Check the right edge.
	if (left > parseInt(marquee.offsetWidth) + CONST_VISIBLILITY_BUFFER)
	{
		return(CONST_POSITION_RIGHT);
	}
	
	return(CONST_POSITION_VISIBLE);
}



//
// Description: Returns the highest left coordinates among the marquee elements.
// Arguments:   marquee - The marquee to evaluate.
// Returns:     Left coordinates.
//
function fwMarquee_GetHighestLeft(marquee)
{
	// Create an array of all images in the marquee.
	var highestLeft = 0;
	var elements = fwGetElementsByClassName(marquee, CONST_CSS_MARQUEE_ELEMENT);
	if (!elements || !elements.length)
	{
		fwDebugPrint('fwMarquee_GetHighestLeft(' +  marquee.id + '): No marquee images located.');
		return(highestLeft);
	}
	
	var index= 0;
	while(elements[index])
	{
		var tempOffset = parseInt(elements[index].style.left) + parseInt(elements[index].offsetWidth);

		if (highestLeft < tempOffset)
		{
			highestLeft = tempOffset;
		}

		index++;
	}
	
	return(highestLeft);
}


//
// Description: Returns the lowest left coordinates among the marquee elements.
// Arguments:   marquee - The marquee to evaluate.
// Returns:     Left coordinates.
//
function fwMarquee_GetLowestLeft(marquee)
{
	// Create an array of all images in the marquee.
	var lowestLeft = 0;
	var elements = fwGetElementsByClassName(marquee, CONST_CSS_MARQUEE_ELEMENT);
	if (!elements || !elements.length)
	{
		fwDebugPrint('fwMarquee_GetLowestLeft(' +  marquee.id + '): No marquee images located.');
		return(lowestLeft);
	}
	
	var index= 0;
	while(elements[index])
	{
		var tempOffset = parseInt(elements[index].style.left);

		if (lowestLeft > tempOffset)
		{
			lowestLeft = tempOffset;
		}

		index++;
	}
	
	return(lowestLeft);
}

//
// End marquee routines
//
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////


////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//
// Interaction handlers
//

//
// Description: Handles the marquee behavior on mouse over.
// Arguments:   None.
// Returns:     None.
//
function fwMarquee_OnMouseOver()
{
	this.scrollSpeed = 0;
	//this.scrollSpeed *= -1;
	
	// Get status from the hidden div if needed.
}


//
// Description: Handles the marquee behavior on mouse out.
// Arguments:   None.
// Returns:     None.
//
function fwMarquee_OnMouseOut()
{
	this.scrollSpeed = CONST_SCROLL_SPEED;
	//this.scrollSpeed *= -1;
}


//
// End interaction handlers
//
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////




////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//
// Menu initiation instructions
//

// Add events
fwAddEvent(window, "load", fwMarquee_Initiate, false);

//
// End menu initiation instructions
//
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////