/**
 * 购物车选择尺寸、颜色和数量面板
 * 显示时构造当前商品信息的HTML插入yoho-page；消失则是直接清除HTML
 * @author: xuqi<qi.xu@yoho.cn>
 * @date: 2015/10/21
 */

// bikai
// 增加init函数，异步请求的接口需要重新初始化一下选择列表
// 异步渲染的模板统一插入 #chose-panel ,兼容页面多个选择框

var $ = require('jquery'),
    tip = require('../plugin/tip'),
    loading = require('../plugin/loading');

var $chosePanel = $('#chose-panel'),
    $num,
    $chosed,
    $imgsThumb,
    $leftNum,
    leftNum,
    confirming,
    curColorIndex,
    curSizeIndex,
    $curSizeRow,
    hasChooseColor,
    hasChooseSize,
    $curSizeBlock,
    $sizeRowList,
    cbFn,
    cartType,
    $allChoseItems,
    $yohoPage = $('.yoho-page');

//初始化购物车面板显示
function init() {
    var $firstRow;

    hasChooseColor = false;
    hasChooseSize = false;
    $curSizeBlock = null;
    $imgsThumb = $('.chose-panel').find('.thumb');
    $allChoseItems = $('.chose-items');
    $sizeRowList = $('.size-list ul');
    $leftNum = $('#left-num');
    $firstRow = $sizeRowList.eq(0);
    $firstRow.toggleClass('hide');
    $curSizeRow = $firstRow;
}

function checkColorSizeNum() {
    if (!hasChooseColor && !hasChooseSize) {
        tip.show('请选择颜色和尺码~');
        return false;
    } else if (!hasChooseColor) {
        tip.show('请选择颜色~');
        return false;
    } else if (!hasChooseSize) {
        tip.show('请选择尺码~');
        return false;
    }
    return true;
}

function show(html, cb) {
    if (html) {
        $chosePanel.html(html);
        init();
    }
    $('.chose-panel').show();
    $num = $('#good-num');
    cbFn = cb;
}

//隐藏当前Panel
function hide() {
    $('.chose-panel').hide();
    //cbFn = null;
}

//修改加入购物车的文字和背景
function updateConformButtonClassAndText() {
    $chosed = $allChoseItems.find('.chosed');
    if (2 === $chosed.closest('.zero-stock').length) {
        $('#chose-btn-sure').css('background-color', '#c0c0c0').html('已售罄');
    } else {
        $('#chose-btn-sure').css('background-color', '#eb0313').html('确定');
    }
}

//重置颜色块的库存为0的样式
function resetColorZeroStock($siblingBlock) {
    var numArray = ($curSizeBlock.data('numstr') + '').split('/'),
        i;

    if (!hasChooseSize) {
        $siblingBlock.find('ul>li').each(function() {
            $(this).removeClass('zero-stock');
            if ('0' === $(this).data('num')) {
                $(this).addClass('zero-stock');
            }
        });

    } else {
        for (i = 0; i < numArray.length; i++) {
            if ('0' === numArray[i]) {
                $siblingBlock.find('.block').eq(i).addClass('zero-stock');
            }
        }
    }
}

// 选择了颜色切换商品图片
function changeGoodImgWhenClickColor() {
    if (hasChooseColor && curColorIndex) {
        $imgsThumb.addClass('hide').eq(curColorIndex).removeClass('hide');
    }
}

init();

$yohoPage.on('touchstart', '.chose-panel', function(e) {
    var $cur = $(e.target);

    if ($cur.closest('.main').length > 0) {
        return;
    }

    //点击蒙版消失
    hide();
});

$yohoPage.on('touchstart', '.color-list .block', function(e) {
    var $this = $(this),
        index,
        curSizeBlock,
        $preSiblingBlock,
        scindex,
        curGoodNum;

    var $siblingBlock = $this.closest('.block-list').siblings(':first');

    $this.siblings('.chosed').removeClass('chosed');
    index = $this.index();

    $preSiblingBlock = $siblingBlock.find('.chosed');
    scindex = $preSiblingBlock.index();
    $curSizeRow = $sizeRowList.eq(index);

    // 当前颜色已经是选中状态,再点击时
    if ($this.hasClass('chosed')) {

        //颜色原来已经是勾选时，要清空剩余件数的提示
        $allChoseItems.find('.num .left-num').html('');
        $leftNum.val(0);
        hasChooseColor = false;

        // 当前颜色不是选中状态,选中时
    } else {
        hasChooseColor = true;

        //把当前选中颜色对应的尺码那一行显示出来
        $sizeRowList.addClass('hide');
        $curSizeRow.removeClass('hide').addClass('show');

        // 之前选中的尺码去掉勾选样式
        if ($preSiblingBlock.length > 0) {
            $preSiblingBlock.removeClass('chosed');
        }

        curSizeBlock = $curSizeRow.children().get(scindex);

        // 当前选中颜色对应的尺码行，其对应的尺码加上勾选样式 (前提是要判断下这个尺码是否存在)
        if (curSizeBlock) {
            curGoodNum = $(curSizeBlock).data('num');
            $(curSizeBlock).addClass('chosed');

            //如果当前有尺码被选中，且数量等于0,则颜色块添加数量为0的样式
            if (curGoodNum > 0) {
                $allChoseItems.find('.num .left-num').html('剩余' + curGoodNum + '件');
                $leftNum.val(curGoodNum);
            } else {
                $allChoseItems.find('.num .left-num').html('');
                $leftNum.val(0);
            }
        }
    }

    // 当前颜色块 切换勾选样式
    $this.toggleClass('chosed');
    curColorIndex = index;

    // 设置按钮的样式和文字
    updateConformButtonClassAndText();

    // 修改颜色时修改商品图片
    changeGoodImgWhenClickColor();
});

