﻿// *********************************
// *****  Catalogue Functions  *****
// *********************************

	var allListItems;
	var currentListAmount = 0;
	var currentResultAmount = 0;
	
	var defaultListAmount = 20; // Number of items to start with
	var showMoreAmount = 5; // Number of items to add on each link click
	
// Setup catalogue page by detecting features

	function setupCatalogue() {
		// add list item to javascript objects
		if(document.getElementsByClassName) {
			allListItems = document.getElementsByClassName("cListItem");
		} else {
			allListItems = getElementsByClass("cListItem",document,"div");
		}
		for(i=0;i<allListItems.length;i++) {
			allSearchResults[i].listItem = allListItems[i];
			allSearchResults[i].inResult = true;
			if (i <= (defaultListAmount - 1)) {
				allSearchResults[i].visible = true;
				currentListAmount++;
			} else {
				allSearchResults[i].visible = false;
				if($) {
					$(allSearchResults[i].listItem).animate({opacity: 0}, 0, function() {
						$(allSearchResults[i].listItem).slideUp(0);
					});
				} else allSearchResults[i].listItem.style.display = "none";
			}
		}
		currentResultAmount = allListItems.length;
		
		// interface update
		updateResultsCount();
		updateShowMoreLink();
	}
		
	
// 'Refine Search Results' engine
		
	var allSearchResults = new Array();
	var searchResultsCount = 0;
	
	function addSearchResult(getPower,getPrice,getLength,getLocation) {
		allSearchResults[searchResultsCount] = new Object();
		thisResult = allSearchResults[searchResultsCount];
		// power
		if(getPower) {
			thisResult.fPower = true;
			thisResult.fSail = false;
			fPower = true;
		} else {
			thisResult.fPower = false;
			thisResult.fSail = true;
			fSail = true;
		}
		// price
		thisResult.fPriceA = false;
		thisResult.fPriceB = false;
		thisResult.fPriceC = false;
		thisResult.fPriceD = false;
		fShowPrice = false;
		if(getPrice >= 1000000) {
			thisResult.fPriceA = true;
			fPriceA = true;
			fShowPrice = true;
		}
		if(getPrice >= 500000 && getPrice <= 1000000) {
			thisResult.fPriceB = true;
			fPriceB = true;
			fShowPrice = true;
		}
		if(getPrice >= 100000 && getPrice <= 500000) {
			thisResult.fPriceC = true;
			fPriceC = true;
			fShowPrice = true;
		}
		if(getPrice <= 100000) {
			thisResult.fPriceD = true;
			fPriceD = true;
			fShowPrice = true;
		}
		// length
		thisResult.fLengthA = false;
		thisResult.fLengthB = false;
		thisResult.fLengthC = false;
		thisResult.fLengthD = false;
		thisResult.fLengthE = false;
		if(getLength >= 30.48) {
			thisResult.fLengthA = true;
			fLengthA = true;
		}
		if(getLength >= 24.384 && getLength <= 30.48) {
			thisResult.fLengthB = true;
			fLengthB = true;
		}
		if(getLength >= 18.288 && getLength <= 24.384) {
			thisResult.fLengthC = true;
			fLengthC = true;
		}
		if(getLength >= 12.192 && getLength <= 18.288) {
			thisResult.fLengthD = true;
			fLengthD = true;
		}
		if(getLength <= 12.192) {
			thisResult.fLengthE = true;
			fLengthE = true;
		}
		// brand
		thisResult.fBrand = new Object();
		thisResult.fBrand[getLocation] = true;
		fBrand[getLocation] = true;
		//increment
		searchResultsCount += 1;
	}
	
	function addRefineFormField(getLabel, getChecked, getName) {
		if(getChecked) {
			return "<input name=\"" + getName + "\" id=\"" + getName + "\" type=\"checkbox\" onclick=\"refineSearchResults()\" \/><label for=\"" + getName + "\"> " + getLabel + "<\/label><br \/>";
		} else return "";
	}
	
	var fPower = false;
	var fSail = false;
	var fPriceA = false;
	var fPriceB = false;
	var fPriceC = false;
	var fPriceD = false;
	var fShowPrice = true;
	var fLengthA = false;
	var fLengthB = false;
	var fLengthC = false;
	var fLengthD = false;
	var fLengthA = false;
	var fLengthB = false;
	var fLengthC = false;
	var fLengthD = false;
	var fLengthE = false;
	var fBrand = new Object();
	var fieldCount;
	var targetScore = 0;
	var refineFormAreas = new Array("refineFormPower","refineFormPrice","refineFormLength","refineFormBrand");
	if(siteLanguage == "cn") {
		var refineFormAreaLabels = new Array("按游艇类型优化","按价格优化 (USD)","按长度优化","按品牌优化");
	} else {
		var refineFormAreaLabels = new Array("Refine by Boat Type","Refine by Price (USD)","Refine by Length","Refine by Brand");
	}
	
	function buildRefineForm() {
		buildCode = "";
		// power
		if(fPower && fSail) {
			buildCode += "<div id='refineFormPower' class='refineFormAreaClosed'>";
			buildCode += "<h3>" + refineFormAreaLabels[0] + "<\/h3>";
			buildCode += "<div class=\"refineFormArea\"><p><em>";
			if(siteLanguage == "cn") {
				buildCode += "只显示";
			} else {
				buildCode += "Show only";
			}
			buildCode += ":<\/em><br \/>";
			buildCode += addRefineFormField("Power", fPower, "fPower");
			buildCode += addRefineFormField("Sail", fSail, "fSail");
			targetScore +=1;
			buildCode += "<\/p><\/div><\/div>";
		}
		// price
		if (fShowPrice) {
			// see if there's more than one field in use
			fieldCount = 0;
			if(fPriceA) fieldCount += 1;
			if(fPriceB) fieldCount += 1;
			if(fPriceC) fieldCount += 1;
			if(fPriceD) fieldCount += 1;
			if(fieldCount > 1) {
				buildCode += "<div id='refineFormPrice' class='refineFormAreaClosed'>";
				buildCode += "<h3>" + refineFormAreaLabels[1] + "<\/h3>";
				buildCode += "<div class=\"refineFormArea\"><p><em>";
				if(siteLanguage == "cn") {
					buildCode += "只显示:<\/em><br \/>";
					buildCode += addRefineFormField("$1百万 +", fPriceA, "fPriceA");
					buildCode += addRefineFormField("$500千 &ndash; $1百万", fPriceB, "fPriceB");
					buildCode += addRefineFormField("$100千 &ndash; $500千", fPriceC, "fPriceC");
					buildCode += addRefineFormField("0$ &ndash; $100千", fPriceD, "fPriceD");
				} else {
					buildCode += "Show only:<\/em><br \/>";
					buildCode += addRefineFormField("$1m +", fPriceA, "fPriceA");
					buildCode += addRefineFormField("$500k &ndash; $1m", fPriceB, "fPriceB");
					buildCode += addRefineFormField("$100k &ndash; $500k", fPriceC, "fPriceC");
					buildCode += addRefineFormField("0$ &ndash; $100k", fPriceD, "fPriceD");
				}
				targetScore +=1;
				buildCode += "<\/p><\/div><\/div>";
			}
		}
		// length
		// see if there's more than one field in use
		fieldCount = 0;
		if(fLengthA) fieldCount += 1;
		if(fLengthB) fieldCount += 1;
		if(fLengthC) fieldCount += 1;
		if(fLengthD) fieldCount += 1;
		if(fLengthE) fieldCount += 1;
		if(fieldCount > 1) {
			buildCode += "<div id='refineFormLength' class='refineFormAreaClosed'>";
			buildCode += "<h3>" + refineFormAreaLabels[2] + "<\/h3>";
			buildCode += "<div class=\"refineFormArea\"><p><em>";
			if(siteLanguage == "cn") {
				buildCode += "只显示:<\/em><br \/>";
				buildCode += addRefineFormField("Superyachts (100尺+)", fLengthA, "fLengthA");
				buildCode += addRefineFormField("80尺 &ndash; 100尺", fLengthB, "fLengthB");
				buildCode += addRefineFormField("60尺 &ndash; 80尺", fLengthC, "fLengthC");
				buildCode += addRefineFormField("40尺 &ndash; 60尺", fLengthD, "fLengthD");
				buildCode += addRefineFormField("0尺 &ndash; 40尺", fLengthE, "fLengthE");
			} else {
				buildCode += "Show only:<\/em><br \/>";
				buildCode += addRefineFormField("Superyachts (100ft+)", fLengthA, "fLengthA");
				buildCode += addRefineFormField("80ft &ndash; 100ft", fLengthB, "fLengthB");
				buildCode += addRefineFormField("60ft &ndash; 80ft", fLengthC, "fLengthC");
				buildCode += addRefineFormField("40ft &ndash; 60ft", fLengthD, "fLengthD");
				buildCode += addRefineFormField("0ft &ndash; 40ft", fLengthE, "fLengthE");
			}
			targetScore +=1;
			buildCode += "<\/p><\/div><\/div>";
		}
		// brand
		if(oCount(fBrand) > 1) {
			buildCode += "<div id='refineFormBrand' class='refineFormAreaClosed'>";
			buildCode += "<h3>" + refineFormAreaLabels[3] + "<\/h3>";
			buildCode += "<div class=\"refineFormArea\"><p><em>";
			if(siteLanguage == "cn") {
				buildCode += "只显示";
			} else {
				buildCode += "Show only";
			}
			buildCode += ":<\/em><br \/>";
			for (var currBrand in oSort(fBrand)) {
				buildCode += addRefineFormField(currBrand, fBrand[currBrand], "f" + currBrand.replace(/\s*/g,''));
				allBrandFields.push(currBrand);
			}
			targetScore +=1;
			buildCode += "<\/p><\/div><\/div>";
		}
		// write form panel if there's content
		if(buildCode != "") {
			document.write("<p>&nbsp;<\/p>");
			if(siteLanguage == "cn") {
				document.write("<h2 class='noBottomNargin'>优化您的结果<\/h2>");
			} else {
				document.write("<h2 class='noBottomNargin'>Refine your Results<\/h2>");
			}
			document.write("<form name= \"refineForm\" id=\"refineForm\">");
			// content
			document.write(buildCode);
			// reset button
			document.write("<p id=\"refineResetHolder\" style=\"display:none;\"><input id=\"refineReset\" type=\"button\" value=\"");
			if(siteLanguage == "cn") {
				document.write("还原所有结果");
			} else {
				document.write("Restore all results");
			}
			document.write("\" onclick=\"clearRefine();\" \/><\/p>");
			// end form
			document.write("<\/form>");
			// hide areas
			for(i=0;i<refineFormAreas.length;i++) {
				if(document.getElementById(refineFormAreas[i])) {
					thisArea = document.getElementById(refineFormAreas[i]);
					// add link to H3
					thisArea.getElementsByTagName("H3")[0].innerHTML = "<a href='javascript:void(0)' onclick='refineFormAreaExpand(" + i + ",true);'>" + refineFormAreaLabels[i] + "<\/a>";
					// hide span content
					if($) {
						$(thisArea.getElementsByTagName("DIV")[0]).slideUp(0);
					} else {
						thisArea.getElementsByTagName("DIV")[0].style.display = "none";
					}
				}
			}
		}
		
	}
	
	function refineFormAreaExpand(expandIndex, expandMode) {
		if(document.getElementById(refineFormAreas[expandIndex])) {
			if(expandMode) {
				// OPEN AREA
				thisArea = document.getElementById(refineFormAreas[expandIndex]);
				// remove h3 link
				thisArea.getElementsByTagName("H3")[0].innerHTML = refineFormAreaLabels[expandIndex];
				// change class
				thisArea.className = "refineFormAreaOpen";
				// expand area
				if($) {
					$(thisArea.getElementsByTagName("DIV")[0]).stop(true,true);
					$(thisArea.getElementsByTagName("DIV")[0]).slideDown(200);
				} else {
					thisArea.getElementsByTagName("DIV")[0].style.display = "block";
				}
				// show reset button
				if(document.getElementById("refineResetHolder")) {
					document.getElementById("refineResetHolder").style.display = "block";
				}
			} else {
				// CLOSE AREA
				thisArea = document.getElementById(refineFormAreas[expandIndex]);
				// add h3 link
				thisArea.getElementsByTagName("H3")[0].innerHTML = "<a href='javascript:void(0)' onclick='refineFormAreaExpand(" + expandIndex + ",true);'>" + refineFormAreaLabels[expandIndex] + "<\/a>";
				// change class
				thisArea.className = "refineFormAreaClosed";
				// hide area
				if($) {
					$(thisArea.getElementsByTagName("DIV")[0]).stop(true,true);
					$(thisArea.getElementsByTagName("DIV")[0]).slideUp(0);
				} else {
					thisArea.getElementsByTagName("DIV")[0].style.display = "none";
				}
			}
		}
	}
	
	
	
	
	var allPowerFields = new Array("fPower","fSail");
	var allPriceFields = new Array("fPriceA","fPriceB","fPriceC","fPriceD");
	var allLengthFields = new Array("fLengthA","fLengthB","fLengthC","fLengthD","fLengthE");
	var allBrandFields = new Array();
	
	function refineSearchResults() {
		var showAll = true;
		var limitType = false;
		var limitPrice = false;
		var limitLength = false;
		var limitBrand = false;
		var limitScore = 0;
		// are any tick boxes ticked?
			// power
			tickFound = false
			for(x=0;x<allPowerFields.length;x++) {
				if(document.refineForm[allPowerFields[x]]) { // form field exists
					if(document.refineForm[allPowerFields[x]].checked) {
						limitType = true;
						showAll = false;
					}
				}
			}
			// price
			if(fShowPrice) {
				for(x=0;x<allPriceFields.length;x++) {
					if(document.refineForm[allPriceFields[x]]) { // form field exists
						if(document.refineForm[allPriceFields[x]].checked) {
							limitPrice = true;
							showAll = false;
						}
					}
				}
			}
			// length
			for(x=0;x<allLengthFields.length;x++) {
				if(document.refineForm[allLengthFields[x]]) { // form field exists
					if(document.refineForm[allLengthFields[x]].checked) {
						limitLength = true;
						showAll = false;
					}
				}
			}
			// brand
			for(x=0;x<allBrandFields.length;x++) {
				if(document.refineForm["f" + allBrandFields[x].replace(/\s*/g,'')]) { // form field exists
					if(document.refineForm["f" + allBrandFields[x].replace(/\s*/g,'')].checked) {
						limitBrand = true;
						showAll = false;
					}
				}
			}
		//set limit score
		if(limitType) limitScore +=1;
		if(limitPrice) limitScore +=1;
		if(limitLength) limitScore +=1;
		if(limitBrand) limitScore +=1;
		// loop through results
		var visibleTotal = 0;
		currentResultAmount = 0;
		currentListAmount = 0;
		for(i=0;i<allSearchResults.length;i++) {
			if(showAll) {
				currentResultAmount = allSearchResults.length;
				if(visibleTotal < defaultListAmount) {
					updateListItemDisplay(i, true);
					visibleTotal += 1;
				}
			} else {
				itemScore = 0;
				// power
				if(limitType) {
					matchFound = false
					for(x=0;x<allPowerFields.length;x++) {
						if(document.refineForm[allPowerFields[x]]) { // form field exists
							if(document.refineForm[allPowerFields[x]].checked && allSearchResults[i][allPowerFields[x]] == true) matchFound = true;
						}
					}
					if(matchFound) itemScore += 1;
				}
				// price
				if(limitPrice) {
					matchFound = false
					if (fShowPrice) {
						for(x=0;x<allPriceFields.length;x++) {
							if(document.refineForm[allPriceFields[x]]) { // form field exists
								if(document.refineForm[allPriceFields[x]].checked && allSearchResults[i][allPriceFields[x]] == true) matchFound = true;
							}
						}
					}
					if(matchFound) itemScore += 1;
				}
				// length
				if(limitLength) {
					matchFound = false
					for(x=0;x<allLengthFields.length;x++) {
						if(document.refineForm[allLengthFields[x]]) { // form field exists
							if(document.refineForm[allLengthFields[x]].checked && allSearchResults[i][allLengthFields[x]] == true) matchFound = true;
						}
					}
					if(matchFound) itemScore += 1;
				}
				// brand
				if(limitBrand) {
					matchFound = false
					for(x=0;x<allBrandFields.length;x++) {
						if(document.refineForm["f" + allBrandFields[x].replace(/\s*/g,'')]) { // form field exists
							if(document.refineForm["f" + allBrandFields[x].replace(/\s*/g,'')].checked && allSearchResults[i]["fBrand"][allBrandFields[x]] == true) matchFound = true;
						}
					}
					if(matchFound) itemScore += 1;
				}
				// display?
				if(itemScore == limitScore) {
					currentResultAmount += 1;
					allSearchResults[i].inResult = true;
					if(visibleTotal < defaultListAmount) {
						updateListItemDisplay(i, true);
						visibleTotal += 1;
					}
				} else {
					allSearchResults[i].inResult = false;
					updateListItemDisplay(i, false);
				}
			}
		}
		// interface updates
		updateResultsCount();
		updateShowMoreLink();
	}
	
	function updateListItemDisplay(itemIndex, getMode) {
		if(getMode) { // show
			if(!allSearchResults[itemIndex].visible) {
				if($) {
					$(allSearchResults[itemIndex].listItem).stop(true,true);
					$(allSearchResults[itemIndex].listItem).animate({opacity: 1, backgroundColor: "#b5b5b5"}, 0, function() {
						$(allSearchResults[itemIndex].listItem).slideDown(200, function() {
							$(allSearchResults[itemIndex].listItem).animate({backgroundColor: "#ffffff"}, 750);
						});
					});
				} else {
					allSearchResults[itemIndex].listItem.style.display = "block";
				}
			}
			allSearchResults[itemIndex].visible = true;
			currentListAmount++;
		} else { // hide
			if(allSearchResults[itemIndex].visible) {
				if($) {
					$(allSearchResults[itemIndex].listItem).stop(true,true);
					$(allSearchResults[itemIndex].listItem).animate({opacity: 0}, 100, function() {
						$(allSearchResults[itemIndex].listItem).slideUp(200);
					});
				} else {
					allSearchResults[itemIndex].listItem.style.display = "none";
				}
			}
			allSearchResults[itemIndex].visible = false;
		}
	}
	
	function clearRefine() {
		allFormFields = document.refineForm.getElementsByTagName("INPUT");
		for(i=0;i<allFormFields.length;i++) {
			if(allFormFields[i].getAttribute("type") == "checkbox") allFormFields[i].checked = false;
		}
		for(i=0;i<refineFormAreas.length;i++) {
			refineFormAreaExpand(i,false);
		}
		document.getElementById("refineResetHolder").style.display = "none";
		refineSearchResults();
	}
	
	function updateResultsCount() {
		if(currentListAmount < currentResultAmount) {
			if(siteLanguage == "cn") {
				document.getElementById("cListSummary").innerHTML = "显示" + currentResultAmount + "个记录中的" + currentListAmount + "个";
			} else {
				document.getElementById("cListSummary").innerHTML = "Showing " + currentListAmount + " of " + currentResultAmount + " result" + ((currentResultAmount > 1) ? "s" : "") + ".";
			}
		} else {
			if(siteLanguage == "cn") {
				document.getElementById("cListSummary").innerHTML = "找到" + currentListAmount + "个记录";
			} else {
				document.getElementById("cListSummary").innerHTML = currentListAmount  + " result" + ((currentListAmount > 1) ? "s" : "") + " found.";
			}
		}
	}
	
	function updateShowMoreLink() {
		if (document.getElementById("showMoreLink")) {
			var resultsLeft = showMoreAmount;
			if (resultsLeft > (currentResultAmount - currentListAmount)) resultsLeft = currentResultAmount - currentListAmount;
			if (currentResultAmount > defaultListAmount) {
				if(siteLanguage == "cn") {
					document.getElementById("showMoreLink").innerHTML = "<a href=\"javascript:showMoreResults();\">显示另外" + resultsLeft.toString() + "艘游艇&hellip;</a>";
				} else {
					document.getElementById("showMoreLink").innerHTML = "<a href=\"javascript:showMoreResults();\">Show another " + resultsLeft.toString() + " yacht" + ((resultsLeft > 1) ? "s" : "") + "&hellip;</a>";
				}
			} else {
				document.getElementById("showMoreLink").innerHTML = "";
			}
		}
	}
	
	function showMoreResults() {
		defaultListAmount += showMoreAmount;
		refineSearchResults();
	}
	
