﻿cartAddObj = "";
cartAddInnerObj = "";
cartAddHTMLObj = "";
arrowLeftObj = "";
arrowRightObj = "";

opacityTimer = null;
opacityFlag = 0;
opacityCount = 0;
numOfImages = 3;
numOfIterations = 10;
opacityIntervalConstant = 50;
opacityBlinkValueIncreaseConstant = 0.25;
opacityBlinkValueDecreaseConstant = 0.15;

nodeBaseName = "productRowNode";

function increaseOpacityBlink(elementId) {
	this.elementId = elementId;
	this.changeVal = changeVal;
	if (opacityTimer != null) clearTimeout(opacityTimer);
	opacityObj = document.getElementById(elementId);
	if (opacityCount < numOfIterations) {
		if (opacityCount >= 3 && opacityCount <= 5) {
			opacityInterval = 200;
			opacityBlinkValueIncrease = 0.40;
			opacityBlinkValueDecrease = 0.30;
		}
		else {
			opacityInterval = opacityIntervalConstant;
			opacityBlinkValueIncrease = opacityBlinkValueIncreaseConstant;
			opacityBlinkValueDecrease = opacityBlinkValueDecreaseConstant;
		}
		if (opacityFlag == 0) {
			opacityBlinkValue = opacityBlinkValue + opacityBlinkValueIncrease;
			opacityFlag = 1;
			opacityCount++;
		}
		else if (opacityFlag == 1) {
			opacityBlinkValue = opacityBlinkValue - opacityBlinkValueDecrease;
			opacityFlag = 0;
			opacityCount++;
		}
		opacityObj.style.opacity = opacityBlinkValue;
		opacityObj.style.filter = 'alpha(opacity=' + opacityBlinkValue * 100 + ')';
		opacityTimer = setTimeout("increaseOpacityBlink(elementId)",opacityInterval);
	}
	else if (opacityCount == numOfIterations) {
		opacityBlinkValue = 1;
		opacityObj.style.opacity = opacityBlinkValue;
		opacityObj.style.filter = 'alpha(opacity=' + opacityBlinkValue * 100 + ')';
	}
}

productCoordinatesArray = new Array(-115, 150, 416, 680, 945);
var productStart = 1;
var productEnd = 3;
var productBlankLeft = productStart - 1;
var productBlankRight = productEnd + 1;
var productLeft = "Left";
var productRight = "Right";
var productIdStart = nodeBaseName + productStart;
var productIdEnd = nodeBaseName + productEnd;
var productIdBlankRight = nodeBaseName + productBlankRight;
var productIdBlankLeft = nodeBaseName + productBlankLeft;
var productIdRight = nodeBaseName + productRight;
var productIdLeft = nodeBaseName + productLeft;


function setMouseover(productId, leftPos) {
	productObj = document.getElementById(productId);
	listImg = productObj.getElementsByTagName("img");
	imgId = listImg[0].id;
	imgObj = document.getElementById(imgId);
	imgObj.style.left = leftPos;
	imgObj.setAttribute("left",leftPos);
	var imgHTML = '<img src="images/homepage/headset_' + imgId + '.png" alt="" width="150" height="123" border="0" id="' + imgId + '">';
	imgHTMLNew = '<a href="# return true;" onmouseover="getProductAdd(\'' + imgId + '\', \'' + leftPos + '\')" onmouseout="hideProductAdd()">' + imgHTML + '</a>';
	productObj.innerHTML = imgHTMLNew;
}

function unsetProducts(numOfImages, nodeBaseName) {
	for (var i = productStart; i <= productEnd; i++) {
		productId = nodeBaseName + i;
		productObj = document.getElementById(productId);
		var elementPos = productCoordinatesArray[i];
		unsetMouseover(productId, elementPos);
	}
}

function unsetMouseover(productId, leftPos) {
	productObj = document.getElementById(productId);
	listImg = productObj.getElementsByTagName("img");
	imgId = listImg[0].id;
	imgObj = document.getElementById(imgId);
	imgObj.style.left = leftPos;
	imgObj.setAttribute("left",leftPos);
	var imgHTML = '<img src="images/homepage/headset_' + imgId + '.png" alt="" width="150" height="123" border="0" id="' + imgId + '">';
	//imgHTMLNew = '<a href="# return true;" onmouseover="getProductAdd(\'' + imgId + '\', \'' + leftPos + '\')" onmouseout="hideProductAdd()">' + imgHTML + '</a>';
	productObj.innerHTML = imgHTML;
}

function getProductAdd(listId, elementPos, pageLanguage) {
	this.listId = listId;
	this.elementPos = elementPos;
	this.pageLanguage = pageLanguage ? pageLanguage.toLowerCase() : "en";
	imgObj = document.getElementById(listId);
	var offset = 100; //$("#productSlide").offset();
	elementPos = parseInt(elementPos) + offset; //parseInt(offset.left)
	ajaxCall(listId, this.pageLanguage);
	moveProductAdd(elementPos);
	showProductAdd();
}

function moveProductAdd(elementPos) {
	if (cartAddObj != '') {
		cartAddObj.style.left = elementPos + "px";
	}
}

function showProductAdd() {
	if (cartAddObj != '') {
		cartAddObj.style.visibility = "visible";
		cartAddInnerObj.style.visibility = "visible";
		cartAddHTMLObj.style.visibility = "visible";
	}
}

