var pagePropertiesArray = new Array();

function setupScrollHandler(scrollProps) {
	pagePropertiesArray[scrollProps.id] = scrollProps;
	var container = document.getElementById(id);
	
	container.scrollTop = 0;
}

function scrollDown(id) {
	var scrollProps = pagePropertiesArray[id];
	var id 				= scrollProps.id;
	var scrollLocation	= scrollProps.scrollLocation;
	var step 			= scrollProps.step;
	var stepHeight 		= scrollProps.stepHeight;
	var locked  		= scrollProps.locked;
	var rows			= scrollProps.rows;
	var container		= document.getElementById(id);
		
	var container	= document.getElementById(id);
	var scrollheight= document.getElementById(id).scrollHeight - (stepHeight * rows);
	if(scrollLocation < scrollheight){
		if(scrollLocation < step * stepHeight){
			container.scrollTop = container.scrollTop + 13;			
			scrollProps.scrollLocation	= container.scrollTop;
			setTimeout("scrollDown('" + scrollProps.id + "');",35);
		} else {
			window.clearTimeout();
			container.scrollTop = step * stepHeight;
			scrollProps.step++;
			
		}
	} else {
		if(locked == false){
			scrollProps.step++;
			scrollProps.locked = true;
		}
	}
	scrollProps.onStateChanged();
}

function scrollUp(id)	{
	var scrollProps = pagePropertiesArray[id];
	// if (scrollProps.locked) , enable up button
	scrollProps.locked = false;
	
	var id 				= scrollProps.id;
	var scrollLocation	= scrollProps.scrollLocation;
	var step 			= scrollProps.step;
	var stepHeight 		= scrollProps.stepHeight;
	var container		= document.getElementById(id);
	
	if(scrollLocation > 0){
		if(scrollLocation > ((step - 2) * stepHeight)){
			container.scrollTop = container.scrollTop - 13;
			scrollProps.scrollLocation = container.scrollTop;			
			setTimeout("scrollUp('" + id + "');",35);
		} else {
			window.clearTimeout();
			container.scrollTop = (step-2) * stepHeight;
			scrollProps.step--;
		}
	} else {
		scrollProps.step = 1;
		// disable up button
	}
	scrollProps.onStateChanged();
}

function scrollElement(div,direction,pixels){
	
}

// Highlight functions
var activeHoverElement	= null;
var activeElement		= null;
var activeStep			= 0;

var selectedHighlight = null;
var selectedCarousel = null;

function highlightHover(div) {
	if (selectedHighlight != div) {
		div.className = "highlightHover";
	}
}
function highlightHoverOut(div) {
	if (selectedHighlight != div) {
		div.className = "highlightNoHover";
	}
}

function removeCurrentSelection() {
	//Remove phone selection
	if (selectedCarousel != null) {
		selectedCarousel.className = "carouselNoHover";
		selectedCarousel = null;
	}
	//Remove highlight selection
	if (selectedHighlight != null) {
		selectedHighlight.className = "highlightNoHover";
		selectedHighlight = null;
	}
}

function highlightSelect(div, id) {
	removeCurrentSelection();

	//Set highlight selection
	selectedHighlight = div;
	selectedHighlight.className = "highlightSelected";
	var activeHighlight = null;
	for (i = 0; i < highlightsArr.length; ++i) {
		if (highlightsArr[i].id == id) {
			activeHighlight = highlightsArr[i];
			break;
		}
	}
	
	setMediaspace(activeHighlight);
}

function carouselHover(div) {
	if (selectedCarousel != div) {
		div.className = "carouselHover";
	}
}
function carouselHoverOut(div) {
	if (selectedCarousel != div) {
		div.className = "carouselNoHover";
	}
}
function carouselSelect(div, id) {
	removeCurrentSelection();

	//Set phone selection
	selectedCarousel = div;
	selectedCarousel.className = "carouselSelected";
	var activeCarousel = null;
	for (i = 0; i < carouselArr.length; ++i) {
		if (carouselArr[i].id == id) {
			activeCarousel = carouselArr[i];
			break;
		}
	}
	setPhonePane(activeCarousel.phoneName,activeCarousel.img, activeCarousel.url, activeCarousel.header, activeCarousel.subheader, activeCarousel.introduction, activeCarousel.relatedCampaignObjectname,
		activeCarousel.tryMeNow,activeCarousel.relatedCampaign,activeCarousel.relatedCampaignUrl, activeCarousel.relatedCampaignTarget, activeCarousel.arrowImg);
}

var phoneImgElement = '';
var onloadRunning = false;

