700 lines
42 KiB
JavaScript
700 lines
42 KiB
JavaScript
// -- GESTION DU FORMULAIRE PERMETTANT DE SAISIR / ÉDITER LES QUIZS ET LEURS DÉPENDANCES (LIENS, IMAGES, TAGS, ETC.)
|
|
|
|
/// Vérifie que l'utilisateur est bien connecté, a le bon statut et le redirige vers le formulaire d'inscription si ce n'est pas le cas.
|
|
/// Si c'est ok, propose un moteur de recherche permettant de chercher un quiz
|
|
/// Si un id est passé par l'url on affiche les informations du quiz dans un formulaire permettant de l'éditer/supprimer avec une liste des éléments liés (liens, illustrations, questions...) pouvant eux-mêmes être édités/supprimés.
|
|
/// Si le nombre max configuré pour chacun de ses éléments n'est pas atteint, il est aussi proposé d'ajouter un nouvel élément.
|
|
/// Sinon pas d'id passé par l'url, on affiche un formulaire vide permettant d'en saisir un nouveau avec ses tags.
|
|
|
|
// 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 reste 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 { empyAndHideForm, empyForm, getDatasFromInputs, setAttributesToInputs } from "./tools/forms.js";
|
|
import { dateFormat, isEmpty, replaceAll } from "../../tools/main";
|
|
import { getUrlParams } from "./tools/url.js";
|
|
import { checkSession, getConfig } from "./tools/users.js";
|
|
|
|
// Dictionnaires :
|
|
const txt = require("../../lang/"+lang+"/general");
|
|
const txtUsers = require("../../lang/"+lang+"/user");
|
|
const txtQuestionnaire = require("../../lang/"+lang+"/questionnaire");
|
|
const txtQuestion = require("../../lang/"+lang+"/question");
|
|
const txtLink = require("../../lang/"+lang+"/link");
|
|
const txtIllustration = require("../../lang/"+lang+"/illustration");
|
|
|
|
helloDev();
|
|
|
|
// Principaux éléments du DOM manipulés :
|
|
const divMain = document.getElementById("main-content");
|
|
const divMessage = document.getElementById("message");
|
|
const divResponse = document.getElementById("response");
|
|
const formQuestionnaire = document.getElementById("questionnaires");
|
|
const inputClassification = document.getElementById("classification");
|
|
const helpClassification = document.getElementById("helpClassification");
|
|
const helpPublishingAt = document.getElementById("helpPublishingAt");
|
|
const deleteCheckBox = document.getElementById("deleteOkLabel");
|
|
const btnNewQuestionnaire = document.getElementById("wantNewQuestionnaire");
|
|
const btnPreviewQuestionnaire = document.getElementById("previewQuestionnaire");
|
|
|
|
const divQuestionnaires = document.getElementById("questionnairesList");
|
|
|
|
const formSearch = document.getElementById("search");
|
|
const divSearchResult = document.getElementById("searchResult");
|
|
|
|
const formLink = document.getElementById("links");
|
|
const formIllustration = document.getElementById("illustrations");
|
|
const formQuestion = document.getElementById("questions");
|
|
const divLinks = document.getElementById("linksList");
|
|
const divIllustrations = document.getElementById("illustrationsList");
|
|
const divQuestions = document.getElementById("questionsList");
|
|
|
|
const initialise = async () =>
|
|
{
|
|
try
|
|
{
|
|
const config = await getConfig();
|
|
if(!config)
|
|
addElement(divMessage, "p", txt.serverError, "", ["error"]);
|
|
else
|
|
{
|
|
const isConnected=await checkSession(["manager", "admin"], "/"+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);
|
|
|
|
// Initialisation du formulaire de recherche :
|
|
setAttributesToInputs(config, formSearch);
|
|
|
|
// Initialise le formulaire permettant de mettre à jour les infos de base du questionnaire :
|
|
setAttributesToInputs(config.Questionnaire, formQuestionnaire);
|
|
// Case de suppression cachée par défaut, car inutile pour formulaire de création
|
|
deleteCheckBox.style.display="none";
|
|
|
|
// Fonction vidant et cachant tous les formulaires annexes
|
|
const hideAllForms = () =>
|
|
{
|
|
empyAndHideForm(formLink);
|
|
if(txtLink.defaultValue!=0)
|
|
document.getElementById("anchor").value=txtLink.defaultValue;
|
|
empyAndHideForm(formIllustration);
|
|
empyAndHideForm(formQuestion);
|
|
}
|
|
hideAllForms();
|
|
|
|
// Affiche les infos connues concernant les liens
|
|
const showLinkInfos = (Links) =>
|
|
{
|
|
addElement(divLinks, "h4", txtLink.introTitle);// remplace l'existant dans divLinks
|
|
let listLinks="";
|
|
for(let i in Links)
|
|
listLinks+="<li><a href='"+Links[i].url+"' target='_blank'>"+Links[i].anchor+"</a> | <a href='#updateLink"+Links[i].id+"' id='#updateLink"+Links[i].id+"' >"+txt.updateBtnTxt+"</a> | <a href='#deleteLink"+Links[i].id+"' id='#deleteLink"+Links[i].id+"' >"+txt.deleteBtnTxt+"</a></li>";
|
|
if(listLinks==="")
|
|
listLinks="<li>"+txtLink.introNoLink+"</li>";
|
|
addElement(divLinks, "ul", listLinks, "", ["information"], "", false);// à intégrer dans le DOM pour pouvoir ajouter des addEventListener ensuite
|
|
for(let i in Links)
|
|
{
|
|
document.getElementById("#updateLink"+Links[i].id).addEventListener("click", function(e)
|
|
{
|
|
e.preventDefault();
|
|
showFormLinkInfos(Links[i]);
|
|
window.location.assign("#links");
|
|
});
|
|
document.getElementById("#deleteLink"+Links[i].id).addEventListener("click", function(e)
|
|
{
|
|
e.preventDefault();
|
|
showFormLinkInfos(Links[i]);
|
|
formLink.elements["deleteOk"].value=true;
|
|
sendLinkForm();
|
|
});
|
|
}
|
|
if(config.nbLinksMax > Links.length || config.nbLinksMax===0)
|
|
{
|
|
if(Links.length < config.nbLinksMin)
|
|
addElement(divLinks, "a", txt.addBtnTxt, "#newLink", ["error"], { href:"#newLink" }, false);
|
|
else
|
|
addElement(divLinks, "a", txt.addBtnTxt, "#newLink", ["information"], { href:"#newLink" }, false);
|
|
document.getElementById("#newLink").addEventListener("click", function(e)
|
|
{
|
|
e.preventDefault();
|
|
hideAllForms();
|
|
formLink.style.display="block";
|
|
formLink.elements["QuestionnaireId"].value=formQuestionnaire.elements["id"].value;
|
|
window.location.assign("#links");
|
|
setAttributesToInputs(config.Link, formLink);
|
|
});
|
|
}
|
|
}
|
|
|
|
// Affiche les infos connues concernant les illustrations
|
|
const showIllustrationInfos = (Illustrations) =>
|
|
{
|
|
addElement(divIllustrations, "h4", txtIllustration.introTitle);// remplace l'existant dans divIllustrations
|
|
let listIllustrations="";
|
|
for(let i in Illustrations)
|
|
listIllustrations+="<li><a href='"+configFrontEnd.illustrationDir+Illustrations[i].url+"' target='_blank'><img src='"+configFrontEnd.illustrationDir+Illustrations[i].url+"' alt='"+txtIllustration.defaultAlt+"' style='max-height:150px'></a> | <a href='#updateIllustration"+Illustrations[i].id+"' id='#updateIllustration"+Illustrations[i].id+"' >"+txt.updateBtnTxt+"</a> | <a href='#deleteIllustration"+Illustrations[i].id+"' id='#deleteIllustration"+Illustrations[i].id+"' >"+txt.deleteBtnTxt+"</a></li>";
|
|
if(listIllustrations==="")
|
|
listIllustrations="<li>"+txtIllustration.introNoIllustration+"</li>";
|
|
addElement(divIllustrations, "ul", listIllustrations, "", ["information"], "", false);// à intégrer dans le DOM pour pouvoir ajouter des addEventListener ensuite
|
|
for(let i in Illustrations)
|
|
{
|
|
document.getElementById("#updateIllustration"+Illustrations[i].id).addEventListener("click", function(e)
|
|
{
|
|
e.preventDefault();
|
|
showFormIllustrationInfos(Illustrations[i]);
|
|
window.location.assign("#illustrations");
|
|
});
|
|
document.getElementById("#deleteIllustration"+Illustrations[i].id).addEventListener("click", function(e)
|
|
{
|
|
e.preventDefault();
|
|
showFormIllustrationInfos(Illustrations[i]);
|
|
formIllustration.elements["deleteOk"].value=true;
|
|
sendIllustrationForm();
|
|
});
|
|
}
|
|
if(config.nbIllustrationsMax > Illustrations.length || config.nbIllustrationsMax===0)
|
|
{
|
|
if(Illustrations.length < config.nbIllustrationsMin)
|
|
addElement(divIllustrations, "a", txt.addBtnTxt, "#newIllustration", ["error"], { href:"#newIllustration" }, false);
|
|
else
|
|
addElement(divIllustrations, "a", txt.addBtnTxt, "#newIllustration", ["information"], { href:"#newIllustration" }, false);
|
|
document.getElementById("#newIllustration").addEventListener("click", function(e)
|
|
{
|
|
e.preventDefault();
|
|
hideAllForms();
|
|
formIllustration.style.display="block";
|
|
formIllustration.elements["QuestionnaireId"].value=formQuestionnaire.elements["id"].value;
|
|
window.location.assign("#illustrations");
|
|
setAttributesToInputs(config.Illustration, formIllustration);
|
|
});
|
|
}
|
|
}
|
|
|
|
// Affiche les infos connues concernant les questions
|
|
const showQuestionInfos = (Questions) =>
|
|
{
|
|
addElement(divQuestions, "h4", txtQuestion.introTitle);// remplace l'existant dans divQuestions
|
|
let listQuestions="";
|
|
for(let i in Questions)
|
|
listQuestions+="<li>"+Questions[i].Question.rank+" - "+Questions[i].Question.text+" | <a href='#updateQuestion"+Questions[i].Question.id+"' id='#updateQuestion"+Questions[i].Question.id+"' >"+txt.updateBtnTxt+"</a> | <a href='#deleteQuestion"+Questions[i].Question.id+"' id='#deleteQuestion"+Questions[i].Question.id+"' >"+txt.deleteBtnTxt+"</a></li>";
|
|
if(listQuestions==="")
|
|
listQuestions="<li>"+txtQuestion.introNoQuestion+"</li>";
|
|
addElement(divQuestions, "ul", listQuestions, "", ["information"], "", false);// à intégrer dans le DOM pour pouvoir ajouter des addEventListener ensuite
|
|
for(let i in Questions)
|
|
{
|
|
document.getElementById("#updateQuestion"+Questions[i].Question.id).addEventListener("click", function(e)
|
|
{
|
|
e.preventDefault();
|
|
showFormQuestionInfos(Questions[i]);
|
|
window.location.assign("#links");
|
|
});
|
|
document.getElementById("#deleteQuestion"+Questions[i].Question.id).addEventListener("click", function(e)
|
|
{
|
|
e.preventDefault();
|
|
showFormQuestionInfos(Questions[i]);
|
|
formQuestion.elements["deleteOk"].value=true;
|
|
sendQuestionForm();
|
|
});
|
|
}
|
|
|
|
if(config.nbQuestionsMax > Questions.length || config.nbQuestionsMax===0)
|
|
{
|
|
if(Questions.length < config.nbQuestionsMin)
|
|
addElement(divQuestions, "a", txt.addBtnTxt, "#newQuestion", ["error"], { href:"#newQuestion" }, false);
|
|
else
|
|
addElement(divQuestions, "a", txt.addBtnTxt, "#newQuestion", ["information"], { href:"#newQuestion" }, false);
|
|
document.getElementById("#newQuestion").addEventListener("click", function(e)
|
|
{
|
|
e.preventDefault();
|
|
hideAllForms();
|
|
formQuestion.style.display="block";
|
|
formQuestion.elements["QuestionnaireId"].value=formQuestionnaire.elements["id"].value;
|
|
formQuestion.elements["rank"].value=(Questions.length===0) ? config.Question.rank.defaultValue : Questions.length+1;
|
|
window.location.assign("#questions");
|
|
setAttributesToInputs(config.Question, formQuestion);
|
|
});
|
|
}
|
|
}
|
|
|
|
// Fonction affichant les infos d'un lien dans le formulaire adhoc
|
|
const showFormLinkInfos = (Link) =>
|
|
{
|
|
// on commence par cacher et vider tous les formulaires annexes
|
|
hideAllForms();
|
|
// puis on affiche celui dont l'id est passé avec ses données connues
|
|
formLink.style.display="block";
|
|
for(let data in Link)
|
|
{
|
|
if(formLink.elements[data]!==undefined)
|
|
formLink.elements[data].value=Link[data];
|
|
}
|
|
// + les contraintes de champ :
|
|
setAttributesToInputs(config.Link, formLink);
|
|
}
|
|
|
|
// Fonction affichant les infos d'une illustration dans le formulaire adhoc
|
|
const showFormIllustrationInfos = (Illustration) =>
|
|
{
|
|
// on commence par cacher et vider tous les formulaires annexes
|
|
hideAllForms();
|
|
// puis on affiche celui dont l'id est passé avec ses données connues
|
|
formIllustration.style.display="block";
|
|
for(let data in Illustration)
|
|
{
|
|
if(formIllustration.elements[data]!==undefined)
|
|
formIllustration.elements[data].value=Illustration[data];
|
|
}
|
|
// + les contraintes de champ :
|
|
setAttributesToInputs(config.Illustration, formIllustration);
|
|
// sauf le champ file qui n'est plus requis quand un fichier existe déjà !
|
|
formIllustration.elements["image"].removeAttribute("required");
|
|
}
|
|
|
|
// Fonction affichant les infos d'une question + ses réponses possibles dans le formulaire adhoc
|
|
const showFormQuestionInfos = (Question) =>
|
|
{
|
|
// on commence par cacher et vider tous les formulaires annexes
|
|
hideAllForms();
|
|
// puis on affiche celui dont l'id est passé avec ses données connues
|
|
formQuestion.style.display="block";
|
|
for(let data in Question.Question)
|
|
{
|
|
if(formQuestion.elements[data]!==undefined)
|
|
formQuestion.elements[data].value=Question.Question[data];
|
|
}
|
|
for(let data in Question.Choices)
|
|
{
|
|
if(formQuestion.elements["choiceText"+data]!==undefined)
|
|
{
|
|
formQuestion.elements["choiceText"+data].value=Question.Choices[data].text;
|
|
if(Question.Choices[data].isCorrect==true)
|
|
formQuestion.elements["choiceIsCorrect"+data].checked=true;
|
|
formQuestion.elements["idChoice"+data].value=Question.Choices[data].id;
|
|
}
|
|
}
|
|
// + les contraintes de champ :
|
|
setAttributesToInputs(config.Question, formQuestion);
|
|
}
|
|
|
|
// Fonction affichant les infos connues concernant un questionnaire et ses dépendances
|
|
const showFormQuestionnaireInfos = (id) =>
|
|
{
|
|
const xhrGetInfos = new XMLHttpRequest();
|
|
xhrGetInfos.open("GET", apiUrl+config.questionnaireRoutes+config.getQuestionnaireRoutes+"/"+id);
|
|
xhrGetInfos.onreadystatechange = function()
|
|
{
|
|
if (this.readyState == XMLHttpRequest.DONE)
|
|
{
|
|
let response=JSON.parse(this.responseText);
|
|
if (this.status === 200 && response.Questionnaire != undefined)
|
|
{
|
|
formQuestionnaire.reset();// pour ne pas garder données déjà affichées si vide dans ce qui est retourné
|
|
for(let data in response.Questionnaire)
|
|
{
|
|
if(formQuestionnaire.elements[data]!==undefined)
|
|
{
|
|
if(data==="publishingAt" && response.Questionnaire[data]!==null)
|
|
formQuestionnaire.elements[data].value=dateFormat(response.Questionnaire[data], "form");// !! revoir car format pouvant poser soucis si navigateur ne gère pas les champs de type "date"
|
|
else
|
|
formQuestionnaire.elements[data].value=response.Questionnaire[data];
|
|
}
|
|
}
|
|
deleteCheckBox.style.display="block";
|
|
}
|
|
if(response.Tags != undefined)
|
|
{
|
|
let classification="";
|
|
for(let i in response.Tags)
|
|
{
|
|
if(i==0)
|
|
classification+=response.Tags[i].name;
|
|
else
|
|
classification+=","+response.Tags[i].name;
|
|
}
|
|
formQuestionnaire.elements["classification"].value=classification;
|
|
}
|
|
divLinks.style.display="block";
|
|
divQuestions.style.display="block";
|
|
divIllustrations.style.display="block";
|
|
if(response.Links != undefined)
|
|
showLinkInfos(response.Links);
|
|
if(response.Questions != undefined)
|
|
showQuestionInfos(response.Questions);
|
|
if(response.Illustrations != undefined)
|
|
showIllustrationInfos(response.Illustrations);
|
|
helpPublishingAt.style.display="none";// info utile pour "placer" un nouveau quiz
|
|
// à revoir : remplacer lien pour un bouton + reset complet du formulaire, y compris champs hidden :
|
|
btnNewQuestionnaire.style.display="block";
|
|
btnNewQuestionnaire.setAttribute("href", configFrontEnd.questionnairesManagementPage);
|
|
btnPreviewQuestionnaire.style.display="block";
|
|
if(response.Questionnaire["isPublished"]===false)
|
|
btnPreviewQuestionnaire.setAttribute("href", apiUrl+config.questionnaireRoutes+config.previewQuestionnaireRoutes+"/"+id+"/"+user.token);
|
|
else
|
|
btnPreviewQuestionnaire.setAttribute("href", config.siteUrl+config.publishedQuestionnaireRoutes+response.Questionnaire["slug"]+".html");
|
|
}
|
|
}
|
|
xhrGetInfos.send();
|
|
}
|
|
|
|
// Si un id est passé par l'url, on essaye d'afficher le questionnaire :
|
|
let urlDatas=getUrlParams();
|
|
if(urlDatas && urlDatas.id!==undefined)
|
|
showFormQuestionnaireInfos(urlDatas.id);
|
|
|
|
// Traitement du lancement d'une recherche
|
|
formSearch.addEventListener("submit", function(e)
|
|
{
|
|
e.preventDefault();
|
|
let datas=getDatasFromInputs(formSearch);
|
|
const xhrSearch = new XMLHttpRequest();
|
|
xhrSearch.open("POST", apiUrl+config.questionnaireRoutes+config.searchAdminQuestionnairesRoute);
|
|
xhrSearch.onreadystatechange = function()
|
|
{
|
|
if (this.readyState == XMLHttpRequest.DONE)
|
|
{
|
|
let response=JSON.parse(this.responseText);
|
|
if (this.status === 200 && Array.isArray(response))
|
|
{
|
|
if(response.length===0)
|
|
addElement(divSearchResult, "p", txtQuestionnaire.notFound, "", ["information"]);
|
|
else
|
|
{
|
|
let selectHTML="<option value=''></option>";
|
|
for(let i in response)
|
|
selectHTML+="<option value='"+response[i].id+"'>"+response[i].title+"</option>";
|
|
addElement(divSearchResult, "select", selectHTML, "selectSearch");
|
|
const searchSelect=document.getElementById("selectSearch");
|
|
searchSelect.addEventListener("change", function()
|
|
{
|
|
if(searchSelect.value!=="")
|
|
showFormQuestionnaireInfos(searchSelect.value);
|
|
});
|
|
}
|
|
}
|
|
else
|
|
addElement(divSearchResult, "p", txt.serverError, "", ["error"]);
|
|
}
|
|
}
|
|
xhrSearch.setRequestHeader("Content-Type", "application/json");
|
|
xhrSearch.setRequestHeader("Authorization", "Bearer "+user.token);
|
|
if(datas)
|
|
xhrSearch.send(JSON.stringify(datas));
|
|
});
|
|
|
|
// Les questionnaires bientôt publiés. Dans une fonction car devant être rechargé.
|
|
const showNextQuestionnaires = () =>
|
|
{
|
|
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+="<li>"+dayStr+" "+dateFormat(response.questionnaires[i].datePublishing, "fr")+": <a href='"+configFrontEnd.questionnairesManagementPage+"?id="+response.questionnaires[i].id+"' id='questionnaire_"+response.questionnaires[i].id+"'>"+response.questionnaires[i].title+"</a>";
|
|
if(response.questionnaires[i].isPublishable===false)
|
|
listHTML+=" <span class='error'>("+txtQuestionnaire.needBeCompleted+")</li>";
|
|
listHTML+="</li>";
|
|
}
|
|
if(response.questionnaires.length!==0)
|
|
addElement(divQuestionnaires, "h3", txtQuestionnaire.nextQuestionnairesList.replace("#NB", response.questionnaires.length));
|
|
addElement(helpPublishingAt, "em", txtQuestionnaire.nextDateWithoutQuestionnaire+dateFormat(new Date(response.dateNeeded), "fr"));
|
|
addElement(divQuestionnaires, "ul", listHTML, "", "", "", false);
|
|
for(let i in response.questionnaires)
|
|
{
|
|
document.getElementById("questionnaire_"+response.questionnaires[i].id).addEventListener("click", function(e)
|
|
{
|
|
e.preventDefault();
|
|
showFormQuestionnaireInfos(e.target.id.split("_")[1]);
|
|
window.location.assign("#questionnaires");
|
|
});
|
|
}
|
|
}
|
|
}
|
|
}
|
|
xhrNextQuestionnaires.setRequestHeader("Authorization", "Bearer "+user.token);
|
|
xhrNextQuestionnaires.send();
|
|
}
|
|
showNextQuestionnaires();
|
|
|
|
// Aide saisie classement du quiz
|
|
inputClassification.addEventListener("input", function(e)
|
|
{
|
|
divResponse.innerHTML="";
|
|
const tags=inputClassification.value.split(",");
|
|
tags.reverse();
|
|
const lastTag=tags[0].trim();
|
|
if(lastTag.length >= 2)
|
|
{
|
|
// à revoir : importer la liste des tags lors de l'initialisation pour éviter les appels multiples
|
|
// mais dans ce cas actualiser cette liste après chaque mise à jour.
|
|
const xhrSearchTags = new XMLHttpRequest();
|
|
xhrSearchTags.open("POST", apiUrl+config.questionnaireRoutes+config.tagsSearchRoute);
|
|
xhrSearchTags.onreadystatechange = function()
|
|
{
|
|
if (this.readyState == XMLHttpRequest.DONE)
|
|
{
|
|
let response=JSON.parse(this.responseText);
|
|
if (this.status === 200 && Array.isArray(response))
|
|
{
|
|
helpClassification.innerHTML="";
|
|
for(let i in response)
|
|
{
|
|
addElement(helpClassification, "a", response[i].name, "#tag"+response[i].id, ["information"], { href:"#tag"+response[i].id }, false);
|
|
document.getElementById("#tag"+response[i].id).addEventListener("click", function(e)
|
|
{
|
|
e.preventDefault();
|
|
tags[0]=e.target.innerHTML;
|
|
tags.reverse();
|
|
inputClassification.value=tags.join(",");
|
|
});
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
xhrSearchTags.setRequestHeader("Content-Type", "application/json");
|
|
xhrSearchTags.setRequestHeader("Authorization", "Bearer "+user.token);
|
|
xhrSearchTags.send(JSON.stringify({search: lastTag}));
|
|
}
|
|
});
|
|
|
|
// Traitement de l'envoi du formulaire des infos de base du quiz
|
|
formQuestionnaire.addEventListener("submit", function(e)
|
|
{
|
|
e.preventDefault();
|
|
divResponse.innerHTML="";
|
|
let datas=getDatasFromInputs(formQuestionnaire);
|
|
const xhrQuestionnaireDatas = new XMLHttpRequest();
|
|
if(!isEmpty(datas.id) && (datas.deleteOk!==undefined))
|
|
xhrQuestionnaireDatas.open("DELETE", apiUrl+config.questionnaireRoutes+"/"+datas.id);
|
|
else if(!isEmpty(datas.id))
|
|
xhrQuestionnaireDatas.open("PUT", apiUrl+config.questionnaireRoutes+"/"+datas.id);
|
|
else
|
|
xhrQuestionnaireDatas.open("POST", apiUrl+config.questionnaireRoutes+"/");
|
|
xhrQuestionnaireDatas.onreadystatechange = function()
|
|
{
|
|
if (this.readyState == XMLHttpRequest.DONE)
|
|
{
|
|
let response=JSON.parse(this.responseText);
|
|
if (this.status === 201 && response.id!=undefined)
|
|
{
|
|
addElement(divResponse, "p", txt.addOkMessage, "", ["success"]);
|
|
datas.id=response.id;
|
|
showNextQuestionnaires();// peut avoir évolué suivant ce qui s'est passé
|
|
}
|
|
else 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"]);
|
|
showNextQuestionnaires();// peut avoir évolué suivant ce qui s'est passé
|
|
}
|
|
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"]);
|
|
if(datas.deleteOk===undefined)
|
|
showFormQuestionnaireInfos(datas.id);
|
|
else
|
|
formQuestionnaire.reset();
|
|
}
|
|
}
|
|
xhrQuestionnaireDatas.setRequestHeader("Content-Type", "application/json");
|
|
xhrQuestionnaireDatas.setRequestHeader("Authorization", "Bearer "+user.token);
|
|
if(datas)
|
|
xhrQuestionnaireDatas.send(JSON.stringify(datas));
|
|
});
|
|
|
|
// L'envoi des données d'un lien peut être généré par le bouton formulaire ou par le lien supprimer
|
|
const sendLinkForm = () =>
|
|
{
|
|
const divResponseLink=document.getElementById("responseLink");
|
|
divResponseLink.innerHTML="";
|
|
let datas=getDatasFromInputs(formLink);
|
|
const xhrLinkDatas = new XMLHttpRequest();
|
|
if(!isEmpty(datas.id) && (!isEmpty(datas.deleteOk)))
|
|
xhrLinkDatas.open("DELETE", apiUrl+config.linksRoute+datas.id);
|
|
else if(!isEmpty(datas.id))
|
|
xhrLinkDatas.open("PUT", apiUrl+config.linksRoute+datas.id);
|
|
else
|
|
xhrLinkDatas.open("POST", apiUrl+config.linksRoute);
|
|
xhrLinkDatas.onreadystatechange = function()
|
|
{
|
|
if (this.readyState == XMLHttpRequest.DONE)
|
|
{
|
|
let response=JSON.parse(this.responseText);
|
|
if ((this.status === 200 || this.status === 201) && response.message!=undefined && response.questionnaire!=undefined)
|
|
{
|
|
if(Array.isArray(response.message))
|
|
response.message = response.message.join("<br>");
|
|
else
|
|
response.message = response.message;
|
|
showLinkInfos(response.questionnaire.Links);// le serveur me retourne une version actualisée de la liste des liens
|
|
addElement(divLinks, "p", response.message, "", ["success"], "", false);
|
|
hideAllForms();
|
|
window.location.assign("#linksList");
|
|
showNextQuestionnaires();// peut avoir évolué suivant ce qui s'est passé
|
|
}
|
|
else if (response.errors)
|
|
{
|
|
if(Array.isArray(response.errors))
|
|
response.errors = response.errors.join("<br>");
|
|
else
|
|
response.errors = txt.serverError;
|
|
addElement(divResponseLink, "p", response.errors, "", ["error"]);
|
|
}
|
|
else
|
|
addElement(divResponseLink, "p", txt.serverError, "", ["error"]);
|
|
}
|
|
}
|
|
xhrLinkDatas.setRequestHeader("Content-Type", "application/json");
|
|
xhrLinkDatas.setRequestHeader("Authorization", "Bearer "+user.token);
|
|
xhrLinkDatas.send(JSON.stringify(datas));
|
|
}
|
|
formLink.addEventListener("submit", function(e)
|
|
{
|
|
e.preventDefault();
|
|
sendLinkForm();
|
|
});
|
|
|
|
// L'envoi des données d'un lien peut être généré par le bouton formulaire ou par le lien supprimer
|
|
const sendIllustrationForm = () =>
|
|
{
|
|
const divResponseIllustration=document.getElementById("responseIllustration");
|
|
divResponseIllustration.innerHTML="";
|
|
let datas=getDatasFromInputs(formIllustration);
|
|
let datasWithFiles=new FormData(formIllustration); // il me manque les informations du fichier avec ma fonction getDatasFromInputs
|
|
const xhrIllustrationDatas = new XMLHttpRequest();
|
|
if(!isEmpty(datas.id) && (!isEmpty(datas.deleteOk)))
|
|
xhrIllustrationDatas.open("DELETE", apiUrl+config.illustrationsRoute+datas.id);
|
|
else if(!isEmpty(datas.id))
|
|
xhrIllustrationDatas.open("PUT", apiUrl+config.illustrationsRoute+datas.id);
|
|
else
|
|
xhrIllustrationDatas.open("POST", apiUrl+config.illustrationsRoute);
|
|
xhrIllustrationDatas.onreadystatechange = function()
|
|
{
|
|
if (this.readyState == XMLHttpRequest.DONE)
|
|
{
|
|
let response=JSON.parse(this.responseText);
|
|
if ((this.status === 200 || this.status === 201) && response.message!=undefined && response.questionnaire!=undefined)
|
|
{
|
|
if(Array.isArray(response.message))
|
|
response.message = response.message.join("<br>");
|
|
else
|
|
response.message = response.message;
|
|
showIllustrationInfos(response.questionnaire.Illustrations);// le serveur me retourne une version actualisée de la liste des liens
|
|
addElement(divIllustrations, "p", response.message, "", ["success"], "", false);
|
|
hideAllForms();
|
|
window.location.assign("#illustrationsList");
|
|
showNextQuestionnaires();// peut avoir évolué suivant ce qui s'est passé
|
|
}
|
|
else if (response.errors)
|
|
{
|
|
if(Array.isArray(response.errors))
|
|
response.errors = response.errors.join("<br>");
|
|
else
|
|
response.errors = txt.serverError;
|
|
addElement(divResponseIllustration, "p", response.errors, "", ["error"]);
|
|
}
|
|
else
|
|
addElement(divResponseIllustration, "p", txt.serverError, "", ["error"]);
|
|
}
|
|
}
|
|
xhrIllustrationDatas.setRequestHeader("Authorization", "Bearer "+user.token);
|
|
xhrIllustrationDatas.send(datasWithFiles);
|
|
}
|
|
formIllustration.addEventListener("submit", function(e)
|
|
{
|
|
e.preventDefault();
|
|
sendIllustrationForm();
|
|
});
|
|
|
|
|
|
// L'envoi des données d'une question et de ses réponse qui peut être généré par le bouton submit ou par le lien supprimer
|
|
const sendQuestionForm = () =>
|
|
{
|
|
const divResponseQuestion=document.getElementById("responseQuestion");
|
|
divResponseQuestion.innerHTML="";
|
|
let datas=getDatasFromInputs(formQuestion);
|
|
const xhrQuestionDatas = new XMLHttpRequest();
|
|
if(!isEmpty(datas.id) && (!isEmpty(datas.deleteOk)))
|
|
xhrQuestionDatas.open("DELETE", apiUrl+config.questionsRoute+datas.id);
|
|
else if(!isEmpty(datas.id))
|
|
xhrQuestionDatas.open("PUT", apiUrl+config.questionsRoute+datas.id);
|
|
else
|
|
xhrQuestionDatas.open("POST", apiUrl+config.questionsRoute);
|
|
xhrQuestionDatas.onreadystatechange = function()
|
|
{
|
|
if (this.readyState == XMLHttpRequest.DONE)
|
|
{
|
|
let response=JSON.parse(this.responseText);
|
|
if ((this.status === 200 || this.status === 201) && response.message!=undefined && response.questionnaire!=undefined)
|
|
{
|
|
if(Array.isArray(response.message))
|
|
response.message = response.message.join("<br>");
|
|
else
|
|
response.message = response.message;
|
|
showQuestionInfos(response.questionnaire.Questions);// le serveur me retourne une version actualisée de la liste des questions
|
|
addElement(divQuestions, "p", response.message, "", ["success"], "", false);
|
|
hideAllForms();
|
|
window.location.assign("#questionsList");
|
|
showNextQuestionnaires();// peut avoir évolué suivant ce qui s'est passé
|
|
}
|
|
else if (response.errors)
|
|
{
|
|
if(Array.isArray(response.errors))
|
|
response.errors = response.errors.join("<br>");
|
|
else
|
|
response.errors = txt.serverError;
|
|
addElement(divResponseQuestion, "p", response.errors, "", ["error"]);
|
|
}
|
|
else
|
|
addElement(divResponseQuestion, "p", txt.serverError, "", ["error"]);
|
|
}
|
|
}
|
|
xhrQuestionDatas.setRequestHeader("Content-Type", "application/json");
|
|
xhrQuestionDatas.setRequestHeader("Authorization", "Bearer "+user.token);
|
|
xhrQuestionDatas.send(JSON.stringify(datas));
|
|
}
|
|
formQuestion.addEventListener("submit", function(e)
|
|
{
|
|
e.preventDefault();
|
|
sendQuestionForm();
|
|
});
|
|
}
|
|
}
|
|
}
|
|
catch(e)
|
|
{
|
|
console.error(e);
|
|
addElement(divMessage, "p", txt.serverError, "", ["error"]);
|
|
}
|
|
}
|
|
initialise(); |