// JavaScript Document
<!--

/////////////////////////////////////////////////////////////////////////////////
// DROP DOWN SETUP
/////////////////////////////////////////////////////////////////////////////////

// All Rights Reserved, Copyright © Brite Inc.
//drop downs 
sfHover = function() {
	var sfEls = document.getElementById("nav").getElementsByTagName("LI");
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover";
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

sfHover2 = function() {
	var sfEls = document.getElementById("moreImagesBox").getElementsByTagName("A");
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover2";
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover2\\b"), "");
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHover2);

sfHoverProdLinks = function() {
	var sfEls = document.getElementById("productTools").getElementsByTagName("DIV");
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover5";
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover5\\b"), "");
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHoverProdLinks);

sfHover3 = function() {
	var sfEls = document.getElementById("colorsBox").getElementsByTagName("P");
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover3";
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover3\\b"), "");
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHover3);

sfHover4 = function() {
	var sfEls = document.getElementById("navB").getElementsByTagName("LI");
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover4";
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover4\\b"), "");
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHover4);

/////////////////////////////////////////////////////////////////////////////////
// END DROP DOWN SETUP
/////////////////////////////////////////////////////////////////////////////////

/////////////////////////////////////////////////////////////////////////////////
// GENERAL FUNCTIONS
/////////////////////////////////////////////////////////////////////////////////

function linkCollapse(name, sectionNum, linkText){
	var divElement = document.getElementById(name);
	if (divElement.style.display == "none"){
		var linkHandle;
		for( var i=1; i<=sectionNum; i++){	
			document.getElementById("hideDiv"+i).style.display = "none";
			linkHandle = document.getElementById("catLink"+i);
			linkHandle.innerHTML = linkHandle.innerHTML.replace("arrowD.gif","arrow.gif");
		}
		divElement.style.display = "inline";
		linkText.innerHTML = linkText.innerHTML.replace("arrow.gif","arrowD.gif");
	} else {
		divElement.style.display = "none";
		linkText.innerHTML = linkText.innerHTML.replace("arrowD.gif","arrow.gif");
	}
}


// clear field on focus
function autoclear(thefield,thedefault) {
	if (thefield.value==thedefault) thefield.value = "";
}

// addLoadEvent()
// Adds event to window.onload without overwriting currently assigned onload functions.
// Function found at Simon Willison's weblog - http://simon.incutio.com/
function addLoadEvent(func)
{	
	var oldonload = window.onload;
	if (typeof window.onload != 'function'){
    	window.onload = func;
	} else {
		window.onload = function(){
		oldonload();
		func();
		}
	}
}

function switchTabs(name){
	if( document.getElementById("featBox") ){ document.getElementById("featBox").style.display = "none"; }
	if( document.getElementById("descBox") ){document.getElementById("descBox").style.display = "none"; }
	if( document.getElementById("colorsBox") ){document.getElementById("colorsBox").style.display = "none"; }
	if( document.getElementById("imagesBox") ){document.getElementById("imagesBox").style.display = "none"; }
	document.getElementById(name).style.display = "inline";
}

/////////////////////////////////////////////////////////////////////////////////
// END GENERAL FUNCTIONS
/////////////////////////////////////////////////////////////////////////////////

//////////////////////////////////////////////////////
// fade in/out functions for added to cart box
//////////////////////////////////////////////////////
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 + ")";
}
//////////////////////////////////////////////////////
// end fade in/out functions for added to cart box
//////////////////////////////////////////////////////

//////////////////////////////////////////////////////////////////////////////////////
// ADD TO CART FUNCTIONS
//////////////////////////////////////////////////////////////////////////////////////

// writeAjaxSubmit()
// Overwrites the form submit with a link that calls the addToCart javascript function
function writeAjaxSubmit(){
	var submitDivs = $$('.submitRewrite');	
	
	for(var i=0;i<submitDivs.length;i++){
		submitDivs[i].innerHTML = "<a onclick=\"addToCart("+ i + ")\" title='Buy Now'><img border='0' src='/images/graphics/button_buy2.gif' alt='Buy Now' /></a>";	
	}
}

