I created a custom sign up flow that enables the new members to fill out their profile then make a payment and then sign up on a custom sign up page to create their login credentials.
I had to use the ascend form to be able to charge people the membership fee. The default membership payment did not work for the custom set up for various reasons.
If you want to test the flow www.wssmda.com
(The membership fee is set to 0.10 for test purposes.)
I have almost everything to work correctly except these two issues:
- I can not figure out why the new profile information shows on the first login and disappears after logging out and back in again.
- Upon updating the profile image the "My Profile form changes but not the image next to the “My Profile” button on the top.
Also I wonder if there is a way I can take the user directly to the “My Profile” Page after they finish signing up. They end up staying on the new profile registration page. I had to add a note to let the new member know that they need to click on the My Profile button that shows their name once they register.
Here is a copy of my code:
import wixUsers from ‘wix-users’;
import wixData from ‘wix-data’;
import wixLocation from ‘wix-location’;
$w.onReady(() => {
if (wixUsers.currentUser.loggedIn) {
$w(“#login”).label = “Logout”;
$w(“#profileButton”).show();
$w(“#image”).show();
}
else {
$w(“#login”).label = “Login”;
$w(“#profileButton”).show();
$w(“#image”).show();
}
} );
export function login_click(event) {
// user is logged in
if (wixUsers.currentUser.loggedIn) {
// log the user out
wixLocation.to(/);
wixUsers.logout()
.then( () => {
// update buttons accordingly
$w(“#login”).label = “Login”;
} );
}
// user is logged out
else {
let userId;
let userEmail;
// prompt the user to log in
wixUsers.promptLogin( {“mode”: “login”} )
.then( (user) => {
userId = user.id;
return user.getEmail();
} )
.then( (email) => {
// check if there is an item for the user in the collection
userEmail = email;
return wixData.query(“Members”)
.eq(“_id”, userId)
.find();
} )
.then( (results) => {
// if an item for the user is not found
if (results.items.length === 0) {
// create an item
const toInsert = {
“_id”: userId,
“email”: userEmail
};
// add the item to the collection
wixData.insert(“Members”, toInsert)
. catch ( (err) => {
console.log(err);
} );
}
// update buttons accordingly
$w(“#login”).label = “Logout”;
$w(“#profileButton”).show();
$w(“#image”).show();
wixLocation.to(/Member-Profile/page);
} )
. catch ( (err) => {
console.log(err);
} );
}
//Add your code for this event here:
}
import wixWindow from ‘wix-window’;
$w.onReady( () => {
if (wixWindow.rendering.renderCycle === 2) {
if (wixUsers.currentUser.loggedIn) {
$w(“#login”).label = “Logout”;
$w(“#profileButton”).show();
$w(“#image”).show();
}
else {
$w(“#login”).label = “Login”;
$w(“#profileButton”).show();
$w(“#image”).show();
$w(‘#dataset2’).refresh();
}
}
});