
/******************************************
* Popup Box- By Jim Silver @ jimsilver47@yahoo.com
* Visit http://www.dynamicdrive.com/ for full source code
* This notice must stay intact for use
******************************************/

	//function getCoord()
	//{
		//var obj = document.getElementById("add_element");
		//alert(obj);
		//obj.add_element = new Object();
		function findPos(nameVar){
			var obj = document.getElementById(nameVar);
			var posX = obj.offsetLeft;var posY = obj.offsetTop;
			while(obj.offsetParent){
				posX=posX+obj.offsetParent.offsetLeft;
				posY=posY+obj.offsetParent.offsetTop;
			if(obj==document.getElementsByTagName('body')[0]){break}
			else{obj=obj.offsetParent;}
		}
		alert(posX+'-'+posY)
		}
		//sessvars.lefty.toString();
		//sessvars.toppy.toString();
	//}
	
	
	
function hideDiv(varDivName)
{
	crossobj=ns6? document.getElementById(varDivName) : document.all[varDivName]
	if (ie4||ns6)
	crossobj.style.visibility="hidden"
	else if (ns4)
	document.varDivName.visibility="hide"
}

function showDiv(varDivName)
{
	crossobj=ns6? document.getElementById(varDivName) : document.all.varDivName
	if (ie4||ns6)
	crossobj.style.visibility="visible"
	else if (ns4)
	document.varDivName.visibility="show"
}

var ns4=document.layers
var ie4=document.all
var ns6=document.getElementById&&!document.all

//drag drop function for NS 4////
/////////////////////////////////

var dragswitch=0
var nsx
var nsy
var nstemp

function drag_dropns(name){
if (!ns4)
return
temp=eval(name)
temp.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP)
temp.onmousedown=gons
temp.onmousemove=dragns
temp.onmouseup=stopns
}

function gons(e){
temp.captureEvents(Event.MOUSEMOVE)
nsx=e.x
nsy=e.y
}
function dragns(e){
if (dragswitch==1){
temp.moveBy(e.x-nsx,e.y-nsy)
return false
}
}

function stopns(){
temp.releaseEvents(Event.MOUSEMOVE)
}

//drag drop function for ie4+ and NS6////
/////////////////////////////////


function drag_drop(e){
if (ie4&&dragapproved){
crossobj.style.left=tempx+event.clientX-offsetx
crossobj.style.top=tempy+event.clientY-offsety
return false
}
else if (ns6&&dragapproved){
crossobj.style.left=tempx+e.clientX-offsetx+"px"
crossobj.style.top=tempy+e.clientY-offsety+"px"
return false
}
}

function initializedrag(e){
crossobj=ns6? document.getElementById("showimage") : document.all.showimage
var firedobj=ns6? e.target : event.srcElement
var topelement=ns6? "html" : document.compatMode && document.compatMode!="BackCompat"? "documentElement" : "body"
while (firedobj.tagName!=topelement.toUpperCase() && firedobj.id!="dragbar"){
firedobj=ns6? firedobj.parentNode : firedobj.parentElement
}

if (firedobj.id=="dragbar"){
offsetx=ie4? event.clientX : e.clientX
offsety=ie4? event.clientY : e.clientY

tempx=parseInt(crossobj.style.left)
tempy=parseInt(crossobj.style.top)

dragapproved=true
document.onmousemove=drag_drop
}
}
document.onmouseup=new Function("dragapproved=false")

////drag drop functions end here//////

function hidebox(){
crossobj=ns6? document.getElementById("showimage") : document.all.showimage
if (ie4||ns6)
crossobj.style.visibility="hidden"
else if (ns4)
document.showimage.visibility="hide"
document.getElementById('holder').innerHTML="\n"+ 
"<div id='showimage' style='position:relative; width:540px; z-index:200; '>\n"+
"</div>\n"+
"";
}
function showbox(){
crossobj=ns6? document.getElementById("showimage") : document.all.showimage
if (ie4||ns6)
crossobj.style.visibility="visible"
else if (ns4)
document.showimage.visibility="show"
}

function infoDiv(descProp)
{
	
	
	var newDesc = descProp;
	
	if (newDesc == "desc_1"){
	document.getElementById('pic_description').innerHTML="\n"+ 
			"<div style=\"text-align:right;\">Amethyst and Aventurine Pendant<br />on Amethyst Strands<br /><a href=\"necklaces_tri-strand.html\">learn more</a></div>\n"+
		"";
	}
	if (newDesc == "desc_2"){
	document.getElementById('pic_description').innerHTML="\n"+ 
			"<div style=\"text-align:left;\">Amethyst and Aventurine Pendant<br />on Amethyst Strands<br /><a href=\"necklaces_tri-strand.html\">learn more</a></div>\n"+
		"";
	}
	if (newDesc == "desc_3"){
	document.getElementById('pic_description').innerHTML="\n"+ 
			"<div style=\"text-align:right;\">Amethyst and Aventurine Pendant<br />on Amethyst Strands<br /><a href=\"necklaces_tri-strand.html\">learn more</a></div>\n"+
		"";
	}
	if (newDesc == "desc_4"){
	document.getElementById('pic_description').innerHTML="\n"+ 
			"<div style=\"text-align:left;\">Amethyst and Aventurine Pendant<br />on Amethyst Strands<br /><a href=\"necklaces_tri-strand.html\">learn more</a></div>\n"+
		"";
	}
	
	
	
	
	

}