function productClicked(itemName,url){
	document.location.href = url;
}

function highlightClicked(itemName, url, target) {
	if (url.length != 0) {
		if (url.indexOf("&amp;") != -1)
		{ 
		url = url.replace ("&amp;", "&");
		}

		// Open link in current document
		if (target == "_self" || target == "" ) {
			document.location.href = url;
		}
		// Open link in new window
		else {
			window.open(url);
		}
	}
}

function setPhonePane(phoneName,img,url,header,subheader,introduction,relatedCampaignObjectname,tryMeNow,relatedCampaign,relatedCampaignUrl,relatedCampaignTarget,arrowImg){
	
	var phoneDiv 		= document.getElementById("productContainerDiv");
	var phoneDetail 	= document.getElementById("productDetail");
	var highlightDiv	= document.getElementById("highlightDetail");
	preloaderDiv		= document.getElementById("preloader_image_product");
	
	highlightDiv.style.display 		= "none";
	phoneDetail.style.display 		= "block";
	var productDetail_image			= document.getElementById("productDetail_image");
	var productDetail_header		= document.getElementById("productDetail_header");
	var productDetail_subheader		= document.getElementById("productDetail_subheader");
	var productDetail_introduction	= document.getElementById("productDetail_introduction");
	var productDetail_readmore		= document.getElementById("productDetail_readmore");
	var product_bottomcontent		= document.getElementById("product_bottomcontent");
	var product_bottomheader		= document.getElementById("product_bottomheader");
	var productContainerDiv			= document.getElementById("productContainerDiv");
	var productDetailImgContainer	= document.getElementById("productDetailImgContainer");
	var productDetail_headerLink	= document.getElementById("productDetail_headerLink");
	var productDetail_image			= document.getElementById("productDetail_image");
	
	//grab image container and store in a sensible named var
	//var productDetail_container		= document.getElementById("productDetailImgContainer");
	
	// REMOVE
	var campaignName = relatedCampaign;
	
	//statistics call
	//var statsFunc = "onclick=\"dcs.dcsTraceLink('LHP_PRODUCT','" + header + "','" + url + "')\"";
	
	//JF NEW
	preloaderDiv.style.background			= 'url(images/preloader_'+document.body.className+'.gif) no-repeat';
	
	preloaderDiv.style.filter				= 'none';
	preloaderDiv.style.backgroundPosition	= '231px';
	
	//preload image to show
	var newPicture	= new Image(130,299); 
	//When the image is loaded, switch it with the preloader image
	var onloadFunction = function(){
		if (onloadRunning) {
			return;
		}
		onloadRunning = true;

		statsCall = "productClicked('"+header+"','"+url+"')";
		productDetail_headerLink.href			= url;
		productDetail_headerLink.innerHTML		= header;
		//productDetail_header.innerHTML 		= "<a href='"+url+"' class='detail_header' style='text-decoration:none' onclick='"+statsCall+"'>" + header + "</a>";
		productDetail_subheader.innerHTML 		= subheader;
		productDetail_introduction.innerHTML 	= introduction;
		productDetail_readmore.href				= url;
		productDetail_readmore.onclick			= function(){productClicked(header,url)};
		productDetailImgContainer.onclick		= function(){productClicked(header,url)};
		productDetail_headerLink.onclick		= function(){productClicked(header,url)};
		productDetail_header.onclick			= function(){productClicked(header,url)};
		
		if(relatedCampaignTarget != ''){
			target = " target='"+relatedCampaignTarget+"' ";
		} else {
			target = "";
		}
		var bottomHeaderUrl = "<a class='detail_bottomheader' href='"+relatedCampaignUrl+"'"+target+">" + tryMeNow + "</a>";
		var bottomContentUrl = "<a href='"+relatedCampaignUrl+"'"+target+">" + relatedCampaign + "</a>";
		
		// replace the [phoneName] tag with the name of the phone	
		product_bottomheader.innerHTML = bottomHeaderUrl;
		product_bottomcontent.innerHTML = bottomContentUrl;
		if(isIE()){
			preloaderDiv.style.display 			= "none";
			productDetail_image.src				= newPicture.src;
			fixPngTransparency(productDetail_image.id);
			productDetail_image.style.marginLeft = '320px';
			productContainerDiv.style.display 	= 'block';
		} else {
			phoneDiv.style.background			= 'url('+newPicture.src+') no-repeat';
			phoneDiv.style.backgroundPosition	= 'center right';
			phoneDiv.style.marginRight			= '60px';
			preloaderDiv.style.display = "none";
			productContainerDiv.style.display = 'block';
			if(!isOpera()){
				opacity("productContainerDiv", 0, 100, 1000);
			}
		}
		onloadRunning = false;
	};
	
	newPicture.src	= img;
	
	if (isOpera() || newPicture.complete && (isIE())) {

		// Hide all phone info, image etc
		productContainerDiv.style.display = 'none';
		// Show preloader
		preloaderDiv.style.display = "block";
		onloadFunction();
	} else {

		newPicture.onload = onloadFunction;
		
		if (newPicture.complete){
			// Hide all phone info, image etc
			changeOpac(0, "productContainerDiv");			
		}
		else{
			changeOpac(0, "productContainerDiv");			
			// Show preloader
			preloaderDiv.style.display = "block";
		}
	}
}

