/**
 * 登录
 * @author: xuqi<qi.xu@yoho.cn>
 * @date: 2015/12/11
 *
 * @author: tao.huang<tao.huang@yoho.cn>
 * @date: 2016/8/29
 */

/** ************************************************************************/
/*                                  流程                                  */
/** ************************************************************************/
/**
 * 登录分为：普通登录(使用帐户和密码登录)和手机验证码登录（使用手机号和验证短信登录）
 *
 * 每种登录的流程都是一致的，具体如下：
 * 1. 各个输入框失去焦点验证（包括本地和网络）。
 * 2. 验证包括：本地(Local)和网络(Async)。本地主要是格式验证，网络是服务器验证。
 * 3. 在登录之前，还有预验证(pre)，包括之前所有的验证。
 *
 * 普通登录
 * 帐号验证 => 密码验证    => 图形验证码验证 => 登录之前验证 => 登录
 *
 * 手机验证码登录
 * 帐号验证 => 手机短信验证 => 图形验证码验证 => 登录之前验证 => 登录
 * 注意： **短信验证使用的是验证短信成功后的code进行登录**
 */

/** ************************************************************************/
/*                                  引入第三方库                             */
/** ************************************************************************/

var $ = require('yoho-jquery');

/** ************************************************************************/
/*                                初始化变量                                */
/** ************************************************************************/

// 帐号
var $accountInput = $('#account'),
    getAccountVal = function() {
        return $.trim($accountInput.val());
    },

// 密码
    $passwordInput = $('#password'),
    getPasswordVal = function() {
        return $.trim($passwordInput.val());
    },

// 图像验证码
    $captchaImgInput = $('#captcha'),
    $captchaImgWrapper = $('.captcha-wrap'),
    $captchaImgPic = $captchaImgWrapper.find('#captcha-img'),
    getCaptchaImgVal = function() {
        return $.trim($captchaImgInput.val());
    },

// 短信验证码
    $captchaSmsInput = $('#captcha-sms'),
    getCaptchaSmsVal = function() {
        return $.trim($captchaSmsInput.val());
    },
    $captchaSmsBtn = $('.change-captcha-sms'),
    $captchaSmsTokenHideInput = $('#captcha-sms-token-hide'),
    getCaptchaSmsTokenVal = function() { // 短信登录凭证
        return $.trim($captchaSmsTokenHideInput.val());
    },

// 区域选择
    $countryCodeInput = $('#country-code-hide'),
    getAreaCodeVal = function() {
        return $countryCodeInput.val().replace('+', '');
    },
    $countryCodeHeader = $('#country-code > em'),
    $countryList = $('#country-list'),

// 记住我
    $rememberMe = $('.remember-me'),
    getRememberMeVal = function() {
        return $rememberMe.hasClass('checked') ? true : false;
    },

// 二维码
    $qrcodeInput = $('#qrcode'),
    getQrCodeVal = function() {
        return $qrcodeInput.val();
    },
    $qrCodeContainer = $('.qrcode');

// 提示
var $accountTip = $accountInput.siblings('.err-tip'),
    $passwordTip = $passwordInput.siblings('.err-tip'),
    $captchaImgTip = $captchaImgInput.siblings('.err-tip'),
    $captchaSmsTip = $captchaSmsInput.siblings('.err-tip'),
    $capsLock = $('#caps-lock');

var mailPhoneRegx = require('../common/mail-phone-regx'), // 邮箱格式验证
    mailAc = require('../common/ac-email'); // 邮箱自动完成

// 图像验证码URL
var CAPTCHA_IMG_URL = '/passport/imagesNode?t='; // /passport/images?t=1454464125

// 记住我符号
var checkboxSymbol = {
    checked: '&#xe612;',
    unchecked: '&#xe613;'
};

// 短信验证码的时间间隔，60s
var second = 60;

// 只能验证一次
var isSmsCheckedSuccess = false;