function hideProductAdd() {
	if (cartAddObj != '') {
		cartAddObj.style.visibility = "hidden";
		cartAddInnerObj.style.visibility = "hidden";
		cartAddHTMLObj.style.visibility = "hidden";
	}
}

opacityArrowsTimer = null;

var products = new Array();
products['black'] = new Array();
products['black']['name'] = new Array();
products['black']['name']['en'] = "BLAH BLAH BLACK";
products['black']['name']['fr'] = "BLA BLA NOIR";
products['black']['name']['de'] = "BLAH BLAH SCHWARTZ";
products['black']['link'] = "?ObjectPath=Products/Jawbone_Headset/SubProducts/JB203-EU";
products['silver'] = new Array();
products['silver']['name'] = new Array();
products['silver']['name']['en'] = "SILVER TONGUE";
products['silver']['name']['fr'] = "LANGUE D'ARGENT";
products['silver']['name']['de'] = "SILVER TONGUE";
products['silver']['link'] = "?ObjectPath=Products/Jawbone_Headset/SubProducts/JB201-EU";
products['gold'] = new Array();
products['gold']['name'] = new Array();
products['gold']['name']['en'] = "GOLDY LIPS";
products['gold']['name']['fr'] = "LÈVRES DORÉES";
products['gold']['name']['de'] = "GOLDY LIPS";
products['gold']['link'] = "?ObjectPath=Products/Jawbone_Headset/SubProducts/JB204-EU";
var viewDemoText = new Array();
viewDemoText['en'] = "VIEW DEMO";
viewDemoText['fr'] = "DÉMO";
viewDemoText['de'] = "DEMO";
var buyNowText = new Array();
buyNowText['en'] = "BUY NOW";
buyNowText['fr'] = "ACHETEZ";
buyNowText['de'] = "JETZT KAUFEN";

function ajaxCall(listId, pageLanguage) {
	if (!pageLanguage) pageLanguage = "en";
	var popupLogo = '<div class="logoPopup"><img src="/WebRoot/Luzern/Shops/Jawbone/MediaGallery/logo_popup.gif" alt="" /></div>';
	var popupName = '<div class="productColorPopup">' + products[listId]['name'][pageLanguage] + '</div>';
	var popupDetails = '<div class="productDetailsPopup"></div>';
	var popupDemoLink = '<div class="viewDemoPopup"><a href="?ObjectPath=Categories/Demo/DemoLandingPage">' + viewDemoText[pageLanguage] + '</a></div>';
	var popupCartImage = '<div class="cartPopup"><a href="' + products[listId]['link'] + '"><img src="/WebRoot/Luzern/Shops/Jawbone/MediaGallery/cart_popup.gif" alt="" border="0" /></a></div>';
	var popupCartLink = '<div class="buynowPopup"><a href="' + products[listId]['link'] + '">' + buyNowText[pageLanguage] + '</a></div>';
	cartAddHTMLObj.innerHTML = popupLogo + popupName + popupDetails + popupDemoLink + popupCartImage + popupCartLink;
}

calloutTopPos = -0;
calloutBottomPos = 0;
calloutMaxHeight = 120;
calloutMinHeight = 62;
slideTop = 0;
expandCalloutFlag = 1;
slideTimerExpand = null;
slideTimerContract = null;
contractCalloutTimer = null;

function expandCallout(element) {
	if (slideTimerExpand != null) clearTimeout(slideTimerExpand);
	if (expandCalloutFlag == 1) {
		calloutObj = document.getElementById(element);
		calloutObj.style.height = calloutMaxHeight;
		this.element = element;
		// slide up starting at slideTop and ending at calloutTopPos, incrementing by slideAmount
		if (slideTop > calloutTopPos) {
			calloutObj = document.getElementById(element);
			topCoordinateNew = parseInt(slideTop);
			calloutObj.style.top = topCoordinateNew;
			slideTop = slideTop - slideAmount;
			slideTimerExpand = setTimeout("expandCallout(element)",slideInterval);
		}
		else {
			expandCalloutFlag = 0;
			slideTop = calloutTopPos;
			calloutObj = document.getElementById(element);
			calloutObj.style.top = calloutTopPos;
		}
	}
}

function contractCallout(element) {
	if (slideTimerContract != null) clearTimeout(slideTimerContract);
	if (contractCalloutTimer != null) clearTimeout(contractCalloutTimer);
	if (expandCalloutFlag == 0) {
		calloutObj = document.getElementById(element);
		this.element = element;
		// slide down starting at calloutBottomPos and ending at slideTop, incrementing by slideAmount
		if (slideTop < calloutBottomPos) {
			calloutObj = document.getElementById(element);
			topCoordinateNew = parseInt(slideTop);
			calloutObj.style.top = topCoordinateNew;
			slideTop = slideTop + slideAmount;
			slideTimerContract = setTimeout("contractCallout(element)",slideInterval);
		}
		else {
			expandCalloutFlag = 1;
			slideTop = calloutBottomPos;
			calloutObj = document.getElementById(element);
			calloutObj.style.top = slideTop;
			calloutObj.style.height = calloutMinHeight;
		}
	}
	else {
		slideTimerContract = setTimeout("contractCallout(element)",1000);
	}
}
function initiateContractCallout(element) {
	if (contractCalloutTimer != null) clearTimeout(contractCalloutTimer);
	this.element = element;
	contractCalloutTimer = setTimeout("contractCallout(element)",1000);
}
function setContractCalloutFlag() {
	expandCalloutFlag = 1;
}
function unsetContractCalloutFlag() {
	expandCalloutFlag = 0;
}