Ext.ns('Login');

Login.LogoPanel = function(config) {
    var defaults = {
        columnWidth:.50,
        height: 167,
        bodyStyle: 'padding: 0',
        contentEl: 'logo'
    };
 
    var cfg = Ext.apply({}, config, defaults);
    var cmp = new Ext.Panel(cfg);
 
    return cmp;
}

Login.FormPanel = function(config) {
    var txfLogin = new  Ext.form.TextField({
        id: 'login',
        name: 'login',
        fieldLabel: 'Usuário',
        allowBlank: false,
        width: 120
    });

    var txfPassword = new  Ext.form.TextField({
        id: 'password',
        name: 'password',
        fieldLabel: 'Senha',
        inputType: 'password',
        allowBlank: false,
        width: 120
    });
	
    var defaults = {
        columnWidth:.50,
        labelWidth: 50,
        url: '/camaranet/login/',
        autoHeight: true,
        border: false,
        baseCls: 'x-plain',
        bodyStyle: 'padding: 45px 0 0 28px;',
        defaultType: 'textfield',
        monitorValid: true,
        items: [
            txfLogin,
            txfPassword
        ],
        buttonAlign: 'center',
        buttons:[{
            text:'Login',
            formBind: true,
            handler: submitForm
        }]
    };
		
    var cfg = Ext.apply({}, config, defaults);
    var cmp = new Ext.FormPanel(cfg);
	
    function submitForm() {
        cmp.getForm().submit({
            method: 'POST',
            waitTitle: 'Conectando',
            waitMsg: 'Enviando dados...',
            success: function() {
                window.location = '/camaranet/';
            },
            failure: function(form, action) {
                if(action.failureType == 'server' || action.failureType == null) {
                    var resposta = Ext.util.JSON.decode(action.response.responseText);
                    Util.ErrorMessageBox(resposta.reason);
                }
                else if (action.failureType == 'client') {
                    Util.ErrorMessageBox('Falha no login!<br/>Forneça os dados corretamente.');
                }
                cmp.getForm().reset();
            }
        });    
    } 		
		
    cmp.getComponent('password').on('specialkey', function(form, event) {
        if(event.getKey() == 13) {
            submitForm();
        }
    });
	
    // return the created component
    return cmp;
}		

Login.LoginWindow = function(config) {
    // pre-instantiation code
    var defaults = {
        title: 'Login',
        layout: 'column',
        bodyStyle: 'padding: 0 1 1 0',
        iconCls: 'login-icon',
        width: 500,
        height: 200,
        closable: false,
        resizable: false,
        draggable: false,
        plain: true
    };
 
    // create config object
    var cfg = Ext.apply({}, config, defaults);
 
    // instantiate
    var cmp = new Ext.Window(cfg);
 
    // post-instantiation code
 
    // return the created component
    return cmp;
}

Ext.onReady(function(){

    setTimeout(function(){
        Ext.get('loading').remove();
        Ext.get('loading-mask').fadeOut({
            remove:true
        });
    }, 250);
	
    Ext.QuickTips.init();
    Ext.form.Field.prototype.msgTarget = 'side';      
	
    var logoPanel = new Login.LogoPanel();
    var formPanel = new Login.FormPanel();
    var window = new Login.LoginWindow({
        items:[logoPanel, formPanel]
    });

    window.show();
		
});