/*
  Written by Jonathan Snook, http://www.snook.ca/jonathan
  Add-ons by Robert Nyman, http://www.robertnyman.com
*/

function getElementsByClassName(oElm, strTagName, strClassName){
    var arrElements = (strTagName == "*" && oElm.all)? oElm.all : oElm.getElementsByTagName(strTagName);
    var arrReturnElements = new Array();
    strClassName = strClassName.replace(/\-/g, "\\-");
    var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
    var oElement;
    for(var i=0; i<arrElements.length; i++){
        oElement = arrElements[i];      
        if(oRegExp.test(oElement.className)){
            arrReturnElements.push(oElement);
        }   
    }
    return (arrReturnElements)
}

startList = function() {
	if( document.all && document.getElementById ) {		
		var myList = getElementsByClassName( document, "li", "dropdownlink" );
		for( i = 0; i < myList.length; i++ ) {
			myNode = myList[ i ]
			myNode.onmouseover = function() {
				this.className += " over";
			}
			myNode.onmouseout = function() {
				this.className = this.className.replace( " over", "" );
			}
		}
	}
}

var lastpic;
var myPics;

var miniThumbWidth = 50;
var miniThumbHeight = 50;

var smallThumbWidth = 115;
var smallThumbHeight = 75;
	
var bigThumbWidth = 200;
var bigThumbHeight = 150;
			
function getFirstPic() {
	if( document.getElementById ) {			  		
  	var i = 0;
  	var myPic;
  	
  	while( document.getElementById( "productImage" + i ) ) {
  		myPic = document.getElementById( "productImage" + i );  		
			myPic.style.marginLeft = Math.floor( -( myPic.width  / 2 ) ) + "px";
			//alert( myPic.width );
			myPic.style.marginTop = Math.floor( ( ( bigThumbHeight - myPic.height ) / 2 ) ) + "px";
  		
  		i++;
  	}
  	
  	if( document.getElementById( "productImage0" ) ) {
  		document.getElementById( "productImage0" ).style.visibility = "visible";
  	}
  	
  	if( document.getElementById( "productCaption0" ) ) {
  		document.getElementById( "productCaption0" ).style.visibility = "visible";
  	}
  	
  	if( document.getElementById( "imageLink0" ) ) {
  		lastpic = document.getElementById( "imageLink0" );
  		lastpic.className = "selected";
  	}
  	else {
  		lastpic = -1;
  	}
  	
  	var myList = getElementsByClassName( document, "img", "imageThumb" );
		for( i = 0; i < myList.length; i++ ) {
			myPic = myList[ i ];
			myPic.style.marginTop = Math.floor( ( ( smallThumbHeight - myPic.height ) / 2 ) ) + "px";
			myPic.style.visibility = "visible";
		}
		
		myList = getElementsByClassName( document, "img", "miniThumb" );
		for( i = 0; i < myList.length; i++ ) {
			myPic = myList[ i ];
			myPic.style.marginTop = ( ( miniThumbHeight - myPic.height ) / 2 ) + "px";
			myPic.style.visibility = "visible";
		}
		
		myList = getElementsByClassName( document, "img", "bigThumb" );
		for( i = 0; i < myList.length; i++ ) {
			myPic = myList[ i ];
			myPic.style.marginTop = ( ( bigThumbHeight - myPic.height ) / 2 ) + "px";
			myPic.style.visibility = "visible";
		}
  }
}

window.onload = startPage;

function startPage() {
	startList();
	getFirstPic();
	//resizeImg();
}

function showPic( whichLink, whichPic, numPics ) {
	for( var i = 0; i < numPics; i++ ) {
		document.getElementById( "productImage" + i ).style.visibility = "hidden";
		document.getElementById( "productCaption" + i ).style.visibility = "hidden";
	}
	
	var myPic = document.getElementById( "productImage" + whichPic );  		
	myPic.style.visibility = "visible";
	
	var myCaption = document.getElementById( "productCaption" + whichPic );
	myCaption.style.visibility = "visible";
	
	if( lastpic != -1 ) {
		lastpic.className = '';
		lastpic = document.getElementById( whichLink );		
		lastpic.className = 'selected';	
	}
}

