/**
 * 第三方登录首页
 * @author: wq
 * @date: 2016/1/21
 */
var $ = require('yoho-jquery');
var phoneRegx = require('../common/mail-phone-regx').phoneRegx;
var Captcha = require('../../plugins/captcha');

var nopermissionoption = $('#nopermissionmessage').html(); // 倒计时dom
var sendmessagehtml = $('.validatewrapper').html(); // 发送短信dom
var second = +$('.second').text(); // 倒计时秒数
var dovalidate = false; // 校验验证码标识
var validatecode = false; // 验证码是否通过
var choosedpic = 'https://cdn.yoho.cn/yohobuy/assets/img/passport/choosed.png';// 已选择图片

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

var captcha = new Captcha('#captcha').init();
var captcha2 = new Captcha('#captcha2').init();

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

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

        if ($(this).attr('checked') === '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').attr('checked') === 'checked';
}

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

/**
 * 验证码校验
 * @return {[type]} [description]
 */
function codeValidate() {
    var validatenum = '';

    $(document).on('keyup', '#validatenum', function() {
        validatenum = $(this).val();
        if (validatenum.length === 4) {
            if (!dovalidate) {
                dovalidate = true;
                $.ajax({
                    type: 'POST',
                    url: '/passport/autouserinfo/checkBindMsg',
                    data: {
                        code: validatenum,
                        mobile: $('#mobile').val(),
                        area: $('#areacode').val()
                    }
                }).then(function(data) {
                    dovalidate = false;
                    if (data.code === 200) {
                        validatecode = true;
                    } else {
                        alert(data.message); // eslint-disable-line
                    }
                });
            }
        }
    });

    $('#validatenum').focus(function() {
        $(this).removeAttr('placeholder');
    }).blur(function() {
        $(this).attr('placeholder', '验证码');
    });
}

/**
 * 选择区域
 * @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 closeMask() {
    var $target;

    $(document).on('click', '#alreayregist', function(e) {
        $target = $(e.target);
        if ($target.hasClass('mask') || $target.hasClass('backdrop')) {
            $('#alreayregist').hide();
            $('.backdrop').hide();
        }
    });

    $(document).on('click', '#bindconfirm', function(e) {
        $target = $(e.target);
        if ($target.hasClass('mask') || $target.hasClass('backdrop')) {
            $('#bindconfirm').hide();
            $('.backdrop').hide();
        }
    });
}

/**
 * 绑定其他手机号
 * @return {[type]} [description]
 */
function yohoBindBtn() {
    $(document).on('click', '#yohobindbtn', function() {
        $('.phonenum').val('');
        $('#bindconfirm').hide();
        $('.backdrop').hide();
    });

    $(document).on('click', '#yohobindbtn2', function() {
        $('.phonenum').val('');
        $('#alreayregist').hide();
        $('.backdrop').hide();
    });
}

/**
 * 发送短信的时间变换动画
 * @return {[type]} [description]
 */
function changeSecond() {
    second -= 1;
    if (second < 0) {
        second = 60;
        $('.validatewrapper').html(sendmessagehtml);
        return;
    } else {
        $('.second').text(second);
        window.setTimeout(changeSecond, 1000);
    }

}

/**
 * 时间循环
 * @param  {[type]} phonenum [description]
 * @return {[type]}          [description]
 */
function circleTime() {
    $('.validatewrapper').html(nopermissionoption);
    window.setTimeout(changeSecond, 1000);
}

/**
 * 发送短信
 * @return {[type]} [description]
 */
function sendMessageValidate() {
    $(document).on('click', '#sendmessage', function() {
        if ($('#sendmessage').attr('disabled') === 'disabled') {
            return;
        }
        captcha2.hideTip();

        $.ajax({
            type: 'POST',
            url: '/passport/autouserinfo/sendBindMsgCode',
            data: {
                mobile: $('#mobile').val(),
                area: $('#areacode').val(),
                verifyCode: captcha2.getResults()
            }
        }).then(function(data) {
            if (data.code === 405) {
                // 验证码 error
                captcha2.showTip(data.message);
            } else if (data.code !== 200) {
                alert(data.message); // eslint-disable-line
            } else {
                circleTime($('#mobile').val());
            }
        });

    });
}

/**
 * 最终提交表单
 */
