(function($) {
  $.fn.simplezoom = function(options){
    // default settings
    var settings = {
      height : 200,
      width : 200,
      target: 'body'
    };
    //extending options
    options = options || {};
    $.extend(settings, options);

    this.each(function(i){ 
      // Preloads zoomed image
      // removes the link to the larger image, making it harder to steal     
      // big_url =  $(this).attr('href'); 
      // url = big_url.split('_display')[0] + big_url.split('_display')[1]; 
      // 
      // url = $(this).attr('href');  
         
      var url = $('.zoom', $(this).parent()).attr('href');  

      $("<img>").attr("src", $(this).attr('href')); 
      
      $("<img>").attr("src", url);
      
      // Onclick starts the zoom
      $(this).click(function(){ 
        if(!$('#zoom_window').length > 0){
          $(this).attr("title","");   
          
          // Basic variables for zoomWindow    
          var $container = $(settings.target), 
            baseImage = $('img', this),
            baseHeight = $(baseImage).attr('height'),
            baseWidth = $(baseImage).attr('width');   
          
          $container.prepend('<div id="zoom_window" />')
          zoomWindow =  $('#zoom_window'); 
          $(zoomWindow).hide().fadeIn('fast').css({
              height: settings.height,
              width: settings.width
            })
            .append('<img src="' + url + '" />');     
            
          $zoomImage = $('img', zoomWindow); 
          var zoomHeight = $zoomImage.attr('height'),
            zoomWidth = $zoomImage.attr('width'), 
            widthRel = baseWidth / zoomWidth,
            heightRel = baseHeight / zoomHeight,
            offset = baseImage.offset();   
          
          // Sets up image css
          $(this).css({
            cursor: 'crosshair',
            zIndex: '99',
            position: 'relative',
            display: 'block',
            height: baseHeight,
            width: baseWidth,
            // marginTop: (505- baseHeight)/2 + 'px',
            marginLeft: (555- baseWidth)/2 + 'px' 
          });
            
          // Inserting lens
          $(this).prepend('<div id="lens" />');
          $lens = $('#lens').hide();
          
          var lensHeight = Math.ceil(settings.height * heightRel),
            lensWidth = Math.ceil(settings.width * widthRel);
          
          $lens.css({  
            position: 'absolute',
            zIndex: 999,
            height: lensHeight + 'px',
            width: lensWidth + 'px', 
            opacity: '0.42',  
            border: '1px solid #111',
            backgroundColor: '#fff',
            cursor: 'crosshair'
          }); 
          
          $(this).mousemove(function(e){  
            $lens.fadeIn('fast');
            var mouseX = e.pageX - offset.left,
             mouseY = e.pageY - offset.top;       
          
            // positioning image according to image relation and mouse position
            var zoomImageX = Math.ceil((mouseX / widthRel) - settings.width/2) * -1;
            zoomImageX = Math.max((-1 * zoomWidth) + settings.width, zoomImageX);
            zoomImageX = Math.min(0, zoomImageX);
          
            var zoomImageY = Math.ceil((mouseY / heightRel) - settings.height/2) * -1;                   
            zoomImageY = Math.max((-1 * zoomHeight) + settings.height, zoomImageY);  
            zoomImageY = Math.min(0, zoomImageY);  
            
            $zoomImage.css({ 
              left: zoomImageX + 'px',
              top:  zoomImageY + 'px'   
            }); 
            
            // positioning the image lens according to image relation and mouse position 
            var lensX = Math.ceil(mouseX - (lensWidth / 2));
            lensX = Math.min(baseWidth - lensWidth - 2, lensX);
            lensX = Math.max(0, lensX);
            
            var lensY = Math.ceil(mouseY - (lensHeight / 2));
            lensY = Math.min(baseHeight - lensHeight - 2, lensY); 
            lensY = Math.max(0, lensY);                    
            
            
            $lens.css({  
              left: lensX + 'px',
              top:  lensY + 'px'
            });
          });
        }
        return false;   
      });                 
      // Resets everything
      $(this).hover(function(){}, function(){  
        $(this).css({
          cursor:'pointer',
          zIndex:'auto'
        });
        $('#zoom_window').remove(); 
        $('#lens').remove();
      });
      
    });    
    return this;
  };
})(jQuery);

