Documentation

Choice

Description

A choice module enables to insert a Multiple choice or a Single choice activity. In a Multiple choice activity it is possible to give more that one correct answer, whereas in a Single choice task only one option is correct. The Choice module enables to set multiple numbers of choice options which can be defined either by texts or by images.

The activity layout is vertical by default, but if needed it is possible to place it horizontally thanks to the CSS styling.

The module also enables to establish different values for the correct answers, e.g. the answer marked as "2" will generate more points than the answer marked as "1". Both of them are correct but one of them is worth more points than the other.

The choice module also allows inserting simple audio controls. They add the possibility of playing and stopping a sound. Though there may be more than one audio in the text module, only one sound can be played simultaneously.
To add an audio control, use "Insert Audio" button on the toolbar of the text editor.
Adding the audio control is also possible using \audio{URL} syntax, where URL is the URL of the audio resource.

Properties

The list starts with the common properties, learn more about them by visiting the Modules description section. The other available properties are described below.

Property name Description
Is multi Indicates whether an activity is a multiple or single choice activity. For a single choice activity it is enough to leave the box unchecked.
Item This section allows to enter all the choice options in the "Text" field and mark the correct answer(s) as "1" in the "Value" field. The options which are not correct should be marked as "0". Item count serves for indicating the number of choice options in an activity.
Is disabled Allows disabling the module so that the user is not able to interact with it.
Is activity This property allows to define whether a choice module is an activity or not. When it is not defined as an activity, the answers given are not taken into account in the overall result. It is helpful for e.g. simulations.
Random Order If this property is checked, items in Choice module will appear in random order every time you reload the lesson's page.
Horizontal Layout If this property is checked, the choice module will be displayed horizontally.
Lang attribute This property allows to define the language for this addon (different than the language of the lesson).
Speech texts List of speech texts: Selected, Deselected, Correct, Wrong.
This texts will be read by Text to Speech addon after a user performs an action.

Supported commands

Command name Params Description
disable - disable module
enable - enable module
show - show module
hide - hide module
reset - reset module
isAttempted - returns true if choice has at least one option selected.
isAllOK - returns true if all answers are selected correctly, otherwise false
markOptionAsCorrect index set correct css style
markOptionAsWrong index set wrong css style
markOptionAsEmpty index set empty css style
isOptionSelected index returns true if given option is selected

Events

OnValueChanged Event

This event contains the following fields

Field name Description
Source module id
Item last changed option id
Value new value 1 or 0
Score choice item score

AllOk Event

This event contains the following fields

Field name Description
Source module id
Item last changed option id
Value N/A
Score N/A

Supported commands

Command name Params Description
markOptionAsCorrect index - 1-based index of option Mark option as correct
markOptionAsWrong index - 1-based index of option Mark option as wrong
markOptionAsEmpty index - 1-based index of option Mark option as empty
show Shows the addon
hide Hides the addon
reset Clears out all answers selected in the addon
isAttempted Returns True if choice has at least one option selected.

Show Answers

This module is fully compatible with Show Answers module and displays correct answers when adequate event is sent.

CSS classes

Class name Description
.ic_moption indicates the look of the Multiple choice activity's option
.ic_moption-up indicates the look of the unselected Multiple choice activity's option
.ic_moption-up-hovering indicates the look of the Multiple choice activity's selected option while putting a mouse cursor on it
.ic_moption-down indicates the look of the Multiple choice activity's option while selecting it
.ic_moption-down-hovering indicates the look of the Multiple choice activity's selected option while putting a mouse cursor on it
.ic_moption-up-correct indicates the look of the correct Multiple choice activity's option — unselected
.ic_moption-up-wrong indicates the look of the incorrect Multiple choice activity's option — unselected
.ic_moption-down-correct indicates the look of the correct Multiple choice activity's option — selected
.ic_moption-down-correct-answer indicates the look of the correct answer in Multiple choice activity's option after ShowAnswers event was sent
.ic_moption-down-wrong indicates the look of the incorrect Multiple choice activity's option — selected
.ic_soption indicates the look of the Single choice activity's option
.ic_soption-up indicates the look of the Single choice activity's option while putting a mouse cursor on it
.ic_soption-up-hovering indicates the look of the Single choice activity's option while putting a mouse cursor on it
.ic_soption-down indicates the look of the Single choice activity's option while selecting it
.ic_soption-down-hovering indicates the look of the Single choice activity's selected option while putting a mouse cursor on it
.ic_soption-up-correct indicates the look of the correct Single choice activity's option — unselected
.ic_soption-up-correct-answer indicates the look of the correct Single choice activity's option — unselected
.ic_soption-up-wrong indicates the look of the correct answer in Single choice activity's option after ShowAnswers event was sent
.ic_soption-down-correct indicates the look of the correct Single choice activity's option — selected
.ic_soption-down-wrong indicates the look of the incorrect Single choice activity's option — selected
ic_soption-markedAsCorrect indicates the look of the correct Single choice activity's option — it's not important if the option is or isn't selected
ic_soption-markedAsWrong indicates the look of the wrong Single choice activity's option — it's not important if the option is or isn't selected

Examples

1.1. Single choice:
.ic_soption{
background-position: right center;
background-repeat: no-repeat;
cursor: pointer;
padding-right: 59px;
font-family: Arial;
line-height: 20px;
font-size: 18px;
color: #717171;
}

1.2. Single choice — up:
.ic_soption-up{
background-image:url('/file/serve/262420');
}

1.3. Single choice — down:
.ic_soption-down{
background-image:url('/file/serve/263409');
}

1.4. Single choice — up-correct:
.ic_soption-up-correct{
background-image:url('/file/serve/260411');
}

1.5. Single choice — down-correct:
.ic_soption-down-correct{
background-image:url('/file/serve/258368');
}

1.6. Single choice — down-wrong:
.ic_soption-up-wrong{
background-image:url('/file/serve/260411');
}

1.7. Single choice — down-wrong:
.ic_soption-down-wrong{
background-image:url('/file/serve/258369');
}

1.8. Single choice — up-wrong:
.ic_soption-up-hovering{
background-image:url('/file/serve/262420');
}

1.9. Single choice — down-hovering:
.ic_soption-down-hovering{
background-image:url('/file/serve/263409');
}

2.1. Multiple choice:
.ic_moption{
background-position: right center;
background-repeat: no-repeat;
cursor: pointer;
padding-right: 59px;
font-family: Arial;
line-height: 20px;
font-size: 18px;
color: #717171;
}

2.2. Multiple choice — up:
.ic_moption-up{
background-image:url('/file/serve/256387');
}

2.3. Multiple choice — down:
.ic_moption-down{
background-image:url('/file/serve/262418');
}

2.4. Multiple choice — up-correc:
.ic_moption-up-correct{
background-image:url('/file/serve/262419');
}

2.5. Multiple choice — down-correc:
.ic_moption-down-correct{
background-image:url('/file/serve/263405');
}

2.6. Multiple choice — up-wrong:
.ic_moption-up-wrong{
background-image:url('/file/serve/262419');
}

2.7. Multiple choice — down-wrong:
.ic_moption-down-wrong{
background-image:url('/file/serve/263408');
}

2.8. Multiple choice — up-hovering:
.ic_moption-up-hovering{
background-image:url('/file/serve/256387');
}

2.9. Multiple choice — up-hovering:
.ic_moption-down-hovering{
background-image:url('/file/serve/262418');
}

Keyboard navigation

Tab – navigation between modules.
Space – accept the choice option.

Demo presentation

Demo presentation contains examples of the addon's usage.