/** ************************************************************************/
/*                                  桌面登录类型设置                            */
/** ************************************************************************/
var accountChangeLoginTypeEvent = $.Callbacks(); //eslint-disable-line
var currentLogin = null;
var $switchLoginType = $('.switch');
var AccountLoginType = {
    PasswordLogin: {
        ele: '.password-login',
        validateAccountAsync: function() {
            return $.ajax({
                url: '/passport/login/password/checkuser',
                type: 'POST',
                data: {
                    phoneNum: getAccountVal(),
                    area: getAreaCodeVal()
                }
            }).then(function(result) {
                var defer = $.Deferred();            // eslint-disable-line

                if (result.code === 200) {
                    hideAccountTip();                // eslint-disable-line
                    defer.resolve();
                } else {
                    showAccountTip(result.message);  // eslint-disable-line
                    defer.reject();
                }

                return defer.promise();
            });
        },
        validateAccountLocal: validateAccountPasswordLocal,  // eslint-disable-line
        creditableToken: getPasswordVal,
        type: function() {
            return 'password';
        },
        name: 'PasswordLogin',
        validate: prePasswordLoginWithValidate       // eslint-disable-line
    },
    SMSLogin: {
        ele: '.sms-login',
        validateAccountAsync: function() {
            return $.ajax({
                url: '/passport/login/sms/checkuser',
                type: 'POST',
                data: {
                    mobile: getAccountVal(),
                    area: getAreaCodeVal()
                }
            }).then(function(result) {
                var defer = $.Deferred();            // eslint-disable-line

                if (result.code === 200) {
                    hideAccountTip();                // eslint-disable-line
                    defer.resolve();
                } else {
                    showAccountTip(result.message);  // eslint-disable-line
                    defer.reject();
                }

                return defer.promise();
            });
        },
        validateAccountLocal: validateAccountSmsLocal,   // eslint-disable-line
        creditableToken: getCaptchaSmsTokenVal,
        type: function() {
            return 'sms';
        },
        name: 'SMSLogin',
        validate: preSmsLoginWithValidate            // eslint-disable-line
    }
};

/** ************************************************************************/
/*                                  设备登录类型                             */
/** ************************************************************************/
var deviceChangeLoginTypeEvent = $.Callbacks(); //eslint-disable-line
var $switchDeviceType = $('#device-bg');
var DeviceLoginType = {
    DesktopLogin: {
        ele: '.desktop-login',
        hide: '.mobile-login',
        dataType: 'MobileLogin',
        tipText: '扫码登录更安全',
        bgClass: 'type-mobile-bg',
        removeClass: 'type-desktop-bg'
    },
    MobileLogin: {
        ele: '.mobile-login',
        hide: '.desktop-login',
        dataType: 'DesktopLogin',
        tipText: '密码登录在这里',
        bgClass: 'type-desktop-bg',
        removeClass: 'type-mobile-bg'
    }
};

var $deviceTips = $('.type-tip');

var desktopShowOnce = $.Callbacks('once'); //eslint-disable-line
var mobileShowOnce = $.Callbacks('once');  //eslint-disable-line

// 切换登录方式
accountChangeLoginTypeEvent.add(function(type) {
    currentLogin = AccountLoginType[type];
});

// 重置状态
accountChangeLoginTypeEvent.add(function() {
    hideAccountTip();                                // eslint-disable-line
    hideCaptchaImgTip();                             // eslint-disable-line
    hideCaptchaSmsTip();                             // eslint-disable-line
    hidePasswordTip();                               // eslint-disable-line

    $accountInput.val('');
    $passwordInput.val('');
    $captchaImgInput.val('');
    $captchaSmsInput.val('');
    $captchaSmsTokenHideInput.val('');
});

// placeholder 变化
accountChangeLoginTypeEvent.add(function(type) {
    if (type === AccountLoginType.SMSLogin.name) {
        $accountInput.attr('placeholder', '手机号码');
    } else {
        $accountInput.attr('placeholder', '邮箱/手机号码');
    }
});

desktopShowOnce.add(function() {
    $deviceTips.removeClass('hide');
});

mobileShowOnce.add(function() {
    $deviceTips.removeClass('hide');
});

/** ************************************************************************/
/*                                  加载自定义库                            */
/** ************************************************************************/

require('../../simple-header');
require('yoho-jquery-placeholder');
require('../../common');// yas
require('yoho-jquery-qrcode');

/** ************************************************************************/
/*                                  错误提示框                              */
/** ************************************************************************/

