var containerBackground = '';

function createZoomImage( id, background ) {
	this.imageBox = $(id);
	containerBackground = background;
}

createZoomImage.prototype.init = function(e) {
	 this.imageBox.addEvent( 'mouseenter', function(e) {
	});
	
	this.imageBox.addEvent( 'mousemove', function(e) {
		
		viewerDims = 160;
		
		imageSize = new Object();
    imageSize.height = document.images['thumbnail'].height;
		imageSize.width = document.images['thumbnail'].width;
		
		var box = this.getPosition();
		
		// top left position of container relative
		var h = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;
		var page_y = ( h ) ? h : 0 ;

		var box_y = ( e.client.y - box.y ) -  (viewerDims/2)  + page_y;
		var box_x = ( e.client.x - box.x ) -  (viewerDims/2) ;
		
		// min-max position
		if( box_y < 0 ) {
			var y = 0;
		} 
		else if(  box_y   > ( imageSize.height.toInt()  - (viewerDims/2) ) ) {
			var y = imageSize.height.toInt() - (viewerDims/2);
		}
		else {
			var y = box_y;
		}
		
		// min-max position
		if( box_x < 0 ) {
			var x = 0;
		} 
		else if( box_x  > ( imageSize.width.toInt()  - (viewerDims/2) ) ) {
			var x = imageSize.width.toInt() - (viewerDims/2);
		} 
		else {
			var x = box_x;
		}

		scale = 2;
			// background image position
		var bg_pos_x = ( scale * x );
		var bg_pos_y = ( scale * y );
			
		if(document.getElementById('view_finder'))
		{
			document.getElementById('view_finder').style.backgroundImage = 'url(' + containerBackground + ')'
			document.getElementById('view_finder').style.backgroundPosition = '-' + bg_pos_x + 'px -' + bg_pos_y + 'px';
			document.getElementById('view_finder').style.top = y  + 'px';
			document.getElementById('view_finder').style.left = x + 'px';
			

		}
	});
	this.imageBox.addEvent( 'mouseleave', function(e) {
		this.removeEvent('mousemove');
		//$('view_finder').destroy();
		//$('zoom_container').destroy();
	} );	
}

/*window.onerror = function(msg,url,l) {
  // alert(msg);
  return true;
}*/