$yohoPage.on('touchstart', '.size-list .block', function(e) {
    var $this = $(this),
        index,
        curGoodNum;

    var $siblingBlock = $this.closest('.block-list').siblings(':first');

    $this.siblings('.chosed').removeClass('chosed');
    index = $this.index();
    $curSizeRow = $sizeRowList.eq(index);

    // 当前尺码已经是选中状态,再点击时
    if ($this.hasClass('chosed')) {

        //尺码原来已经是勾选时，要清空剩余件数的提示
        $allChoseItems.find('.num .left-num').html('');
        $('#left-num').val(0);
        hasChooseSize = false;

        // 当前尺码不是选中状态,选中时
    } else {
        hasChooseSize = true;

        curGoodNum = $this.data('num');

        // 之前选中的尺码去掉勾选样式
        if ($curSizeBlock) {
            $curSizeBlock.removeClass('chosed');
        }

        // 如果当前有尺码被选中，且数量等于0, 否则显示剩余件数
        if (curGoodNum > 0 && hasChooseColor) {
            $allChoseItems.find('.num .left-num').html('剩余' + curGoodNum + '件');
            $('#left-num').val(curGoodNum);
        } else {
            $allChoseItems.find('.num .left-num').html('');
            $('#left-num').val(0);
        }

    }

    $this.toggleClass('chosed');
    curSizeIndex = index;
    $curSizeBlock = $this;

    // 设置按钮的样式和文字
    updateConformButtonClassAndText();

    // 重置颜色块的样式
    resetColorZeroStock($siblingBlock);

});

$yohoPage.on('touchstart', '.btn-minus', function() {
    var num = parseInt($num.val(), 10);

    leftNum = $('#left-num').val();

    if (!checkColorSizeNum()) {
        return;
    }

    if (num === 1 || 0 === leftNum - 0) {
        return;
    }

    $num.val(num - 1);
}).on('touchstart', '.btn-plus', function() {
    var num = parseInt($num.val(), 10);

    leftNum = $('#left-num').val();

    if (!checkColorSizeNum()) {
        return;
    }


    if (num - 0 === leftNum || 0 === leftNum) {
        return;
    }

    //TODO:库存数验证
    $num.val(num + 1);
}).on('touchstart', '#chose-btn-sure', function() {

    var productSku,
        buyNumber = $('#good-num').val() - 0,

        promotionId,
        isEdit = 0,
        numInCart = $('.num-tag').html() - 0,
        num = $num.val();

    //颜色尺码没有选择
    if (!checkColorSizeNum()) {
        return;
    }

    //TODO status change
    if ($('#chose-btn-sure').html() === '已售罄') {
        return;
    }

    leftNum = $('#left-num').val();

    if (num > leftNum) {
        tip.show('您选择的数量超过了最大库存量~');
        return;
    }

    $chosed = $('.block-list>ul>li.chosed');

    if (2 === $chosed.length && 0 === $chosed.closest('.zero-stock').length) {
        productSku = $curSizeBlock.data('skuid');
        promotionId = $('[data-id="' + productSku + '"]').closest('.advance-block').data('promotion-id');
        if (confirming) {
            return false;
        }

        confirming = true;
        loading.showLoadingMask();
        $.ajax({
            method: 'POST',
            url: '/cart/index/add',
            data: {
                productSku: productSku,
                buyNumber: buyNumber,
                promotionId: promotionId,
                isEdit: isEdit,
                cartType: cartType
            }
        }).done(function(res) {
            loading.hideLoadingMask();
            if (res.code === 200) {
                $('.num-tag').html(numInCart + buyNumber).removeClass('hide');
                confirming = false;
                hide();

                if (cbFn) {
                    cbFn();
                }
            }
            if (res.message) {
                tip.show(res.message);
            }
        }).fail(function() {
            tip.show('网络出了点问题~');
        }).always(function() {
            confirming = false;
        });
    }

});

exports.init = init;
exports.show = show;