function errTipShow($tip, $input, msg) {
    $tip.removeClass('hide').children('em').empty().html(msg);
    $input.addClass('error');
}

function errTipHide($tip, $input) {
    $tip.addClass('hide');
    $input.removeClass('error');
}

/** ************************************************************************/
// 帐号
function showAccountTip(msg) {
    return errTipShow($accountTip, $accountInput, msg);
}

function hideAccountTip() {
    return errTipHide($accountTip, $accountInput);
}

/** ************************************************************************/
// 密码
function showPasswordTip(msg) {
    return errTipShow($passwordTip, $passwordInput, msg);
}

function hidePasswordTip() {
    return errTipHide($passwordTip, $passwordInput);
}

/** ************************************************************************/
// 图形验证码
function showCaptchaImgTip(msg) {
    return errTipShow($captchaImgTip, $captchaImgInput, msg);
}

function hideCaptchaImgTip() {
    return errTipHide($captchaImgTip, $captchaImgInput);
}

/** ************************************************************************/
// 短信验证码
function showCaptchaSmsTip(msg) {
    return errTipShow($captchaSmsTip, $captchaSmsInput, msg);
}

function hideCaptchaSmsTip() {
    return errTipHide($captchaSmsTip, $captchaSmsInput);
}

/** ************************************************************************/
/*                                  用户帐号验证                            */
/** ************************************************************************/

// 本地验证用户输入格式
function validateAccountPasswordLocal() {
    var account = getAccountVal(),
        err;

    var defer = $.Deferred(); // eslint-disable-line

    if (account !== '') {
        if (/^[0-9]+$/.test(account)) {
            defer.resolve();
        } else {
            if (mailPhoneRegx.emailRegx.test(account)) {
                defer.resolve();
            } else {
                defer.reject();
                err = '邮箱格式不正确，请重新输入';
            }
        }
    } else {
        err = '请输入账户名';
    }

    if (defer.state() === 'resolved') {
        hideAccountTip();
    } else {
        showAccountTip(err);
    }
    return defer.promise();
}

// 本地验证
function validateAccountSmsLocal() {
    var account = getAccountVal(),
        err;

    var defer = $.Deferred(); // eslint-disable-line

    if (account !== '') {
        if (/^[0-9]+$/.test(account)) {
            defer.resolve();
        } else {
            defer.reject();
            err = '手机号码不正确，请重新输入';
        }
    } else {
        err = '请输入手机号';
    }

    if (defer.state() === 'resolved') {
        hideAccountTip();
    } else {
        showAccountTip(err);
    }
    return defer.promise();
}


// 本地验证和网络验证
function validateAccount() {
    return currentLogin.validateAccountLocal()
        .then(currentLogin.validateAccountAsync)
        .then(hideAccountTip);
}


/** ************************************************************************/
/*                                  密码验证                                */
/** ************************************************************************/

// 本地验证密码格式
function validatePasswordLocal() {
    var password = getPasswordVal(),
        err;

    var defer = $.Deferred(); // eslint-disable-line

    if (password !== '') {
        if (password.length < 6) {
            err = '请输入长度为6-20字符的密码';
            defer.reject();
        } else {
            defer.resolve();
        }
    } else {
        err = '请输入密码';
        defer.reject();
    }

    if (defer.state() === 'resolved') {
        hidePasswordTip();
    } else {
        showPasswordTip(err);
    }
    return defer.promise();
}

/** ************************************************************************/
/*                                  图形验证码                              */
/** ************************************************************************/

// 本地验证图形验证码格式
function validateCaptchaImgLocal() {
    var captcha = getCaptchaImgVal(),
        err;

    var defer = $.Deferred(); // eslint-disable-line

    if (captcha !== '') {
        if (captcha.length !== 4) {
            err = '请输入长度为4字符的验证码';
            defer.reject();
        } else {
            defer.resolve();
        }
    } else {
        err = '请输入验证码';
        defer.reject();
    }

    if (defer.state() === 'resolved') {
        hideCaptchaImgTip();
    } else {
        showCaptchaImgTip(err);
    }

    return defer.promise();
}

