if (typeof LSF == 'undefined') LSF = {};

(function(){

	
	var register = function (container, options) {

		var img = container.getElementsByTagName ('IMG');
		if (img.length == 0) throw "Invalid container content: Missing image";
		img = img[0];
		
		var div = LSF.DOM.Element.create ('div', {
			style : {
				position: 'absolute',
				display: 'none',
				lineHeight : options.zoomHeight + 'px',
				width : options.zoomWidth + 'px',
				height : options.zoomHeight + 'px',
				background: 'white',
				border: 'solid 1px black',
				overflow: 'hidden'
			},
			className : options.zoomerCssClass
		}, null, document.body/*container*/);
		
		//container.insertBefore (div, img);

		if ($.browser.msie && $.browser.version < 7) {
            var span = document.createElement ('SPAN');
            span.style.position = 'absolute';
            span.style.width = img.width + 'px';
            span.style.height = img.height + 'px';            
            span.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader' +
                '(src=\'' + img.src + "\', sizingMethod='scale')";
                
            img.parentNode.insertBefore (span, img);
            img.style.filter = 'alpha(opacity=0)';
		}
		
		var loader = LSF.DOM.Element.create ('div', {
			style : {
				textAlign: 'center'
			}
		}, options.loadingMessage, div);
		
		var imgPosition = LSF.DOM.Element.findPosition (img);
		
		var scaleX = 0, scaleY = 0;
		var big = LSF.DOM.Element.create ('img', { visibility : 'hidden' }, null, div);
		var lastX, lastY;
		
		big.onload = function() {
			big.style.visibility = '';
			loader.style.display = 'none';
			setTimeout (function() {
				scaleX = (big.offsetWidth - options.zoomWidth) / img.offsetWidth;
				scaleY = (big.offsetHeight - options.zoomHeight) / img.offsetHeight;
				mousemove ({ clientX : lastX, clientY : lastY });
				//alert (scaleY + ':' + scaleX + '[' + big.offsetWidth + '<>' + img.offsetWidth);
			}, 1);
		}
	
		var isLoaded = false;
		var mouseover = function (event) {
			if (!isLoaded) {
				big.src = img.alt;
				img.alt = '';
				isLoaded = true;
				div.style.left = (event.clientX - (options.zoomWidth / 2)) + 'px';
				div.style.top = (event.clientY - (options.zoomHeight / 2)) + 'px';
			}
			LSF.DOM.Element.show (div);
		}
	
		var mouseout = function (event) {
			//LSF.DOM.Element.hide (div);
		}
		var mousemove = function (event) {
			lastX = event.clientX;
			lastY = event.clientY;
			var ml = event.clientX - imgPosition.x;
			var mt = event.clientY - imgPosition.y;
			if (ml < 0 || ml >= img.offsetWidth || mt < 0 || mt >= img.offsetHeight) {
				LSF.DOM.Element.hide (div);
			}
			
			div.style.left = (event.clientX - (options.zoomWidth / 2)) + 'px';
			div.style.top = (event.clientY - (options.zoomHeight / 2)) + 'px';

			if (scaleX) {
				big.style.marginLeft = (scaleX * (imgPosition.x - event.clientX)) + 'px';
				big.style.marginTop = (scaleY * (imgPosition.y - event.clientY)) + 'px';
			}
		}

		cn (img).addEventListener ('mouseover', mouseover, true);
		cn (container).addEventListener ('mouseout', mouseout, true);
		cn (container).addEventListener ('mousemove', mousemove, true);
		cn (big).addEventListener ('mousemove', mousemove, true);
	}
	
	var m = function (options) {
		
		options = options || {};
		options.cssClass = options.cssClass || 'lsf_magnifier';
		options.zoomerCssClass = options.zoomerCssClass || 'lsf_magnifier_zoomer';
		options.zoomWidth = options.zoomWidth || 120;
		options.zoomHeight = options.zoomHeight || 90;
		options.loadingMessage = options.loadingMessage || 'Loading...';
		
		css_query_iterate (function (node) {
			register (node, options);
		}, '.' + options.cssClass);
	}
			
	LSF.Magnifier = { apply : m };

	
})();