// Listing price converter

	var currencyRates = new Array();
	var currencyIndex = 0;
	
	function addCurrency(getTitle, getCode, getSymbol, getRate) {
		currencyRates[currencyIndex] = new Object();
		currencyRates[currencyIndex].title = getTitle;
		currencyRates[currencyIndex].code = getCode;
		currencyRates[currencyIndex].symbol = getSymbol;
		currencyRates[currencyIndex].rate = getRate;
		currencyIndex += 1;
	}

	function buildPriceConverter(getMode, itemID, itemPrice, currencyCode) {
		document.write("<form id='priceConverter_" + itemID + "'>");
		document.write("<select onchange=\"convertPrice('" + getMode + "', this, " + itemID + ", " + itemPrice + ", '" + currencyCode + "')\">");
		for(i=0; i<currencyRates.length; i++) {
			document.write("<option value='" + currencyRates[i].code + "'");
			if(getMode == "listing" && currencyRates[i].code == "USD") document.write(" selected");
			if(getMode == "details" && currencyRates[i].code == currencyCode) document.write(" selected");
			document.write(">" + currencyRates[i].title + "<\/option>");
		}
		document.write("<\/select>");
		document.write("<\/form>");
	}
	
	function convertPrice(getMode, selectObject, itemID, itemPrice, currencyCode) {
		basePrice = itemPrice;
		baseCurrencyCode = currencyCode;
		newCurrencyCode = selectObject.options[selectObject.selectedIndex].value;
		isBase = false;
		if(baseCurrencyCode == newCurrencyCode) {
			newPrice = itemPrice;
			isBase = true;
		} else {
			for(i=0; i<currencyRates.length; i++) {
				if(currencyRates[i].code == baseCurrencyCode) baseRate = currencyRates[i].rate;
				if(currencyRates[i].code == newCurrencyCode) newRate = currencyRates[i].rate;
			}
			newPrice = (itemPrice / baseRate) * newRate;
		}
		newSymbol = currencyRates[selectObject.selectedIndex].symbol;
		// write new content
		if(getMode == "listing") {
			document.getElementById("cListItemPrice_" + itemID).innerHTML = newSymbol + formatPrice(newPrice);
			document.getElementById("cListItemPriceLabelApprox_" + itemID).innerHTML = (isBase ? "" : "approx.");
		} else {
			document.getElementById("cPrice").innerHTML = newSymbol + formatPrice(newPrice);
			document.getElementById("approxLabel").innerHTML = (isBase ? "" : "approx.");
		}
	}
			
	function formatPrice(getPrice) {
		// round up
		tempPrice = "" + Math.round(getPrice);
		// add commas
		var rgx = /(\d+)(\d{3})/;
		while (rgx.test(tempPrice)) {
			tempPrice = tempPrice.replace(rgx, '$1' + ',' + '$2');
		}
		return tempPrice;
	}

	