// 网络验证图形验证码格式
function validateCaptchaImgAsync() {
    return $.ajax({
        url: '/passport/captcha/img',
        type: 'POST',
        data: {
            verifyCode: getCaptchaImgVal()
        }
    }).then(function(result) {
        var defer = $.Deferred(); // eslint-disable-line

        if (result.code === 200) {
            hideCaptchaImgTip();
            defer.resolve();
        } else {
            defer.reject();
            showCaptchaImgTip('验证码不正确');
        }

        return defer.promise();
    });
}

// 本地和网络验证图形验证码
function validateCaptchaImg() {
    // 验证码不可见的时候验证通过
    if ($captchaImgWrapper.is(':hidden')) {
        return $.Deferred().resolve().promise(); //eslint-disable-line
    }

    return validateCaptchaImgLocal().then(function() {
        return validateCaptchaImgAsync();
    }).then(function() {
        hideCaptchaImgTip();
        return null;
    });
}

/** ************************************************************************/
/*                                  短信验证码                              */
/** ************************************************************************/

// 本地验证短信验证码格式
function validateCaptchaSmsLocal() {
    var captcha = getCaptchaSmsVal(),
        err;

    var defer = $.Deferred(); // eslint-disable-line

    if (captcha !== '') {
        if (captcha.length !== 4) {
            err = '请输入长度为4字符的验证码';
            defer.reject();
        } else {
            defer.resolve();
        }
    } else {
        err = '请输入短信验证码';
        defer.reject();
    }

    if (defer.state() === 'resolved') {
        hideCaptchaSmsTip();
    } else {
        showCaptchaSmsTip(err);
    }

    return defer.promise();
}

// 网络验证短信验证码
// Note: 这里的验证码只能成功验证一次，十分钟内有效
function validateCaptchaSmsAsync() {
    var smsToken = getCaptchaSmsTokenVal();

    if (isSmsCheckedSuccess && smsToken !== '') {
        return $.Deferred().resolve().promise(); // eslint-disable-line
    }

    return $.ajax({
        url: '/passport/login/sms/auth',
        type: 'POST',
        data: {
            area: getAreaCodeVal(),
            mobile: getAccountVal(),
            code: getCaptchaSmsVal()
        }
    }).then(function(result) {
        var defer = $.Deferred(); // eslint-disable-line

        if (result.code === 200) {
            hideCaptchaSmsTip();
            $captchaSmsTokenHideInput.val(result.token);
            isSmsCheckedSuccess = true;
            defer.resolve();
        } else {
            showCaptchaSmsTip('验证码不正确');
            $captchaSmsTokenHideInput.val('');
            defer.reject();
        }

        return defer.promise();
    });
}

// 本地和网络验证短信验证码
function validateCaptchaSms() {
    return validateCaptchaSmsLocal()
        .then(validateCaptchaSmsAsync)
        .then(hideCaptchaSmsTip);
}

/** ************************************************************************/
/*                                  全部验证过程                             */
/** ************************************************************************/

// 密码验证过程
function validateWithPasswordMode() {
    return validateAccount()
        .then(validatePasswordLocal)
        .then(validateCaptchaImg);
}

// 短信验证过程
function validateWithSmsMode() {
    return validateAccount()
        .then(validateCaptchaSms)
        .then(validateCaptchaImg);
}

/** ************************************************************************/
/*                                  登录之前验证                             */
/** ************************************************************************/

// password登录之前验证
function prePasswordLoginWithValidate() {
    return (function() {
        var account = getAccountVal(),
            password = getPasswordVal();

        var defer = $.Deferred(); // eslint-disable-line

        if (account === '') {
            showAccountTip('请输入账户名');
            defer.reject();
        }

        if (password === '') {
            showPasswordTip('请输入密码');
            defer.reject();
        }

        if (account === '' && password === '') {
            // 账户名和密码都为空的情况下点击登陆，只在账户输入框后显示错误提示
            showAccountTip('请输入账户名和密码');

            $passwordTip.addClass('hide');
            $passwordInput.addClass('error');
            defer.reject();
        }

        return defer.resolve().promise();
    }()).then(validateWithPasswordMode);
}

