Ext.onReady(function(){

    Ext.QuickTips.init();

	var problemas = function(){
		Ext.MessageBox.alert('Alerta', 'Problemas de conunicación');
	}

	var guardar = function(){
		if (forma.form.isValid()) {
			forma.form.submit({
				waitTitle: "Grabando",
				waitMsg : "Esperame un poco...",
				failure: problemas,
				success: function(sender, action) {
				    Ext.MessageBox.alert('Alerta', 'Información guardada ^_^');
				}
			});
		} else {
			Ext.MessageBox.alert('Alerta', 'La informacion ingresada no es válida!');
		}
	}

	//Esto es un container que crea por debajo un BasicForm y lo mete como contenido.
    var forma = new Ext.FormPanel({
        frame:true,
	labelWidth: 120, 
//        title: 'Configuración básica',
        width: 350,
        defaultType: 'textfield',
	url : "config/set",
	defaults: {width: "200px", allowBlank: false,},  //<-- para no poner la wea acada rato en los items..
	items: [{
		fieldLabel: 'Cliente',
		name: 'cliente[descripcion]',
		blankText: "Nombre descriptivo del cliente",
            }, {
		fieldLabel: 'Nombre cuenta',
		name: 'cliente[nombre]',
//		minLength:3, 
//		maxLength:20,
		blankText: "Cuenta asociadad el cliente (minusculas, sin espacios ni cosas raras)"
            }, {
		fieldLabel: 'Puerto asignado',
		name: 'swat[puerto_inicial]',
		blankText: "Puerto asignado (cada cliente tiene uno unico)"
            }, {
                fieldLabel: 'Carga esperada',
                name: 'servidores',
		blankText: "Cantidad de servidores en pararelo"
            },
        ],
    });


	var cargarValores = function() {

		//forma.getForm().setValues( [ { id: 'servidores', value: '123'} ] );

		Ext.Ajax.request({
		   url: 'config/get',
		   success: function(resp, opts){
				console.log(resp, opts);  //<-- muestramelos!!!
				var respuesta = resp.responseText;
				forma.getForm().setValues( [ respuesta ] );
				
			},
		   failure: problemas,
		   headers: {
		       'my-header': 'foo'
		   },
		   params: { foo: 'bar' }
		});

	}
	var configVentana = {
		title: 'Editando la configuracion de ',
		width: 500,
		height:300,
		minWidth: 300,
		minHeight: 200,
		layout: 'fit',
		plain:true,
		buttonAlign:'center',
		items: forma,
			buttons: [{
			text: 'Guardar',
			type:  'submit',
		//	disabled: true,
			handler: guardar
		},{
			text: "Recargar",
			handler: cargarValores
		}]
	}

	var window = new Ext.Window(configVentana);
	window.show();

	

    
});