-// Logic to login, or create / update a user (and also logout)
<template lang="pug">
div
input#modalUser.modal(type="checkbox" @change="trySetEnterTime")
i.material-icons send
button(v-if="stage!='Update'" @click="toggleStage()")
span {{ stage=="Login" ? "Register" : "Login" }}
- button(v-else onClick="location.replace('/logout')")
+ button(v-else @click="doLogout()")
span Logout
#dialog(:style="{display: displayInfo}") {{ infoMsg }}
</template>
return {
user: store.state.user,
nameOrEmail: "", //for login
- stage: (store.state.user.id > 0 ? "Update" : "Login"), //TODO?
+ logStage: "Login", //or Register
infoMsg: "",
enterTime: Number.MAX_SAFE_INTEGER, //for a basic anti-bot strategy
};
displayInfo: function() {
return (this.infoMsg.length > 0 ? "block" : "none");
},
+ stage: function() {
+ return this.user.id > 0 ? "Update" : this.logStage;
+ },
},
methods: {
trySetEnterTime: function(event) {
},
toggleStage: function() {
// Loop login <--> register (update is for logged-in users)
- this.stage = (this.stage == "Login" ? "Register" : "Login");
+ this.logStage = (this.logStage == "Login" ? "Register" : "Login");
},
ajaxUrl: function() {
switch (this.stage)
res => {
this.infoMsg = this.infoMessage();
if (this.stage != "Update")
- {
this.nameOrEmail = "";
- this.user["email"] = "";
- // Update global object
- this.user["name"] = res.name;
- this.user["id"] = res.id;
- // Store our identifiers in local storage (by little anticipation...)
- localStorage["myid"] = res.id;
- localStorage["myname"] = res.name;
- }
setTimeout(() => {
this.infoMsg = "";
- if (this.stage == "Register")
- this.stage = "Login";
document.getElementById("modalUser").checked = false;
}, 2000);
},
}
);
},
+ doLogout: function() {
+ ajax(
+ "/logout",
+ "GET",
+ () => {
+ this.user.id = 0;
+ this.user.name = "";
+ this.user.email = "";
+ this.user.notify = false;
+ delete localStorage["myid"];
+ delete localStorage["myname"];
+ }
+ );
+ },
},
};
</script>