Dyris

Dyris est un outil pour créer des QCM (questionnaire à choix multiples) en ligne.

Site officiel : http://dyris.free.fr/

• version disponible au 06/11/2023 : dyris 24_2

Cet outil utilise JavaScript pour rendre le QCM dynamique.

Mise en forme du texte

Depuis la version 24, il est possible d'utiliser la syntaxe MathML pour l'insertion de formules mathématiques.

Syntaxe	Rendu	Commentaire
Exemple	Exemple	Exemple

Personnalisation générale

Texte de l'interface

Concernant les différents textes de l'interface, je les personnalise pour :

• éviter les textes "tout en lettre capital" ;
• respecter les règles de typographie françaises ;
• personnaliser certains textes pour éviter les ambiguïtés (remplacement du terme "identifiant" par "pseudo"...) ;
• ...

C'est le fichier textes.js qui est modifié.

Tableau de modification des textes

Texte original	Texte personnalisé	Changement	Commentaire
titre("SELECTION DES THEMES")	titre("Sélection des thèmes")	Ne pas abuser des lettres capitales, lettre accentuée
titre("NOMBRE DE QUESTIONS")	titre("Nombre de questions")	Ne pas abuser des lettres capitales
titre("QUESTION N°")	titre("Question n° ")	Ne pas abuser des lettres capitales
titre("Note : ")	titre("Note : ")	Ne pas abuser des lettres capitales
titre("THEME(S) SELECTIONNE(S)")	titre("Thème(s) sélectionné(s)")	Ne pas abuser des lettres capitales, lettre accentuée
titre("NOMBRE DE QUESTIONS CHOISI")	titre("Nombre de questions choisi")	Ne pas abuser des lettres capitales
titre("VOTRE NOTE")	titre("Votre note")	Ne pas abuser des lettres capitales
titre("TEMPS MIS POUR REPONDRE AUX QUESTIONS")	titre("Temps mis pour répondre aux questions")	Ne pas abuser des lettres capitales, lettre accentuée
titre("APPRECIATION")	titre("Appréciation")	Ne pas abuser des lettres capitales, lettre accentuée
bouton("COMMENCER")	bouton("Commencer")	Ne pas abuser des lettres capitales
bouton("QUITTER")	bouton("Quitter")	Ne pas abuser des lettres capitales
bouton("VALIDER")	bouton("Valider")	Ne pas abuser des lettres capitales
bouton("QUESTION SUIVANTE")	bouton("Suivant")	Ne pas abuser des lettres capitales
bouton("JE NE SAIS PAS")	bouton("Je ne sais pas")	Ne pas abuser des lettres capitales
bouton("ARRETER")	bouton("Arrêter")	Ne pas abuser des lettres capitales, lettre accentuée
bouton("ACCUEIL")	bouton("Accueil")	Ne pas abuser des lettres capitales
bouton("CONCLUSION")	bouton("Conclusion")	Ne pas abuser des lettres capitales
bouton("ENREGISTRER LE SCORE")	bouton("Enregistrer le score")	Ne pas abuser des lettres capitales
bouton("AIDE")	bouton("Aide")	Ne pas abuser des lettres capitales
fenetre("Sélectionnez un thème au moins.")	fenetre("Sélectionnez un thème au moins.")
fenetre("Veuillez choisir un nombre d'exercices.")	fenetre("Veuillez choisir un nombre d'exercices.")
fenetre("Pas assez de questions disponibles avec ce choix d'options!")	fenetre("Pas assez de questions disponibles avec ce choix d'options !")	Respect des règles typographiques
fenetre("Inscrivez votre identifiant pour commencer l'évaluation.")	fenetre("Inscrivez votre pseudo pour commencer l'évaluation.")
fenetre("Votre identifiant est invalide.")	fenetre("Votre pseudo est invalide.")
fenetre("Votre identifiant ou mot de passe est incorrect.")	fenetre("Votre mot de passe est incorrect.")
fenetre("Vous n'avez pas répondu à la question!")	fenetre("Vous n'avez pas répondu à la question !")	Respect des règles typographiques
fenetre("Votre score a bien été enregistré.")	fenetre("Votre score a bien été enregistré.")
confirmation("Vous n'avez pas répondu complètement à la question. Etes-vous sûr de vouloir continuer?")	confirmation("Vous n'avez pas répondu complètement à la question. Êtes-vous sûr de vouloir continuer ?")	Respect de la typographie
confirmation("Vous n'avez pas terminé. Etes-vous sûr de vouloir quitter?")	confirmation("Vous n'avez pas terminé. Êtes-vous sûr de vouloir quitter ?")	Respect des règles typographiques
mot("Tous les thèmes")	mot("Tous les thèmes")
mot("questions")	mot("questions")
mot("Identifiant : ")	mot("pseudo : ")
mot("Mot de passe : ")	mot("Mot de passe : ")
mot("Avertissement Dyris")	mot("QCM froid, nouveau score...")	Personnalisation en fonction du thème du QCM
mot("Un nouveau bilan est sauvegardé sur le serveur.")	mot("QCM froid, un nouveau score est sauvegardé sur le serveur.")	Personnalisation en fonction du thème du QCM
score("Identifiant")	score("pseudo")	Personnalisation pour éviter les ambiguïtés
score("Thème(s) choisi(s)")	score("Thème(s) choisi(s)")
score("Nombre de questions")	score("Nombre de questions")
score("Temps")	score("Temps")
score("Note")	score("Note")
score("EFFACER LES SCORES")	score("Effacer les scores")	Ne pas abuser des lettres capitales

