Quiz-Tool
Mit diesem Modul kann ein Quiz eingebunden werden. Dabei wird ein Quelltext und eine Eingabe präsentiert, der Benutzer muss die entsprechende Ausgabe in ein Textfeld eingeben. Für jeden Fehlversuch wird ein Punkt abgezogen, für jeden richtigen Versuch bekommt der Benutzer fünf Punkte. Am Ende wird die Punktzahl und die Anzahl der möglichen Versuche ausgegeben.
Das Modul einbinden
Um das Modul nutzen zu können, muss die Einbindung des Moduls über den Meta-Tag features
erfolgen (siehe auch Abschnitt "Javascript"):
Das Modul verwenden
Die Verwendung des Moduls wird über einen HTML-Tag gesteuert. Er wird an der gewünschten Stelle eingefügt:
<quiz-tool dataconfig='{"dict": "beispieldaten-quiz-tool"}'></quiz-tool>
Konfiguration vornehmen
dataconfig
- Übergabe der Konfiguration im JSON Format, Reihenfolge beliebig
-
dict
Ordner mit den Daten zum entsprechenden Quiz -
background
Hintergrundfarbe des Tools (Standardwert: weiß) -
sterne
Anzahl der Sterne zu Beginn (Standardwert: 5) -
title
Titel des Elements (Standardwert: Quelltext Quiz)
Die Daten zum Quiz werden im entsprechenden Ordner (siehe dataconfig -> dict) hinterlegt.
-
data.json
Hier werden die Aufgaben festgelegt, indem der Dateiname einer Quelltext Datei, die Dateinamen der zugehörigen Eingaben und die Lösungen zu den Eingaben hinterlegt werden. - Die Bilddateien, welche in der
data.json
referenziert wurden, werden einfach im entsprechenden Ordner abgelegt.
Beispiel
Ordner mit den Daten zum Quiz: beispieldaten-quiz-tool
Inhalt der Datei data.json
:
{
"Aufgabe 1":
{
"quelltext" : "quelltext_1.png",
"eingaben" : ["eingabe_1.png","eingabe_2.png","eingabe_3.png","eingabe_4.png","eingabe_5.png"],
"loesungen" : ["2 Sechser","kein Sechser","kein Sechser","1 Sechser","1 Sechser"]
},
"Aufgabe 2":
{
"quelltext" : "quelltext_2.png",
"eingaben" : ["eingabe_1.png","eingabe_2.png","eingabe_3.png","eingabe_4.png","eingabe_5.png"],
"loesungen" : ["2 Sechser\n1 Sechser","kein Sechser","kein Sechser","1 Sechser","1 Sechser"]
}
}
Alle Bilddateien liegen ebenfalls in diesem Ordner. Das Tool selbst wird dann über den folgenden Tag eingebunden
und der entsprechende Ordner wird über die dataconfig
übergeben.
<quiz-tool dataconfig='{"dict": "beispieldaten-quiz-tool", "title": "Testeinbindung", "sterne": 4}'></quiz-tool>