var bi_timeout = 1200;
var bi_timer;
var bi_return_hide = true;
var bi_pos_y = 'middle'; // top|middle|bottom
var bi_pos_x = 'middle'; // left|middle|right
var bi_close_method = 'onmouseout'; // onmouseout|onclick
var image_element = null;

var getfunction_container;

if (getfunction_container = document.getElementById('productslist')) {
	try {
		//applyImageScale(getfunction_container);
	}
	catch(E) {
		alert(E);
	}
}

//  style="padding: 10px;" onMouseOver="displayBigImage(this, '{$col.picture.medium.url}');"

function applyImageScale(container) {
	var bi_imgs, hsrc, pn;
	bi_imgs = container.getElementsByTagName('IMG');
	if (bi_imgs) for(i=0; i < bi_imgs.length; i++) {
		if (bi_imgs.item(i).hsrc = bi_imgs.item(i).getAttribute('hsrc')) {
			//alert(i + ': ' + bi_imgs.item(i).hsrc + '\n');
			bi_imgs.item(i).parentNode.parentNode.style.padding = '10px';
			bi_imgs.item(i).parentNode.parentNode.onmouseover = function() {
				displayBigImage(this, bi_imgs.item(i).hsrc);
			}
		}
	}
}

function displayBigImage(element, bigurl) {
	//alert(bigurl);
	window.clearTimeout(bi_timer);
	hideBigImage(element);

	switch(bi_close_method) {
		case 'onmouseout':
			element.onmouseout = (function (element) {
				return function() {
				stopTmBigImage();
				};
			})(element);
			break;
		case 'onclick': 
			element.onclick = (function (element) {
				return function() {
				stopTmBigImage();
				};
			})(element);
			break;
	}

	if (bigurl && bi_return_hide) {
		if (image_element) {
			var parent = image_element.parentNode;
			if (parent) parent.removeChild(image_element);
			var image_element = null;
		}
		
		image_element = document.createElement("img");
		image_element.id = 'bi_image_prewiev';
		image_element.style.position = 'absolute';
		image_element.src = bigurl;
		image_element.border = '1';
		image_element.style.left = '-9999px';

		bi_image = new Image();
		bi_image.onload = function(){insertBigImage(element, bigurl);};
		bi_image.src = bigurl;
		
		image_element.onmouseout = (function (element) {
		return function() {
		bi_return_hide = true;
		hideBigImage(element);
		};
		})(element);
		
		image_element.onmouseover = (function (element) {
		return function() {
		bi_return_hide = false;
		//hideBigImage(element);
		};
		})(element);

		element.appendChild(image_element);
		bi_timer = window.setTimeout(function(){insertBigImage(element, image_element);}, bi_timeout);
		
	}
	else { return false; }
}

function stopTmBigImage() {
		window.clearTimeout(bi_timer);
}

function hideBigImage(element) {
	window.clearTimeout(bi_timer);

	if (element && bi_return_hide) {
		for (var i = 0; typeof element.childNodes[i] == 'object'; i++) {
			if (element.childNodes[i].id) if (element.childNodes[i].id == 'bi_image_prewiev') {
				if (bi_return_hide) element.removeChild(element.childNodes[i]);
				break;
			}
		}
	}
}

function insertBigImage(element, image_element) {
	if (image_element.offsetWidth > 50) {
		var h = element.scrollHeight;
		var w = element.scrollWidth;
		var pos = getOffsetOf(element);
		
		bi_return_hide = false;
		
		var bi_h = image_element.scrollHeight;
		var bi_w = image_element.scrollWidth;
		
		switch(bi_pos_y) {
			case 'top':
				image_element.style.top = (pos[1])+'px';
			break;
			case 'middle':
				if ((pos[1]-(bi_h/2)+(h/2)) > 0) 
				image_element.style.top = (pos[1]-(bi_h/2)+(h/2))+'px';
				else image_element.style.top = '0px';
			break;
			case 'bottom':
				image_element.style.top = (pos[1]-(bi_h)+h)+'px';
			break;
		}
		switch(bi_pos_x) {
			case 'left':
				image_element.style.left = (pos[0])+'px';
			break;
			case 'middle':
				if ((pos[0]-(bi_w/2)+(w/2)) > 0)
				image_element.style.left = (pos[0]-(bi_w/2)+(w/2))+'px';
				else image_element.style.left = '0px';
			break;
			case 'right':
				image_element.style.left = (pos[0]-(bi_w-w))+'px';
			break;
		}

		
	}
	else {
		window.setTimeout(function(){insertBigImage(element, image_element);}, 10);
	}
}