// sets image color variation and change image with color variation
// store actual image color variation
var storeImgVariation = "img_original";
function setImgColor(col) {
	// set image color
	setCol(col);
	// turn off last shown image
	document.getElementById(storeImgVariation).style.display = "none";
	// image src needs to be replaced because trans.gif is set for initial load (to prevent preloading big file sizes)
	var newImg250Src = document.getElementById("img250src_" + col).value;
	document.getElementById("img250_" + col).src = newImg250Src;
	// show new image color
	document.getElementById("img_" + col).style.display = "block";
	// store actual shown image
	storeImgVariation = "img_" + col;
}
function setImgOriginal(col) {
	// set image color
	setCol(col);
	// replace, show and store original image
	document.getElementById(storeImgVariation).style.display = "none";
	document.getElementById("img_original").style.display = "block";
	storeImgVariation = "img_original";
}


// adds images to tooltip. the images were read out of an hidden input field
function addImg2TT(imgBoxId, imgId, imgPrefix) {
	var box = document.getElementById(imgBoxId)
	var imgStr = document.getElementById(imgId).value;
	if (imgStr == "") {
		document.getElementById(imgBoxId).style.display = "none";
	}
	else if (imgStr != "loaded") {
		var imgs = imgStr.split(",");
		for (var i = 0; i <imgs.length; i++) {
			var img = document.createElement('img');
			img.setAttribute('src', imgPrefix + imgs[i]);
			var tag = imgs[i];
			if(tag.indexOf('trans.gif') != -1) {
				img.setAttribute('class', 'sprite sMore');
				img.setAttribute('border', '0');
			}
			box.appendChild(img);
		}
		document.getElementById(imgId).value = "loaded";
	}
}

// handles navigation scrolling. if nav is on top of screen, it'll be fixed except user's scrolling to page end.
function handleNavigation() { 
	window.onscroll = function() {
		var nav = document.getElementById('navTable');
		// get scrolled position
		var scrolledW3C = document.body.scrollTop; // W3C browsers
		var scrolledIE = document.documentElement.scrollTop; // ie
		var scrolled = (scrolledW3C > 0) ? scrolledW3C : scrolledIE;
		// get length of navigation and size of window to calculate end of window
		var docHeight = document.getElementById('superContent').clientHeight;
		var navHeight = nav.clientHeight;
		// calculate left top corner of lowest nav position
		var navLowestTopPos = (docHeight - (navHeight + 150));

		if (scrolled > 110) {
			nav.style.position = "fixed";
			if (scrolled < navLowestTopPos) {
				nav.style.top = "0px";
			}
			else {
				nav.style.top = (navLowestTopPos - scrolled) + "px";
			}
		}
		else {
			nav.style.position = "static";
		}
	}
}

function loadFacebook() {
	try {
		// get visit specific information
		var link = document.getElementById('fbLink').value;
		
		// generate iFrame url
		var fbIFrameUrl = "http://www.facebook.com/plugins/like.php?href=facebook.com%2F" + link + "&amp;layout=standard&amp;show_faces=false&amp;width=300&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=75";
		
		// create iframe
		var fbIFrame = document.createElement('iFrame');
		fbIFrame.setAttribute('src', fbIFrameUrl);
		fbIFrame.setAttribute('id', 'fbIFrame')
		fbIFrame.setAttribute('scrolling', 'no');
		fbIFrame.setAttribute('frameBorder', '0');
		fbIFrame.setAttribute('allowTransparency', 'true');
		
		document.getElementById('appendIFrame').appendChild(fbIFrame);
		document.getElementById('facebook').style.display = "block";
	}
	catch(err) {
		// do nothing in error case, handling is just to avoid crashing
		// which would results in stopping the execution of all JS code
	}
}

// for subcat.jsp / itemlist.jsp / itemDetails.jsp
function setMaterial(mat) {
	document.getElementById('current').id=matOfCurrent;
	document.getElementById("div_"+matOfCurrent).style.visibility = 'hidden';
	matOfCurrent = mat;
	document.getElementById(mat).id='current';
	document.getElementById("div_"+mat).style.visibility = 'visible';
	document.getElementById("div_"+mat).style.width = 420;
}

function cbi(elt) {
    var element = document.getElementById(elt);
    element.style.borderColor="#F6CE02";
}