// sms登录之前验证
function preSmsLoginWithValidate() {
    return (function() {
        var account = getAccountVal(),
            password = getCaptchaSmsVal();

        var defer = $.Deferred(); // eslint-disable-line

        if (account === '') {
            showAccountTip('请输入手机号');
            defer.reject();
        }

        if (password === '') {
            showCaptchaSmsTip('请输入短信验证码');
            defer.reject();
        }

        if (password === '' && account === '') {
            // 账户名和密码都为空的情况下点击登陆，只在账户输入框后显示错误提示
            showAccountTip('请输入手机号和短信验证码');

            $captchaSmsTip.addClass('hide');
            $captchaSmsInput.addClass('error');
            defer.reject();
        }

        return defer.resolve().promise();
    }()).then(validateWithSmsMode);
}

/** ************************************************************************/
/*                                  帮助函数                                */
/** ************************************************************************/

// 密码错误次数，超过三次显示验证码
function vaAccountErrTimes() {
    $captchaImgPic.attr('src', CAPTCHA_IMG_URL + $.now());
    $captchaImgInput.val('');
    $captchaImgWrapper.removeClass('hide');
}

// 短信验证码重新发送
function switchSmsBtnState() {
    second -= 1;
    if (second < 0) {
        second = 60;
        $captchaSmsBtn.text('获取短信验证码').removeClass('second-progress').removeClass('disable');
    } else {
        $captchaSmsBtn.addClass('second-progress').text(second + '秒后可重新操作').addClass('disable');
        window.setTimeout(switchSmsBtnState, 1000);
    }
}

// 发送短信验证码
function sendCaptchaSmsAsync() {
    return $.ajax({
        type: 'POST',
        url: '/passport/login/sms/send',
        data: {
            area: getAreaCodeVal(),
            mobile: getAccountVal()
        }
    });
}

// 检查验证次数
function checkUserAuthCountAsync() {
    return $.ajax({
        url: '/passport/login/account',
        type: 'GET',
        data: {
            account: getAccountVal()
        }
    }).then(function(res) {
        if (res.data && res.data.needCaptcha) {
            vaAccountErrTimes();
        }
    });
}

/** ************************************************************************/
/*                                  登录函数                                */
/** ************************************************************************/

// 登录
function login() {
    return currentLogin.validate().then(function() {
        return $.ajax({
            url: '/passport/login/auth',
            type: 'POST',
            data: {
                areaCode: getAreaCodeVal(),
                account: getAccountVal(),
                password: currentLogin.creditableToken(),
                captcha: getCaptchaImgVal(),
                isRemember: getRememberMeVal(),
                loginType: currentLogin.type()
            }
        });
    }).then(function(res) {

        if (res.code === 200) {
            if (res.data) {
                location.href = res.data.session;
            }
        } else {
            if (res.data.errorType === 'captcha') {
                $captchaImgTip.removeClass('hide').children('em').html(res.message);
                $captchaImgInput.addClass('error').val('');
            } else {
                if (currentLogin.type() === 'password') {
                    showPasswordTip(res.message);
                    $passwordInput.addClass('error').val('');
                } else {
                    showCaptchaSmsTip('短信验证码错误');
                    $captchaSmsInput.addClass('error').val('');
                }
            }

            // 验证错误次数
            if (res.data && res.data.needCaptcha) {
                vaAccountErrTimes();
            }
        }
    });
}

/** ************************************************************************/
/*                                  事件绑定                                */
/** ************************************************************************/

$('[placeholder]').placeholder(); // ie8 兼容 placeholder

// 展开地区列表
$('#country-code').on('click', function() {
    if ($countryList.css('display') === 'none') {
        $countryList.slideDown();
    }
});

// 选中地区列表项
$countryList.on('click', 'li', function() {
    var $this = $(this),
        cc = $this.data('cc');

    $countryCodeHeader.html($this.html());
    $countryCodeInput.val(cc);
    $countryList.slideUp();
});

// 点击其他区域，收起区域列表
$(document).on('click', function(e) {
    if ($(e.target).closest('#country-code').length > 0) {
        return;
    }

    if ($countryList.css('display') === 'block') {
        $countryList.slideUp();
    }
});

