Look at my main.js file
const serverUrl = "https://mzrhanzmogsu.moralishost.com:2053/server";
const appId = "gFnTLmvgt8ZDUYMXF80FIonsCRqosKxXcfzmO2bM";
Moralis.start({ serverUrl, appId });
async function hide_buttons() {
let user = await Moralis.User.current();
if (!user) {
document.getElementById("btnConnect").style.display = "block";
document.getElementById("btnUserInfo").style.display = "none";
document.getElementById("btnLogout").style.display = "none";
document.getElementById("userInfo").style.display = "none";
} else {
document.getElementById("btnUserInfo").style.display = "block";
document.getElementById("btnConnect").style.display = "none";
document.getElementById("btnLogout").style.display = "block";
}
}
hide_buttons();
async function login() {
let user = Moralis.User.current();
if (!user) {
try {
user = await Moralis.authenticate({
signingMessage: "Welcome to GrandPaDoge NFT MarketPlace",
});
} catch (error) {
alert(
(error =
"Please consider installing Metamask to connect to MrGrandPaDoge NFT MarketPlace")
);
}
}
console.log("logged in user:", user);
hide_buttons();
const isWeb3Active = Moralis.ensureWeb3IsInstalled();
if (isWeb3Active) {
console.log("Activated");
} else {
async function enable() {
await Moralis.enable();
}
}
}
async function logOut() {
await Moralis.User.logOut();
console.log("logged out");
hide_buttons();
}
async function openuserInfo() {
const user = Moralis.User.current();
hide_buttons();
if (user) {
const email = user.get("email");
if (email) {
userEmailField.value = email;
} else {
userEmailField.value = "";
}
userUsernameField.value = user.get("username");
const userAvatar = user.get("avatar");
console.log(openuserInfo);
if (userAvatar) {
console.log(imgAvatar);
console.log(userAvatar);
imgAvatar.src = userAvatar.url();
document.getElementById("imgAvatar").style.display = "block"; //display avatar
} else {
document.getElementById("imgAvatar").style.display = "none"; //hide avatar when user is connected
}
document.getElementById("userInfo").style.display = "block"; //Hide userinfo
} else {
login(); //if not,then login
}
}
async function saveUserInfo() {
let user = await Moralis.User.current();
user.set("email", userEmailField.value);
user.set("username", userUsernameField.value);
if (fileAvatar.files.length > 0) {
//get user avatar
const avatar = new Moralis.File("avatar.jpg", fileAvatar.files[0]);
console.log(fileAvatar.files);
x = await avatar.save();
console.log(x);
user.set("avatar", x);
}
alert("User info saved successfully!");
openuserInfo();
}
async function closeuserInfo() {
user = await Moralis.User.current();
hide_buttons();
if (user) {
document.getElementById("userInfo").style.display = "none";
console.log("closed");
} else {
logOut();
}
}
document.getElementById("btnConnect").onclick = login;
document.getElementById("btnLogout").onclick = logOut;
document.getElementById("btnUserInfo").onclick = openuserInfo;
document.getElementById("btnCloseUserInfo").onclick = closeuserInfo;
document.getElementById("btnSaveUserInfo").onclick = saveUserInfo;
const userUsernameField = document.getElementById("txtUsername");
const userEmailField = document.getElementById("txtEmail");
const userAvatarImg = document.getElementById("imgAvatar");
const userAvatarFile = document.getElementById("fileAvatar");
@cryptokid