/*
 * @description 注册页js
 * @time 2015/12/14
 */

var $ = require('yoho.jquery'),
    regValidate = require('./mail-phone-regx'),
    computeComplex = require('./pwd-strength');

var $registerPage = $('.register-page'),
    $pwdTips = $('#pwd-tips'),
    $pwdTip1 = $pwdTips.find('#pwd-tip1'),
    $errTip = $('#err-tip'),
    $registerBtn = $('#register-btn');

var $sendCaptcha = $('#send-captcha'),
    caCount = 4,
    validateResult = [];

var $pn = $('#phone-num'),
    $mc = $('#msg-captcha'),
    $pwd = $('#pwd'),
    $repwd = $('#repwd'),
    $ca = $('#captcha');

// 密码强度验证
var $pwdIntensity = $('.pwd-intensity'),
    $pwdParent = $pwdIntensity.closest('.pwd-intensity-container');

//signup验证
var $region = $('#country-code'),
    $regionSelect = $('#region');

setTimeout(function() {
    $pn.val('');
    $mc.val('');
    $pwd.val('');
    $repwd.val('');
    $ca.val('');
}, 100);

//验证码位数
$ca.attr('maxlength', caCount);

//密码规则提示
$pwd.focus(function() {
    $pwdTips.removeClass('hide');
}).blur(function() {
    $pwdTips.addClass('hide');
});


//IE8 placeholder
//$('[placeholder]').placeholder();

// 存储校验信息
validateResult = [
    {
        id: 'phone-num',
        message: '', //错误信息
        status: false //当前的状态
    },
    {
        id: 'captcha',
        message: '',
        status: false
    },
    {
        id: 'msg-captcha',
        message: '',
        status: false
    },
    {
        id: 'pwd',
        message: '',
        status: false
    },
    {
        id: 'repwd',
        message: '',
        status: false
    }
];

//手机号ajax校验
function phoneAjaxFn(callback) {
    $.ajax({
        url: '/passport/register/checkmobile',
        type: 'POST',
        data: {
            mobile: $pn.val(),
            area: $region.text().split('+')[1]
        }
    }).then(function(data) {
        switch (data.code) {
            case 200:
                validateResult[0].message = '';
                validateResult[0].status = true;
                break;
            case 404:
                validateResult[0].message = '改账号已经存在';
                validateResult[0].status = false;
                break;
        }

        callback();
    });
}

//图形验证码ajax校验
function picCaptchaAjaxFn(callback) {
    $.ajax({
        type: 'POST',
        url: '/passport/register/piccaptcha',
        data: {
            code: $ca.val(),
            mobile: $pn.val(),
            area: $region.text().split('+')[1]
        }
    }).then(function(data) {
        switch (data.code) {
            case 200:
                validateResult[1].message = '';
                validateResult[1].status = true;
                break;
            case 404:
                validateResult[1].message = '图形验证码错误';
                validateResult[1].status = false;
                break;
        }
        callback();
    });
}

//短信验证码ajax校验
function msgCaptchaAjaxFn(callback) {
    $.ajax({
        type: 'POST',
        url: '/passport/register/msgcaptcha',
        data: {
            code: $ca.val(),
            mobile: $pn.val(),
            area: $region.text().split('+')[1]
        }
    }).then(function(data) {
        switch (data.code) {
            case 200:
                validateResult[2].message = '';
                validateResult[2].status = true;
                break;
            case 404:
                validateResult[2].message = '短信验证码错误';
                validateResult[2].status = false;
                break;
        }

        callback();
    });
}

// 验证
function validateRule($element, callback) {

    var val = $.trim($element.val()),
        regionCode;


    //手机号校验
    if ($element.hasClass('phone-num')) {

        regionCode = $region.text();

        if (val === '') {
            validateResult[0].message = '请输入手机号码';
            validateResult[0].status = false;
            callback();

        } else if (!regValidate.phoneRegx[regionCode].test(val)) {
            validateResult[0].message = '手机号码格式不正确,请重新输入';
            validateResult[0].status = false;
            callback();

        } else {
            phoneAjaxFn(callback);
        }

    //图形验证码校验
    } else if ($element.hasClass('captcha')) {
        if (val === '') {
            validateResult[1].message = '请输入图形验证码';
            validateResult[1].status = false;
            callback();

        } else if (val.length <= 3) {
            validateResult[1].message = '图形验证码为4位';
            validateResult[1].status = false;
            callback();

        } else {

            // 并且手机号正确
            if (validateResult[0].status) {
                picCaptchaAjaxFn(callback);
            } else {
                validateResult[1].message = '图形验证码错误';
                validateResult[1].status = false;
                callback();
            }

        }

    //短信验证码校验
    } else if ($element.hasClass('msg-captcha')) {

        if (val === '') {
            validateResult[2].message = '请输入短信验证码';
            validateResult[2].status = false;
            callback();

        } else if (val.length <= 3) {
            validateResult[2].message = '短信验证码为4位';
            validateResult[2].status = false;
            callback();

        } else {

            // 并且图形验证码正确
            if (validateResult[1].status) {
                msgCaptchaAjaxFn(callback);
            } else {
                validateResult[2].message = '短信验证码错误';
                validateResult[2].status = false;
            }
        }

    //密码校验
    } else if ($element.hasClass('pwd')) {
        if (val === '') {
            validateResult[3].message = '请输入密码';
            validateResult[3].status = false;

        } else if (val.length < 6 || val.length > 20) {
            validateResult[3].message = '密码只支持6-20位字符';
            validateResult[3].status = false;

        } else if (/\s/.test($element.val())) {
            validateResult[3].message = '密码不能包含空格';
            validateResult[3].status = false;

        } else {
            validateResult[3].message = '';
            validateResult[3].status = true;
        }
        callback();

    //二次密码校验
    } else if ($element.hasClass('repwd')) {
        if (val === '') {
            validateResult[4].message = '请输入密码确认';
            validateResult[4].status = false;

        } else if ($pwd.val() !== val) {
            validateResult[4].message = '与密码不一致,请重新输入';
            validateResult[4].status = false;

        } else {
            validateResult[4].message = '';
            validateResult[4].status = true;

        }

        callback();
    }
}

