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

	var signup_win;
	
    function open_signup_popup(){
		BoxButton = Ext.extend(Ext.BoxComponent, Ext.apply({
		        constructor: Ext.Button
		    }, Ext.Button.prototype)
		);
		Ext.reg('boxbutton', BoxButton);
		
		Ext.override(Ext.BoxComponent, {
		    adjustSize : function(w, h){
		        if(this.autoWidth === true){
		            w = 'auto';
		        }
		        if(this.autoHeight === true){
		            h = 'auto';
		        }
		        return {width : w, height: h};
		    }
		});
		
        // create the window on the first click and reuse on subsequent clicks
        if (signup_win)
        	signup_win.destroy();
        if (login_win)
        	login_win.destroy();
		signup_win = new Ext.Window({
			title: 'Join glocals.com - It\'s FREE and EASY',
			cls: 'signup',
			id: 'login-popup',
			border: false,
			bodyBorder: false,
			bodyStyle: 'padding-left: 13px; padding-right:13px;',
			shadow: false,
			resizable: false,
            width       : 450,
            height      : 378,
            closeAction :'hide',
			layout: 'fit',
			items: [{
				xtype: 'form',
				id: 'signup_form',
			   	bodyStyle:'padding-top:1px',
				cls: 'login-form',
				border: false,
				labelAlign: 'left',
				labelWidth:100,
				bodyBorder: false,
				autoHeight: true,
				defaults: {hideMode: 'offsets'},
				items: [{
			        xtype: 'textfield',
		            fieldLabel: 'First Name',
		            name: 'mem_first',
		            id: 'mem_first',
		            width: 180,
            		allowBlank:false
		        },{
		        	layout:'column',
		        	border: false,
		        	bodyStyle: 'padding-top:1px;padding-bottom:5px;',
		        	items:[{
		        		border:false,
		        		html:'<span style="font-size:15px;">Last Name:</span>',
		        		width:105,
		        		bodyStyle: 'padding-top:3px;'
		        	},{
				        xtype: 'textfield',
			            hideLabel: true,
			            name: 'mem_last',
			            id: 'mem_last',
			            width: 186,
            			allowBlank:false
			   		},{
			   			border:false,
			   			html:'&nbsp;&nbsp;'
			        },{
				        xtype: 'checkbox',
			            hideLabel: true,
			            name: 'mem_last_perms',
			            id: 'mem_last_perms',
		        		width: 18
			   		},{
			   			border:false,
			   			html:'Hide my last name'
		   			}]
		        },{
			        xtype: 'textfield',
			        vtype: 'email',
		            fieldLabel: 'Email',
		            name: 'mem_email',
		            id: 'mem_email',
		            width: 180,
            		allowBlank:false
		        },{
			        xtype: 'textfield',
			        inputType: 'password',
		            fieldLabel: 'Password',
		            name: 'mem_pwd',
		            id: 'mem_pwd',
		            width: 180,
            		allowBlank:false
		        },{
			        xtype: 'textfield',
			        inputType: 'password',
		            fieldLabel: 'Retype Password',
		            name: 'mem_pwd_2',
		            id: 'mem_pwd_2',
		            width: 180,
            		allowBlank:false
		        },{
		        	layout:'column',
		        	border:false,
		        	bodyStyle: 'padding-bottom:3px;',
		        	items:[{
		        		border:false,
		        		html:'<span style="font-size:15px;">Birthday:</span>',
		        		width:105
		        	},{
				   		layout:'form',
				   		border:false,
				   		items:[
					        new Ext.form.ComboBox({
			                	hideLabel: true,
			                	displayField:'label',
						    	valueField:'id',
						    	hiddenName: 'mem_birthday_DD',
						    	hiddenId: 'mem_birth_day_select',
					            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',
				   		items:[
					        new Ext.form.ComboBox({
			                	hideLabel: true,
			                	displayField:'label',
						    	valueField:'id',
						    	hiddenName: 'mem_birthday_MM',
						    	hiddenId: 'mem_birth_month_select',
					            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',
					            width: 55,
						    	forceSelection: true,
						    	store: year_data,
						    	triggerAction:'all',
						    	mode:'local',
            					allowBlank:false
					   		})
					   	]
		        	},{
			   			border:false,
			   			html:'&nbsp;&nbsp;'
			   		},{
				        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',
		        	items: [{
				        xtype: 'boxbutton',
			       		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").getValue() == Ext.getCmp("mem_pwd_2").getValue() && Ext.getCmp("signup_form").getForm().isValid()) {
				 		        Ext.getCmp("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',
			       		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: 320,
			            height: 46
			       }]
			   	},{
		       		border:false,
		       		html:'<div id="signup_bottom_text">Already a member?&nbsp;<a href="javascript:open_login_popup()"><img src="'+g_params["static_media_domain"]+'/public/global/popup/login.png" alt="Login" /></a></div>',
		            width: 416,
		            height: 39
			   	}]
			}]
        });
  		signup_win.show();
    }