﻿(function ($) {
    $.ClassTopAnimate = {
        ChangeItem: null,
        RateDelay: 3000,
        RateAnimate: 500,
        HeightItem: 25,
        Direction: 'Top',
        ParentNode: null,
        Loop: function () {
            var _this = this;
            this.ChangeItem = setInterval(function () { AutoChangeItem() }, this.RateDelay);
            function AutoChangeItem() {
                var Active = _this.obj.find('.Active');
                if (_this.obj.find('div').length > 1) {
                    if (Active.next().length) {
                        Active.removeClass('Active').next().addClass('Active');
                        _this.ChangePos();
                    }
                    else {
                        Active.removeClass('Active').siblings('div:first').addClass('Active');
                        _this.ChangePos();
                    } 
                }
            }
        },
        ChangePos: function () {
            var _this = this;
            var Active = this.obj.find('.Active');
            if (this.Direction.toLowerCase() == 'top') {
                Active.animate({ 'top': '0px' }, this.RateAnimate).prev().animate({ 'top': -(this.HeightItem) }, this.RateAnimate, function () { $(this).css({ 'top': _this.HeightItem }) }).appendTo($('.' + this.ParentNode));
            }
            else {
                Active.animate({ 'top': '0px' }, this.RateAnimate).prev().animate({ 'top': this.HeightItem }, this.RateAnimate, function () { $(this).css({ 'top': -(_this.HeightItem) }) }).appendTo($('.' + this.ParentNode));
            }
        }
    }
    $.fn.TopAnimate = function (option) {
        var option = $.extend(true, {}, $.ClassTopAnimate, option, { obj: $(this) });
        return this.each(function () {
            option.Loop();
            option.ChangePos();
            HeightItem = $(this).find('div').height();
            switch (option.Direction.toLowerCase()) {
                case 'top':
                    $(this).find('div').css({ 'top': HeightItem + 'px' });
                    $(this).find('div:first').css({ 'top': '0px' }).addClass('Active');
                    break;
                case 'bottom':
                    $(this).find('div').css({ 'top': -HeightItem + 'px' });
                    $(this).find('div:first').css({ 'top': '0px' }).addClass('Active');
                    break;
                default:
            }
            $(this).live('mouseenter', function () {
                clearInterval(option.ChangeItem);
            }).live('mouseleave', function () { option.Loop() });
        });
    }
})(jQuery);

