function imagePreview() {

	//create floating preview div
	var body_elm = document.getElementsByTagName("body")[0];
	var preview_div = document.createElement("div");
	var image = document.createElement("img");
	var desc = document.createElement("div");
	desc.setAttribute("id","productName");
	preview_div.setAttribute("id","preview");
	preview_div.appendChild(image);
	preview_div.appendChild(desc);
	body_elm.appendChild(preview_div);

	//create toggle preview div
    var toggle_div = document.createElement('div');
	toggle_div.setAttribute('id','toggle');
	var toggle_text = document.createTextNode('Turn Enhanced Preview ');
	toggle_div.appendChild(toggle_text);
	//on span
	var toggle_on = document.createElement('span');
	toggle_on.setAttribute('id','on');
	var toggle_on_text = document.createTextNode('On');
	toggle_on.appendChild(toggle_on_text);
	toggle_div.appendChild(toggle_on);
	//divider
	var divider = document.createTextNode('/');
	toggle_div.appendChild(divider);
	//off span
	var toggle_off = document.createElement('span');
	toggle_off.setAttribute('id','off');
	var toggle_off_text = document.createTextNode('Off');
	toggle_off.appendChild(toggle_off_text);
	toggle_div.appendChild(toggle_off);
	$('pathmenu').insertBefore(toggle_div, $('pathmenu').firstChild);

    /*
	* Finds the top position of the element
	**/
	function position(element) {
		var p = {y:element.offsetTop || 0};
		while (element = element.offsetParent) {
			p.y += element.offsetTop;
		}
		return p;
	}

	function createCookie(name,value,days) {
		if (days) {
			var date = new Date();
			date.setTime(date.getTime()+(days*24*60*60*1000));
			var expires = "; expires="+date.toGMTString();
		} else
			var expires = ""; document.cookie = name+"="+value+expires+"; path=/";
	}

	function getCookie(name) {
		var start = document.cookie.indexOf( name + "=" );
		var len = start + name.length + 1;

		if ((!start) && (name!= document.cookie.substring(0, name.length))) {
			return null;
		}

		if (start == -1) return null;
		var end = document.cookie.indexOf( ';', len );

		if (end == -1) end = document.cookie.length;
		return unescape(document.cookie.substring(len, end));
	}

	function eraseCookie(name) {
		createCookie(name,"",-1);
	}

	//setting variables
	if(document.all) {
		var preview_width = $("wrapper").offsetWidth + 35;
	} else {
		var preview_width = $("wrapper").offsetWidth + 25;
	}

	//set initial image preview and toggle styles 
	$('preview').setStyles({ display:'none', fontSize:'12px', color:'#fff', backgroundColor:'#fff', textAlign:'center', position:'absolute', left:preview_width});
	$('toggle').setStyles({ float:'right', width:'200px', textAlign:'right' });
	$('on').setStyles({ cursor:'pointer' });
	$('off').setStyles({ cursor:'pointer' });

    var preview_check = getCookie("preview_image");

	$("on").onclick = function() {
		eraseCookie("preview_image");
		createCookie("preview_image","true",1);
		var preview_check = getCookie("preview_image");
		this.style.fontWeight = "bold";
		$('off').style.fontWeight = "normal";
		$$('.product-wrapper').addEvent('mouseenter', showImagePreview);
		resizeBrowserWidth();
	}

	$("off").onclick = function() {
		eraseCookie("preview_image");
		createCookie("preview_image","false",1);
		var preview_check = getCookie("preview_image");
		this.style.fontWeight = "bold";
		$('on').style.fontWeight = "normal";
		$("preview").style.display = "none";
		$$('.product-wrapper').removeEvent('mouseenter', showImagePreview);
	}

	function imagePreviewStatus() {
		var preview_check = getCookie("preview_image");

		if(preview_check=="true") {
			$("on").setStyles({ fontWeight:'bold' });
			$("off").setStyles({ fontWeight:'normal' });
			var preview_check = getCookie("preview_image");
			$$('.product-wrapper').addEvent('mouseenter', showImagePreview);
			$$('.product-wrapper').addEvent('mouseleave', hideImagePreview);
		} else if(preview_check=="false") {
			$("off").setStyles({ fontWeight:'bold' });
			$("on").setStyles({ fontWeight:'normal' });
			var preview_check = getCookie("preview_image");
			eraseCookie("preview_image");
			createCookie("preview_image","false",1);
			$$('.product-wrapper').removeEvent('mouseenter', showImagePreview);
		} else {
			createCookie("preview_image","true",1);
			$("on").setStyles({ fontWeight:'bold' });
			var preview_check = getCookie("preview_image");
			$$('.product-wrapper').addEvent('mouseenter', showImagePreview);
			$$('.product-wrapper').addEvent('mouseleave', hideImagePreview);
		}
	}

    /*
	* Tests to see if browser width is wide enough for image preview
	**/
	function resizeBrowserWidth() {
		var width;
		var preview_check = getCookie("preview_image");

		if(window.innerWidth) {
		    width = window.innerWidth;
		} else if(document.documentElement && document.documentElement.clientWidth != 0) {
			width = document.documentElement.clientWidth;    
		} else {
			width = document.body.clientWidth;
		}

		if(width < 1250) {
		    $('toggle').setStyles({display:'none'});
			$$('.product-wrapper').removeEvent('mouseenter', showImagePreview);
			return false;
		} else {
		    $('toggle').setStyles({display:'block'});
			eraseCookie("preview_image");
		    if(preview_check=='true') {
				createCookie("preview_image","true",1);
			} else if(preview_check=='false') {
				createCookie("preview_image","false",1);
			}
			$$('.product-wrapper').addEvent('mouseenter', showImagePreview);
			$$('.product-wrapper').addEvent('mouseleave', hideImagePreview);
		}
		imagePreviewStatus();
	}
	resizeBrowserWidth();

	/*
	** Absolute positions hovered image to match row
	*/
    function getRowPosition() {
		var rows = $('esearchtbl').rows;

		for(var i=0; i<rows.length; i++) {
			rows[i].onmouseover = function() {
				if(window.XMLHttpRequest) {
					var cur_pos = position(this).y;
				} else {
					var cur_pos = position(this).y - 218;
				}
				$('preview').setStyles({'top':cur_pos});
			}
		}
	}

    /*
	* If mouseover is enabled
	* Gets the properties of the current image
	**/
    function showImagePreview() {

		//gets DOM path based upon hovered image and whether item is new
	
		var el = this.getElement(".prodhrefprev");
		//get DOM path to the image
		var prodSrc = this.getElement(".prodimgprev").src;

		//Checks if the image is hi-res or non-hi-res
		if(prodSrc.match('THUMBNAIL')) {
			//Gets style_id for hi-res images	and creates new image src
			var newProd = prodSrc.replace(/(.*)\/(.*)-(.*)-(.*)/, '/n/i/$2-DETAILED.jpg');
		} else {
			//Gets style_id for non-hi-res images	and creates new image src
			var newProd = prodSrc.replace(/(.*)-(.*)-(.*)/, '/n/i/$2-DETAILED.jpg');
		}

		//fill in the rest of the information for the remaining pieces
		$$('#preview img').setProperty('src', newProd);
		$('preview').setStyles({border:'1px solid #e6e6e6',display:'block',color:'#fff'}); 
		var co_name = el.firstChild.nodeValue; 
		var style_name = el.lastChild.nodeValue; 
		$('productName').setStyles({ background:'#b0b7c4',padding:'15px 7px' });
		$('productName').setHTML(co_name + "<br />" + style_name);

		getRowPosition();
	}

	function hideImagePreview() {
	    $('preview').setStyles({'display':'none'});
	}

	window.addEvent('resize',resizeBrowserWidth);
}

window.addEvent('load',imagePreview);
