WikiLerni/front/src/subscribeValidation.js

202 lines
11 KiB
JavaScript

// -- PAGE PERMETTANT DE VALIDER LA CRÉATION DE SON COMPTE, PUIS DE COMPLÉTER SON INSCRIPTION
/// Un token est transmis en paramètre de l'Url. Il a une validité limité dans le temps.
/// Si le token n'est pas/plus valide, on redirige l'utilisateur vers la page de connexion pour obtenir un nouveau lien.
/// Si le token est ok, on l'informe que tout est ok et lui propose de se compléter les informations de son compte. Une session lui est également créée.
/// Si l'utilisateur a déjà une session active valide, c'est qu'il a déjà cliqué sur le lien. On le redirige vers sa page d'accueil.
// Fichier de configuration tirés du backend :
import { apiUrl, availableLangs, theme, tokenConnexionMinTimeInHours } from "../../config/instance.js";
const lang=availableLangs[0];
const configTemplate = require("../../views/"+theme+"/config/"+lang+".js");
const configUsers = require("../../config/users"); // besoin de tous le fichier pour configurer le formulaire de saisie, etc.
// Importation des fonctions utiles au script :
import { getLocaly, saveLocaly } from "./tools/clientstorage.js";
import { addElement } from "./tools/dom.js";
import { helloDev } from "./tools/everywhere.js";
import { getDatasFromInputs, setAttributesToInputs } from "./tools/forms.js";
import { getPassword } from "../../tools/main";
import { loadMatomo } from "./tools/matomo.js";
import { getUrlParams } from "./tools/url.js";
import { checkSession, setSession } from "./tools/users.js";
// Dictionnaires :
const { notRequired, serverError } = require("../../lang/"+lang+"/general");
const { alreadyConnected, badLinkValidationMessage, godfatherFound, godfatherNotFound, passwordCopied, validationMessage } = require("../../lang/"+lang+"/user");
// Principaux éléments du DOM manipulés :
const codeGodfatherInput=document.getElementById("codeGodfather");
const divExplanations = document.getElementById("explanations");
const divMessage = document.getElementById("message");
const divResponse = document.getElementById("response");
const formAccount = document.getElementById("subscription2");
const passwordInput=document.getElementById("newPassword");
const passwordLink=document.getElementById("getPassword");
const passwordHelp=document.getElementById("passwordMessage");
const initialise = async () =>
{
try
{
// Explications cachées par défaut :
divExplanations.style.display="none";
const isConnected=await checkSession();
if(isConnected)
{
saveLocaly("message", { message: alreadyConnected, color:"info" });
const user=getLocaly("user", true);
const homePage=user.status+"HomePage";// lors de la création d'un compte, seul le statut "user" est possible.
window.location.assign("/"+configTemplate[homePage]);
}
else
{
loadMatomo();
const datas=getUrlParams();
if(datas && datas.t!==undefined)
{
const xhr = new XMLHttpRequest();
xhr.open("GET", apiUrl+configUsers.userRoutes+configUsers.checkSubscribeTokenRoute+datas.t);
xhr.onreadystatechange = function()
{
if (this.readyState == XMLHttpRequest.DONE)
{
let response=JSON.parse(this.responseText);
if (this.status === 200 && response.newUser != undefined && response.token != undefined)
{
addElement(divMessage, "p", validationMessage, "", ["success"]);
// Affichage et initialisation du formulaire permettant de compléter les infos :
formAccount.style.display="block";
divExplanations.style.display="block";
setAttributesToInputs(configUsers, formAccount);
// Affichage des infos déjà enregistrées :
for(let data in response.newUser.User)
{
if(formAccount.elements[data]!==undefined)
formAccount.elements[data].value=response.newUser.User[data];
}
// Jours de réception de l'abonnenment :
for(let i in response.newUser.Subscription.receiptDays)
formAccount.elements["d"+response.newUser.Subscription.receiptDays[i]].checked="checked";
// Certains navigateurs remplissent automatiquement les champs password :
passwordInput.value="";
// Création d'une session courte avec le token reçu (nécessaire pour la suite) :
let connexionMaxTime=Date.now()+parseInt(tokenConnexionMinTimeInHours,10)*3600*1000;
setSession(response.newUser.User.id, response.token, connexionMaxTime);
}
else if ((this.status === 200 || this.status === 404) && response.errors != undefined)
{
if(Array.isArray(response.errors))
response.errors = response.errors.join("<br>");
else
response.errors = serverError;
addElement(divMessage, "p", response.errors, "", ["error"]);
}
else
addElement(divMessage, "p", badLinkValidationMessage.replace("#URL", configTemplate.connectionPage), "", ["error"]);
}
}
xhr.send();
// Génére un mot de passe pseudo-aléatoire :
passwordLink.addEventListener("click", function(e)
{
e.preventDefault();
passwordInput.type="text";
passwordInput.value=getPassword(8, 12);
// Copie du mot de passe généré dans le "presse-papier" de l'ordinateur :
passwordInput.select();
document.execCommand("copy");
addElement(passwordHelp, "div", passwordCopied, "", ["success"]);
});
// Vérifie que le code/e-mail de parrainage saisi est valide :
codeGodfatherInput.addEventListener("blur", function(e)
{
const codeValue=codeGodfatherInput.value.trim();
if(codeValue!=="")
{
const xhr = new XMLHttpRequest();
xhr.open("POST", apiUrl+configUsers.userRoutes+configUsers.getGodfatherRoute);
xhr.onreadystatechange = function()
{
if (this.readyState == XMLHttpRequest.DONE)
{
if (this.status === 204)
addElement(document.getElementById("codeGodfatherMessage"), "div", godfatherNotFound, "", ["error"]);
else
addElement(document.getElementById("codeGodfatherMessage"), "div", godfatherFound, "", ["success"]);
}
}
xhr.setRequestHeader("Content-Type", "application/json");
const datas={ codeTest:codeValue };
xhr.send(JSON.stringify(datas));
}
});
// Efface l'éventuel message déjà injecté si l'utilisateur revient sur ce champ de saisie :
codeGodfatherInput.addEventListener("focus", function(e)
{
addElement(document.getElementById("codeGodfatherMessage"), "i", notRequired);
});
// Traite de l'envoi d'une mise à jour des infos :
formAccount.addEventListener("submit", function(e)
{
e.preventDefault();
divResponse.innerHTML="";
let datas=getDatasFromInputs(formAccount);
// Recomposition des jours d'envoi de l'abonnement
datas.receiptDays="";
for(let i=1; i<=7; i++)
{
if(datas["d"+i] !== undefined)
datas.receiptDays+=""+i;
}
const user=getLocaly("user", true);// on a créé la session + haut
const xhrUserUpdate = new XMLHttpRequest();
xhrUserUpdate.open("PUT", apiUrl+configUsers.userRoutes+configUsers.signupCompletionRoute+user.id);
xhrUserUpdate.onreadystatechange = function()
{
if (this.readyState == XMLHttpRequest.DONE)
{
let response=JSON.parse(this.responseText);
if (this.status === 200 && response.message !== undefined)
{
if(Array.isArray(response.message))
response.message = response.message.join("<br>");
else
response.message = response.message;
saveLocaly("message", { message: response.message, color:"success" });
window.location.assign(configTemplate["userHomePage"]);
}
else if (response.errors)
{
if(Array.isArray(response.errors))
response.errors = response.errors.join("<br>");
else
response.errors = serverError;
addElement(divResponse, "p", response.errors, "", ["error"]);
}
else
addElement(divResponse, "p", serverError, "", ["error"]);
}
}
xhrUserUpdate.setRequestHeader("Content-Type", "application/json");
xhrUserUpdate.setRequestHeader("Authorization", "Bearer "+user.token);
if(datas)
{
xhrUserUpdate.send(JSON.stringify(datas));
}
});
}
}
}
catch(e)
{
console.error(e);
addElement(divResponse, "p", serverError, "", ["error"]);
}
}
initialise();
helloDev();