function setMediaspace(activeHighlight) {
	if(activeHighlight != null){
		var phoneDiv 					= document.getElementById("productDetail");
		var highlightContainerDiv		= document.getElementById("highlightContainerDiv");
		preloaderDiv					= document.getElementById("preloader_image_highlight");
		var highlightDetail				= document.getElementById("highlightDetail");
		var highlight_bottomheader		= document.getElementById("highlight_bottomheader");
		
		//Clear all the text.
		header.innerHTML 		= "";
		subheader.innerHTML 	= "";
		introduction.innerHTML 	= "";
		
		highlightDetail.style.display 	= "block";
		phoneDiv.style.display 			= "none";
		
		preloaderDiv.style.background	= 'url(images/preloader_'+document.body.className+'.gif) no-repeat';
		
		preloaderDiv.style.filter				= 'block';
		
		//preload image to show
		var newPicture	= new Image(494,325); 
		//When the image is loaded, switch it with the preloader image
		var onloadFunction = function(){
			
			//Populate the text items with text again
			header.innerHTML 			= activeHighlight.heading;
			subheader.innerHTML 		= activeHighlight.subHeading;
			introduction.innerHTML 		= activeHighlight.intro;
			iconicMessage.src 			= activeHighlight.iconicMessageSrc;			
			preloaderDiv.style.display 	= "none";
			
			if(isIE()){
				highlightContainerDiv.style.backgroundImage 	= "none";
				highlightContainerDiv.style.filter 				= "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=image, src="+newPicture.src+")";
				fixPngTransparency(iconicMessage.id);
				
				if (subheader.innerHTML == "") {
					subheader.style.display = "none";
				}
				else {
					subheader.style.display = "block";
				}	
				if (iconicMessage.src == "") {
					iconicMessage.style.display = "none";
				}
			} else {
				highlightContainerDiv.style.background			= 'url('+newPicture.src+') no-repeat';
				highlightContainerDiv.style.backgroundPosition	= '0px 0px';
				if(!isOpera()){
					opacity("highlightContainerDiv", 0, 100, 1000);
				}
			}
			
			highlightContainerDiv.style.display = 'block';
		};

		newPicture.src	= activeHighlight.image;
		if (isOpera() || newPicture.complete && isIE()) {
			// Hide all phone info, image etc
			highlightContainerDiv.style.display = 'none';
			// Show preloader
			preloaderDiv.style.display = "block";
			onloadFunction();
		} else {
			newPicture.onload = onloadFunction;
			if (newPicture.complete){
				// Hide all phone info, image etc
				changeOpac(0, "highlightContainerDiv");
			} else {
				changeOpac(0, "highlightContainerDiv");
				// Show preloader
				preloaderDiv.style.display = "block";
			}
		}
		
		highlightcontent.onclick	= function() {
			highlightClicked(activeHighlight.itemName, activeHighlight.highlightUrl, activeHighlight.highlightTarget);
		}
		
		/*
		 *  Turned off since related product are scoped out of this project.
		 *  Please do not remove this code since it may be scoped back in in a later project
		if(activeHighlight.relatedProds.length > 0){
			var relatedProdString = ""; 
			var maxDisplayRelatedProd = 5;
			for (var i = 0; i < activeHighlight.relatedProds.length && i < maxDisplayRelatedProd; i++) {
				if (relatedProdString == "") {
					relatedProdString = activeHighlight.relatedProds[i];
				}
				else {
					relatedProdString = relatedProdString + "&nbsp;|&nbsp;" + activeHighlight.relatedProds[i];
				}
			}
		} else {
			relatedProdString = "";
		}
		bottomcontent.innerHTML = relatedProdString;
		*/
	}
}

