/**
 * 第三方登录首页
 * @author: wq
 * @date: 2016/1/21
 */
var $ = require('yoho-jquery');
var phoneRegx = require('../common/mail-phone-regx').phoneRegx;
var choosedpic = 'http://cdn.yoho.cn/yohobuy/assets/img/passport/choosed.png';// 已选择图片

var $wrapper = $('.bindwrapper'),
    $phoneTip = $wrapper.find('.phone-err-tip'),
    $nextBtn = $wrapper.find('.yohobindbtn');

require('../../simple-header');

/**
 * 选择协议
 * @return {[type]} [description]
 */
function chooseProtocol() {
    $('.choosetag').on('change', function() {
        var btnColor = '#f02200';

        if ($(this).prop('checked')) {
            $('.choosewrapper').css({
                'background-image': 'url("' + choosedpic + '")'
            });
        } else {
            $('.choosewrapper').css({
                'background-image': 'none'
            });
            btnColor = '#CCCCCC';
        }
        $nextBtn.css({
            'background-color': btnColor
        });
    });
}

/**
 * 判断是否同意协议
 * @return {[type]} [description]
 */
function isagree() {
    return $('.choosetag').prop('checked');
}

/**
 * 选择区域的开关
 * @return {[type]} [description]
 */
function chooseAreaToogle() {
    $('.optionshow').on('click', function() {
        $('.optionslist').toggleClass('hide');
    });
}

/**
 * 选择区域
 * @return {[type]} [description]
 */
function chooseArea() {
    $('.optionitem').on('click', function() {
        var $option = $(this);
        var areanum = $option.attr('areanum');
        var areaname = $option.text();

        $('#areaname').text(areaname);
        $('#areanum').text(areanum);
        $('#areacode').val(areanum);
        $('.optionslist').addClass('hide');
    });
}

/**
 * 取消选择区域
 * @return {[type]} [description]
 */
function cancelChooseArea() {
    $(document).on('click', 'body', function(e) {
        var $target = $(e.target);

        if ($target.hasClass('yohoselectarea') ||
            $target.hasClass('areaname') ||
            $target.hasClass('righttag') ||
            $target.hasClass('optionslist') ||
            $target.hasClass('optionitem')) {
            return;
        } else {
            $('.optionslist').addClass('hide');
        }
    });
}

/**
 * 去掉区域号的加号
 * @return {[type]} [description]
 */
function fixAreaNum() {
    var $opitem = '';
    var itemarecode = '';

    $('.optionitem').each(function() {
        $opitem = $(this);
        itemarecode = $opitem.attr('areanum').replace(/\+/g, '');
        $opitem.attr('areanum', itemarecode);
    });
}


/**
 * 点击下一步
 * @return {[type]} [description]
 */
function nextStep() {
    var mobile = '';
    var areaCode = '';

    $('#bindfirststep').on('click', function(e) {
        var regx;

        e.preventDefault();
        mobile = $('.phonenum').val();
        areaCode = $('#areanum').text();
        regx = phoneRegx['+' + areaCode];

        if (!isagree()) {
            return;
        }
        if (mobile === '' || !regx || !regx.test(mobile)) {
            $phoneTip.find('em').text('手机格式错误');
            $phoneTip.removeClass('hide');
            return;
        }

        $.ajax({
            type: 'post',
            url: '/passport/cert/check',
            data: {
                mobile: mobile,
                area: areaCode
            },
            dataType: 'json',
            success: function(data) {

                if (data.code === 200) {    // 绑定/关联
                    $('#bindmobileform').attr('action', data.data.next);
                    $('#bindmobileform').submit();
                } else if (data.code === 402) {
                    $phoneTip.find('em').text('手机格式错误');
                    $phoneTip.removeClass('hide');
                } else {
                    if (data && data.message) {
                        alert(data.message);
                    }
                }
            }
        });
    });
}

$wrapper.on('keydown', '.phonenum', function(e) {
    if (e.keyCode === 13) {
        $nextBtn.trigger('click');
        return false;
    }
});

function init() {
    fixAreaNum(); // 去掉所有区域的+
    chooseProtocol(); // 选择协议
    chooseArea(); // 选择区域
    chooseAreaToogle(); // 选择区域展示或关闭
    cancelChooseArea(); // 取消选择区域
    nextStep();  // 下一步
}
init();