/*
 * Ext JS Library 2.1
 * Copyright(c) 2006-2008, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */

Ext.apply(Ext.form.VTypes, {
	postcode: function(v){
		return /^\d{4}\w{2}$/.test(v);
	},
	postcodeMask: /[\d\w]/,
	postcodeText: 'De postcode moet in het formaat 0000XX',
	telefoon: function(v){ return /((^06\s{0,1}[0-9]{8}$)|(^[0-9]{3,4}\s{0,1}[0-9]{6,7}$)|(^\+{1}[0-9]{2}\s{0,1}[0-9]{2,3}\s{0,1}[0-9]{6,7}$))/.test(v); },
	telefoonMask: /[\d\s]/,
	telefoonText: '10-cijferig telefoonnummer in het formaat: kerngetal-nummer (012 3456789)'	
});

Ext.onReady(function(){

    Ext.QuickTips.init();

    // turn on validation errors beside the field globally
    Ext.form.Field.prototype.msgTarget = 'under';
    
    var bouwjaren = [];
    var jaar = (new Date()).getFullYear();
    for (var i=0;i<20;i++) {
    	bouwjaren.push([jaar - i]);
    }
    
    var y = (new Date()).getFullYear() - 18;
    var maxDate = new Date();
    maxDate.setFullYear(y);

    var fp = new Ext.FormPanel({
        labelAlign: 'top',
		//url:'index/aanvraag',
		url: 'formaction.php',
        frame:true,
        //bodyStyle:'padding:5px 5px 0; overflow-y: scroll;',
        //height: 450,
        layout:'column',
        items: [{
			columnWidth:.20,
			//style: 'padding-bottom:6px;',
            layout: 'form',
            items: [{
                xtype:'radio',
                fieldLabel: 'Geslacht *',
                name: 'sexe',
				inputName: 'sexe',
				inputValue: 'M',
				boxLabel: 'man',					
                anchor:'95%'
            }]
		},{
			columnWidth:.26,
			//style: 'padding-bottom:20px;',
            layout: 'form',
            items: [{
                xtype:'radio',
                fieldLabel: '&nbsp;',
				labelSeparator: '',
                name: 'sexe',
				inputName: 'sexe',
				inputValue: 'V',
				boxLabel: 'vrouw',
                anchor:'95%'
            }]
		},{
			columnWidth:.53,
            layout: 'form',
            items: [{
                xtype:'textfield',
                fieldLabel: 'Voornaam',
                name: 'voornaam',
                anchor:'92%'
            }]
        },{
			columnWidth:.22,
            layout: 'form',
            items: [{
                xtype:'textfield',
                fieldLabel: 'Voorletters *',
                name: 'voorletters',
                anchor:'70%',
				allowBlank:false
            }]
        },{
            columnWidth:.24,
            layout: 'form',
            items: [{
                xtype:'textfield',
                fieldLabel: 'Tussenvoegsel',
                name: 'tussenvoegsel',
                anchor:'79%'
            }]
		},{
			columnWidth:.53,
            layout: 'form',
            items: [{
                xtype:'textfield',
                fieldLabel: 'Achternaam *',
                name: 'achternaam',
                anchor:'92%',
				allowBlank: false
            }]
		},{
			columnWidth:.5,
            layout: 'form',
            items: [{
                xtype:'textfield',
                fieldLabel: 'Straatnaam *',
                name: 'straat',
                anchor:'90%',
				allowBlank: false
            }]
		},{
			columnWidth:.25,
            layout: 'form',
            items: [{
                xtype:'numberfield',
                fieldLabel: 'Huisnummer *',
                name: 'huisnummer',
                anchor:'82%',
				allowBlank: false
            }]
		},{
			columnWidth:.23,
            layout: 'form',
            items: [{
                xtype:'textfield',
                fieldLabel: 'Toevoeging',
                name: 'toevoeging',
                anchor:'85%'
            }]
		},{
			columnWidth:.25,
            layout: 'form',
            items: [{
                xtype:'textfield',
                fieldLabel: 'Postcode *',
                name: 'postcode',
                anchor:'82%',
				vtype: 'postcode',
				allowBlank: false
            }]
		},{
			columnWidth:.74,
            layout: 'form',
            items: [{
                xtype:'textfield',
                fieldLabel: 'Woonplaats *',
                name: 'plaats',
                anchor:'94%',
				allowBlank: false
            }]
		},{
			columnWidth:0.5,
            layout: 'form',
            items: [{
                xtype:'textfield',
                fieldLabel: 'E-mailadres *',
                name: 'email',
				vtype:'email',
                anchor:'91%',
				allowBlank: false
            }]
		},{
			columnWidth:0.5,
            layout: 'form',
            items: [{
                xtype:'textfield',
                fieldLabel: 'Telefoonnummer *',
                name: 'telefoon',
                anchor:'89%',
                vtype: 'telefoon',
				allowBlank: false
            }]
		},{
			columnWidth:0.5,
            layout: 'form',
            items: [{
                xtype:'numberfield',
                fieldLabel: 'Bank- of gironummer *',
                name: 'banknummer',
                anchor:'91%',
				allowBlank: false
            }]
		},{
			columnWidth:0.5,
            layout: 'form',
            items: [{
                xtype:'numberfield',
                fieldLabel: 'Bedrag in Euro *',
                name: 'bedrag',
                anchor:'89%',
				allowBlank: false
            }]
		},{
			columnWidth:.50,
            layout: 'form',
            items: [{
                xtype:'combo',
                fieldLabel: 'Hierbij machtig ik Duchenne Parent Project het door mij opgegeven bedrag als volgt van mijn rekening te incasseren',
                name: 'incassowijze',
                anchor:'91%',
				store: new Ext.data.SimpleStore({
			        fields: ['value'],
			        data:  [
						['Maandelijks'],
						['Per kwartaal'],
						['Jaarlijks'],
						['Eenmalig']
					]
			    }),
				valueField: 'value',
				forceSelection: true,
				displayField:'value',
		        typeAhead: true,
		        mode: 'local',
		        triggerAction: 'all',
				allowBlank: false
            }]
        },{
			columnWidth:.50,
			style: 'padding-top:26px;',
            layout: 'form',
            items: [{
                xtype:'combo',
                fieldLabel: 'Betaalmethode',
                name: 'betaalmethode',
                anchor:'89%',
				store: new Ext.data.SimpleStore({
			        //fields: ['value', 'text'],
					fields: ['value'],
			        data:  [
						['Machtiging'],
						['Afschrijving']
					]
			    }),
				valueField: 'value',
				//displayField:'text',
				displayField:'value',
				forceSelection: true,
		        typeAhead: true,
		        mode: 'local',
		        triggerAction: 'all',
				allowBlank: false
            }]
        },{
        	columnWidth:1,
            layout: 'form',
            items: [{
                xtype:'checkbox',
                boxLabel: 'Ik wil graag op het bovenstaande e-mailadres informatie ontvangen over het Duchenne Parent Project en de ontwikkelingen in het onderzoek.',
				labelSeparator: '',
                name: 'informatie_ontvangen',
                anchor:'93%'
            }]
		},{
			columnWidth:1,
            layout: 'form',
            items: [{
                labelSeparator: '',
                html: '<br /> Velden met een * zijn verplicht.<br /><br />U kunt natuurlijk ook uw donatie storten op gironummer 818 818 in Amsterdam t.n.v. het Duchenne Parent Project Amsterdam.',
                anchor:'93%'
            }]
		}],
        buttons: [{
            text: 'Verstuur',
			style: 'padding: 20px 0 0 0;',
            handler: function() {
            	var form = fp.getForm();
            	//var vw = form.findField('voorwaarden');
            	//if (vw.checked) {
	            	if (form.isValid()) {
	            		form.submit({
	            			success:function() {
	            				Ext.get('doneerForm').setVisibilityMode(Ext.Element.DISPLAY).hide(true);
	            				/*var d = Ext.get('brochure_aanvraag_download');
	            				if (d.dom.checked) {
	            					window.open('http://forms.autobytel.nl/seat/pdf/Leon.pdf');
	            				}*/
	            			},
	            			failure: function() {
								alert('Er is iets mis gegaan bij het verzenden van het formulier.');
	            			}
	            		});
	            	} else {
	            		alert('Het formulier is niet correct ingevuld.');
	            	}
            	/*} else {
            		alert('Het formulier is niet correct ingevuld.');
            	}*/
            }
        }]
    });
	
	fp.render('doneerForm');
});