function opacity(id, opacStart, opacEnd, millisec) {
    //speed for each frame
    var speed = Math.round(millisec / 100);
    var timer = 0;

    //determine the direction for the blending, if start and end are the same nothing happens
    if(opacStart > opacEnd) {
        for(i = opacStart; i >= opacEnd; i--) {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    } else if(opacStart < opacEnd) {
        for(i = opacStart; i <= opacEnd; i++)
            {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    }
}

//change the opacity for different browsers
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
} 

function switchMediaSpace(obj,div){
	
	var activeHighlight			= null
	var kissPhrase 				= document.getElementById("highlight_kissphrase");
	var iconicMessage			= document.getElementById("highlight_iconicmessage");
	var highlightContainerDiv	= document.getElementById("highlightContainerDiv");
	
	var header 					= document.getElementById("highlightDetail_header");
	var subheader				= document.getElementById("highlightDetail_subheader");
	var introduction			= document.getElementById("highlightDetail_introduction");
	var highlightcontent		= document.getElementById("highlightDetail_Content");
	
	moveHighlightSelection(obj,div,"switch");

	for(i=0;i<highlightsArr.length;i++){
		if(highlightsArr[i].id == obj.id){
			activeHighlight = highlightsArr[i];
		}
	}
	setMediaspace(activeHighlight);		
}

function clearHover(id){
	obj = document.getElementById(id);
	obj.style.display = "none";
}

function kill(){
	div = document.getElementById("highlight_hover_div");
	div.style.display = "none";
}

function getNumberWithoutPx(num){
	return parseInt(num);
}

function getActiveHighlightNumber(obj){
	var startPosition 	= obj.id.indexOf("_");
	var elementNumber	= obj.id.substr(startPosition+1);
	elementNumber++;

	return elementNumber;
}

function togglePhoneDropdown(){
	var dropDownDiv 	= document.getElementById("browsephonesdropdowndiv");
	var dropDownArrow 	= document.getElementById('dropdownArrow');

	if(dropDownDiv.style.display == "block"){
		togglePhoneDropdownOff();
	}
	else{
		dropDownDiv.style.display = "block";	

		if(!isIE()){
			dropDownArrow.src="../images/dropdown_click.png";
		} else {
			dropDownArrow.style.filter='progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/dropdown_click.png", sizingMethod="image")';
		}

		// add to body onclick a function to see where page was clicked
		document.body.onclick = autoHidePhoneDropDown;
	}
	dropDownArrow.blur();
}
	
function autoHidePhoneDropDown(eventClicked){
	var target
	var eventClicked
	var tname	
	var dropdown 		= document.getElementById("browsephonesdropdowndiv");
	var dropdownarrow 	= document.getElementById('dropdownArrow');
		
	if (!eventClicked) { eventClicked = window.event; }

	if (eventClicked.target) { target = eventClicked.target }
	
	else if (eventClicked.srcElement) { target = eventClicked.srcElement }
	
	else { target = eventClicked.srcElement }
	
	// defeat Safari bug
	if (target.nodeType == 3) { target = target.parentNode }
	
	tname=target.id
	
	// currently just toggling drop down list to be off
	if (tname.indexOf("dropdown") < 0) {
		if (dropdown.style.display == "block") {
			togglePhoneDropdownOff();
		}
	}
}

function togglePhoneDropdownOff(){
	dropDownDiv 	= document.getElementById("browsephonesdropdowndiv");
	dropDownArrow 	= document.getElementById('dropdownArrow');
	if(dropDownDiv.style.display == "block"){
		dropDownDiv.style.display = "none";
		
		if(!isIE()){
			dropDownArrow.src="../images/dropdown.png";
		} else {
			dropDownArrow.style.filter='progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/dropdown.png", sizingMethod="image")';
		}
	}
	
	// removes the onclick toggle function from body
	document.body.onclick = "";
}

function arrowHoverRestore(){
	dropDownDiv = document.getElementById("browsephonesdropdowndiv");
	if(dropDownDiv.style.display == "none" || dropDownDiv.style.display == ""){
		if(!isIE()){
			document.getElementById('dropdownArrow').src='../images/dropdown.png';
		} else {
			document.getElementById('dropdownArrow').style.filter='progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/dropdown.png", sizingMethod="image")';
		}	
	}
}

function arrowHover(){
	dropDownDiv = document.getElementById("browsephonesdropdowndiv");
	if(dropDownDiv.style.display == "none" || dropDownDiv.style.display == ""){
		if(!isIE()){
			document.getElementById('dropdownArrow').src='../images/dropdown_hover.png';
		} else {
			document.getElementById('dropdownArrow').style.filter='progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/dropdown_hover.png", sizingMethod="image")';
		}
	}	
}