Personnalisation 1

Dans la page du mode d'emploi, j'ai intégré un formulaire de contact.

Fichier du mode d'emploi à personnaliser :

• ...\qcm\secinfo\pages\mode_emploi.php

Modification 1

Cette modification concerne le libellé du message généré à la suite de la validation du formulaire de contact ; il est personnalisé en fonction du QCM concerné :

• $sujet = 'QCM, réseau informatique : message';
• $message = "Ce message concerne le formulaire de contact du QCM réseau informatique...

Modification 2

La modification a pour but de mettre en évidence le message indiquant que le commentaire du formulaire de contact a bien été envoyé. Cela se fait en mettant le message sur fond vert avec une écriture en blanc.

Avant modification :

• echo "Votre commentaire a bien été envoyé";

Après modification :

• echo "<span style='background: darkgreen; color: white'>&nbsp;Votre commentaire a bien été envoyé&nbsp;</span>";

Personnalisation 2

Dans la page du mode d'emploi, j'ai intégré un formulaire de contact.

Fichier du mode d'emploi à personnaliser :

• ...\qcm\secinfo\textes.js

Modification 1

La modification a pour but d'éviter qu'un utilisateur demande quel est son identifiant ; en effet le terme identifiant peut faire penser qu'il faut être enregistré préalablement pour pouvoir utiliser le QCM.

Avant modification :

• mot("Identifiant : ");
• score("Identifiant");

Après modification :

• mot("pseudo : ");
• score("pseudo");

Amélioration

Amélioration souhaitée

Utilisant la version dyris 20.4, voici des améliorations suggérées :

• faire en sorte que la zone d'illustration soit de taille fixe ;
• faire en sorte que les boutons soient toujours à la même place :
  • Le bouton validé à un emplacement fixe,
  • les boutons "Je ne sais pas" et "Suivant" à la même place,
  • le bouton "Arrêter" à un emplacement fixe,
• lorsque la solution est affichée, afficher, s'il y en a une, l'image correspondant à la solution ;
• proposer une mise en forme adaptative (écran large, écran étroit, écran de smartphone...).

Amélioration effectuée sur la version 16

Astuce pour que les sélections sur les cases à cocher et sur les boutons radios soit plus pratique ; un clic sur le libellé agit sur l'élément :

• ajout de la balise <label> pour encadrer le code de la balise <input>

---

Code avant modification, fichier vue.js, ligne 50, page d'affichage des thèmes :

function afficher_themes() {
      ...
      for (i=0;i<mod.th.length;i++) {
         ch+='<input type="checkbox" name="case'+i+'" onclick="p1_choisir_themes();"';
         if (mod.th[i].choisi=="oui") ch+=' checked';
         ch+='>&nbsp;&nbsp;'+mod.th[i].titre+'<br>';
      }
      ch+='<input type="checkbox" name="tous" onclick="p1_choisir_themes();">&nbsp;&nbsp;'+txt.mot[0];
   }
   else {
      ch+='<input type="radio" name="ch_th" checked>&nbsp;&nbsp;'+mod.th[0].titre+'<br>';
      for (i=1;i<mod.th.length;i++) {
         ch+='<input type="radio" name="ch_th"';
         if (mod.th[i].choisi=="oui") ch+=' checked';
         ch+='>&nbsp;&nbsp;'+mod.th[i].titre+'<br>';
      }
   }

Code après modification, fichier vue.js, ligne 50, page d'affichage des thèmes :

