Documentation

Source list

Description

Source list is closely related to Text and Multigap modules. It enables to insert a ready-made list of text items to be put into a draggable gap activity. The elements can also be filled in with mathematical or chemical formulas thanks to the LaTeX scripting language.

Each item in the source list can match more than one draggable gap and the already selected elements can either be removed from a source list, or can remain in the module.

Depending on the activity type, it is possible to place the items either vertically or horizontally.

Of course it is possible to alter the look of the individual items included in the source list. All elements can be the same or different size, depending on the CSS style used.

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
Items This property serves for inserting text to be displayed in the module. Each item should be placed in a seperate line.
Removable This property indicates whether texts are to be removed from a source list after being inserted into a text module.
Vertical This property indicates whether the source list is in a vertical or horizontal position.
Random order This property indicates whether the source list items are to be displayed in random order.
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.
This texts will be read by Text to Speech addon after a user performs an action.

Supported commands

Command name Params Description
reset --- Reset a module.
getItem index – 1-based index of item in a module Returns item (text) with a given index. The order is based on the module configuration and does not change when 'Random order' option is selected.

Markup

It is possible to format all text items included in the source list by using simple markup language:

Syntax Description
**sample text** "sample text" will be written in bold.
__sample text__ "sample text" will be written in italics.

Events

The Source List addon sends ItemSelected type of events to Event Bus when a user selects an object.

Field name Description
Type It's a string representation of a selected object type.
Value The Value is the file path.
Item It's a name of a selected item.

The Source List addon sends ItemConsumed type of events to Event Bus when a user consumes the object.

Field name Description
Type It's a string representation of a consumed object type.
Value The Value is the file path.
Item It's a name of a consumed object.

The Source List addon sends ItemReturned type of events to Event Bus when a user returns the object.

Field name Description
Type It's a string representation of a returned object type
Value The Value is the file path.
Item It's a name of a returned object.

CSS classes

Class name Description
ic_sourceListItem indicates the look of the items included in the source list
ic_sourceListItem-selected indicates the look of the item selected in the source list

Examples

.ic_sourceListItem {  
    background-color: #38c8d3;  
    border: 1px solid #38c8d3;  
    border-radius: 4px;  
    cursor: pointer;  
    display: inline;  
    margin-right: 10px;  
    padding: 4px;  
    text-align: center;  
    font-size: 16px;  
    color: #ffffff;  
    font-family: Verdana;  
    font-weight: bold;  
}  


.ic_sourceListItem-selected {  
    background-color: orange;  
    cursor: pointer;  
    border: 1px solid orange;  
}

Keyboard navigation

  • Tab – move between the elements
  • Space - select a current element

Demo presentation

Demo presentation contains examples of the addon's usage.