Ext.onReady(function(){

    Ext.QuickTips.init();
    
    var cf;
    var contactform;
    
    Ext.get('contact').on('click', function() {
            contactform = Ext.extend(Ext.Window, {
                title: 'Contact Us',
                width: 426,
                height: 263,
                resizable: false,
                layout: 'auto',
                closeAction: 'close',
				modal: true,
                initComponent: function() {
                    this.items = [
                        {
                            id: 'form',
                            xtype: 'form',
                            labelWidth: 75,
                            labelAlign: 'left',
                            layout: 'form',
                            padding: 5,
                            autoHeight: false,
                            width: 414,
                            height: 230,
                            items: [
                                {
                                    xtype: 'textfield',
                                    fieldLabel: 'First Name',
                                    anchor: '100%',
                                    allowBlank: false,
                                    blankText: 'Please enter your first name.',
                                    id: 'firstname'
                                },
                                {
                                    xtype: 'textfield',
                                    fieldLabel: 'Last Name',
                                    anchor: '100%',
                                    allowBlank: false,
                                    blankText: 'Please enter your last name.',
                                    id: 'lastname'
                                },
                                {
                                    xtype: 'textfield',
                                    fieldLabel: 'Email',
                                    anchor: '100%',
                                    allowBlank: false,
                                    vtype: 'email',
                                    blankText: 'Please enter your email addres.',
                                    vtypeText: 'Please enter a valid email address in the form of user@domain.com.',
                                    id: 'email'
                                },
                                {
                                    xtype: 'textarea',
                                    fieldLabel: 'Comments',
                                    allowBlank: false,
                                    blankText: 'Please enter your comments.',
                                    anchor: '100%',
                                    height: 100,
                                    id: 'comments'
                                }
                            ],
                            buttons: [
                            {
                                text: 'Send',
                                handler: function(){
                                    var formObject = Ext.getCmp('form').getForm();
                                    if(formObject.isValid()){
                                        formObject.submit({
                                            method: 'post',
                                            url: '/sendmail',
                                            success: function(form, action){
                                                cf.close()
                                                Ext.Msg.alert('Success', 'Your message has been sent successfully.');
                                            },
                                            failure: function(form, action){
                                                cf.close()
                                                Ext.Msg.alert('Failure', 'There was a problem sending your message.');
                                            }
                                        });
                                        /* cf.close.defer(200, cf); */
                                        /* cf.close(); */
                                    }
                                }
                            },
                            {
                                text: 'Cancel',
                                handler: function(){
                                    cf.close();
                                }
                            }
                            ]
                        }
                        
                    ];
                    contactform.superclass.initComponent.call(this);
                }
            });

        if(!cf || cf.isDestroyed){
            cf = new contactform();
            cf.show();
        } else {
            cf.show();
        }
        
    }, this, {stopEvent: true});    
});