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

Ext.onReady(function(){
		
	Ext.QuickTips.init();
	
	new Ext.FormPanel({
        url: location.href,
        id: 'extjs_signup_form',
        bodyStyle:'padding:5px',
		labelAlign: 'left',
		labelWidth:80,
        border: false,
		autoHeight: true,
		defaults: {hideMode: 'offsets'},
		items: [{
	        xtype: 'textfield',
            fieldLabel: 'First Name',
            name: 'mem_first',
            width: 180,
            allowBlank:false
        },{
        	xtype: 'textfield',
            fieldLabel: 'Last Name',
            name: 'mem_last',
            width: 180,
            allowBlank:false
        },{
        	layout:'column',
        	border: false,
        	bodyStyle: 'padding-top:1px;padding-bottom:5px;',
        	items:[{
	   			border:false,
	   			html:'  ',
	   			width: 85
	        },{
		        xtype: 'checkbox',
	            hideLabel: true,
	            name: 'mem_last_perms',
        		width: 18
	   		},{
	   			border:false,
	   			html:'Hide my last name'
   			}]
        },{
	        xtype: 'textfield',
	        vtype: 'email',
            fieldLabel: 'Email',
            name: 'mem_email',
            width: 180,
            allowBlank:false
        },{
	        xtype: 'textfield',
	        inputType: 'password',
            fieldLabel: 'Password',
            name: 'mem_pwd',
            id: 'mem_pwd_form',
            width: 180,
            allowBlank:false
        },{
	        xtype: 'textfield',
	        inputType: 'password',
            fieldLabel: 'Retype Password',
            name: 'mem_pwd_2',
            id: 'mem_pwd_form_2',
            width: 180,
            allowBlank:false
        },{
        	layout:'column',
        	border:false,
        	bodyStyle: 'padding-bottom:3px;',
        	width:265,
        	items:[{
        		border:false,
        		html:'<span style="font-size:15px;">Birthday:</span>',
        		width:85
        	},{
		   		layout:'form',
		   		border:false,
		   		items:[
			        new Ext.form.ComboBox({
	                	hideLabel: true,
	                	displayField:'label',
				    	valueField:'id',
				    	hiddenName: 'mem_birthday_DD',
				    	hiddenId: 'mem_birth_day_select_form',
			            width: 40,
				    	forceSelection: true,
				    	store: new Ext.data.SimpleStore({
			    	    	fields:['id', 'label'],
			    	    	data: [
			    	    		[1,1],[2,2],[3,3],[4,4],[5,5],[6,6],[7,7],[8,8],[9,9],[10,10],
			    	    		[11,11],[12,12],[13,13],[14,14],[15,15],[16,16],[17,17],[18,18],[19,19],[20,20],
			    	    		[21,21],[22,22],[23,23],[24,24],[25,25],[26,26],[27,27],[28,28],[29,29],[30,30],[31,31]
			    	    	]
						}),
				    	triggerAction:'all',
				    	mode:'local',
            			allowBlank:false
			   		})
			   	]
        	},{
		   		layout:'form',
		   		border:false,
		   		id:'mem_birth_month_combo_form',
		   		items:[
			        new Ext.form.ComboBox({
	                	hideLabel: true,
	                	displayField:'label',
				    	valueField:'id',
				    	hiddenName: 'mem_birthday_MM',
				    	hiddenId: 'mem_birth_month_select_form',
			            width: 75,
				    	forceSelection: true,
				    	store: new Ext.data.SimpleStore({
			    	    	fields:['id', 'label'],
			    	    	data: [
			    	    		[1,'January'],
			    	    		[2,'February'],
			    	    		[3,'March'],
			    	    		[4,'April'],
			    	    		[5,'May'],
			    	    		[6,'June'],
			    	    		[7,'July'],
			    	    		[8,'August'],
			    	    		[9,'September'],
			    	    		[10,'October'],
			    	    		[11,'November'],
			    	    		[12,'December']
			    	    	]
						}),
				    	triggerAction:'all',
				    	mode:'local',
            			allowBlank:false
			   		})
			   	]
        	},{
		   		layout:'form',
		   		border:false,
		   		items:[
			        new Ext.form.ComboBox({
	                	hideLabel: true,
	                	displayField:'label',
				    	valueField:'id',
				    	hiddenName: 'mem_birthday_YYYY',
				    	hiddenId: 'mem_birth_year_select_form',
			            width: 55,
				    	forceSelection: true,
				    	store: year_data,
				    	triggerAction:'all',
				    	mode:'local',
            			allowBlank:false
			   		})
			   	]
        	}]
		},{
        	layout:'column',
        	border: false,
        	bodyStyle: 'padding-top:1px;padding-bottom:5px;',
        	items:[{
	   			border:false,
	   			html:'&nbsp;&nbsp;',
	   			width: 85
	        },{
		        xtype: 'checkbox',
	            hideLabel: true,
	            name: 'mem_birth_year_perms',
	            id: 'mem_birth_year_perms',
	            width: 18
	   		},{
	   			border:false,
	   			html:'Hide my age'
   			}]
		},
	        new Ext.form.ComboBox({
            	fieldLabel: 'Gender',	
            	displayField:'label',
		    	valueField:'id',
		    	hiddenName: 'mem_gender',
		    	hiddenId: 'mem_gender_select',
	            width: 80,
		    	forceSelection: true,
		    	store: new Ext.data.SimpleStore({
	    	    	fields:['id', 'label'],
	    	    	data: [[1,'Male'],[2,'Female']]
				}),
		    	triggerAction:'all',
		    	mode:'local',
            	allowBlank:false
	   		}),
   		{
			layout: 'form',
        	border:false,
        	id: 'signup_column_form',
        	items: [{
		        xtype: 'button',
	       		border:false,
				minWidth: 40,
				icon: g_params["static_media_domain"]+'/public/global/popup/signup.png',
				cls: "signup-btn x-btn-text-icon",
				handler: function() {
					if (Ext.getCmp("mem_pwd_form").getValue() == Ext.getCmp("mem_pwd_form_2").getValue() && Ext.getCmp("extjs_signup_form").getForm().isValid()) {
		 		        Ext.getCmp("extjs_signup_form").getForm().submit({
							url: location.href,
							params: { 
								'login_act': 'register'
							},
				            failure: function(form, action) {
								Ext.MessageBox.show({
				   					title:'Error',
				   					msg: action.result.errors,
									buttons: Ext.MessageBox.OK,
								   width: 364,
								  cls:'feedbackm'
								});
							},
							success: function(form, action) {
								location = g_params["base_domain"]+"/activate_account/";
							}
						}); 
		        	}
			        else {
						Ext.MessageBox.show({
		   					title:'Error',
		   					msg: 'Fill in the missing fields and make sure the passwords match.',
							buttons: Ext.MessageBox.OK,
						   width: 364,
						  cls:'feedbackm'
						});
			        }
		        }
	       }]
   		},{
       		border:false,
       		id: 'signup_text_form',
       		html:'<img src="'+g_params["static_media_domain"]+'/public/global/asterisk.png" alt="*" />&nbsp;By clicking the "Sign Up" button you confirm that you are 23 or older, you agree with our <a href="'+g_params["base_domain"]+'/terms-privacy">terms of use</a>, and you understand that glocals is NOT a dating site.',
            width: 265,
            height: 40
   		}],
        renderTo: 'guest_register_form'
	});
});