function bulletDiv(imageName,setX)
{
	
	
	
		function findPos(imageName){
			
		}
	
	var newImage = imageName;
	if (newImage == "color_detect"){
	document.getElementById('text_1').innerHTML="\n"+ 
			"sdfsfsdfsdfs\n"+
				"sfsdfdsfs\n"+
		"";
	}
	if (newImage == "color_detect"){
	document.getElementById('text_1').innerHTML="\n"+ 
			"sdfsfsdfsdfs\n"+
				"sfsdfdsfs\n"+
		"";
	}
	

}




var setIntervalID;
var current;
var nextImage;
var previousImage;
var currentID;
var nextID;

function theRotator(pageLoad,imageID) {


    if(imageID != currentID)
    {
    
        clearInterval(setIntervalID);
    	
	    if(imageID !="")
	        {swapButtons(imageID);}
    	    
	    if(pageLoad==true)
	    {
	        //Set the opacity of all images to 0
	        $('div#rotator span').css({opacity: 0.0});
	        //Get the first image and display it (gets set to full opacity)
	        $('div#rotator span:first').css({opacity: 1.0});
    	
	        currentID = 1;
	        nextID = 1;
	    }
	    else
	    {
    	
	        //got here via a button click
	        updateIDs(imageID);
	        rotate(false);
	    }
    		
	    //Call the rotator function to run the slideshow, 8000 = change to next image after 8 seconds
	    setIntervalID = setInterval("rotate(true)",8000);
	}
	
}


function updateIDs(imageID)
{

	 if (imageID == "") 
	 {
	    if(currentID == 10)
	    { nextID = 1;}
	    else
	     {    nextID = currentID + 1;} 
	 
	 }
	 else
	 {
	    nextID = imageID;
	 } 
		nextDesc = 'desc_'+nextID;
		//infoDiv(nextDesc);
}	 
	 
function rotate(incrementID) {	
	
	 if (incrementID ==true)
	 { 
	    updateIDs("");
		nextDesc = 'desc_'+nextID;
		//infoDiv(nextDesc);
	 }
	// alert(currentID);
	 //alert(nextID); 
	 	 
	 var currentImageDivString = "div#rotator span#" + currentID + ".show";
	 var nextImageDivString = "div#rotator span#" + nextID + ".hide";
	 		 
	 currentImage = $(currentImageDivString);
     nextImage = $(nextImageDivString);
	
	//Set the fade in effect for the next image, the show class has higher z-index
	 nextImage.css({opacity: 0.0})
	.addClass('show')
	.animate({opacity: 1.0}, 750);

	//Hide the current image
	currentImage.animate({opacity: 0.0}, 750)
	.removeClass('show')
	.addClass('hide');
	
	currentID = nextID;
	
//alert (setIntervalID + " " + current + " " + nextImage + " " + previousImage + " " + currentID + " " + nextID);
};




var setIntervalID2;
var current2;
var nextImage2;
var previousImage2;
var currentID2;
var nextID2;



function theRotator2(pageLoad2,imageID2) {
    if(imageID2 != currentID2)
    
		
    {
        clearInterval(setIntervalID2);
    	
	    //if(imageID2 !="")
	        //{swapButtons(imageID2);}
    	    
	    if(pageLoad2==true)
	    {
	//alert(pageLoad2);
    	
	        //Set the opacity of all images to 0
	        $('div#rotator2 span').css({opacity: 0.0});
	        //Get the first image and display it (gets set to full opacity)
	        $('div#rotator2 span:first').css({opacity: 1.0});
    	
	        currentID2 = 101;
	        nextID2 = 101;
	    }
	    else
	    {
	        //got here via a button click
	        updateIDs2(imageID2);
	        rotate2(false);
	    }
    		
	    //Call the rotator function to run the slideshow, 8000 = change to next image after 8 seconds
	    setIntervalID2 = setInterval("rotate2(true)",5000);
	}
	
}


function updateIDs2(imageID2)
{	
	//alert("hitting" + imageID2);

	 if (imageID2 == "") 
	 {
	    if(currentID2 == 105)
	    { nextID2 = 101;}
	    else
	     {    nextID2 = currentID2 + 1;} 
	 
	 }
	 else
	 {
	    nextID2 = imageID2;
	 } 
		nextDesc2 = 'desc_'+nextID2;
		//infoDiv(nextDesc);
}	 
	 
function rotate2(incrementID2) {
	 if (incrementID2 ==true)
	 { 
	    updateIDs2("");
		nextDesc2 = 'desc_'+nextID2;
		//infoDiv(nextDesc);
	 }
	// alert(currentID);
	 //alert(nextID); 
	 	 
	 var currentImageDivString2 = "div#rotator2 span#" + currentID2 + ".show";
	 var nextImageDivString2 = "div#rotator2 span#" + nextID2 + ".hide";
	 		 
	 currentImage2 = $(currentImageDivString2);
     nextImage2 = $(nextImageDivString2);
	
	//Set the fade in effect for the next image, the show class has higher z-index
	 nextImage2.css({opacity: 0.0})
	.addClass('show')
	.animate({opacity: 1.0}, 750);

	//Hide the current image
	currentImage2.animate({opacity: 0.0}, 750)
	.removeClass('show')
	.addClass('hide');
	
	currentID2 = nextID2;
	//alert (setIntervalID2 + " " + current2 + " " + nextImage2 + " " + previousImage2 + " " + currentID2 + " " + nextID2);
};