// Media Tabs

	var mediaTabAreas;
	var mediaTabIndex = 0;
	var mediaTabTitles = new Array;
	var mediaTabThumbnails = new Array;

	function buildMediaTabs() {
		if(document.getElementById("cDetailMediaPanel")) {
			if(document.getElementsByClassName) {
				mediaTabAreas = document.getElementById("cDetailMediaPanel").getElementsByClassName("cDetailThumbnailArea");
			} else {
				mediaTabAreas = getElementsByClass("cDetailThumbnailArea",document.getElementById("cDetailMediaPanel"),"div");
			}
			if(mediaTabAreas.length > 0) {
				// loop through, get data, and hide all but first tab
				for(i=0;i<mediaTabAreas.length;i++) {
					// tab title
					if(document.all) {
						mediaTabTitles[i] = mediaTabAreas[i].getElementsByTagName("H2")[0].innerText.toString();
					} else {
						mediaTabTitles[i] = mediaTabAreas[i].getElementsByTagName("H2")[0].textContent.toString();
					}
					// hide content?
					if(i == 0) {
						mediaTabAreas[i].className = "cDetailThumbnailArea contentVisible";
					} else {
						mediaTabAreas[i].className = "cDetailThumbnailArea contentHidden";
					}
					// Create arrow navigation for small thumbnails
					if(mediaTabAreas[i].getElementsByTagName("IMG").length > 1) mediaTabThumbnails[i] = new mediaThumbScroller(i);
				}
				// Build tabs
				var myTabs = "<dl id='mediaTabButtons'>";
				for (i=0; i<mediaTabAreas.length; i++) {
					if (i == tabOn) {
						myTabs += "<dd id='mediaTab" + i + "' class='tab tabOn'>";
					} else {
						myTabs += "<dd id='mediaTab" + i + "' class='tab tabOff'>";
					}
					myTabs += "<a href='javascript:doMediaTab(" + i + ");'><span class='tabContent'>" + mediaTabTitles[i] + "<\/span><\/a><\/dd>";
				}
				myTabs += "</dl>";
				document.getElementById("cDetailMediaPanelTabs").innerHTML += myTabs;
			}
		}
	}
	
	function doMediaTab(getTab) {
		// check tab is different from current active tab
		if(getTab != mediaTabIndex) {
			// get elements again for IE
			if(document.getElementsByClassName) {
				mediaTabAreas = document.getElementById("cDetailMediaPanel").getElementsByClassName("cDetailThumbnailArea");
			} else {
				mediaTabAreas = getElementsByClass("cDetailThumbnailArea",document.getElementById("cDetailMediaPanel"),"div");
			}
			// hide old content and change old tab class
			mediaTabAreas[mediaTabIndex].className = "cDetailThumbnailArea contentHidden";
			document.getElementById("mediaTab"+mediaTabIndex).className = "tab tabOff";
			// show new content and change new tab class
			mediaTabAreas[getTab].className = "cDetailThumbnailArea contentVisible";
			document.getElementById("mediaTab"+getTab).className = "tab tabOn";
			// store new tab
			mediaTabIndex = getTab;
		}
	}
	
	function mediaThumbScroller(getIndex) {
		this.index = getIndex;
		this.scrollNeeded = false;
		if(document.getElementsByClassName) {
			this.thumbContainer = mediaTabAreas[getIndex].getElementsByClassName("smallImagesContainer")[0];
		} else {
			this.thumbContainer = getElementsByClass("smallImagesContainer",mediaTabAreas[getIndex],"div")[0];
		}
		this.allThumbs = this.thumbContainer.getElementsByTagName("A");
		this.thumbCount = this.allThumbs.length;
		// loop through an get width total
		this.prevThumb = -1;
		this.nextThumb = -1;
		this.thumbsWidthCount = 0;
		thumbsMaxWidth = 352;
		for(x=0;x<this.allThumbs.length;x++) {
			this.thumbsWidthCount += parseFloat(this.allThumbs[x].offsetWidth) +10;
			if((this.thumbsWidthCount - 10) > thumbsMaxWidth) {
				this.allThumbs[x].style.display = "none";
				if(this.nextThumb < 0) this.nextThumb = x;
				this.scrollNeeded = true;
			}
		}
		if(this.scrollNeeded) {
			// create left arrow button
			var newdiv = document.createElement("DIV");
   			newdiv.setAttribute("id", "leftArrow" + getIndex);
   			newdiv.setAttribute("class", "mediaThumbArrowLeft inactive");
			this.thumbContainer.appendChild(newdiv);
			// create right arrow button
			var newdiv = document.createElement("DIV");
   			newdiv.setAttribute("id", "rightArrow" + getIndex);
   			newdiv.setAttribute("class", "mediaThumbArrowRight active");
			this.thumbContainer.appendChild(newdiv);
			this.updateMediaArrows();
		}
	}
	
	mediaThumbScroller.prototype.updateMediaArrows = function() {
		if(this.prevThumb >= 0) {
			document.getElementById("leftArrow" + this.index).className = "mediaThumbArrowLeft active";
			document.getElementById("leftArrow" + this.index).onclick = function() {
				moveMediaThumbs(this.id,"left");
			}
		} else {
			document.getElementById("leftArrow" + this.index).className = "mediaThumbArrowLeft inactive";
			document.getElementById("leftArrow" + this.index).onclick = null;
		}
		if(this.nextThumb < this.thumbCount) {
			document.getElementById("rightArrow" + this.index).className = "mediaThumbArrowRight active";
			document.getElementById("rightArrow" + this.index).onclick = function() {
				moveMediaThumbs(this.id,"right");
			}
		} else {
			document.getElementById("rightArrow" + this.index).className = "mediaThumbArrowRight inactive";
			document.getElementById("rightArrow" + this.index).onclick = null;
		}
	}
	
	function measureWidth(getIndex) {
		thisScroller = mediaTabThumbnails[getIndex];
		buildWidth = -10;
		for(y=0; y<thisScroller.allThumbs.length; y++) {
			if(thisScroller.allThumbs[y].style.display != "none") buildWidth += (parseFloat(thisScroller.allThumbs[y].offsetWidth) + 10);
		}
		return buildWidth;
	}
	
	function moveMediaThumbs(getTrigger,getMode) {
		getIndex = parseFloat(getTrigger.split("w")[1]);
		thisScroller = mediaTabThumbnails[getIndex];
		if(getMode == "right") {
			thisScroller.allThumbs[thisScroller.nextThumb].style.display = "inline";
			if($) {
				$(thisScroller.allThumbs[thisScroller.nextThumb]).stop(true,false);
				$(thisScroller.allThumbs[thisScroller.nextThumb]).animate({opacity: 0}, 0);
				$(thisScroller.allThumbs[thisScroller.nextThumb]).animate({opacity: 1}, 1000);
			}
			thisScroller.nextThumb += 1;
			while(measureWidth(thisScroller.index) > 352) {
				thisScroller.allThumbs[thisScroller.prevThumb + 1].style.display = "none";
				thisScroller.prevThumb += 1;
			}
			thisScroller.updateMediaArrows();
		} else {
			thisScroller.allThumbs[thisScroller.prevThumb].style.display = "inline";
			if($) {
				$(thisScroller.allThumbs[thisScroller.prevThumb]).stop(true,false);
				$(thisScroller.allThumbs[thisScroller.prevThumb]).animate({opacity: 0}, 0);
				$(thisScroller.allThumbs[thisScroller.prevThumb]).animate({opacity: 1}, 1000);
			}
			thisScroller.prevThumb -= 1;
			while(measureWidth(thisScroller.index) > 352) {
				thisScroller.allThumbs[thisScroller.nextThumb - 1].style.display = "none";
				thisScroller.nextThumb -= 1;
			}
			thisScroller.updateMediaArrows();
		}
	}









