/**
 * 首页banner轮播
 * @author: liuyue(yue.liu@yoho.cn)
 * @date: 2015/12/04
 */

var $ = require('yoho.jquery'),
    lazyLoad = require('yoho.lazyload');

(function($) {
    var Slider = function(element, options) {
        this.$element = $(element);
        this.options = $.extend({}, $.fn.slider.defaults, options);
        this.bigItem = this.$element.find('.slide-wrapper').find('li');
        this.smallItem = null;
        this.len = this.bigItem.size();
        this.index = 0;
        this.timer = null;
        this.init();
    };

    Slider.prototype = {
        init: function() {
            if (!!this.options.pagination) {
                this.smallItem = $(this.options.pagination).find('li');
            } else {
                this._createPage();
            }
            this._slideShow();
            this._bindEvent();
            this._autoplay();
        },
        _createPage: function() {
            var pageHtml = '<div class="slide-pagination"><div class="slide-pagination-inner">' +
                            '<div class="slide-shade"></div><div class="slide-pagination-last">',
                i = 0;

            if (this.len <= 1) {
                return;
            }
            for (i = 0; i < this.len; i++) {
                pageHtml += '<span></span>';
            }
            pageHtml += '</div></div></div>';
            this.$element.append($(pageHtml));
            this.smallItem = $('.slide-pagination-inner').find('span');
        },
        _bindEvent: function() {
            var that = this;

            this.$element.find('.slide-switch').on('click', '.next', function() {
                that._nextSlide();
                clearInterval(that.timer);
                that.timer = setInterval(function() {
                    that._nextSlide();
                }, that.options.time);
            }).on('click', '.prev', function() {
                that._prevSlide();
                clearInterval(that.timer);
                that.timer = setInterval(function() {
                    that._nextSlide();
                }, that.options.time);
            });

            this.smallItem.on('mouseenter', function() {
                that.index = $(this).index();
                clearInterval(that.timer);
                that._slideShow();
            }).on('mouseleave', function() {
                that._autoplay();
            });
        },
        _nextSlide: function() {
            if (this.index === this.len - 1) {
                this.index = 0;
            } else {
                this.index++;
            }
            this._slideShow();
        },
        _prevSlide: function() {
            if (this.index === 0) {
                this.index = this.len - 1;
            } else {
                this.index--;
            }
            this._slideShow();
        },
        _slideShow: function() {
            var $img = this.bigItem.eq(this.index).find('img.lazy');

            if ($img.attr('src') !== $img.data('original')) {
                lazyLoad($img.trigger('appear'));
            }
            if (this.len > 1) {
                this.$element.find('.slide-switch').addClass('show');
            }
            this.smallItem.eq(this.index).addClass('focus').siblings().removeClass('focus');
            this.bigItem.eq(this.index).fadeIn().siblings().fadeOut();
        },
        _autoplay: function() {
            var that = this;

            clearInterval(this.timer);
            this.timer = setInterval(function() {
                that._nextSlide();
            }, this.options.time);
        }
    };
    $.fn.slider = function(option) {
        return this.each(function() {
            var $this = $(this),
                data = $this.data('Slider'),
                options = typeof option === 'object' && option;

            if (!data) {
                $this.data('Slider', (data = new Slider(this, options)));
            }
            if (typeof option === 'string') {
                data[option]();
            }
        });
    };
    $.fn.slider.Constructor = Slider;
    $.fn.slider.defaults = {
        time: 5000,
        pagination: null
    };
})($);