function actionSubmit() {
    var mobile = '';
    var area = '';

    area = $('#areacode').val();
    mobile = $('#mobile').val();
    $.ajax({
        type: 'POST',
        url: '/passport/autouserinfo/bindMobile',
        data: {
            area: area,
            openId: $('#openId').val(),
            sourceType: $('#sourceType').val(),
            mobile: mobile,
            code: $('#validatenum').val()
        }
    }).then(function(data) {
        if (data.code === 200) {
            if (data.data && data.data.refer) {
                window.location.href = data.data.refer;
            } else {
                window.location.href = '/passport/thirdlogin/bindsuccess';
            }
        } else {
            alert(data.message); // eslint-disable-line
        }
    });
}

/**
 * 确认去绑定
 * @return {[type]} [description]
 */
function goToBindPhone() {
    $(document).on('click', '#gotobindphone', function() {
        if (validatecode === true) {
            $('#inarea').val($('#areacode').val());
            $('#inmobile').val($('#mobile').val());
            actionSubmit();
        } else {
            alert('请输入正确验证码'); // eslint-disable-line
        }
    });
}

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

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

        e.preventDefault();
        captcha.hideTip();
        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;
        }
        openId = $('#openId').val() || '29803EC6D4AAC3AAB8ABDB6AE829D579';
        sourceType = $('#sourceType').val() || 'qq';

        $.ajax({
            type: 'post',
            url: '/passport/autouserinfo/bindCheckSendMsg',
            data: {
                mobile: mobile,
                area: areaCode,
                openId: openId,
                sourceType: sourceType,
                verifyCode: captcha.getResults()
            },
            dataType: 'json',
            success: function(data) {
                var winHeight = $(window).height();

                if (data.code === 200) {
                    $('#bindmobileform').attr('action', data.data.next);
                    $('#bindmobileform').submit();
                } else if (data.code === 201) {

                    // 已注册 未绑定
                    username = data.data.user.username;
                    headImg = data.data.user.headImg;
                    $('#registphone').text(mobile);
                    $('#username').text(username);
                    if (headImg === '') {
                        $('#userphoto').attr('src', 'http://img10.static.yhbimg.com/headimg/2013/11/28/09/' +
                            '01cae078abe5fe320c88cdf4c220212688.gif?imageView/2/w/100/h/100');
                    } else {
                        $('#userphoto').attr('src', headImg);
                    }
                    $('#logindirectly2').attr('href', data.data.user.bindLogin);
                    $('.backdrop').show();

                    $('#alreayregist .mask').css({
                        'padding-top': winHeight > 440 ? winHeight / 2 : 217
                    });
                    $('#alreayregist').show();

                    // 201 code send msg
                    circleTime($('#mobile').val());
                } else if (data.code === 203) {
                    // 已注册 可关联
                    $('#bindmobileform').attr('action', data.data.next);
                    $('#bindmobileform').submit();
                } else if (data.code === 205) {
                    // 未注册 不可关联
                    username = data.data.user.username;
                    headImg = data.data.user.headImg;
                    $('#registphonetwo').text(mobile);
                    $('#username1').text(username);
                    if (headImg === '') {
                        $('#userphoto1').attr('src', 'http://img10.static.yhbimg.com/headimg/2013/11/28/09/' +
                            '01cae078abe5fe320c88cdf4c220212688.gif?imageView/2/w/100/h/100');
                    } else {
                        $('#userphoto1').attr('src', headImg);
                    }
                    $('#logindirectly').attr('href', data.data.user.bindLogin);
                    $('.backdrop').show();
                    $('#bindconfirm .mask').css({
                        'padding-top': winHeight > 440 ? winHeight / 2 : 217
                    });
                    $('#bindconfirm').show();
                } else if (data.code === 402) {
                    $phoneTip.find('em').text('手机格式错误');
                    $phoneTip.removeClass('hide');
                } else if (data.code === 405) {
                    // 验证码 error
                    captcha.showTip(data.message);
                } else {
                    if (data && data.message) {
                        alert(data.message); // eslint-disable-line
                    }
                }
            }
        });
    });
}

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

function init() {
    fixAreaNum(); // 去掉所有区域的+
    sendMessageValidate(); // 有交互的发送短信
    chooseProtocol(); // 选择协议
    chooseArea(); // 选择区域
    chooseAreaToogle(); // 选择区域展示或关闭
    cancelChooseArea(); // 取消选择区域
    nextStep();  // 下一步
    closeMask(); // 关闭蒙层
    yohoBindBtn(); // 绑定其他手机号点击
    goToBindPhone(); // 绑定手机
    codeValidate(); // 验证码校验
}
init();