/*global Ext, AJAX_ACTION */

Ext.onReady(function(){

    var f = new Ext.FormPanel({
        title: 'Request a pickup',
        frame: true,
        bodyStyle: 'padding: 20px',
        renderTo: 'pickup-form',
        labelWidth: 120,
        labelAlign: 'right',
        items:[ {fieldLabel: 'Company Name', xtype: 'textfield', width: '70%', name: 'company',
                    allowBlank: false, minLength: 3, msgTarget: 'side'
                },
                {fieldLabel: 'Contact Name', xtype: 'textfield', width: '70%', name: 'name',
                    allowBlank: false, minLength: 3, msgTarget: 'side'
                },
                {fieldLabel: 'Contact Email', xtype: 'textfield', width: '90%', name: 'email',
                    allowBlank: false, minLength: 3, msgTarget: 'side', vtype: 'email'
                },
                {fieldLabel: 'Pickup Address', xtype: 'textarea', width: '70%', name: 'address',
                    allowBlank: false, minLength: 3, msgTarget: 'side'
                },
                {fieldLabel: 'Pickup Postcode', xtype: 'textfield', width: '30%', name: 'postcode',
                    allowBlank: false, minLength: 3, msgTarget: 'side'
                },
                {fieldLabel: 'Your Reference', xtype: 'textfield', width: '90%', name: 'client_ref',
                    allowBlank: false, minLength: 3, msgTarget: 'side'
                },
                {fieldLabel: 'Missc notes', xtype: 'textarea', width: '90%', name: 'notes',
                    allowBlank: true
                },
                {xtype: 'hidden', name: 'action', value: 'sample_collection'}
        ],
        buttonAlign: 'center',
        buttons:[   {text: 'Send Request', handler: function(){
                            if(f.form.isValid()){
								 Ext.MessageBox.wait('sending details');
                                f.form.submit({
                                    url: AJAX_ACTION,
                                    success: function(){
										Ext.MessageBox.hide();
                                        Ext.MessageBox.alert(
                                             'Request sent',
                                             'You request for sample collection has been sent. Please check your email in a few moments.'
                                        );

										 f.form.reset();

                                    },
                                    failure: function(){
										Ext.MessageBox.hide();
										Ext.MessageBox.alert('Problem','There seems to be a problem. Please try again in a few moments');
                                    }

                                });

                            }

                        }
                    }
        ]
    });
    f.form.clearInvalid();
});