/** ************************************************************************/

    // 邮箱自动完成后失去焦点：1. 本地验证格式；2.服务器检查用户是否注册；3.检查验证用户次数
mailAc($accountInput, function() {
    return currentLogin.validateAccountLocal().then(function() {
        return currentLogin.validateAccountAsync().always(checkUserAuthCountAsync);
    });
});

// 密码输入框事件
$passwordInput.on('blur', function() {
    validatePasswordLocal();

    if ($capsLock.hasClass('hide')) {
        return;
    }

    $capsLock.addClass('hide');
}).on('keypress', function(e) {
    var code = e.which;

    // CapsLock检测
    if (code >= 65 && code <= 90) {
        $capsLock.removeClass('hide');
        return;
    }
    $capsLock.addClass('hide');
});

// 图像验证码输入框事件
$captchaImgInput.on('blur', function() {
    validateCaptchaImg();
});

// sms验证码输入框事件
$captchaSmsInput.on('blur', function() {
    validateCaptchaSms();
});

// 短信验证码发送按钮
$captchaSmsBtn.on('click', function() {
    // 已在发送短信时间范围内
    if ($captchaSmsBtn.hasClass('second-progress')) {
        return;
    }

    validateAccount().then(function() {
        switchSmsBtnState();
        return sendCaptchaSmsAsync();
    });
});

// 记住登录状态
$rememberMe.on('click', function() {
    var $this = $(this);

    $this.toggleClass('checked');

    if ($this.hasClass('checked')) {
        $this.children('i').html(checkboxSymbol.checked);
    } else {
        $this.children('i').html(checkboxSymbol.unchecked);
    }
});

// focus到输入框则隐藏错误提示和样式
$('.va').on('focus', function() {
    var $this = $(this);

    $this.removeClass('error');
    $this.siblings('.err-tip').addClass('hide');
});

// 验证码刷新
$captchaImgWrapper.on('click', '.change-captcha, .captcha-img', function() {
    $captchaImgPic.attr('src', CAPTCHA_IMG_URL + $.now());
});

// 切换登录模式：密码登录和短信登录
$switchLoginType.on('click', 'div', function() {
    var $this = $(this),
        type = $this.data('type');

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

    accountChangeLoginTypeEvent.fire(type);

    $this.addClass('selected');
    $this.siblings().removeClass('selected');

    $(AccountLoginType[type].ele).removeClass('hide').siblings('.login').addClass('hide');
});

// 切换登录模式：帐号登录和二维码登录
$switchDeviceType.on('click', function() {
    var $this = $(this),
        $parent = $this.parent(),
        type = $parent.data('type');

    $deviceTips.addClass('hide');

    $(DeviceLoginType[type].ele).removeClass('hide');
    $(DeviceLoginType[type].hide).addClass('hide');
    $parent.data('type', DeviceLoginType[type].dataType);
    $this.removeClass(DeviceLoginType[type].removeClass)
        .addClass(DeviceLoginType[type].bgClass);
    $parent.find('#device-tip').html(DeviceLoginType[type].tipText);

    if (type === 'DesktopLogin') {
        desktopShowOnce.fire();
    } else {
        mobileShowOnce.fire();
    }
});

$qrCodeContainer.on('mouseenter', function() {
    console.log('enter');
}).on('mouseleave', function() {
    console.log('leave');
});

/** ************************************************************************/
/*                                  登录                                   */
/** ************************************************************************/

    // click登录
$('#login-btn').on('click', login);

// enter登录
$('input.va').on('keypress', function(e) {
    if (e.which === 13) {
        login();
    }
});

/** ************************************************************************/
/*                                  初始化                                 */
/** ************************************************************************/

    // 初始化为密码登录
accountChangeLoginTypeEvent.fire('PasswordLogin');

// 只带账户名的页面，密码输入获得焦点
if (($accountInput.val() !== '' || $accountInput.val() === $accountInput.attr('placeholder')) &&
    $passwordInput.val() === '') {
    $passwordInput.focus();
}

/** ************************************************************************/
/*                                  结束                                   */
/** ************************************************************************/

$('.qrcode').qrcode({
    render: 'table',
    size: 150,
    text: getQrCodeVal()
});

$switchDeviceType.triggerHandler('click');