//显示提示信息
function showErrTip() {

    var show = false,
        tipPosition,
        $container,
        i,
        validateResultLen = validateResult.length;

    for (i = 0; i < validateResultLen; i++) {
        if (!show) {

            //不可以通过status判断
            if (!!validateResult[i].message) {

                //显示错误提示
                $errTip.find('span').text(validateResult[i].message);

                $container = $('#' + validateResult[i].id);

                tipPosition = $container.offset();
                $errTip.css({
                    top: tipPosition.top - 40,
                    left: tipPosition.left
                }).removeClass('hide');

                show = true; //停止判断
            } else {
                $errTip.addClass('hide');
            }
        }
    }
}

//显示红色边框
function showBorder() {

    var $errInput,
        i,
        validateResultLen = validateResult.length;

    for (i = 0; i < validateResultLen; i++) {
        if (!!validateResult[i].message) {

            //显示红色边框
            $errInput = $('#' + validateResult[i].id);
            $errInput.addClass('error');

        } else {

            //去掉红色边框
            $errInput = $('#' + validateResult[i].id);
            $errInput.removeClass('error');
        }
    }
}

// 密码强度验证
function pwdFn($obj) {
    var pwd = $obj.val(),
        pwdStrength = computeComplex(pwd),
        level = 0;

    if (pwdStrength === 0) {
        level = 0;
    } else if (pwdStrength <= 10) {
        level = 1;
    } else if (pwdStrength <= 20) {
        level = 2;
    } else {
        level = 3;
    }

    switch (level) {
        case 0:
            $pwdParent.removeClass('red yellow green');
            $pwdIntensity.removeClass('color');
            break;
        case 1:
            $pwdParent.addClass('red').removeClass('yellow green');
            $pwdIntensity.filter('.low').addClass('color');
            $pwdIntensity.filter('.mid,.high').removeClass('color');
            break;
        case 2:
            $pwdParent.addClass('yellow').removeClass('red green');
            $pwdIntensity.filter('.low,.mid').addClass('color');
            $pwdIntensity.filter('.high').removeClass('color');
            break;
        case 3:
            $pwdParent.addClass('green').removeClass('yellow red');
            $pwdIntensity.addClass('color');
            break;
    }

    //提示框
    if (pwd === '') {
        $pwdTip1.removeClass('red yes no').addClass('default');
    } else if (pwd.length < 6 || pwd.length > 20) {
        $pwdTip1.removeClass('default yes').addClass('no red');
    } else {
        $pwdTip1.removeClass('default no red').addClass('yes');
    }
}

// 失去焦点时开始校验
// Tips: 不可以在获得焦点的时候验证，获得焦点和失去焦点的间隔太小，如果中间存在ajax校验的话会出现问题
$registerPage.find('.va').keyup(function() {

    var j,
        statusLen = 0,
        vLen = validateResult.length,
        $that = $(this);

    validateRule($(this), function() {
        showErrTip(); // 显示错误提示
        showBorder(); // 显示红色边框

        // 如果validateResult中有4个status为true表示验证通过
        for (j = 0; j < vLen; j++) {

            if (validateResult[j].status) {

                statusLen++;
            }

        }

        if (statusLen === 4 && $('#agree-terms').is(':checked')) {
            $registerBtn.removeClass('disable').removeAttr('disabled');
        } else {
            $registerBtn.addClass('disable').attr('disabled', 'true');
        }

        // 图形验证通过时，发送短信按钮可点击
        if (validateResult[1].status) {
            $sendCaptcha.removeClass('disable');
        } else {
            $sendCaptcha.addClass('disable');
        }

        //图形验证通过时，发送短信按钮可点击 end

    });

    // 如果是密码则校验强度
    if (($that).hasClass('pwd')) {
        pwdFn($that);
    }

}).blur(function() {

    /*validateRule($(this), function() {
        showErrTip();
        showBorder(); // 显示红色边框
    });*/
});

$regionSelect.change(function() {

    $region.text('+' + $('#region').val());

    validateRule($pn, showErrTip); //验证
});

// 点击发送验证码
$sendCaptcha.click(function() {
    var timeResidue = 10,
        t;

    if ($(this).hasClass('disable')) {
        return;
    }

    //todo ajax

    t = setInterval(function() {
        if (timeResidue <= 0) {
            $sendCaptcha.removeClass('disable').val('获取短信验证码');
            clearInterval(t);
            return;
        }
        $sendCaptcha.addClass('disable').val(timeResidue-- + '秒可重新发送');
    }, 1000);
});

//form表单提交
$registerBtn.click(function() {

    if ($(this).hasClass('disable')) {
        return;
    } else {
        ('#register-form').submit();
    }
});

$('.change-captcha').click(function() {
    var time = new Date(),
        $captchaImg = $('.captcha-img'),
        captchaImgSrc = $captchaImg.attr('src').split('?')[0];

    $captchaImg.attr('src', captchaImgSrc + '?t=' + time.getTime());
});