function oldShowPic( whichpic, newDim ) {
	var temppic;
	if( lastpic ) {
		temppic = lastpic;
	}
	lastpic = whichpic;
	if( document.getElementById ) {			  		
  	//var placeholder = document.getElementById( 'placeholder' )
  	//placeholder.src = whichpic.href;
  	
  	var placeholder = document.createElement("img");
		placeholder.setAttribute( "src", whichpic.href );
		
  	//alert( placeholder.width );
  	
  	/*if( newDim != "" ) {
  		var firstPos = newDim.indexOf( "\"" );
  		var secondPos = newDim.indexOf( "\"", firstPos + 1 );
  		var myDim = newDim.substr( firstPos + 1, secondPos - ( firstPos + 1 ) );
  	}*/
  	
  	/*if( myDim != "" ) {
  		if( newDim.match( "width" ) != null ) {
  			if( myDim == 230 ) {  				
  			  var ratio = myDim / placeholder.width;
  			  alert( "New Width: " + placeholder.width + " Ratio: " + ratio );
  				//placeholder.width *= ratio;
  				//placeholder.height *= ratio;
  			}
  		}
  		else if( newDim.match( "height" ) != null ) {
  			if( myDim == bigThumbHeight ) {  				
  			  var ratio = myDim / placeholder.height;
  			  alert( "New Height: " + placeholder.height + " Ratio: " + ratio );
  			  placeholder.width *= ratio;
  			  placeholder.height *= ratio;
  			}  			
  		}
  	}*/
  	
  	var ratioWidth = placeholder.width / bigThumbWidth;
  	var ratioHeight = placeholder.height / bigThumbHeight;
  	var ratio = 1;
  	
  	alert( "Normal Width: " + placeholder.width + " Ratio: " + ratioWidth );
  	alert( "Normal Height: " + placeholder.height + " Ratio: " + ratioHeight );
  	
  	if( ratioWidth > 1 || ratioHeight > 1 ) {
	  	if( ratioWidth > ratioHeight ) {
	  		ratio = ratioWidth;
	  		placeholder.width = Math.floor( placeholder.width / ratio );
	  		placeholder.height = Math.floor( placeholder.height / ratio );	  	  
	  	}
	  	else if( ratioWidth < ratioHeight ) {
	  		ratio = ratioHeight;
	  		placeholder.width = Math.floor( placeholder.width / ratio );
	  		placeholder.height = Math.floor( placeholder.height / ratio );	  
	  	}
	  }
	  
	  //alert( "Normal Height: " + placeholder.height + " Ratio: " + ratioHeight + " New Height: " + Math.floor( placeholder.height / ratio ) );
  	//alert( "Math.floor( " + placeholder.height + " / " + ratio + " ) = " + Math.floor( placeholder.height / ratio ) );
  	alert( "Final Ratio: " + ratio + " Final Width: " + placeholder.width  + " Final Height: " + placeholder.height );
	  
	    	
  	whichpic.className = 'selected';
  	if( temppic ) {
  		temppic.className = '';
  	}
	  /*if( whichpic.title ) {
	  	document.getElementById( 'desc' ).childNodes[ 0 ].nodeValue = whichpic.title;
	  }
	  else {
	  	document.getElementById( 'desc' ).childNodes[ 0 ].nodeValue = whichpic.childNodes[ 0 ].nodeValue;
	  }
	  */
	  
	  var replaceImage = document.getElementById( 'placeholder' )
  	//placeholder.src = whichpic.href;
  	replaceImage.setAttribute( "src", placeholder.src );
  	replaceImage.width = placeholder.width;
  	replaceImage.height = placeholder.height;
  	alert( replaceImage.src );
  	
 		return false;
 }
 else {
 	return true;
 }
}

function resizeImg() {
	var myImages = document.getElementsByTagName( "img" );
	for( var i = 0; i < myImages.length; i++ ) {
		var myImg = myImages[ i ];
		if( myImg.className == "thumbnail" ) {
			var myWidth = myImg.width;
			var myHeight = myImg.height;
			myImg.width = 200;
			myImg.height = 200;
			/*
			alert( "Image " + myImg.name + ": " + myWidth + " x " + myHeight );
			*/
			/*break;*/
		}
	}
}