(function($) {
  $.fn.imagePiles = function(settings) {
    settings = $.extend({
      pile1Control: "pile1",
      pile2Control: "pile2",
      pile1Animation: {
        top: 0,
        left: 0,
      },
      pile2Animation: {
        top: 0,
      	right: 0,
      },
      activeAnimation: {
        top: '100px',
        left: 0,
      },
      duration: 1500
    }, settings);
    var $pile1 = $('#'+settings.pile1Control);
    var $pile2 = $('#'+settings.pile2Control);

    $pile1.bind("click", takeFrom1);
    $pile2.bind("click", takeFrom2);
    $(this.selector + ' img').addClass('ipOnPile1');
    $pile1.addClass('ipActive');
    takeOff1();

    function takeFrom1() {
      if (takeOff1()) putOn2();
    };

    function takeFrom2() {
      if (takeOff2()) putOn1();
    };

    function takeOff1() {
      if ($('img.ipOnPile1').length == 0) return false;
      $('img.ipOnPile1:last').animate(settings.activeAnimation, settings.duration).removeClass('ipOnPile1').addClass('ipActive');
      if ($('img.ipOnPile1').length == 0) $pile1.removeClass('ipActive');
      else $('img.ipOnPile1:last').fadeIn(settings.duration);
      return true;
    };

    function takeOff2() {
      if ($('img.ipOnPile2').length == 0) return false;
      $('img.ipOnPile2:first').animate(settings.activeAnimation, settings.duration).removeClass('ipOnPile2').addClass('ipActive');
      if ($('img.ipOnPile2').length == 0) $pile2.removeClass('ipActive');
      else $('img.ipOnPile2:first').fadeIn(settings.duration);
      return true;
    };

    function putOn1() {
    	var imageToBePutOn1 = $('img.ipActive:first');
    	if (imageToBePutOn1.attr('height') > imageToBePutOn1.attr('width')) {
				settings.pile1Animation.maxHeight = 150;
				settings.pile1Animation.maxWidth = (150 * imageToBePutOn1.attr('width')/imageToBePutOn1.attr('height'));
    	}
    	else {
				settings.pile1Animation.maxHeight = (150 * imageToBePutOn1.attr('height')/imageToBePutOn1.attr('width'));
				settings.pile1Animation.maxWidth = 150;
    	}
      $('img.ipOnPile1:last').fadeOut(settings.duration);

      imageToBePutOn1.animate(settings.pile1Animation, settings.duration).removeClass('ipActive').addClass('ipOnPile1');
      $pile1.addClass('ipActive');
    };

    function putOn2() {
    	var imageToBePutOn2 = $('img.ipActive:last');
    	if (imageToBePutOn2.attr('height') > imageToBePutOn2.attr('width')) {
				settings.pile2Animation.maxHeight = 150;
				settings.pile2Animation.maxWidth = (150 * imageToBePutOn2.attr('width')/imageToBePutOn2.attr('height'));
    	}
    	else {
				settings.pile2Animation.maxHeight = (150 * imageToBePutOn2.attr('height')/imageToBePutOn2.attr('width'));
				settings.pile2Animation.maxWidth = 150;
    	}
			settings.pile2Animation.left = 320 - settings.pile2Animation.maxWidth;
      $('img.ipOnPile2:first').fadeOut(settings.duration);
      imageToBePutOn2.animate(settings.pile2Animation, settings.duration).removeClass('ipActive').addClass('ipOnPile2');
      $pile2.addClass('ipActive');
    };
  };

})(jQuery);

$(document).ready(function(){
  $('#spinner').show();
});

$(window).load(function(){
  //$('#spinner').fadeOut(500);
  $('#spinner *').fadeOut(500);
  $('#spinner').css({'position':'relative','top':'150px','left':'0','width':'360px','height':'500px','z-index':'1000'});
  $('#images').imagePiles({
    pile1Control: 'leftPile',
    pile2Control: 'rightPile',
    pile1Animation: {
      top: 0,
      left: 0,
      maxHeight: '150px',
      maxWidth: '150px',
    },
    pile2Animation: {
      top: 0,
      right: 0,
      maxHeight: '150px',
      maxWidth: '150px',
    },
    activeAnimation: {
      top: '150px',
      left: 0,
      width: '320px',
      maxHeight: '500px',
      maxWidth: '320px'
    }
  });
});