import Component from '@ember/component';
import $ from 'jquery';

export default Component.extend({
    classNames: ['container-fluid'],
    errors: {},
    model: {
        rememberMe: false
    },
    constraints: {
        loginId: {
            presence: true,
            length: {
                minimum: 1,
                maximum: 36
            }
        },
        password: {
            presence: true,
            length: {
                minimum: 4
            }
        }
    },
    didInsertElement() {
        let me = this;
        me._super(...arguments);
        $('body').removeClass().addClass('login-layout blur-login');
    },
    willDestroy() {
        $('body').removeClass('login-layout blur-login').addClass('no-skin');
    },
    actions: {
        login() {
            let me = this;
            me.validate() || me.get('onLogin')(me.get('model'));
        },
        loginIdInsertNewline(loginId) {
            console.info('Login Id Insert Newline', loginId);
            this.send('login');
        },
        loginIdKeyPress(loginId) {
            loginId && this.set('errors.loginId', null);
        },
        passwordInsertNewline(password) {
            // console.info('Password Insert Newline', password);
            this.send('login');
        },
        passwordKeyPress(password) {
            password && this.set('errors.password', null);
        },
    },
    validate() {
        let me = this;
        let vr = validate(me.get('model'), me.get('constraints'));
        vr && me.set('errors', vr);
        return vr;
    }
});