// addToCart
// Adds the given item to the shopping cart
// args: num - keeps track of what item was added to the cart
function addToCart(num){
	var cartItems = "";
	var cartArgs = new2DArray(6,2);	
	
	//Set up arguments for ajax
	cartArgs[0][0] = "sku_grp_id";
	cartArgs[0][1] = $('skuID'+num).value;
	cartArgs[1][0] = "item_sku";
	cartArgs[1][1] = $('itemSKU'+num).value;
	cartArgs[2][0] = "num_options";
	cartArgs[2][1] = $('numOptions'+num).value;
	cartArgs[3][0] = "type";
	cartArgs[3][1] = $('itemType'+num).value;
	cartArgs[4][0] = "qty";
	cartArgs[4][1] = $('qty'+num).value;
	cartArgs[5][0] = "sales_price";
	cartArgs[5][1] = $('salesPrice'+num).value;
	
	//Make item added box invisible / write loading screen
	document.getElementById('itemAddedDiv').innerHTML = "<center><br /><br /><img src='/images/graphics/page-loading.gif' /><br />Loading...</center>";
	
	//Replace button with an item added button
	document.getElementById('addButtonDiv'+num).innerHTML = "<a onclick=\"addToCart("+ num + ")\" title='Item Added'><img border='0' src='/images/graphics/item_added.gif' alt='Item Added' /></a>";	
	
	//Run AJAX call
	returnData = runAJAXsync('add_to_cart',cartArgs);
	
	//The time out is used so the loading graphic shows up in IE
	window.setTimeout( function () {
		//Load 'items in cart display' by getting a substring from the begginging of temp to BREAK
		//Load 'item added to cart div' by getting a substring from BREAK to the end of temp
		document.getElementById('cartItems').innerHTML = returnData.substr(0, returnData.indexOf('BREAK') );
		document.getElementById('itemAddedDiv').innerHTML = returnData.substr( (returnData.indexOf('BREAK')+5) );
	
		//Set opacity of item added to cart bot to zero
		$('itemAddedOpacity').set('opacity',"0.0");
		
		//Fade in 'item added to cart' box
		var myFx = new Fx.Tween("itemAddedOpacity");
		myFx.set('tween', {duration: '2000'});
		myFx.start('opacity','0.0','1.0');
	
		//Fade out 'item added to cart' box after 7 seconds
		window.setTimeout( function () {
			var myFx = new Fx.Tween("itemAddedOpacity");
			myFx.set('tween', {duration: '2000'});						 
			myFx.start('opacity','1.0','0.0')
		}
		, 7000);
	}
	, 1000);
}

//////////////////////////////////////////////////////////////////////////////////////
// END ADD TO CART FUNCTIONS 
//////////////////////////////////////////////////////////////////////////////////////

//////////////////////////////////////////////////////////////////////////////////////
// AJAX SETUP AND OUTPUT FUNCTIONS
//////////////////////////////////////////////////////////////////////////////////////

// JavaScript Document
//Get HTTP Object for AJAX Processing
function getHTTPObject(){
	if (window.ActiveXObject) 
		return new ActiveXObject("Microsoft.XMLHTTP");
	else if (window.XMLHttpRequest) 
		return new XMLHttpRequest();
	else {
		alert("Your browser does not support AJAX.");
		return null;
	}
}

// setOutput()
// Loads the output of an AJAX call to a element with the given id
// args: id - id of element to load output into, ajaxHandle - AJAX object 
function setOutput(id, ajaxHandle){
	if(ajaxHandle.readyState == 4){
		if( ajaxHandle.responseText != null && ajaxHandle.responseText != "" ){
			document.getElementById(id).innerHTML = ajaxHandle.responseText;
		}
	}
}

// runAJAXasync()
// Runs a 'syncronous' AJAX call and load the out put to a given location
// args: pageName - page name of AJAX script, argsArray - array of arguments for AJAX call
function runAJAXsync(pageName,argsArray){
	var urlArgs = "";
	
	//Build string of arguments for AJAX call
	for(var i=0;i<argsArray.length;i++){
		urlArgs += argsArray[i][0] + "=" + argsArray[i][1] + "&";
	}
	//Adds date to arguments to force browser to reload the called page
	urlArgs += "pseudoParam="+new Date().getTime();
	
	httpObject = getHTTPObject();
	//Send comment data to submit_comment.php return all comments
	if (httpObject != null) {
		httpObject.open("GET", "/components/scripts/ajax/"+pageName+".php?"+urlArgs, false);
		httpObject.send(null);
		return httpObject.responseText;
	} else {
		document.write('Failed to get httpObject');
	}
}

