WikiLerni/front/src/accountUser.js

261 lines
13 KiB
JavaScript
Raw Normal View History

// -- GESTION DES FORMULAIRES PERMETTANT AUX UTILISATEURS DE METTRE À JOUR LEURS INFORMATIONS + LEUR ABONNEMENT
/// Vérifier que l'utilisateur est bien connecté, a le bon statut et le rediriger vers le formulaire d'inscription si ce n'est pas le cas.
/// Si c'est ok, on récupère les infos de son compte et son abonnement et les affiche dans le formulaire.
/// Une information est affichée concernant la possibilité de parrainage et les listes les filleuils existants.
/// Un menu permet à l'utilisateur d'accéder à la modification de ses infos, etc.
/// Des boutons de paiement sont aussi affichés suivant le choix de l'utilisateur pour lui permettre de prolonger son abonnement.
/// Un message venant d'une autre page peut aussi être à afficher lors du premier chargement.
/// Ajout test email en doublon avant envoi ?
// Fichier de configuration côté client :
import { apiUrl, availableLangs, theme } from "../../config/instance.js";
const lang=availableLangs[0];
const configFrontEnd = require("../../views/"+theme+"/config/"+lang+".js");
// Fonctions utiles au script : !! revoir quand le rest sera fini pour vérifier si tout est utile
import { getLocaly, removeLocaly, saveLocaly } from "./tools/clientstorage.js";
import { addElement } from "./tools/dom.js";
import { helloDev, updateAccountLink } from "./tools/everywhere.js";
import { getDatasFromInputs, setAttributesToInputs } from "./tools/forms.js";
import { isEmpty, replaceAll } from "../../tools/main";
import { checkSession, getConfig, getTimeDifference } from "./tools/users.js";
// Spécifique WebPortage pour paiements:
import { showBtnPayment, unCheckAllOthers } from "./tools/webportage.js";
// Dictionnaires :
const txt = require("../../lang/"+lang+"/general");
const txtUsers = require("../../lang/"+lang+"/user");
const txtSubscriptions = require("../../lang/"+lang+"/subscription");
// Principaux éléments du DOM manipulés :
const divCrash = document.getElementById("crash");
const divMain = document.getElementById("main-content");
const divMessage = document.getElementById("message");
const divResponse = document.getElementById("response");
const divGodchilds = document.getElementById("godchilds");
const divSubscribeIntro = document.getElementById("subscribeIntro");
const formAccount = document.getElementById("accountUpdate");
const newPassword = document.getElementById("newPassword");
const showGFEmail = document.getElementById("godfatherEmail");
const showGFCode = document.getElementById("godfatherCode");
helloDev();
const initialise = async () =>
{
try
{
const config = await getConfig();
if(!config)
addElement(divCrash, "p", txt.serverError, "", ["error"]);
else
{
// Si l'utilisateur n'est pas connecté avec le bon statut, pas la peine d'aller + loin :
const isConnected=await checkSession(["user"], "/"+configFrontEnd.connectionPage, { message: txtUsers.needBeConnected, color:"error" }, window.location);
if(isConnected)
{
divMain.style.display="block";
if(!isEmpty(getLocaly("message")))
{
addElement(divMessage, "p", getLocaly("message", true).message, "", [getLocaly("message", true).color], "", false);
removeLocaly("message");
}
const user=getLocaly("user", true);
updateAccountLink(user.status, configFrontEnd);
// Initialise le formulaire permettant de mettre à jour les infos :
setAttributesToInputs(config, formAccount);
// Certains navigateurs ont tendance à remplir tout seul les champs password
newPassword.value="";
// Fonction affichant les infos connues au premier affichage puis après envoi mise à jour
const getInfos = () =>
{
const xhrGetInfos = new XMLHttpRequest();
xhrGetInfos.open("GET", apiUrl+config.userRoutes+config.getUserInfos+user.id);
xhrGetInfos.onreadystatechange = function()
{
if (this.readyState == XMLHttpRequest.DONE)
{
let response=JSON.parse(this.responseText);
if (this.status === 200 && response.User != undefined && response.Subscription != undefined)
{
for(let data in response.User)
{
if(formAccount.elements[data]!==undefined)
{
if(response.User[data]!==true && response.User[data]!==false)// booléen = case à cocher !
formAccount.elements[data].value=response.User[data];
else if (response.User[data]==true) // si false, on ne fait rien
formAccount.elements[""+data].checked="checked";
}
}
// infos de l'abonnement
if(response.Subscription.noticeOk==true)
formAccount.elements["noticeOk"].checked="checked";
// jours de réception
for(let i in response.Subscription.receiptDays)
formAccount.elements["d"+response.Subscription.receiptDays[i]].checked="checked";
showGFEmail.innerHTML=response.User.email;
showGFCode.innerHTML=config.beginCodeGodfather+response.User.id;
}
const beginSubTS=new Date(response.Subscription.createdAt).getTime();
const nbDaysOk=response.Subscription.numberOfDays-Math.round((Date.now()-beginSubTS)/1000/3600/24);
if(nbDaysOk>0)
addElement(divSubscribeIntro, "p", txtSubscriptions.infosNbDays.replace("NB_DAYS", nbDaysOk), "", ["information"]);
else
{
addElement(divSubscribeIntro, "p", txtSubscriptions.infosExpirated.replace("NB_DAYS", nbDaysOk), "", ["error"]);
window.location.assign("#subscribe");
}
}
}
xhrGetInfos.setRequestHeader("Authorization", "Bearer "+user.token);
xhrGetInfos.send();
}
// Remonte les infos déjà enregistrées :
getInfos();
// Traitement 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 valables pour l'abonnement :
datas.receiptDays="";
for(let i=1; i<=7; i++)
{
if(datas["d"+i]!==undefined)
datas.receiptDays+=""+i;
}
if(datas.noticeOk===undefined)
datas.noticeOk="false";
if(datas.newsletterOk===undefined)
datas.newsletterOk="false";
datas.timeDifference=getTimeDifference(config);
const xhrUserUpdate = new XMLHttpRequest();
if(datas.deleteOk!==undefined)
xhrUserUpdate.open("DELETE", apiUrl+config.userRoutes+"/"+user.id);
else
xhrUserUpdate.open("PUT", apiUrl+config.userRoutes+config.updateUserInfos+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;
addElement(divResponse, "p", response.message, "", ["success"]);
}
else if (response.errors)
{
if(Array.isArray(response.errors))
response.errors = response.errors.join("<br>");
else
response.errors = txt.serverError;
addElement(divResponse, "p", response.errors, "", ["error"]);
}
else
addElement(divResponse, "p", txt.serverError, "", ["error"]);
// dans tous les cas, je mets à jour le contenu du formulaire :
getInfos();
}
}
xhrUserUpdate.setRequestHeader("Content-Type", "application/json");
xhrUserUpdate.setRequestHeader("Authorization", "Bearer "+user.token);
if(datas)
{
datas.output="html";
xhrUserUpdate.send(JSON.stringify(datas));
}
});
// on passe à la caisse ?
const CGV=document.getElementById("CGVOk");
const abo12=document.getElementById("abo12");
const abo24=document.getElementById("abo24");
const abo60=document.getElementById("abo60");
const abo120=document.getElementById("abo120");
const divWPBtns=document.getElementById("WPBtns");
divWPBtns.style.display="none";
abo12.addEventListener("change", function(e)
{
unCheckAllOthers("abo12");
});
abo24.addEventListener("change", function(e)
{
unCheckAllOthers("abo24");
});
abo60.addEventListener("change", function(e)
{
unCheckAllOthers("abo60");
});
abo120.addEventListener("change", function(e)
{
unCheckAllOthers("abo120");
});
CGV.addEventListener("change", function(e)
{
if(CGV.checked===true)
{
divWPBtns.style.display="block";
if(abo12.checked===true)
showBtnPayment("btn12");
else if(abo24.checked===true)
showBtnPayment("btn24");
else if(abo60.checked===true)
showBtnPayment("btn60");
else if(abo120.checked===true)
showBtnPayment("btn120");
else
{
divWPBtns.style.display="none";
CGV.checked=false;
}
}
else
divWPBtns.style.display="none";
});
// Liste des filleuils, si il y en a
const xhrGetGodchilds = new XMLHttpRequest();
xhrGetGodchilds.open("GET", apiUrl+config.userRoutes+config.getGodChilds);
xhrGetGodchilds.onreadystatechange = function()
{
if (this.readyState == XMLHttpRequest.DONE)
{
let response=JSON.parse(this.responseText), txtGodchilds="";
if (this.status === 200)
{
const nbGodchilds=response.length;
if(nbGodchilds===0)
txtGodchilds="Pour l'instant, aucune personne ne s'est inscrite, en vous désignant comme \"parrain\".";// revoir : utiliser le dictionnaire User
else
{
txtGodchilds=nbGodchilds+" utilisateur(s) inscrit(s) en vous désignant comme \"parrain\" :";
for(let i in response)
txtGodchilds+=response[i].name+" ("+response[i].email+") ";
}
}
addElement(divGodchilds, "p", txtGodchilds, "", ["info"]);
}
}
xhrGetGodchilds.setRequestHeader("Authorization", "Bearer "+user.token);
xhrGetGodchilds.send();
}
}
}
catch(e)
{
addElement(divCrash, "p", txt.serverError, "", ["error"]);
console.error(e);
}
}
initialise();