﻿(function($) {

  $.fn.nextImage = function()
  {
    if($(this).hasClass('last')) {
      next = $(this).parent().children('.first').eq(0);
    } else {
      next = $(this).next();
    }
    
    return next;
  };
  
  $.fn.customBanner = function(settings)
  {
    var images = $('img', $(this));
    var cHeight = $(this).height();
    var image1 = images.eq(0);
    var image2 = image1.nextImage();
    
    //initialize
    image1.addClass('first');
    images.eq(images.length-1).addClass('last');
    $(this).css({'position':'relative'});
    images.css({'position':'absolute', 'left':0, 'top':0, 'opacity':0});
    
    image1.show(function() {
      $(this).animate({
        'top': '-'+($(this).height()-cHeight)/2+'px',
        'opacity': 2,
      }, 3000, 'linear');
    });
    
    setInterval(imageSliding, 3000);
    
    function imageSliding() {
      image1.animate({
        'top': '-'+(image1.height()-cHeight)+'px',
        'opacity':0
      }, 3000, 'linear', function() {
        $(this).css({'top':0});
      });
      image2.show(function() {
        $(this).animate({
          'top': '-'+($(this).height()-cHeight)/2+'px',
          'opacity': 2,
        }, 3000, 'linear');
      });
      image1 = image1.nextImage();
      image2 = image2.nextImage();
    }
    
    /*var images = $('img', $(this));
    var cHeight = $(this).height();
    var index = 0;
    var image = images.eq(index);
    var image2 = nextImage(index);
    
    //initialize
    images.hide();
    $(this).css({'position':'relative'});
    images.css({'position':'absolute', 'left':0, 'top':0, 'opacity':0});
    
    var timer = setInterval( imageSliding(image, image2), 10000 );
    
    function imageSliding(img1, img2) {
      img1.fadeOut(5000);
      img2.show().animate({
        'top':'-'+(images.eq(i).height()-cHeight)+'px',
        'opacity':1,
      }, 10000);
    }
    
    function nextImage(i) {
      return (i == images.length) ? images.eq(0) : images.eq(++i);
    }*/
  };

})(jQuery);
