202 lines
11 KiB
JavaScript
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(); |