/*
 * 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)'	
});

var fp = null;

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);

    fp = new Ext.FormPanel({
        labelAlign: 'bottom',
		url: 'http://www.groenewelle.nl/formaction.php',
        frame: false,
		border: false,
		labelWidth: 155,
		defaults: { 
			width: 300
		},
        items: [{
			xtype:'textfield',
			fieldLabel: 'Voornaam *',
			name: 'Voornaam',
			blankText: '- Het veld Voornaam is niet correct ingevuld',
			msgTarget: 'error-panel1',
			allowBlank:false
        },{
			xtype:'textfield',
			fieldLabel: 'Tussenvoegsel',
			name: 'Tussenvoegsel'
		},{
			xtype:'textfield',
			fieldLabel: 'Achternaam *',
			name: 'Achternaam',
			blankText: '- Het veld Achternaam is niet correct ingevuld',
			msgTarget: 'error-panel2',
			//vtype: 'telefoon',
			allowBlank: false
		},{
			xtype:'textfield',
			fieldLabel: 'Straat',
			name: 'Straat'
		},{
			xtype:'textfield',
			fieldLabel: 'Huisnummer',
			name: 'Huisnummer'
		},{
			xtype:'textfield',
			fieldLabel: 'Postcode',
			name: 'Postcode'
		},{
			xtype:'textfield',
			fieldLabel: 'Plaats',
			name: 'Plaats'
		},{
			xtype:'textfield',
			fieldLabel: 'E-mailadres *',
			name: 'E-mailadres',
			vtype:'email',
			blankText: '- Het veld E-mailadres is niet correct ingevuld',
			msgTarget: 'error-panel3',
			allowBlank: false
        },{
			xtype:'textfield',
			fieldLabel: 'Onderwerp',
			name: 'Onderwerp'
		},{
			xtype:'textarea',
			fieldLabel: 'Uw vraag',
			name: 'Uw_vraag'
		},{
			border: false,
			labelSeparator: '',
			style: 'font-size: 12px; color: #656262; margin: 20px 0 0 160px;',
			html: '<div>Velden met een <span style="color: #13aa66;">*</span> gemarkeerd zijn verplicht.</div>'
		}]
    });
	
	fp.render('formulier');
});

function verstuur() {
	var form = fp.getForm();
	if (form.isValid()) {
		form.submit({
			success:function() {
			    Ext.get('formBox').setVisibilityMode(Ext.Element.DISPLAY).hide(true);
			    Ext.get('bedankt').show();
			},
			failure: function() {
				alert('Er is iets mis gegaan bij het verzenden van het formulier.');
			}
		});
	} else {
		alert('Het formulier is niet correct ingevuld.');
	}
}