// -- 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 liste les filleuls 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.
// Fichier de configuration côté client :
import { apiUrl, availableLangs, theme } from "../../config/instance.js";
const lang=availableLangs[0];
const configTemplate = require("../../views/"+theme+"/config/"+lang+".js");// besoin de toutes les déclarations pour la fonction : updateAccountLink()
const { beginCodeGodfather } = require("../../config/instance");
const configUsers = require("../../config/users"); // besoin de tous le fichier pour configurer le formulaire
// Fonctions utiles au script
import { getLocaly, removeLocaly } 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 } 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 { serverError } = require("../../lang/"+lang+"/general");
const { infosUserNbGodChilds, infosUserNoGodchilds, needBeConnected } = require("../../lang/"+lang+"/user");
const { infosExpirated, infosNbDays } = 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 divGodfatherInfos = document.getElementById("godfatherInfos");
const divGodchilds = document.getElementById("godchilds");
const divSubscribeInfos = document.getElementById("subscribeInfos");
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
{
// Si l'utilisateur n'est pas connecté avec le bon statut, pas la peine d'aller + loin :
const isConnected=await checkSession(["user"], "/"+configTemplate.connectionPage, { message: needBeConnected, color:"error" }, window.location);
if(isConnected)
{
divMain.style.display="block";
// l'éventuelle ancre est ignorée, car absente du DOM avant d'avoir vérifié la connexion
if(window.location.hash!==undefined)
window.location.assign(window.location.hash);
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, configTemplate);
// Initialise le formulaire permettant de mettre à jour les infos :
setAttributesToInputs(configUsers, formAccount);
// Certains navigateurs remplissent 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+configUsers.userRoutes+configUsers.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";
}
}
// jours de réception
for(let i in response.Subscription.receiptDays)
formAccount.elements["d"+response.Subscription.receiptDays[i]].checked="checked";
// "codes" possibles à transmettre pour parrainer d'autres utilisateurs
showGFEmail.innerHTML=response.User.email;
showGFCode.innerHTML=beginCodeGodfather+response.User.id;
}
const beginSubTS=new Date(response.Subscription.createdAt).getTime();
if(response.Subscription.numberOfDays !== 0)
{
divGodfatherInfos.style.display="block";
divSubscribeInfos.style.display="block";
const nbDaysOk=response.Subscription.numberOfDays-Math.round((Date.now()-beginSubTS)/1000/3600/24);
if(nbDaysOk > 0)
addElement(divSubscribeIntro, "p", infosNbDays.replace("NB_DAYS", nbDaysOk), "", ["info"]);
else
{
addElement(divSubscribeIntro, "p", 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;
}
datas.timeDifference=getTimeDifference();
const xhrUserUpdate = new XMLHttpRequest();
if(datas.deleteOk!==undefined)
xhrUserUpdate.open("DELETE", apiUrl+configUsers.userRoutes+"/"+user.id);
else
xhrUserUpdate.open("PUT", apiUrl+configUsers.userRoutes+configUsers.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("
");
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("
");
else
response.errors = serverError;
addElement(divResponse, "p", response.errors, "", ["error"]);
}
else
addElement(divResponse, "p", 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 abo9=document.getElementById("abo9");
const abo18=document.getElementById("abo18");
const abo36=document.getElementById("abo36");
const abo54=document.getElementById("abo54");
const CGV=document.getElementById("CGVOk");
const divWPBtns=document.getElementById("WPBtns");
divWPBtns.style.display="none";
abo9.addEventListener("change", function(e)
{
unCheckAllOthers("abo9");
});
abo18.addEventListener("change", function(e)
{
unCheckAllOthers("abo18");
});
abo36.addEventListener("change", function(e)
{
unCheckAllOthers("abo36");
});
abo54.addEventListener("change", function(e)
{
unCheckAllOthers("abo54");
});
CGV.addEventListener("change", function(e)
{
if(CGV.checked===true)
{
divWPBtns.style.display="block";
if(abo9.checked===true)
showBtnPayment("btn9");
else if(abo18.checked===true)
showBtnPayment("btn18");
else if(abo36.checked===true)
showBtnPayment("btn36");
else if(abo54.checked===true)
showBtnPayment("btn54");
else
{
divWPBtns.style.display="none";
CGV.checked=false;
}
}
else
divWPBtns.style.display="none";
});
// Liste des filleuls, si il y en a
const xhrGetGodchilds = new XMLHttpRequest();
xhrGetGodchilds.open("GET", apiUrl+configUsers.userRoutes+configUsers.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=infosUserNoGodchilds;
else
{
txtGodchilds=infosUserNbGodChilds.replace("#NB", nbGodchilds);
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", serverError, "", ["error"]);
console.error(e);
}
}
initialise();