pre_obj = new Object();
browser = new browser();

function init_preview(){
	//set up all the images
	images = window.document.getElementsByTagName("img");
	for(i=0;i<=images.length-1;i++){
		//adds register the on mousedown function
		if(images[i].className == "vim"){
			img = images[i];
			if (browser.IE) {
				img.attachEvent("onmouseover", initPreview);
			}
			if (browser.NS){
				img.addEventListener("mouseover", initPreview,false);
			}
		}
	}
}
function browser() {
	this.IE    = false;
	this.NS    = false
	agent = navigator.userAgent;
	if ((i = agent.indexOf("MSIE")) >= 0) {
		this.IE = true;
		return;
	}
	if ((i = agent.indexOf("Gecko")) >= 0) {
		this.NS = true;
		return;
	}
	if ((i = agent.indexOf("Netscape6/")) >= 0) {
		this.NS = true;
		return;
	}
}
function initPreview(event){
	/*show the preview div and put in the image
	setup the dragable so the preview images will move with the mouse
	*/
	if(browser.IE){
		pre_obj = window.event.srcElement;	
	}
	if(browser.NS){
		pre_obj = event.target;
	}
	
	imgX = pre_obj.x;
	imgY = pre_obj.y;
	
	preview_box = window.document.getElementById("preview");
	//position the box
	
	//set the preview image
	var id = pre_obj.id;
	var artistid = window.document.getElementById(id).getAttribute("aid");
	var desc= window.document.getElementById(id).getAttribute("description");
	setPreviewImg(id,artistid,desc);

	if (browser.IE) {
		//for ie
		document.attachEvent("onmousemove", dragPreview);
		pre_obj.attachEvent("onmouseout",   stopPreview);
		window.event.cancelBubble = true;
		window.event.returnValue = false;
	}
	if (browser.NS) {
		document.addEventListener("mousemove", dragPreview,   true);
		pre_obj.addEventListener("mouseout",   stopPreview, true);
 	}

}

function dragPreview(event){
	//this will do all of the draging of the image
	
	var tbody = (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;
	var docwidth=document.all? tbody.scrollLeft+tbody.clientWidth : pageXOffset+window.innerWidth;
	var docheight=document.all? Math.min(tbody.scrollHeight, tbody.clientHeight) : Math.min(window.innerHeight);
	xpos = event.clientX
	ypos = tbody.scrollTop + event.clientY;	
	
	if((event.clientX + 325) > docwidth){
		//make the box appear on the left
		xpos = (event.clientX - 325) - 10;
	}else{
		xpos = (event.clientX + 10);
	}
	if(docheight - event.clientY < (300)){
		//the box is overlapping
		ypos = event.clientY + tbody.scrollTop - (300 + event.clientY - docheight);
	}else{
		ypos = tbody.scrollTop + event.clientY;	
	}

	
	preview_box.style.left = xpos+"px";
	preview_box.style.top = ypos+"px";
	
}

function stopPreview(){
	//this will remove the onmousemove and the onmouseup functions from the image
	if (browser.IE) {
   		document.detachEvent("onmousemove", dragPreview);
	    pre_obj.detachEvent("onmouseout",   stopPreview);
  	}
  	if (browser.NS) {
    	document.removeEventListener("mousemove", dragPreview,   true);
	    pre_obj.removeEventListener("mouseout",   stopPreview, true);
  	}
	
	resetPreviewImg(pre_obj.id)
	preview_box = window.document.getElementById("preview");
	preview_box.style.left = "-500px";
	preview_box.style.top = "-500px";
	
}

function setPreviewImg(id,artistid,desc){
		window.document.getElementById("desc").innerHTML = desc;
		window.document.getElementById("previewimg").src = "http://www.shutterfarm.com/include/getimage.php?typ=mid&aid="+artistid+"&imageid="+id;
}
function resetPreviewImg(id){
		window.document.getElementById("desc").innerHTML = "";
		window.document.getElementById("previewimg").src = "";
}