This is a quiz game plugin for Moodle with a strong focus on speed for answering the questions. It can be added to any Moodle course as an activity. You will have to define levels and assign categories of your moodle question bank to each level. The game frontend is written with Vue.js so that playing the game doesn't require any page reloads.
- Install Plugin: Just download the repository as zip file and install it. You can remove the vue folder to reduce the size.
- Go to a course and add the quiz as an activity.
- Choose a name and, if necessary, change game options.
- Go to the activity and configure levels through the admin screen (top right corner, gears icon).
A new instance of this game can be added to any Moodle course through the "add activity" link in your course. You will be able to set some game options (like the available seconds to answer a question, whether or not teachers should be included in the leader board, etc). Configuring the different levels is a screen within the app, i.e. you will have to go to the activity and will see a settings icon in the top right corner of the game screen. You can add as many levels as you want. You need to assign at least one moodle question category to every game level. The game will then pick a random single choice question from those categories. There will be an individually calculated amount of time to answer the question. It is calculated from a) the constant amount of time (in seconds) you configured in the game settings and b) a reading time, calculated from the configured reading speed level and the number of words in the question + answers. When the time reaches 0 the question will be cancelled (0 points). If the correct answer was picked, the participant will receive the number of remaining seconds as points (max. the static part, reading time is never counted in the score). You can set a review time per question. After the question is answered, the game will go back to the level overview automatically after the review time has passed.
The javascript files and Vue components will be bundled into a single file as AMD module
amd/build/app-lazy.min.js
using Webpack.
You may call functions in that module with $PAGE->requires->js_call_amd
.
The suffix -lazy is used to tell Moodle that the file should not be bundled with Moodle's other AMD modules That makes sense because the javascript file generated by Webpack is quite big and is only needed for this plugin.
If you want to change the Vue components or the javascript code, you have to install all dependencies:
cd vue
yarn install
With npm run dev
or npm run watch
you build the file amd/build/app-lazy.min.js
(in development mode) that will be loaded by the browser. Watch does not exit, it will
re-build the file whenever one of the source files was touched.
Important: Before a commit you should build the file with npm run build
(production mode).
This generates a much smaller file. However, the file is not suitable for debugging using the
browser web developer tools.
Hint: you should disable Moodle's javascript cache. You may add the line $CFG->cachejs = false;
to config.php
. If you disable caching, Moodle takes the file from the amd/src
folder.
Hence, there is a symbolic link to ../build/app-lazy.min.js
.
If you want to use javascript libraries from Moodle, you have to declare them as external
dependencies in vue/webpack.config.js
under exports.externals
.