/*!
 * Ext JS Library 3.0+
 * Copyright(c) 2006-2009 Ext JS, LLC
 * licensing@extjs.com
 * http://www.extjs.com/license
 */
Ext.onReady(function(){
    var win;
    var win2;
    nhtml='<script type="text/javascript" src="http://www.mortgagecalculator.net/embeddable/calc.js"></script><iframe src ="http://www.mortgagecalculator.net/embeddable/?id=8" width="100%" frameborder=0 scrolling=no height=260></iframe>';
    var button = Ext.get('show-btn');
		var button2 = Ext.get('calc-btn');
   //Ext.QuickTips.init();

    // turn on validation errors beside the field globally
    //Ext.form.Field.prototype.msgTarget = 'side';

Ext.namespace('Ext.exampledata');

Ext.exampledata.howhear = [
        ['Salesperson', 'Salesperson'],
        ['Builder', 'Builder / Contractor'],
        ['Magazine', 'Magazine'],
        ['Internet', 'Internet'],
        ['Radio', 'Radio Commercial'],
        ['TV', 'TV Commercial'],
        ['Billboard', 'Billboard'],
        ['Yellowpages', 'Yellowpages'],
        ['Friend', 'Friend'],
        ['Other', 'Other']
    ];

Ext.exampledata.subject = [
        ['General', 'General Inquiry'],
        ['Insulation', 'New Construction'],
        ['Gutters', 'Communities'],
        ['Website Related', 'Website Related']
    ];   

    var storeHH = new Ext.data.SimpleStore({
        fields: ['id', 'name'],
        data : Ext.exampledata.howhear
    });

    var storeSUB = new Ext.data.SimpleStore({
        fields: ['id', 'name'],
        data : Ext.exampledata.subject
    });
    
    var comboHH = new Ext.form.ComboBox({
        store: storeHH,
        displayField:'name',
        name: 'howhear',
   			fieldLabel: 'How did you hear about us',
        typeAhead: true,
        mode: 'local',
        triggerAction: 'all',
        emptyText:'Select an option...',
        selectOnFocus:true,
        allowBlank:false
    });   

    var comboSUB = new Ext.form.ComboBox({
        store: storeSUB,
        displayField:'name',
        name: 'subject',
   			fieldLabel: 'Subject',
        typeAhead: true,
        mode: 'local',
        triggerAction: 'all',
        emptyText:'Select an option...',
        selectOnFocus:true,
        allowBlank:false
    });
  
    var simple = new Ext.FormPanel({
        labelWidth: 100, // label settings here cascade unless overridden
        url:'aj-contactus.php',
        frame:true,
        title: ' ',
        bodyStyle:'padding:5px 5px 0',
        width: '400',
        defaults: {width: 200},
        defaultType: 'textfield',

        items: [{
                fieldLabel: 'First Name',
                name: 'first',
                allowBlank:false
            },{
                fieldLabel: 'Last Name',
                name: 'last',
                allowBlank:false
            },{
                fieldLabel: 'Phone Number',
                name: 'phone',
                emptyText: '(888) 555-1212',
                allowBlank:false
            }, {
                fieldLabel: 'Email',
                name: 'email',
                vtype:'email'
            }, comboSUB,{
            xtype:'textarea',
            id:'message',
            fieldLabel:'Message',
            height:200
        		}
        ]
    });

    var mortcalc = new Ext.FormPanel({
        labelWidth: 130, // label settings here cascade unless overridden
        url:'aj-mortcalc.php',
        frame:true,
        title: ' ',
        bodyStyle:'padding:5px 5px 0',
        width: '360',
        defaults: {width: 200},
        defaultType: 'textfield',

        items: [{
        					fieldLabel: 'Mortgage amount',
                	name: 'mamt',
                	width: '100px',
                	allowBlank:false
        			},{
        					fieldLabel: 'Yearly interest rate',
                	name: 'interest',
                	width: '100px',
                	allowBlank:false
        			},{
        					fieldLabel: 'Term (in years)',
                	name: 'term',
                	width: '100px',
                	allowBlank:false
        			},{xtype:'fieldset',
			            title: '',
			            collapsible: false,
			            autoHeight:true,
			            autoWidth:true,
			            defaultType: 'textfield',
			            items :[{
						        					fieldLabel: 'Monthly payment',
						                	name: 'mpayment',
						                	width: '100px',
						                	allowBlank:false
						        			},{
						        					fieldLabel: 'Total payment',
						                	name: 'tpayment',
						                	width: '100px',
						                	allowBlank:false
						        			}
			            ]
					     }]
        
    });
    
    button.on('click', function(){
        // create the window on the first click and reuse on subsequent clicks
        if(!win){
            win = new Ext.Window({
            	  title: 'Contact Us',
            	  modal: true,
                layout:'fit',
                width:500,
                height:450,
                closeAction:'hide',
                plain: true,
                items: [simple],
                buttons: [{
					text: 'Send Message',
					handler: function(){
						if(simple.getForm().isValid()){
							simple.getForm().submit({
								waitMsg: 'Sending Request...',
								success: function(form, action){
									Ext.MessageBox.alert('Successful', action.result.msg);
									simple.getForm().reset();
									win.hide();
								},
								failure: function(form, action){	
									Ext.MessageBox.alert('Error Message', action.result.msg); 
								}
							});
						}else{
							Ext.MessageBox.alert('Errors', 'Please fill in the required fields');
						}
					}			
				},{
                    text: 'Close',
                    handler: function(){
                        win.hide();
                    }
                }]
            });
        }
        win.show(this);
    });
    
    //Calc BUtton Show
    button2.on('click', function(){
        // create the window on the first click and reuse on subsequent clicks
        if(!win2){
            win2 = new Ext.Window({
            	  title: 'Mortgage Calulator',
            	  modal: true,
                layout:'fit',
                width:585,
                height:330,
                closeAction:'hide',
                plain: true,
 								html: nhtml,
                buttons: [{
                    text: 'Close',
                    handler: function(){
                        win2.hide();
                    }
                }]

            });
        }
        win2.show(this);
    });
    
});