Register form.
Creates a new account.
Issues: not setting the password.
width: 80%;
}
div.glm-reg-login {
- background-color: grey;
+ background-color: white;
border: solid 1px black;
padding: 2rem;
width: 30rem;
position: absolute;
top: 10vh;
- left: 30vw;
+ left: 10vw;
}
div.glm-reg-login h4 {
- color: white;
+ color: black;
+}
+div.glm-reg-register {
+ background-color: white;
+ border: solid 1px black;
+ padding: 2rem;
+ width: 30rem;
+ position: absolute;
+ top: 10vh;
+ left: 10vw;
+}
+div.glm-reg-register div {
+ clear: both;
+}
+div.glm-reg-register input {
+ width: 48% !important;
+ margin-right: 5px;
+ float: left;
}
.reg-class-detail {
/* display: none; */
// },
});
+app.Models.Front.Register = Backbone.Model.extend({
+ defaults: {
+ validEmail: false,
+ name: 'register',
+ email: '',
+ password: '',
+ fname: '',
+ lname: '',
+ org: '',
+ title: '',
+ addr1: '',
+ addr2: '',
+ city: '',
+ state: '',
+ zip: '',
+ country: '',
+ phone: '',
+ fax: '',
+ },
+
+ urlRoot: ajaxUrl + 'glm_action=register',
+
+ validate: function(){
+ // Validation stuff here
+ },
+});
+
app.Models.Front.Request = Backbone.Model.extend({
defaults: {
name: 'request',
render: function(){
// Check to see if there's a login
if ( loginAccount ) {
- jQuery('.glm-reg-account-login').hide();
+ jQuery('#appLogin').hide();
+ jQuery('#register').hide();
this.accountView = new app.Views.Front.Account({ model: loginAccount });
this.$el.append( this.accountView.render().el );
}
'click #appLogin': 'login',
'click #glm-reg-cart-continue': 'continue',
'click #accountLogin': 'loginToAccount',
+ 'click #accountRegister': 'registerNewAccount',
'click #accountLogout': 'logout',
'click #register': 'register',
},
- register: function(){
- // Have to create new view and model for the register
- },
-
continue: function(){
console.log( cart );
// Confirm they are done and goto the next page
}
})
.fail(function(msg){
- console.log('Fail:');
+ console.log('Fail: ' );
+ console.log( msg );
+ });
+ },
+
+ registerNewAccount: function(){
+ this.$email = this.$('.account_email').val().trim();
+ this.$password = this.$('.account_password').val().trim();
+ this.$fname = this.$('.account_fname').val().trim();
+ this.$lname = this.$('.account_lname').val().trim();
+ this.$addr1 = this.$('.account_addr1').val().trim();
+ this.$addr2 = this.$('.account_addr2').val().trim();
+ this.$city = this.$('.account_city').val().trim();
+ this.$state = this.$('.account_state').val().trim();
+ this.$zip = this.$('.account_zip').val().trim();
+ this.$country = this.$('.account_country').val().trim();
+
+ // Send request to backend
+ jQuery.ajax({
+ context: this,
+ url: appAccountUrl,
+ dataType: 'json',
+ data:{
+ option: 'register',
+ email: this.$email,
+ password: this.$password,
+ fname: this.$fname,
+ lname: this.$lname,
+ addr1: this.$addr1,
+ addr2: this.$addr2,
+ city: this.$city,
+ state: this.$state,
+ zip: this.$zip,
+ country: this.$country,
+ }
+ })
+ .done(function(account){
+ console.log('return from ajax for register new');
+ console.log(account);
+ if ( account.id != undefined && account.id !== '' ) {
+ // Account was created.
+ // Now use this account for login.
+ loginAccount = new app.Models.Front.Account({
+ id: account.id,
+ email: account.email,
+ fname: account.fname,
+ lname: account.lname
+ });
+ this.registerModel.destroy();
+ this.registerView.remove();
+ this.render();
+ }
+ })
+ .fail(function(msg){
+ console.log('Fail: ' );
console.log( msg );
});
},
login: function(){
this.loginModel = new app.Models.Front.Login();
- this.loginView = new app.Views.Front.Login({ model: this.loginModel });
+ this.loginView = new app.Views.Front.Login({ model: this.loginModel });
this.$el.append( this.loginView.render().el );
- jQuery('#appLogin').hide();
+ jQuery('#accountHeader').hide();
+ },
+
+ register: function(){
+ this.registerModel = new app.Models.Front.Register();
+ this.registerView = new app.Views.Front.Register({ model: this.registerModel });
+ this.$el.append( this.registerView.render().el );
+ jQuery('#accountHeader').hide();
},
});
template: _.template( jQuery('#eventReg-account-login').html() ),
events: {
- 'click #loginCancel': 'closeLoginForm'
+ 'click #loginCancel': 'closeLoginForm',
+ 'keydown': 'keyAction',
},
initialize: function(){
closeLoginForm: function(){
this.remove();
- jQuery('#appLogin').show();
+ jQuery('#accountHeader').show();
return;
},
render: function(){
this.$el.html( this.template( this.model.toJSON() ) );
+ //jQuery('.login').focus();
return this;
},
+ keyAction: function(e){
+ if ( e.which === 13 ) {
+ console.log( 'Enter key used' );
+ }
+ },
+
});
app.Views.Front.NewRegistrant = Backbone.View.extend({
},
});
+
+app.Views.Front.Register = Backbone.View.extend({
+ tagName: 'div',
+
+ className: 'glm-reg-register',
+
+ template: _.template( jQuery('#register-new-account').html() ),
+
+ events: {
+ 'click #registerCancel': 'closeForm',
+ 'keydown': 'keyAction',
+ },
+
+ initialize: function(){
+ },
+
+ render: function(){
+ this.$el.html( this.template( this.model.toJSON() ) );
+ return this;
+ },
+
+ closeForm: function(){
+ this.remove();
+ jQuery('#accountHeader').show();
+ return;
+ },
+
+ keyAction: function(e){
+ if ( e.which === 13 ) {
+ console.log( 'Enter key used' );
+ } else if ( e.which === 9 ) {
+ console.log( 'Tab key used' );
+ // if they entered email then test for existing email
+ if ( this.model.get( 'validEmail' ) === true ){
+ return;
+ }
+ var email = this.$('.account_email').val().trim();
+ console.log( email );
+ jQuery.ajax({
+ context: this,
+ url: ajaxUrl + '&glm_action=account&option=checkEmail',
+ dataType: 'json',
+ data: 'email=' + email
+ })
+ .done(function(account){
+ if ( account.validEmail !== true ) {
+ alert('Must be a valid email address!');
+ jQuery('.account_email').focus();
+ } else if ( account.id !== undefined && account.email !== undefined ) {
+ alert('There is an account already with that email address.\nPlease use another one!');
+ jQuery('.account_email').val('');
+ jQuery('.account_email').focus();
+ } else {
+ // email is not existing account and valid
+ this.model.set({ validEmail: true });
+ }
+ })
+ .fail(function(msg){
+ console.log('Fail: ' + msg);
+ });
+ }
+ },
+
+});
--- /dev/null
+app.Models.Front.Register = Backbone.Model.extend({
+ defaults: {
+ validEmail: false,
+ name: 'register',
+ email: '',
+ password: '',
+ fname: '',
+ lname: '',
+ org: '',
+ title: '',
+ addr1: '',
+ addr2: '',
+ city: '',
+ state: '',
+ zip: '',
+ country: '',
+ phone: '',
+ fax: '',
+ },
+
+ urlRoot: ajaxUrl + 'glm_action=register',
+
+ validate: function(){
+ // Validation stuff here
+ },
+});
render: function(){
// Check to see if there's a login
if ( loginAccount ) {
- jQuery('.glm-reg-account-login').hide();
+ jQuery('#appLogin').hide();
+ jQuery('#register').hide();
this.accountView = new app.Views.Front.Account({ model: loginAccount });
this.$el.append( this.accountView.render().el );
}
'click #appLogin': 'login',
'click #glm-reg-cart-continue': 'continue',
'click #accountLogin': 'loginToAccount',
+ 'click #accountRegister': 'registerNewAccount',
'click #accountLogout': 'logout',
'click #register': 'register',
},
- register: function(){
- // Have to create new view and model for the register
- },
-
continue: function(){
console.log( cart );
// Confirm they are done and goto the next page
}
})
.fail(function(msg){
- console.log('Fail:');
+ console.log('Fail: ' );
+ console.log( msg );
+ });
+ },
+
+ registerNewAccount: function(){
+ this.$email = this.$('.account_email').val().trim();
+ this.$password = this.$('.account_password').val().trim();
+ this.$fname = this.$('.account_fname').val().trim();
+ this.$lname = this.$('.account_lname').val().trim();
+ this.$addr1 = this.$('.account_addr1').val().trim();
+ this.$addr2 = this.$('.account_addr2').val().trim();
+ this.$city = this.$('.account_city').val().trim();
+ this.$state = this.$('.account_state').val().trim();
+ this.$zip = this.$('.account_zip').val().trim();
+ this.$country = this.$('.account_country').val().trim();
+
+ // Send request to backend
+ jQuery.ajax({
+ context: this,
+ url: appAccountUrl,
+ dataType: 'json',
+ data:{
+ option: 'register',
+ email: this.$email,
+ password: this.$password,
+ fname: this.$fname,
+ lname: this.$lname,
+ addr1: this.$addr1,
+ addr2: this.$addr2,
+ city: this.$city,
+ state: this.$state,
+ zip: this.$zip,
+ country: this.$country,
+ }
+ })
+ .done(function(account){
+ console.log('return from ajax for register new');
+ console.log(account);
+ if ( account.id != undefined && account.id !== '' ) {
+ // Account was created.
+ // Now use this account for login.
+ loginAccount = new app.Models.Front.Account({
+ id: account.id,
+ email: account.email,
+ fname: account.fname,
+ lname: account.lname
+ });
+ this.registerModel.destroy();
+ this.registerView.remove();
+ this.render();
+ }
+ })
+ .fail(function(msg){
+ console.log('Fail: ' );
console.log( msg );
});
},
login: function(){
this.loginModel = new app.Models.Front.Login();
- this.loginView = new app.Views.Front.Login({ model: this.loginModel });
+ this.loginView = new app.Views.Front.Login({ model: this.loginModel });
this.$el.append( this.loginView.render().el );
- jQuery('#appLogin').hide();
+ jQuery('#accountHeader').hide();
+ },
+
+ register: function(){
+ this.registerModel = new app.Models.Front.Register();
+ this.registerView = new app.Views.Front.Register({ model: this.registerModel });
+ this.$el.append( this.registerView.render().el );
+ jQuery('#accountHeader').hide();
},
});
template: _.template( jQuery('#eventReg-account-login').html() ),
events: {
- 'click #loginCancel': 'closeLoginForm'
+ 'click #loginCancel': 'closeLoginForm',
+ 'keydown': 'keyAction',
},
initialize: function(){
closeLoginForm: function(){
this.remove();
- jQuery('#appLogin').show();
+ jQuery('#accountHeader').show();
return;
},
render: function(){
this.$el.html( this.template( this.model.toJSON() ) );
+ //jQuery('.login').focus();
return this;
},
+ keyAction: function(e){
+ if ( e.which === 13 ) {
+ console.log( 'Enter key used' );
+ }
+ },
+
});
--- /dev/null
+app.Views.Front.Register = Backbone.View.extend({
+ tagName: 'div',
+
+ className: 'glm-reg-register',
+
+ template: _.template( jQuery('#register-new-account').html() ),
+
+ events: {
+ 'click #registerCancel': 'closeForm',
+ 'keydown': 'keyAction',
+ },
+
+ initialize: function(){
+ },
+
+ render: function(){
+ this.$el.html( this.template( this.model.toJSON() ) );
+ return this;
+ },
+
+ closeForm: function(){
+ this.remove();
+ jQuery('#accountHeader').show();
+ return;
+ },
+
+ keyAction: function(e){
+ if ( e.which === 13 ) {
+ console.log( 'Enter key used' );
+ } else if ( e.which === 9 ) {
+ console.log( 'Tab key used' );
+ // if they entered email then test for existing email
+ if ( this.model.get( 'validEmail' ) === true ){
+ return;
+ }
+ var email = this.$('.account_email').val().trim();
+ console.log( email );
+ jQuery.ajax({
+ context: this,
+ url: ajaxUrl + '&glm_action=account&option=checkEmail',
+ dataType: 'json',
+ data: 'email=' + email
+ })
+ .done(function(account){
+ if ( account.validEmail !== true ) {
+ alert('Must be a valid email address!');
+ jQuery('.account_email').focus();
+ } else if ( account.id !== undefined && account.email !== undefined ) {
+ alert('There is an account already with that email address.\nPlease use another one!');
+ jQuery('.account_email').val('');
+ jQuery('.account_email').focus();
+ } else {
+ // email is not existing account and valid
+ this.model.set({ validEmail: true });
+ }
+ })
+ .fail(function(msg){
+ console.log('Fail: ' + msg);
+ });
+ }
+ },
+
+});
* an AJAX call that goes through the WorPress AJAX Handler.
*
*/
-class GlmMembersAdmin_ajax_account extends GLMDataRegistrationsAccount
+class GlmMembersAdmin_ajax_account extends GlmDataRegistrationsAccount
{
/**
$option = filter_var( $_REQUEST['option'], FILTER_SANITIZE_STRING );
switch ( $option ) {
+ case 'register':
+ // trigger_error(print_r($_REQUEST,1));
+ $email = filter_var( $_REQUEST['email'], FILTER_VALIDATE_EMAIL );
+ $password = filter_var( $_REQUEST['password'], FILTER_SANITIZE_STRING );
+ $fname = filter_var( $_REQUEST['fname'], FILTER_SANITIZE_STRING );
+ $lname = filter_var( $_REQUEST['lname'], FILTER_SANITIZE_STRING );
+ $addr1 = filter_var( $_REQUEST['addr1'], FILTER_SANITIZE_STRING );
+ $addr2 = filter_var( $_REQUEST['addr2'], FILTER_SANITIZE_STRING );
+ $city = filter_var( $_REQUEST['city'], FILTER_SANITIZE_STRING );
+ $state = filter_var( $_REQUEST['state'], FILTER_SANITIZE_STRING );
+ $zip = filter_var( $_REQUEST['zip'], FILTER_SANITIZE_STRING );
+ $country = filter_var( $_REQUEST['country'], FILTER_SANITIZE_STRING );
+ // Verify that the email is not registered already
+ if ( $email ) {
+ $accountId = $this->wpdb->get_var(
+ $this->wpdb->prepare(
+ "SELECT id
+ FROM " . GLM_MEMBERS_REGISTRATIONS_PLUGIN_DB_PREFIX . "account
+ WHERE email = %s",
+ $email
+ )
+ );
+ if ( $accountId ) {
+ $return = array(
+ 'valid' => false,
+ 'validEmail' => false,
+ );
+ break;
+ }
+ // If they reach here then check create a new account record
+ $_POST = $_REQUEST;
+ // Note: When using insertEntry() it is not setting the
+ // password. Not sure why!
+ $account = $this->insertEntry();
+ trigger_error(print_r($account,E_USER_NOTICE));
+ IF ( $account['status'] ) {
+ $return = array(
+ 'id' => $account['fieldData']['id'],
+ 'email' => $email,
+ 'fname' => $fname,
+ 'lname' => $lname,
+ 'addr1' => $addr1,
+ 'addr2' => $addr2,
+ 'city' => $city,
+ 'state' => $state,
+ 'zip' => $zip,
+ 'country' => $country,
+ );
+ } else {
+ $return = array(
+ 'valid' => false,
+ 'validEmail' => false,
+ );
+ }
+ } else {
+ $return = array(
+ 'valid' => false,
+ 'validEmail' => false,
+ );
+ break;
+ }
+
+ break;
case 'logout':
unset( $_SESSION['LoginAccount'] );
$return = array( 'valid' => false );
$this->wpdb->prepare(
"SELECT id,password,fname,lname
FROM " . GLM_MEMBERS_REGISTRATIONS_PLUGIN_DB_PREFIX . "account
- WHERE email = %s",
+ WHERE email = %s
+ AND active = true",
$username
),
ARRAY_A
{* Underscore Templates for the Event Registration App *}
{* Template for Account Login *}{literal}
<script type="text/template" id="eventReg-account-login">
- <a class="glm-reg-account-login" id="loginCancel">Close</a>
+ <a id="loginCancel">Close</a>
<h4>Login</h4>
<% if ( message ) { %>
<span style="color: red;"><%= message %></span>
<input class="login" placeholder="Email Address" type="email">
<input class="password" placeholder="Password" type="password">
<input type="submit" id="accountLogin" value="Login">
- <a id="register">Register</a>
<a id="forgotLogin">Forgot Password</a>
</script>
{/literal}
{/literal}
{* Template for Register New Account *}{literal}
<script type="text/template" id="register-new-account">
-<h1>New Account</h1>
+ <a id="registerCancel">Close</a>
+ <h3>Register New Account</h3>
+ <div>
+ {/literal}{$terms.reg_term_contact_information}{literal}
+ </div>
+ <div>
+ <input class="account_email" placeholder="*Email Address">
+ <input class="account_password" placeholder="*Password">
+ </div>
+ <div>
+ <input class="account_fname" placeholder="*First Name">
+ <input class="account_lname" placeholder="*Last Name">
+ </div>
+ <div>
+ <input class="account_addr1" placeholder="Address 1">
+ <input class="account_addr2" placeholder="Address 2">
+ </div>
+ <div>
+ <input class="account_city" placeholder="City">
+ <input class="account_state" placeholder="State">
+ </div>
+ <div>
+ <input class="account_zip" placeholder="Zip/Postal Code">
+ <input class="account_country" placeholder="Country">
+ </div>
+ <div>
+ <input type="submit" id="accountRegister" value="Register">
+ </div>
</script>
{/literal}
{* Template for the regEvent *}{literal}
{/literal}
<div class="glm-reg-event-list" id="regApp">
<h1>{$terms.reg_term_registrations_name}</h1>
- <div class="glm-reg-account">
- <a class="glm-reg-account-login" id="appLogin">Login</a>
+ <div id="accountHeader">
+ <a id="appLogin">Login</a>
+ <a id="register">Register</a>
</div>
</div>
{* Bootstrap the models needed on page load *}
projects / WP-Plugins / glm-member-db-registrations.git / commitdiff