From 0cf5a82418d25738992e46645127fa168ce907cd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Fabrice=20PENHO=C3=8BT?= Date: Wed, 23 Sep 2020 17:12:53 +0200 Subject: [PATCH] Revue page accueil administrateur site : template wikilerni + optimisation script JS. --- front/public/gestion.html | 122 +++++++++------------- front/src/homeManager.js | 212 ++++++++++++++++++++------------------ 2 files changed, 160 insertions(+), 174 deletions(-) diff --git a/front/public/gestion.html b/front/public/gestion.html index abe25c2..9aede49 100644 --- a/front/public/gestion.html +++ b/front/public/gestion.html @@ -1,79 +1,59 @@ - - - - - - WikiLerni - gestion du site - - - - - - - - - + + + + + + Mon WikiLerni + + + + + + - - -
-
- WikiLerni -
-
-
-
- -
- -
- Gestion WikiLerni - -
+ -
-

WikiLerni

-
-
-
+
+ +
+ + + + -

Régénérer le HTML.

-
-
- - + + + + \ No newline at end of file diff --git a/front/src/homeManager.js b/front/src/homeManager.js index 18a1fbc..66155d7 100644 --- a/front/src/homeManager.js +++ b/front/src/homeManager.js @@ -6,30 +6,41 @@ /// Un menu permet à l'utilisateur d'accéder aux formulaires permettant de gérer les quizs et les comptes utilisateurs et abonnements /// Un message venant d'une autre page peut aussi être à afficher lors du premier chargement. -/// C'est ici aussi que l'on peut régénérer tout le HTML -> à terme dans homeAdmin ! +/// Temporairement, c'est ici aussi que l'on peut régénérer tout le HTML -> à terme dans homeAdmin ! // 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"); + +import { getAdminStats, userRoutes } from "../../config/users.js"; +import { getListNextQuestionnaires, questionnaireRoutes, regenerateHTML } from "../../config/questionnaires.js"; +const configTemplate = require("../../views/"+theme+"/config/"+lang+".js"); // 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 { dateFormat, isEmpty, replaceAll } from "../../tools/main"; -import { checkSession, getConfig } from "./tools/users.js"; +import { checkSession } from "./tools/users.js"; -// Dictionnaires : +// Dictionnaires : revoir pour ne prendre que les variables utilisées const txt = require("../../lang/"+lang+"/general"); -const txtUsers = require("../../lang/"+lang+"/user"); + +const txtNotAllowed = require("../../lang/"+lang+"/general").notAllowed; +const txtServerError = require("../../lang/"+lang+"/general").serverError; +const txtStatsAdmin = require("../../lang/"+lang+"/general").statsAdmin; +const txtNeedBeCompleted = require("../../lang/"+lang+"/questionnaire").needBeCompleted; +const txtNextDateWithoutQuestionnaire = require("../../lang/"+lang+"/questionnaire").nextDateWithoutQuestionnaire; +const txtNextQuestionnairesList = require("../../lang/"+lang+"/questionnaire").nextQuestionnairesList; +const txtWelcome = require("../../lang/"+lang+"/user").welcomeMessage; + const txtQuestionnaire = require("../../lang/"+lang+"/questionnaire"); // Principaux éléments du DOM manipulés : const divMain = document.getElementById("main-content"); +const divCrash = document.getElementById("crash"); const divMessage = document.getElementById("message"); const divQuestionnaires = document.getElementById("questionnaires"); - const btnRegenerate = document.getElementById("wantRegenerate"); helloDev(); @@ -38,110 +49,105 @@ const initialise = async () => { try { - const config = await getConfig(); - if(!config) - addElement(divResponse, "p", txt.serverError, "", ["error"]); - else + const isConnected=await checkSession(["manager", "admin"], "/"+configTemplate.connectionPage, { message: txtNotAllowed, color:"error" }); + if(isConnected) { - const isConnected=await checkSession(["manager", "admin"], "/"+configFrontEnd.connectionPage, { message: txt.notAllowed, color:"error" }); - if(isConnected) + const user=getLocaly("user", true); + updateAccountLink(user.status, configTemplate); + addElement(divMessage, "h2", txtWelcome.replace("#NAME", user.name)); + divMain.style.display="block"; + if(!isEmpty(getLocaly("message"))) { - const user=getLocaly("user", true); - updateAccountLink(user.status, configFrontEnd); - addElement(divMessage, "h4", txtUsers.welcomeMessage.replace("#NAME", user.name)); - divMain.style.display="block"; - if(!isEmpty(getLocaly("message"))) - { - addElement(divMessage, "p", getLocaly("message", true).message, "", [getLocaly("message", true).color], "", false); - removeLocaly("message"); - } - // Les stats : - const xhrStats = new XMLHttpRequest(); - xhrStats.open("GET", apiUrl+config.userRoutes+config.getAdminStats); - xhrStats.onreadystatechange = function() - { - if (this.readyState == XMLHttpRequest.DONE) - { - let response=JSON.parse(this.responseText); - if (this.status === 200) - { - const mapText = - { - NB_USERS_24H : response.nbNewUsers24H, - NB_SUBSCRIPTIONS_24H : response.Subscriptions.nbSubscriptions24H, - NB_USERS_DELETED_24H : response.nbDeletedUsers24H, - NB_ANSWERS_24H : response.Answers.nbAnswers24H, - NB_USERS_TOT : response.nbNewUsersTot, - NB_SUBSCRIPTIONS_TOT : response.Subscriptions.nbSubscriptionsTot, - NB_SUBSCRIPTIONS_PREMIUM : response.Subscriptions.nbSubscriptionsPremium, - NB_ANSWERS_TOT : response.Answers.nbAnswersTot, - NB_USERS_DELETED_TOT : response.nbDeletedUsersTot, - NB_USERS_DELETED_VALIDED : response.nbDeletedUsersWasValided, - NB_USERS_DELETED_PREMIUM : response.nbDeletedUsersTotWasPremium - }; - addElement(divMessage, "p", replaceAll(txt.statsAdmin, mapText), "", "", "", false); - } - } - } - xhrStats.setRequestHeader("Authorization", "Bearer "+user.token); - xhrStats.send(); - - // Les questionnaires bientôt publiés : - const xhrNextQuestionnaires = new XMLHttpRequest(); - xhrNextQuestionnaires.open("GET", apiUrl+config.questionnaireRoutes+config.getListNextQuestionnaires); - xhrNextQuestionnaires.onreadystatechange = function() - { - if (this.readyState == XMLHttpRequest.DONE) - { - let response=JSON.parse(this.responseText); - if (this.status === 200 && Array.isArray(response.questionnaires)) - { - let listHTML="", dayStr, optionsDayStr = { weekday: 'long'}; - for(let i in response.questionnaires) - { - dayStr=new Intl.DateTimeFormat(lang, optionsDayStr).format(new Date(response.questionnaires[i].datePublishing)); - listHTML+="
  • "+dayStr+" "+dateFormat(response.questionnaires[i].datePublishing, "fr")+": "+response.questionnaires[i].title+""; - if(response.questionnaires[i].isPublishable===false) - listHTML+=" ("+txtQuestionnaire.needBeCompleted+")
    • "; - listHTML+=""; - } - if(response.questionnaires.length!==0) - addElement(divQuestionnaires, "h3", txtQuestionnaire.nextQuestionnairesList.replace("#NB", response.questionnaires.length)); - addElement(divQuestionnaires, "h4", txtQuestionnaire.nextDateWithoutQuestionnaire+dateFormat(response.dateNeeded, "fr"), "", ["information"], "", false); - addElement(divQuestionnaires, "ul", listHTML, "", "", "", false); - } - } - } - xhrNextQuestionnaires.setRequestHeader("Authorization", "Bearer "+user.token); - xhrNextQuestionnaires.send(); - - // Traitement demande régénérer HTML - btnRegenerate.addEventListener("click", function(e) - { - e.preventDefault(); - const xhrRegenerate = new XMLHttpRequest(); - xhrRegenerate.open("GET", apiUrl+config.questionnaireRoutes+"/htmlregenerated"); - xhrRegenerate.onreadystatechange = function() - { - if (this.readyState == XMLHttpRequest.DONE) - { - let response=JSON.parse(this.responseText); - if (this.status === 200 && response.message!=undefined) - addElement(divMessage, "p", response.message, "", ["success"], "", false); - else - addElement(divMessage, "p", txt.serverError, "", ["error"], "", false); - } - } - xhrRegenerate.setRequestHeader("Content-Type", "application/json"); - xhrRegenerate.setRequestHeader("Authorization", "Bearer "+user.token); - xhrRegenerate.send(); - }); + addElement(divMessage, "p", getLocaly("message", true).message, "", [getLocaly("message", true).color], "", false); + removeLocaly("message"); } + // Les stats sur les comptes utilisateurs : + const xhrStats = new XMLHttpRequest(); + xhrStats.open("GET", apiUrl+userRoutes+getAdminStats); + xhrStats.onreadystatechange = function() + { + if (this.readyState == XMLHttpRequest.DONE) + { + let response=JSON.parse(this.responseText); + if (this.status === 200) + { + const mapText = + { + NB_USERS_24H : response.nbNewUsers24H, + NB_SUBSCRIPTIONS_24H : response.Subscriptions.nbSubscriptions24H, + NB_USERS_DELETED_24H : response.nbDeletedUsers24H, + NB_ANSWERS_24H : response.Answers.nbAnswers24H, + NB_USERS_TOT : response.nbNewUsersTot, + NB_SUBSCRIPTIONS_TOT : response.Subscriptions.nbSubscriptionsTot, + NB_SUBSCRIPTIONS_PREMIUM : response.Subscriptions.nbSubscriptionsPremium, + NB_ANSWERS_TOT : response.Answers.nbAnswersTot, + NB_USERS_DELETED_TOT : response.nbDeletedUsersTot, + NB_USERS_DELETED_VALIDED : response.nbDeletedUsersWasValided, + NB_USERS_DELETED_PREMIUM : response.nbDeletedUsersTotWasPremium + }; + addElement(divMessage, "p", replaceAll(txtStatsAdmin, mapText), "", "", "", false); + } + } + } + xhrStats.setRequestHeader("Authorization", "Bearer "+user.token); + xhrStats.send(); + + // Les questionnaires bientôt publiés : + const xhrNextQuestionnaires = new XMLHttpRequest(); + xhrNextQuestionnaires.open("GET", apiUrl+questionnaireRoutes+getListNextQuestionnaires); + xhrNextQuestionnaires.onreadystatechange = function() + { + if (this.readyState == XMLHttpRequest.DONE) + { + let response=JSON.parse(this.responseText); + if (this.status === 200 && Array.isArray(response.questionnaires)) + { + let listHTML="", dayStr, optionsDayStr = { weekday: 'long'}; + for(let i in response.questionnaires) + { + dayStr=new Intl.DateTimeFormat(lang, optionsDayStr).format(new Date(response.questionnaires[i].datePublishing)); + listHTML+="
  • "+dayStr+" "+dateFormat(response.questionnaires[i].datePublishing, availableLangs[0])+": "+response.questionnaires[i].title+""; + if(response.questionnaires[i].isPublishable===false) + listHTML+=" ("+txtNeedBeCompleted+")
    • "; + listHTML+=""; + } + if(response.questionnaires.length!==0) + addElement(divQuestionnaires, "h2", txtNextQuestionnairesList.replace("#NB", response.questionnaires.length)); + addElement(divQuestionnaires, "h4", txtNextDateWithoutQuestionnaire+dateFormat(response.dateNeeded, availableLangs[0]), "", ["info"], "", false); + addElement(divQuestionnaires, "ul", listHTML, "", "", "", false); + } + } + } + xhrNextQuestionnaires.setRequestHeader("Authorization", "Bearer "+user.token); + xhrNextQuestionnaires.send(); + + // Traitement demande régénérer HTML + btnRegenerate.addEventListener("click", function(e) + { + e.preventDefault(); + const xhrRegenerate = new XMLHttpRequest(); + xhrRegenerate.open("GET", apiUrl+questionnaireRoutes+regenerateHTML); + xhrRegenerate.onreadystatechange = function() + { + if (this.readyState == XMLHttpRequest.DONE) + { + let response=JSON.parse(this.responseText); + if (this.status === 200 && response.message!=undefined) + addElement(divMessage, "p", response.message, "", ["success"], "", false); + else + addElement(divMessage, "p", txt.serverError, "", ["error"], "", false); + } + } + xhrRegenerate.setRequestHeader("Content-Type", "application/json"); + xhrRegenerate.setRequestHeader("Authorization", "Bearer "+user.token); + xhrRegenerate.send(); + }); } + } catch(e) { - addElement(divMessage, "p", txt.serverError, "", ["error"]); + addElement(divCrash, "p", txtServerError, "", ["error"]); console.error(e); } }