function afficher_themes() {
      ...
      for (i=0;i<mod.th.length;i++) {
         ch+='<label><input type="checkbox" name="case'+i+'" onclick="p1_choisir_themes();"';
         if (mod.th[i].choisi=="oui") ch+=' checked';
         ch+='>&nbsp;'+mod.th[i].titre+'</label><br />';
      }
      ch+='<label><input type="checkbox" name="tous" onclick="p1_choisir_themes();">&nbsp;'+txt.mot[0]+'</label>';
   }
   else {
      ch+='<label><input type="radio" name="ch_th" checked>&nbsp;&nbsp;'+mod.th[0].titre+'<br />';
      for (i=1;i<mod.th.length;i++) {
         ch+='<input type="radio" name="ch_th"';
         if (mod.th[i].choisi=="oui") ch+=' checked';
         ch+='>&nbsp;'+mod.th[i].titre+'</label><br />';
         ...

---

Code avant modification, fichier vue.js, ligne 68, fonction d'affichage du nombre de questions :

function afficher_nb_questions() {
   var ch='<div class="cadre"><h2>'+txt.titre[1]+'</h2>';
   ch+='<input type="radio" name="ch_nb" checked>&nbsp;&nbsp;'+opt.nb_questions[0]+' '+txt.mot[1]+'<br />';
   for (var i=1;i<opt.nb_questions.length;i++) {
      ch+='<input type="radio" name="ch_nb"';
      if (cont.nb_quest_choisi==opt.nb_questions[i]) ch+=' checked';
      ch+='>&nbsp;&nbsp;'+opt.nb_questions[i]+' '+txt.mot[1]+'<br />';
   }
   ch+='</div>';
   return ch;
}

Code après modification, fichier vue.js, ligne 68, fonction d'affichage du nombre de questions :

function afficher_nb_questions() {
   var ch='<div class="cadre"><h2>'+txt.titre[1]+'</h2>';
   ch+='<label><input type="radio" name="ch_nb" checked>&nbsp;&nbsp;'+opt.nb_questions[0]+' '+txt.mot[1]+'</label><br />';
   for (var i=1;i<opt.nb_questions.length;i++) {
      ch+='<label><input type="radio" name="ch_nb"';
      if (cont.nb_quest_choisi==opt.nb_questions[i]) ch+=' checked';
      ch+='>&nbsp;&nbsp;'+opt.nb_questions[i]+' '+txt.mot[1]+'</label><br />';
   }
   ch+='</div>';
   return ch;
}

---

Code avant modification, fichier vue.js, ligne 122, fonction d'affichage des questions :

   if (mod.th[a].quest[b].type=="cases a cocher") {
      var k=0;
      for (i=0;i<c;i++) {
         k=num[i];
         ch+='<input type="checkbox" name="case'+k+'">&nbsp;&nbsp;';
         ch+=mod.th[a].quest[b].rep[k].enonce+'<br />';
      }
   }

Code après modification, fichier vue.js, ligne 122, fonction d'affichage des questions et cases à cocher :

   if (mod.th[a].quest[b].type=="cases a cocher") {
      var k=0;
      for (i=0;i<c;i++) {
         k=num[i];
         ch+='<label><input type="checkbox" name="case'+k+'">&nbsp;&nbsp;';
         ch+=mod.th[a].quest[b].rep[k].enonce+'</label><br />';
      }
   }

---

Code avant modification, fichier vue.js, ligne 143, fonction d'affichage des questions et boutons radios :

      for (i=0;i<c;i++) {
         ch+='<input type="radio" name="ch_rep">&nbsp;&nbsp;';
         ch+=mod.th[a].quest[b].rep[i].enonce+'<br />';
      }

Code après modification, fichier vue.js, ligne 143, fonction d'affichage des questions et boutons radios :

      for (i=0;i<c;i++) {
         ch+='<label><input type="radio" name="ch_rep">&nbsp;&nbsp;';
         ch+=mod.th[a].quest[b].rep[i].enonce+'</label><br />';
      }

Mise à jour

Mise à jour version 23 vers 24.2

La version 24.2 de Dyris est disponible depuis le 06/11/2023.

Voici les étapes de mises à jour pour les différents QCM.

QCM	Lien	Version en cours	Date de migration vers 24.2	Commentaire
QCM du frigoriste	https://www.phpage.fr/qcm/froid	24.2	13/01/2025
QCM sur la sécurité informatique	https://www.phpage.fr/qcm/secinfo	23
QCM sur le réseau informatique	https://www.phpage.fr/qcm/reseau/	23

Les fichiers à conserver :

• donnees.js : c'est la base de données du paramétrage et des questions d'un QCM ;
• style.css : c'est la personnalisation du style CSS ;

Modifications à effectuer :

• dans le fichier de données donnees.js, remplacer la chaine de caractère sch( par aj( sur l'ensemble du document ;

Mise à jour version 16 vers 23

Modification du fichier de données (donnees.js).

Version 16	Version 23	Observation
mode_theme("1");	mode_presentation("1");
mode_question("1");	mode_evaluation("1");

Voir aussi

• QCM