function cbiback(elt) {
    var element = document.getElementById(elt);
    element.style.borderColor="#F3F3F3";
}      


// for cart.jsp  // TODO move those 2 methods as single statement inline to cart.jsp ------- 
function remove(n) {
  self.location.replace("cart.jsp?remove=" + n  + "&r=" + Math.random() );
}

function changeVar(n) {
  var newVar =  document.getElementById("var_"+n).value;
  self.location.replace('cart.jsp' + "?change=" + n + "&var=" + newVar + "&r=" + Math.random() );
}
// remove until here -----------------------------------------------------------------------


      
// for itemDetails.jsp      

function showDetailText(elt) {
    document.getElementById(elt).style.visibility = "visible";
}

function hideDetailText(elt) {
    document.getElementById(elt).style.visibility = "hidden";
}              

var colSelected = null;
function setCol(col) {
	var colToSet = document.getElementById('col_' + col);
	if(colSelected != null) {
		colSelected.className = "i";
	}
	colToSet.className = "iA";
	colSelected = colToSet;
	document.f.variation.value= col; 

}


function setSelectCol() {
	var col = document.getElementById("varSelect").value;
	setCol(col);
}


function addToCart(itemID,smartPhone) {
  var link = "itemDetails.jsp?addToCart=" + itemID + "&itemID=" + itemID + "&r=" + Math.random();
  var sel = document.forms["f"].elements["variation"];
  if ( sel != null && sel.value == 'choose') {
	if(!smartPhone) {
	  	document.getElementById('choose').style.visibility = "visible";
	} else {
	  	document.getElementById('choose').style.display = "block";
	  	setButtonLabel();
	}
  	return; 
  }
  link = link + "&var=" + document.forms["f"].elements["variation"].value;
  self.location.replace(link);
}

function pause(millis) {
	date = new Date();
	var curDate = null;
	
	do { var curDate = new Date(); } 
	while(curDate-date < millis);
} 


function copyText(t) {
	window.clipboardData.setData('Text', t);
}


function changeLangToIDs(url) {
    var c = "?";
    if (self.location.href.indexOf("?") != -1) { c = "&"; }
    self.location.replace(self.location.href + c + "langIDs=true");
}      


function cc(tdName) {
    var row = document.getElementById(tdName);
    row.style.backgroundColor="#F6CE02";
}

function ccback(tdName) {
    var row = document.getElementById(tdName);
    row.style.backgroundColor="#EFEFEF";
}

/* myBijouteria.jsp functions (prefix mB...) */
function mBCc(trName, clazzName) {
	var row = document.getElementById(trName);
	row.className = clazzName + "_hover";
}

function mBCcback(trName, clazzName) {
  var row = document.getElementById(trName);
  row.className = clazzName;
}

function mBHideInfo(infoID) {
  var row = document.getElementById(infoID);
  row.className = "mB_hideInfo";
}

function mBSwitchInfoState(infoID) {
  var row = document.getElementById(infoID);
  var clazz = row.className;
  if("mB_showInfo" == clazz) {
	  row.className = "mB_hideInfo";
  } else {
	  row.className = "mB_showInfo";
  }
}

function cb(elt) {
    var element = document.getElementById(elt);
    element.style.borderColor="#F6CE02";
}

function cbback(elt) {
    var element = document.getElementById(elt);
    element.style.borderColor="#FFFFFF";
}      

function cbbackgrey(elt) {
    var element = document.getElementById(elt);
    element.style.borderColor="#EEEEEE";
}    


// Navigator functions
var color = "";

function ccN(tdName) {
  var row = document.getElementById(tdName);
  color = row.backgroundColor;
  if (color==null) { color = row.style.backgroundColor; }
  row.style.backgroundColor="#F6CE02";
  row.style.Cursor="Hand";
}

function ccNback(tdName)
{
  var row = document.getElementById(tdName);
  row.style.backgroundColor=color;
} 


