// JavaScript Document

function openFlashVid(element, vidDivID, FLVName, width, height, iOffsetY, iOffsetX, hdrVidName)	// Opens demo video and locates it near calling element so only a single Flash window needs to pop up
//Requires: Dimension js class
//Requires: swfobject.js
//Requires two Div containers--a Div with an ID (e.g.,'demoVid') which will be replaced when the flash movie is instantiated,
//and a Div with an ID consisting of the video ID and "-container"  (e.g. 'demoVid-container') which is used to hide/show and position the video.  This Div must contain the video ('demoVid') Div, but can also contain any other
//content, including other Divs, used for formatting and layout.
// element:  The entity that is calling the video and where the video will be co-located to
// vidDivID: The 
{
	var swfVideo = document.getElementById(vidDivID);	// Get a reference to the container that the swfObject will replace
	var swfContainer = document.getElementById(vidDivID+'-container')
	var dime=new Dimension(element);	// Get the absolute coordinates to the calling element, where the swfObject will be moved to
	
	if(hdrVidName)	//If there is a header video, pause it before starting the product videos
	{
		callFlashPlayPauseVideo(hdrVidName);	// TODO:  Generalize this function so the header video doesn't have to be treated seperately.
	}
	swfobject.embedSWF("/Flash/product-demo.swf", vidDivID, width, height, "9.0.0","/Flash/expressInstall.swf",{flvurl:FLVName}, {wmode:"Transparent"},{});
	
	// Format the swfVideo
	swfVideo.style.position='absolute';
	swfVideo.style.padding = 0;
	swfVideo.style.margin = 0;
	swfVideo.style.display = "block";
	swfVideo.style.zindex = 100;
	
	// Position the video container
	swfContainer.style.display = 'block';	
	swfContainer.style.position = 'absolute';
	swfContainer.style.left = dime.x + iOffsetX + "px";
	swfContainer.style.top = dime.y + iOffsetY + "px";	

	return false;
}

function closeFlashVid(vidObjID)	//Hides the demo video window
{
	//First stop the video from playing (does not destroy swfObject)
	callFlashPlayPauseVideo(vidObjID);
	document.getElementById(vidObjID+'-container').style.display = 'none';	//Hide the demo
}

function callFlashPlayPauseVideo(vidObjID)	//Calls SWF video's internal pause method
{
	var swfVideo = document.getElementById(vidObjID);
	swfVideo.pauseResume();
}
// FOR FLASH DEMO POPUPS--END //

function openInfoBubble(bubbleID)
// Toggles a single DIV block on and off the page whose ID is passed as bubbleID
// for popup effect, initialize DIV to display="none"
{
	if(document.getElementById(bubbleID).style.display == "none")
	{
		document.getElementById(bubbleID).style.display = "block";
	}
	else
	{
		document.getElementById(bubbleID).style.display = "none";
	}
}

function toggleReadMore(descrblk,h)	//Shows or hides extended product description using CSS overflow
// descrblk = the ID of the productContainer div
// h = the height of the content to show in collapsed state
// There are three components to this content toggle:  _more, _descr & _morebtn
// _more is the div holding the extended content and is nested within the _descr div
// _descr contains the complete product descripition copy
// _morebtn is the expand button within the productContainer parent div
{
	var bExpnd;
	var m_descrblk;
	m_descrblk = descrblk;
	bExpnd = (document.getElementById(m_descrblk + "_more").style.display == "block")
	if(bExpnd)
	{
		document.getElementById(m_descrblk + "_more").style.display = "none";
		document.getElementById(m_descrblk + "_descr").style.overflow = "hidden";
		document.getElementById(m_descrblk + "_descr").style.height = h+"px";
		document.getElementById(m_descrblk + "_descr").style.borderBottomStyle = "solid";
		document.getElementById(m_descrblk + "_morebtn").innerHTML = "<span class='moreBtn'>&nbsp;Expand</span>";
	}
	else
	{
		document.getElementById(m_descrblk + "_more").style.display = "block";
		document.getElementById(m_descrblk + "_descr").style.overflow = "visible";
		document.getElementById(m_descrblk + "_descr").style.height = "auto";
		document.getElementById(m_descrblk + "_descr").style.borderBottomStyle = "none";
		document.getElementById(m_descrblk + "_morebtn").innerHTML = "<span class='lessBtn'></span>";
	}
}