var zoom_timer = null;

function show_zoom(event_obj) {
	move_zoom(event_obj);

	document.getElementById("zoom_div").style.display="inline";
	document.getElementById("location_marker").style.display="inline";
}

var small_image_width = null;
var small_image_height = null;

var zoom_image_width = null;
var zoom_image_height = null;

//var x_center_offset = 3;
//var y_center_offset = 3;
var x_center_offset = null;
var y_center_offset = null;

//var image_magnification_multiplier = 16;
var image_magnification_multiplier_x = null;
var image_magnification_multiplier_y = null;

function move_zoom(event_obj) {
	clearTimeout(zoom_timer);

	ev = event_obj || window.event;

	var mouse_x_pos = ev.clientX;
	var mouse_y_pos = ev.clientY;

	//var x_pos_from_left = 44;
	//var y_pos_from_top = 100;
	var product_image = document.getElementById("product_image");

	// mouse position from top left corner of screen
	var x_pos_from_left = findPosX(product_image) - f_scrollLeft();
	var y_pos_from_top = findPosY(product_image) - f_scrollTop();

	var zoom_image = document.getElementById("zoom_container");

	if (mouse_x_pos >= x_pos_from_left && mouse_x_pos <= small_image_width + x_pos_from_left)
		zoom_image.style.left = (-mouse_x_pos + x_pos_from_left + x_center_offset) * image_magnification_multiplier_x + (small_image_width / zoom_image_width);
	else
		hide_zoom();

	if (mouse_y_pos >= y_pos_from_top && mouse_y_pos <= small_image_height + y_pos_from_top)
		zoom_image.style.top = (-mouse_y_pos + y_pos_from_top + y_center_offset) * image_magnification_multiplier_y + (small_image_height / zoom_image_height);
	else
		hide_zoom();


	// make sure zoom image always takes up all available space
	if (parseInt(zoom_image.style.left) > 0)
		zoom_image.style.left = 0;

	if (parseInt(zoom_image.style.left) < 338 - zoom_image_width)
		zoom_image.style.left = 338 - zoom_image_width;

	if (parseInt(zoom_image.style.top) > 0)
		zoom_image.style.top = 0;

	if (parseInt(zoom_image.style.top) < 338 - zoom_image_height)
		zoom_image.style.top = 338 - zoom_image_height;
	

	// update position of square on smaller image 63x63
	var location_marker = document.getElementById("location_marker");
	location_marker.style.left = (mouse_x_pos - 32 + f_scrollLeft()) + "px";
	location_marker.style.top = (mouse_y_pos - 32 + f_scrollTop()) + "px";

	//document.getElementById("debug").innerHTML = zoom_image.style.left + " " + zoom_image.style.top;
	//document.getElementById("debug").innerHTML = "mouse_pos = " + mouse_x_pos + "," + mouse_y_pos + "<br>pos from top left = " + x_pos_from_left + "," + y_pos_from_top;
}

function hide_zoom() {
	document.getElementById("zoom_div").style.display="none";
	document.getElementById("location_marker").style.display="none";
}

// source: http://blog.firetree.net/2005/07/04/javascript-find-position/
function findPosX(obj) {
	var curleft = 0;
	if(obj.offsetParent)
		while(1) {
			curleft += obj.offsetLeft;
			if(!obj.offsetParent)
				break;
			obj = obj.offsetParent;
		}
	else if(obj.x)
		curleft += obj.x;
	return curleft;
}

function findPosY(obj) {
	var curtop = 0;
	if(obj.offsetParent)
		while(1) {
			curtop += obj.offsetTop;
			if(!obj.offsetParent)
			break;
			obj = obj.offsetParent;
		}
	else if(obj.y)
		curtop += obj.y;
	return curtop;
}

// source: http://www.softcomplex.com/docs/get_window_size_and_scrollbar_position.html
function f_scrollLeft() {
	return f_filterResults (
		window.pageXOffset ? window.pageXOffset : 0,
		document.documentElement ? document.documentElement.scrollLeft : 0,
		document.body ? document.body.scrollLeft : 0
	);
}
function f_scrollTop() {
	return f_filterResults (
		window.pageYOffset ? window.pageYOffset : 0,
		document.documentElement ? document.documentElement.scrollTop : 0,
		document.body ? document.body.scrollTop : 0
	);
}
function f_filterResults(n_win, n_docel, n_body) {
	var n_result = n_win ? n_win : 0;
	if (n_docel && (!n_result || (n_result > n_docel)))
		n_result = n_docel;
	return n_body && (!n_result || (n_result > n_body)) ? n_body : n_result;
}