// CRC : Bitte gleich bei allen Tooltip functionen noch mit Kommentar beschreiben
// tooltip functions
function showTT(ttDivId,text,callingElemId,leftPos,topPos,doHover) {
	var tooltip = document.getElementById(ttDivId);
	if (text.substr(0,3) == 'id:') {
		var textDivId = text.substr(3);
		var textDiv = document.getElementById(textDivId);
		tooltip.innerHTML = textDiv.innerHTML;
	}
	else {
		tooltip.innerHTML = text;
	}
	var calling = document.getElementById(callingElemId);
	if (doHover) {
		calling.style.backgroundColor="#F6CE02"
	}
	var x = leftPos;
	if (x == '') {
		var xCalc = findPosX(calling);
		if (xCalc > 696) {
			xCalc = 696;
		}
		x = xCalc + 'px';
	}
	else if (x.substr(0,3) == 'id:') {
		var adjustDivId = x.substr(3);
		var adjustElemPos = findPosX(document.getElementById(adjustDivId));
		x = adjustElemPos + 'px';
	}
	var y = topPos;
	if (y == '') {
		y = ((findPosY(calling) - tooltip.clientHeight + 12)) + 'px';
	}
	tooltip.style.left = x; tooltip.style.top = y;
	tooltip.style.visibility = "visible";
} 

function hideTT(ttDivId,callingElemId,doHover) {
	document.getElementById(ttDivId).style.visibility = 'hidden';
	if (doHover) {
		document.getElementById(callingElemId).style.backgroundColor = "#EFEFEF";
	}
}
	
// tooltip with items
function iTT(msg, imgID, bigImg, rightAlign, rightAlignCorrection, label, cols) {
	var layer = document.getElementById('tooltip');
	layer.style.height = "270px";

	var content ='<TABLE cellpadding="2" width="500" height="120"><TR>';
	content += '<TD class="tt" style="width:250px;height:250px;"><IMG src="' + bigImg + '" /></TD>';
	content += '<TD class="tt" >' + msg;
	for(var i in cols) {
		if(i == 0) {
			content += "<BR><BR>" + label + ":<BR><BR>";
		}
		content += '<IMG style="display:inline;" src="http://static.bijouteria.ch/ct/small/' + cols[i] + '.jpg"/> ';
	}
	content +=  '</TD></TR></TABLE>';
	
	var img = document.getElementById(imgID);

	layer.innerHTML = content;
	var layerHeight = layer.clientHeight;
	
	layer.style.visibility = "visible";
	var l = (findPosX(img) - 2 - (rightAlign ? 293 - rightAlignCorrection : 0));
	layer.style.left = l + 'px';
	var t = (findPosY(img) - layerHeight);
	layer.style.top = t + 'px';
}


// untooltip
function uTT() {
	var layer = document.getElementById('tooltip');	
	layer.style.visibility = "hidden";
}


function findPosX(obj) {
    var curleft = 0;
    if(obj.offsetParent)
        while(1) 
        {
          curleft += obj.offsetLeft;
          if(!obj.offsetParent)
            break;
          obj = obj.offsetParent;
        }
    else if(obj.x)
        curleft += obj.x;
    return curleft;
}


function findPosY(obj) {
    var curtop = 0;
    if(obj.offsetParent)
        while(1)
        {
          curtop += obj.offsetTop;
          if(!obj.offsetParent)
            break;
          obj = obj.offsetParent;
        }
    else if(obj.y)
        curtop += obj.y;
    return curtop;
}

/* material switch function (_materialBox)*/
var cacheMatLinkId = "ml_0";
function matSwitch(id, text, selfId) {
	document.getElementById(id).innerHTML=text;
	var oldElem = document.getElementById(cacheMatLinkId);
	var newElem = document.getElementById(selfId);
	cacheMatLinkId = selfId;

	// reset old element
	oldElem.className="choose";
	
	// set new element
	newElem.className="active";
}

/* used by smart phones (special button) */
function setButtonLabel() {
    var bg = document.getElementById('phoneButton');
    var label = document.getElementById('phoneButtonLabel');
    
    /* evaluate font size */
    var labelFontSize = bg.offsetHeight/2;
    document.getElementById('cLabel').style.fontSize = labelFontSize + "px";

    /* set label to position */
    label.style.left = (bg.offsetWidth/2) - (label.offsetWidth/2);
    var labelTop = bg.offsetTop + ((bg.offsetHeight/2) - (label.offsetHeight/2));
  	label.style.top = labelTop + 5 + document.getElementById('iHeader').offsetHeight;
    
    label.style.visibility="visible";
}