/**
 * [秒抢页面js]
 * author: 陈峰<feng.chen@yoho.cn>
 * date: 2016/09/08
 */
var $ = require('yoho-jquery'),
        IScroll = require('yoho-iscroll'),
        seckillObj = {};

seckillObj = {
    el: { 
        //doms
        $navUl: $('.nav-ul'),
        $navList: $('.nav-list'),

        //变量
        times: $('.nav-ul>li').length,
        startX: 0,
        timeWidth: 0,
        focusTimeWidth: 0,
        iScroll: null,
        currentTick: null
    },
    /**
     * [初始化界面]
     */
    init: function() {
        var $el = this.el, that = this;

        $el.$navUl.find('>li').click(function () {
            that.selectTime(this);
        });

        $(window).resize(function() {
            that.initNav();
        })

        that.initNav();

        var focus = $el.$navUl.find('>li.focus');
        if (focus.length && (focus.hasClass('now') || focus.hasClass('wait'))) {
            that.initTick($('.nav-ul>li.focus'));
        }
    },
    /**
     * [初始化时间段]
     */
    initNav: function() {
        var $el = this.el, that = this;

        timeWidth = ($el.$navUl.find('>li:not(.focus)').width() + 1);
        focusTimeWidth = ($el.$navUl.find('>li.focus').width() + 1);

        $el.$navUl.width(($el.times - 1) * timeWidth + focusTimeWidth).removeClass('hide');
        //只有时间段大于3个才需要定位
        if ($el.$navUl.find('>li').length > 3 && $el.$navUl.find('>li.focus').length) {
            $el.startX = (0 - ($el.$navUl.find('>li.focus').index()-1)*timeWidth);
        }
        if ($el.iScroll) {
            $el.iScroll.destroy();
        }
        $el.iScroll = new IScroll($el.$navList[0], {
            scrollX: true,
            scrollY: false,
            startX: $el.startX,
            tap: true,
            eventPassthrough: true,
            preventDefault: true,
            bounceTime: 400,
            bounceEasing: {
                style: 'cubic-bezier(0.333333, 0.666667, 0.666667, 1)'
            }
        });
        that.registerScrollEvents($el.iScroll);
    },
    /**
     * [注册iscroll事件，滑动停止时判断位置自动选中居中时间段]
     */
    registerScrollEvents: function(iScroll) {
        var $el = this.el, that = this;

        iScroll.on('scrollStart', function () {
            $el.$navList.addClass('srolling');
        });
        iScroll.on('scrollEnd', function () {
            //避免死循环
            if ($el.$navList.hasClass('srolling')) {
                $el.$navList.removeClass('srolling');
                var offsetLeft = this.x - $(window).width()/2;
                for (var i = 0; i < $el.$navUl.find('>li').length; i++) {
                    offsetLeft += $el.$navUl.find('>li').eq(i).width();
                    if (offsetLeft >= 0) { //判断选中时间段
                        that.selectTime($el.$navUl.find('>li').eq(i));
                        break;
                    }
                }
            }
        });
    },
    /**
     * [选中时间段]
     */
    selectTime: function(elem) {
        var $el = this.el, that = this;

        $el.$navUl.find('>li').removeClass('focus');
        var index = $(elem).index();

        $(elem).addClass('focus');
        //点击切换时遇到首尾特殊处理选中时间段位置,大于3个才需要滑动选中
        if ($el.$navUl.find('>li').length > 3) {
            if (index === 0) {
                $el.iScroll.scrollTo(0, 0, 400);
            } else if (index === $el.$navUl.find('>li').length - 1) {
                $el.iScroll.scrollTo(0 - $el.$navUl.width() + timeWidth * 2 + focusTimeWidth, 0, 400);
            } else {
                $el.iScroll.scrollTo((0 - (index-1)*timeWidth), 0, 400);
            }
        }
        
        if ($(elem).hasClass('now') || $(elem).hasClass('wait')) {
            //初始化倒计时并开始计时
            that.initTick(elem);
        }
    },
    /**
     * [刷新状态]
     */
    refreshList: function(el) {
        var $el = this.el, that = this;

        //刷新时间段状态
        $el.$navUl.find('>li').each(function () {
            $(this).removeClass('now over wait');
            var time = new Date($(this).find('input.date').val());
            var nowTime = new Date();
            if (nowTime > time) { //当前时间大于这个时间段，已经开始和即将开始两种情况
                if ($(this).next('.time-item').length) {
                    var nextTime = new Date($(this).next().find('input.date').val());
                    if (nowTime < nextTime) { //下一个时间段与当前时间来区别是否正在抢购
                        $(this).addClass('now');
                    } else {
                        $(this).addClass('over');
                    }
                } else { //大于这个时间段但是后面没有秒抢时间端了，则依然显示抢购中
                    $(this).addClass('now');
                }
            } else if (!$(this).hasClass('nothing')) {
                $(this).addClass('wait');
            }
        })
        //刷新列表状态
        console.log('刷新啊')
    },
    /**
     * [初始化倒计时]
     */
    initTick: function(elem) {
        var $el = this.el, that = this;

        if ($el.currentTick) {
            clearTimeout($el.currentTick);
        }
        var time;
        
        var nowTime = Date.parse(new Date()) / 1000;
        var offsetTime;
        if ($(elem).hasClass('now')) {
            time = Date.parse(new Date($(elem).next().find('input.date').val())) / 1000;
        } else {
            time = Date.parse(new Date($(elem).find('input.date').val())) / 1000;
        }
        offsetTime = time - nowTime;
        that.startTick(elem, offsetTime);
    },
    /**
     * [开始倒计时]
     */
    startTick: function(el, offsetTime) {
        var $el = this.el, that = this;

        var hour = parseInt(offsetTime / (60 * 60), 10);
        var minute = parseInt(offsetTime % (60 * 60) / 60, 10);
        var second = offsetTime % 60;
        $(el).find('.tick.hour').text(hour < 0 ? '00': (hour<10?('0'+hour):hour));
        $(el).find('.tick.minute').text(minute < 0 ? '00': (minute<10?('0'+minute):minute));
        $(el).find('.tick.second').text(second < 0 ? '00': (second<10?('0'+second):second));
        if (offsetTime <= 0) { //结束倒计时刷新状态
            that.refreshList(el);
        } else {
            setTimeout(function() {
                that.startTick(el, --offsetTime);
            }, 1000);
        }
    }
}

seckillObj.init();