// runAJAXasync()
// Runs a 'syncronous' AJAX call and load the out put to a given location
// args: pageName - page name of AJAX script, argsArray - array of arguments for AJAX call
function runAJAXsync(pageName,argsArray){
	var urlArgs = "";
	
	//Build string of arguments for AJAX call
	for(var i=0;i<argsArray.length;i++){
		urlArgs += argsArray[i][0] + "=" + argsArray[i][1] + "&";
	}
	//Adds date to arguments to force browser to reload the called page
	urlArgs += "pseudoParam="+new Date().getTime();
	
	httpObject = getHTTPObject();
	//Send comment data to submit_comment.php return all comments
	if (httpObject != null) {
		httpObject.open("GET", "/components/scripts/ajax/"+pageName+".php?"+urlArgs, false);
		httpObject.send(null);
		return httpObject.responseText;
	} else {
		document.write('Failed to get httpObject');
	}
}

//////////////////////////////////////////////////////////////////////////////////////
// END AJAX SETUP AND OUTPUT FUNCTIONS
//////////////////////////////////////////////////////////////////////////////////////


//////////////////////////////////////////////////////////////////////////////////////
// AUTO COMPLETE FUNCTIONS
//////////////////////////////////////////////////////////////////////////////////////

function autocomplete(searchTerm){
	if( searchTerm.length > 0 ){
		var returnData = "";
		searchArgs = new2DArray(2,1);
		document.getElementById('suggestions').style.display = "inline";	
		
		searchArgs[0][0] = "queryString";
		searchArgs[0][1] = searchTerm;
		
		returnData = runAJAXsync("auto_complete",searchArgs);
					
		if( returnData != 0 ){
			document.getElementById('autoSuggestionsList').innerHTML = returnData;
		} else {
			document.getElementById('suggestions').style.display = "none";	
		}
	} else {
		document.getElementById('suggestions').style.display = "none";	
	}
}

function fill( item_nm ){
	document.getElementById('inputString').value = item_nm;	
}

function hideAutoComplete(){
	document.getElementById('suggestions').style.display = "none";	
}

// new2DArray()
// Sets up a new 2D array
// args: length - length of array, width - width of array
// return: the new array
function new2DArray(length, width){
	returnArray = new Array(length);
	for(var i=0;i<length;i++){
		returnArray[i] = new Array(width);	
	}
	return returnArray;
}

//////////////////////////////////////////////////////////////////////////////////////
// AUTO COMPLETE FUNCTIONS
//////////////////////////////////////////////////////////////////////////////////////

//bookmark this page
function bookmarkThisPage(){
	if (window.sidebar || (window.opera && window.print)) // firefox
		alert("Your browser does not support this function. Please click OK then press CTRL+D on your keyboard to bookmark this page."); 
	else if(document.all)// ie
		window.external.AddFavorite('http://www.mapsandglobesplus.com', 'Maps and Globes Plus.');
}


///////////////////////////////////////////////////////////
// INITIALIZE PAGE
///////////////////////////////////////////////////////////

function loadImages(){	
	  pic1= new Image(75,26); 
	  pic1.src='/images/layout/btn_home_over.gif'; 
	  pic2= new Image(165,26); 
	  pic2.src='/images/layout/btn_help_over.gif'; 
	  pic3= new Image(135,26); 
	  pic3.src='/images/layout/btn_contact_over.gif';
}

function hideLoading(){ 
	//document.getElementById("loading").className = "loading-invisible";
	if( document.getElementById('loading') )
		document.getElementById('loading').className = "loading-invisible";
}

// setAutoComplete
// attachs the auto complete function
function setAutoComplete(){
	document.getElementById('inputString').onkeyup = function() { autocomplete(this.value); return false; }	
}

addLoadEvent(loadImages);
addLoadEvent(setAutoComplete);
addLoadEvent(hideLoading);
///////////////////////////////////////////////////////////
// END INITIALIZE PAGE
///////////////////////////////////////////////////////////

// -->