i

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"):

Beispielquelltext für die Einbindung des SVG Viewers über das Meta-Tag features

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>

Suche

v
17.6.3.4.19
dev.inf-schule.de/infschule/dokumentation/kapitel-erstellen/interaktive-elemente/quiz-tool
dev.inf-schule.de/17.6.3.4.19
dev.inf-schule.de/@/page/B0XrvNnQvqHX4QlD

Rückmeldung geben