DokuWiki

It's better when it's simple

User Tools

Site Tools


plugin:quizlib

QuizLib Plugin

Compatible with DokuWiki

Detritus, Elenor of Tsort

plugin Quiz Plugin for self test for DokuWiki based on QuizLib at https://github.com/ALPSquid/quizlib

Last updated on
2016-04-17
Provides
Syntax
Repository
Source

This extension has not been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues.

Similar to mikioplugin, quiz

Tagged with quiz, test

The QuizLib Plugin for DokuWiki embeds the JavaScript library QuizLib of Andrew Palmer. The library offers functions to parse quizzes written in well-defined HTML syntax and to evaluate the user answers. Furthermore the plugin provide a simple XML-like syntax with a generic CSS styling as a all-round carefree package. Therefore 3 ways to write quizzes exist:

  1. XML syntax with generic styling and generic evaluation function (only one quiz per HTML page)
  2. HTML syntax with individual styling and generic evaluation function (only one quiz per HTML page)
  3. HTML syntax and individual evaluation function for total freedom

Installation

Search and install the plugin using the Extension Manager. Refer to Plugins on how to install plugins manually.

Examples/Usage

There a three kinds of question formats you can use:

  • plain text
  • radio buttons (exactly one correct answer)
  • checkbox (one or more correct answers)

XML style

Every quiz starts with the tag “quizlib”. This tag contains as attributes the array with the correct answers (“rightanswers”) and the string for the submit button (“submit”). Each element of the rightanswers-array is either a string (for the plain text questions) or again an array with the zero-based indexes ('a0', 'a1', …) of the correct answers (for radio and checkbox). Please use double quotes for the rightanswers-array and single quotes inside.

The questions itself are child elements of the quizlib-tag. Each “question” has an attribute “title” with the content of the question and an attribute “type” (text, radio, checkbox). The possible answers are a list separated by a vertical bar. If you want to use characters that are protected in XML you have to work with entity references (http://www.w3schools.com/xml/xml_syntax.asp):

  • &lt; for <
  • &gt; for >
  • &amp; for &
  • &apos; for '
  • &quot; for "
<quizlib id="quiz" rightanswers="['42',['a0'],['a0','a2','a3']]" submit="Check Answers">
    <question title="1. What is the answer to life, the universe and everything?" type="text"></question>
    <question title="2. Your enemy's father..." type="radio">is a hamster|smells of elderberries</question>
    <question title="3. Which factors will contribute to the end of humanity as we know it?" type="checkbox"> Global warming| The release of Linux 4.1.15| Cats| Advancements in artificial intelligence</question>
</quizlib>

HTML style

The syntax is rather self-explanatory, if something is unclear read documentation of the JavaScript library https://alpsquid.github.io/quizlib/

The only difference to the original is the generic evaluation function “quizlibShowResults”. It's the callback function for the onlick-event in the submit-button. Its first argument is the id of the quiz, the second is the array with the answers.

<!-- Quiz Container -->
<div id="quiz">
    <!-- Question 1 -->
    <div class="quizlib-card quizlib-question">
        <div class="quizlib-question-title">1. What is the answer to life, the universe and everything?</div>
        <div class="quizlib-question-answers">
            <input type="text" name="q1">
        </div>
    </div>
    <!-- Question 2 -->
    <div class="quizlib-card quizlib-question">
        <div class="quizlib-question-title">2. Your enemy's father...</div>
        <div class="quizlib-question-answers">
            <ul>
                <li><label><input type="radio" name="q2" value="a"> is a hamster</label></li>
                <li><label><input type="radio" name="q2" value="b"> smells of elderberries</label></li>
            </ul>
        </div>
    </div>
    <!-- Question 3 -->
    <div class="quizlib-card quizlib-question">
        <div class="quizlib-question-title">3. Which factors will contribute to the end of humanity as we know it?</div>
        <div class="quizlib-question-answers">
            <ul>
                <li><label><input type="checkbox" name="q3" value="a"> Global warming</label></li>
                <li><label><input type="checkbox" name="q3" value="b"> The release of Linux 4.1.15</label></li>
                <li><label><input type="checkbox" name="q3" value="c"> Cats</label></li>
                <li><label><input type="checkbox" name="q3" value="d"> Advancements in artificial intelligence</label></li>
            </ul>
        </div>
    </div>
    <!-- Answer Button -->
    <button class="quizlib-submit" type="button" onclick="quizlibShowResults('quiz',['42',['a'],['a','c','d']]);">Check Answers</button>
</div>
 
<div id="quizlib-result" class="quizlib-card">
    You Scored <span id="quiz-percent"></span>% - <span id="quiz-score"></span>/<span id="quiz-max-score"></span><br/>
</div>

Total freedom style

Like HTML style but you have to write your own evaluation function.

Change Log

  • 2016-04-17
    • Initial release

Known Bugs and Issues

ToDo/Wish List

The syntax parsing is very simple and uses the PHP function simplexml_load_string. It would be probably good to use the addPattern method instead to improve the stability of the parsing and to allow more embedded syntax of other plugins (getAllowedTypes is currently empty).

FAQ

Discussion

EDIT: Using the same code above HTML Style does not work. JS ERROR: Number of answers does not match number of questions!

Answer: Ok, so you cant use the pages' name as the quiz name. It will create two ids with the same name.

plugin/quizlib.txt · Last modified: 2024-01-16 22:07 by Aleksandr

Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
CC Attribution-Share Alike 4.0 International Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki