$(document).on 'click', '.zoomed_image', (e) ->
  $('#cloned_zoomed_image').remove();
  originalLeft = $(this).offset().left - window.pageXOffset;
  originalTop = $(this).offset().top - window.pageYOffset;
  originalWidth = $(this).width();
  clonedImg = $(this).clone()
  $(clonedImg).attr(id: 'cloned_zoomed_image', class: '');
  $(clonedImg).css(top: originalTop, left: originalLeft, position: 'fixed', 'z-index': 21);
  $(clonedImg).width(originalWidth);
  $('body').prepend(clonedImg)
  $(clonedImg).click () ->
    $(clonedImg).animate width: originalWidth, left: originalLeft, top: originalTop
    , 300, () -> $(clonedImg).remove()

  max = 0.95
  coef = $(clonedImg).width() / $(clonedImg).height()
  w = $(window).height()*max * coef
  if $(clonedImg).width() > $(clonedImg).height() && $(window).width()*max*coef < $(window).height()
    w = $(window).width()*max

  $('#cloned_zoomed_image').animate
    width: w
    left: ($(window).width() - w) / 2
    top: ($(window).height() - w * $(this).height() / $(this).width() ) / 2
    opacity: 1
  , 300

  e.preventDefault()
  false