260 lines
13 KiB
JavaScript
260 lines
13 KiB
JavaScript
// -- 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("<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 = 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(); |