1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198
|
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Nothus - Editeur en ligne</title>
<style type="text/css">
</style>
</head>
<body>
<div id="test">Page en cours de chargement...</div>
<script type="text/javascript">
/*Nothus // On lance le sondage seulement lorsque la page est terminée (événement ajouté à l'objet Window) */
try { window.addEventListener("load",function() {
/*N // Définition d'une fonction qui sera appelée "comme un objet", c'est-à-dire avec des propriétés et des méthodes. On peut autocharger celle-ci de cette manière : var maVariable = (function() { alert("coucou"); })(); */
$Sondage = function(Fct_fin) {
/*N // Propriété "Fct_fin" (fonction stockée) : déclencher lorsque le sondage est terminé */
this.Fct_fin = Fct_fin;
/*N // Propriété "ObjHTML" (objet) : stocker la référence vers un événement HTML pour afficher le HTML généré du sondage */
this.ObjHTML = false;
/*N // Propriété "Sortie" (texte) : stocker le HTML généré, utiliser par la méthode "Afficher" */
this.Sortie = "";
/*N // Propriété "Q_id" (texte) : stocker la question en cours */
this.Q_id = false;
/*N // Propriété "Questions" (objet) : stocker toutes les questions disponbles (l'ordre d'apparition ici détermine l'ordre d'apparition des questions). Le format est déterminé par avance. Chaque question peut avoir 0 (mais du coup peu d'intérêt...) ou N questions, qui peuvent être des fonctions */
this.Questions = {
"q1": {
"question": "Quel est votre sexe ?",
"description": "",
"type": "choix simple",
"reponses": {
"r1": {
"reponse": "homme",
"vers": "q2"
},
"r2": {
"reponse": "femme",
"vers": "q2"
}
}
},
"q2": {
"question": "Quel est votre tranche d'âge (révolu) ?",
"description": "" ,
"reponses": {
"r1": {
"reponse": "moins de 18 ans",
"vers": false
},
"r2": {
"reponse": "18-25",
"vers": false
},
"r3": {
"reponse": "25-45",
"vers": false
},
"r4": {
"reponse": "45-65",
"vers": false
},
"r5": {
"reponse": "plus de 65 ans",
"vers": false
}
}
}
};
/*N // Propriété "Reponses" (objet) : stocker toutes les réponses, sous la forme Q_id = R_id (nom de la propriété à chaque fois) */
this.Reponses = {
};
/*N // Méthode "Afficher" : afficher le HTML généré dans l'objet HTML déterminé par l'utilisateur */
this.Afficher = function(Texte) {
if (typeof Texte!="string")
Texte = this.Sortie;
if (
this.ObjHTML!=false
&
typeof this.ObjHTML.innerHTML=="string"
)
this.ObjHTML.innerHTML = Texte;
};
/*N // Méthode "Preparer" : lancer le sondage, et initialise la première question */
this.Preparer = function(ObjHTML) {
this.ObjHTML = ObjHTML;
if (
this.Q_verifier()==false
)
this.Afficher("<p>Le sondage ne contient aucune question.</p>");
this.Q_charger();
};
/*N // Méthode "Finir" : initialiser la propriété "Fin" et, si une fonction valide a été indiquée au début, tente de la lancer */
this.Finir = function() {
this.Fin = true;
this.Sortie = "<p>Ce sondage est terminé, merci de votre participation.</p>";
if (typeof this.Fct_fin=="function") {
try {
this.Fct_fin();
this.Sortie += "<p>La fonction d'envoi a été lancée.</p>";
} catch(e) {
this.Sortie += "<p>La fonction d'envoi a été lancéen mais a rencontré une erreur : "+e+"</p>";
}
this.Afficher(false);
}
};
/*N // Méthode "Q_verifier" : déterminer la question à afficher en fonction de Q_id et de sa correspondance dans le tableau des réponses */
this.Q_verifier = function() {
if (
this.Q_id==false
|
typeof this.Questions[this.Q_id]=="undefined"
) {
for (var i in this.Questions) {
if (typeof this.Reponses[i]!="string") {
this.Q_id = i;
return true;
}
}
return false;
}
return true;
};
/*N // Méthode "Q_charger" : générer le formulaire pour que l'utilisateur puisse répondre. Par facilité de lecture, je n'utilise pas ici createElement, que les puristes me pardonnent... */
this.Q_charger = function() {
if (typeof this.Questions[this.Q_id]=="undefined") {
this.Afficher("<p>Cette question n\'existe pas.</p>");
return false;
}
var Q = this.Questions[this.Q_id];
this.Sortie = "<sondage><question>"+Q["question"]+"</question><description>"+Q["description"]+"</description><form onSubmit=\"javascript: return ($Sondage.Q_repondre(this))?false:false;\">";
for(var R_id in Q["reponses"]) {
var R = Q["reponses"][R_id];
this.Sortie += '<input type="radio" name="reponse" value="'+R_id+'" /> '+R["reponse"];
}
this.Sortie += '<input type="submit" value="répondre" /></form></sondage>'
this.Afficher(false);
};
/*N // Méthode "Q_repondre" : on vérifie rapidement que tout correspond et ce vers quoi renvoie la réponse : une autre question (texte), vers la fin (false) ou une fonction particulière */
this.Q_repondre = function(Formulaire) {
if (typeof this.Questions[this.Q_id]=="undefined") {
this.Afficher("<p>Cette question n\'existe pas.</p>");
return false;
}
var Q = this.Questions[this.Q_id];
if (typeof Q["reponses"][Formulaire.reponse.value]!="object") {
this.Afficher("<p>Cette réponse n\'existe pas pour cette question.</p>");
return false;
}
this.Reponses[this.Q_id] = Formulaire.reponse.value;
if (typeof Q["reponses"][Formulaire.reponse.value].vers=="string") {
this.Q_id = Q["reponses"][Formulaire.reponse.value].vers;
if (this.Q_verifier()) {
this.Q_charger();
}
} else if (typeof Q["reponses"][Formulaire.reponse.value].vers=="function") {
Q["reponses"][Formulaire.reponse.value].vers();
} else if (Q["reponses"][Formulaire.reponse.value].vers===false) {
this.Finir();
}
};
};
/*N // On initialise le sondage, avec une fonction de fin sous la forme d'une alerte */
$Sondage = new $Sondage(function() {
alert("envoi du formulaire...");
});
/*N // On prépare le sondage, en définissant une référence valide dans le DOM */
$Sondage.Preparer(document.getElementById("test"));
});
} catch(e) {
alert("Votre navigateur ne semble pas compatible avec grand chose...");
}
</script>
</body>
</html> |