//Media Menu for the product page
var pagePosition=0;
var currentPage=1;
var maxPage=0;
var containerObj=null;
var itemsObj=new Array();

function pageUp(){
	
	//if not the first page
	if (currentPage > 1){
		pagePosition = pagePosition + 340;
		currentPage--;
		containerObj.style.marginTop = pagePosition + 'px';	
		
		//if first page
		if (currentPage == 1){
			var buttonUpObj = document.getElementById('buttonNavUp');
			buttonUpObj.className = "buttonNavUp upInactive";
		}
		
		var buttonDownObj = document.getElementById('buttonNavDown');
		buttonDownObj.className = "buttonNavDown";
	}
}

function pageDown(){	
	
	//if not the last page
	if (currentPage < maxPage){
		pagePosition = pagePosition - 340;
		currentPage++;
		containerObj.style.marginTop = pagePosition + 'px';	
		
		//if last page
		if (currentPage == maxPage){
			var buttonDownObj = document.getElementById('buttonNavDown');
			buttonDownObj.className = "buttonNavDown downInactive";
		}
		
		var buttonUpObj = document.getElementById('buttonNavUp');
		buttonUpObj.className = "buttonNavUp";
	}
}

function displayScreenshot(imageObj){
	var parentObj = imageObj.parentNode;
	var source = imageObj.src;
	var productScreenshotObj = document.getElementById('productScreenshot');
	var productScreenshotContainerObj = productScreenshotObj.parentNode;
	var productVideoObj = document.getElementById('productVideo');
	var videoScriptObj = document.getElementById('videoScript');
	var captionObj = document.getElementById('caption');
	
	//clear all hilight
	for (i=0; i<itemsObj.length; i++){
		itemsObj[i].className = "thumbnail";
	}
	
	//create hilight
	parentObj.className = "thumbnail thumbSelected";
	
	//cut '_sm.jpg' from image name
	source = source.slice(0, source.indexOf('_sm.jpg'));
	source = source + '.jpg';
	
	//remove video
  videoScriptObj.innerHTML = '';
	productVideoObj.style.display = 'none';
	
	//show screenshot image
	productScreenshotContainerObj.style.display = 'block';
	productScreenshotObj.style.display = 'block';
  productScreenshotObj.src = source;
	
	//change caption
	captionObj.innerHTML = parentObj.lastChild.innerHTML;
}


function fullScreenshot(imageObj){
	var fullscreenContentObj = document.getElementById('fullscreenContent');
	var topMargin = 100;

	//find page offset if user has scrolled download
	fullscreenContentObj.style.top = '0px';
	if (window.pageYOffset) //Firefox
		fullscreenContentObj.style.top = (window.pageYOffset + topMargin) + 'px';
	else if (document.body.scrollTop)
		fullscreenContentObj.style.top = (document.body.scrollTop + topMargin) + 'px';
	else if (document.documentElement.scrollTop)
		fullscreenContentObj.style.top = (document.documentElement.scrollTop + topMargin) + 'px';
	else
		fullscreenContentObj.style.top = topMargin + 'px';
	
	//set fullscreenContent	
	fullscreenContentObj.innerHTML = "<img class='fullscreenImage' onclick='fullscreenHide();' onmouseover='showInfoBubble(this);' onmouseout='hideInfoBubble(this);' title='Cliquez pour fermer' src='" + imageObj.src + "' />";
	
	//display fullscreenLayer
	fullscreenShow();

}


function displayVideo(videoObj){
	var parentObj = videoObj.parentNode;
	var videoPath = videoObj.src;
	var flashPlayerPath = 'http://img.metaboli.fr/common/V4/flash/productVideoPlayer.swf';
	var productScreenshotObj = document.getElementById('productScreenshot');	
	var productScreenshotContainerObj = productScreenshotObj.parentNode;	
	var productVideoObj = document.getElementById('productVideo');
	var videoScriptObj = document.getElementById('videoScript');
	var captionObj = document.getElementById('caption');
		
	//clear all hilight
	for (i=0; i<itemsObj.length; i++){
		itemsObj[i].className = "thumbnail";
	}
	
	//create hilight
	parentObj.className = "thumbnail thumbSelected";
	
	//cut '_sm.jpg' from image name replace with '.flv'
	videoPath = videoPath.slice(0, videoPath.indexOf('_sm.jpg'));
	videoPath = videoPath + '.flv';
	
	//change video
	productScreenshotObj.style.display = 'none';
	productScreenshotContainerObj.style.display = 'none';
	productVideoObj.style.display = 'block';
	videoScriptObj.innerHTML = '<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" WIDTH="450" HEIGHT="450">' + 
														 '<PARAM NAME=movie VALUE="' + flashPlayerPath + '"><PARAM NAME=quality VALUE=high><PARAM NAME=bgcolor VALUE=#000000><PARAM NAME=wmode VALUE=transparent>' + 
														 '<PARAM NAME=flashvars VALUE="videoPath=' + videoPath + '">' + 
														 '<EMBED FLASHVARS="videoPath=' + videoPath + 
														 '" src="' + flashPlayerPath + '" quality=high bgcolor="#000000" WIDTH="450" HEIGHT="450" NAME="" ALIGN="" wmode="transparent" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED></OBJECT>';
	
	//change caption
	captionObj.innerHTML = parentObj.lastChild.innerHTML;
}


function initialItem(initialIndex){
	var targetObj = itemsObj[initialIndex].firstChild;
	var pages=0;
		
	if (targetObj.alt == "video")
		displayVideo(targetObj);
	else //c'est forcément une image.
		displayScreenshot(targetObj);
		
	//if initial object not on first page, go to the correct page
	pages = Math.floor(initialIndex/4);
	for (i=0; i<pages; i++){
		pageDown();
	}
}


function initMediaMenu(initialIndex){
	containerObj = document.getElementById('thumbnailContent');	
	var childNodeObj = containerObj.childNodes;
	var mediaNumberObj = document.getElementById('mediaNumber');
	
	for (i=0; i<childNodeObj.length; i++){		
		//check if tag or element node and store in array (firefox treats empty space as a node but not IE)
		if (childNodeObj[i].nodeType == 1){
			itemsObj.push(childNodeObj[i]);
		}
	}
	
	//put total number of objects
	mediaNumberObj.innerHTML = itemsObj.length;
	
	//find max pages from total number of objects
	maxPage = Math.ceil(itemsObj.length/4);
	
	//select initial item
	if (initialIndex < itemsObj.length)
		initialItem(initialIndex);
	else
		initialItem(0);
}