Documentation

Description

The Crossword module allows inserting a Crossword game into a presentation. It's enough to predefine some specific parameters to make it work.

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.

ENGLISH
···O···
·NEVER·
·E·E···
·W·····

Supported commands

Events

ValueChanged event

When the user types a letter into the crossword and leaves the cell, the ValueChanged event is sent. Its structure is shown below.

AllOK event

When the user fills in all cells properly, the module sends the 'ALL OK' event. This event is different from a normal event, so its structure is shown below.

CorrectWord event

When the user fills in a correct word, the CorrectWord event is sent. This event has the following structure:

Advanced Connector example:

EVENTSTART
Name:CorrectWord
Source:crossword1
SCRIPTSTART

presenter.playerController.getModule('feedback1').change('1');

SCRIPTEND
EVENTEND

Show Answers

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

eKeyboard integration

It is possible to enter text into cells using the eKeyboard module.

See the documentation of the eKeyboard module »

CSS classes

Please note that in practice, styles related to the cell position (.cell_AxB, .cell_row_X, .cell_column_X) must be combined with another style that indicates a type of cell, e.g.

• .cell_column_3.cell_letter will apply only to cells with letters in column 4,
• .cell_row_0.cell_blank will apply only to cells without letters in row 1.

CSS classes for printable

CSS classes for the printable version of the module have the same names as in the original version but with the prefix printable_. For example, printable_cell_container_letter is equivalent to cell_container_letter in the printable version. The original classes should be defined by providing a path where the first name is printable_crossword_container, e.g., .printable_crossword_container .printable_cell_container_letter.

The new CSS classes include:

Examples

1.1. Make font bigger:

.crossword_bigfont {
}

.crossword_bigfont .cell_letter input {
    font-size: 24pt;
}

1.2. Green background, only cells with a letters are visible:

• Set _Blank cells border width_ to 0
• Set _Letter cells border width_ to 1
• Set _Letter cells border color_ to #aaa

.crossword_green {
    background: #D6FFE9;
}

.crossword_green .cell_container_blank {
    background: transparent;
}

.crossword_green .cell_container_letter {
    box-shadow: 5px 5px 2px 2px #ccc;
}

.crossword_green .cell_invalid {
    background: #fff;
}

.crossword_green .cell_invalid input {
    color: #aa0000;
    text-decoration: line-through;
    font-weight: bold;
}

Auto navigation algorithm

To better understand the algorithm, a legend has been created with a description of the elements.

Legend:

Algorithm rules/sequential steps of the algorithm:

1. If the current direction is horizontal and there is at least one editable cell on the right side in the current word, then move to the first possible editable cell on the right side.
2. If the current direction is horizontal and there is not at least one editable cell to the right side in the current word, then move using the TabIndex direction.
3. If the current direction is vertical and there is at least one editable cell below it in the current word, then move to the first possible editable cell below it.
4. If the current direction is vertical and there is not at least one editable cell below it in the current word, then move using the TabIndex direction.
5. If there is at least one editable cell below it in the current word, and if the right cell is an blank cell, then move to the first possible editable cell below it.
6. If there is at least one editable cell on the right side in the current word, and if the top cell and the bottom cell are blank cells, then move to the first possible editable cell on the right side.
7. If there is at least one editable cell below it in the current word, and if the top cell is an blank cell and the right cell is not an blank cell, then move to the first possible editable cell below it.
8. If there is at least one editable cell below in the current word, and if the right cell is not an blank cell that the user has filled in, and the cell at the bottom is not an blank cell that the user has not filled in, then move to the first possible editable cell below.
9. If there is at least one editable cell on the right side in the current word, then move to the first possible editable cell on the right side.
10. Use the TabIndex direction.

Note: The rules of the algorithm are checked from the first rule to the last. This means that rule 1 will be checked first, then rule 2, and so on. If any rule has all conditions satisfied, then the next rules are not checked.

Note: If the "Word numbers" property is set to horizontal or vertical, auto-navigation will ignore the algorithm and jump to the next possible horizontal/vertical answer if available.

Note: If the auto-navigation mode does not allow the chosen direction, then the navigation will not move the cursor to the next cell. For example, if the auto-navigation mode is set to Simple and the direction analysis shows the TabIndex direction, then the cursor will not be moved to the next cell.

In short, the following directions are used for the following rules:

• 1, 6, 9 – horizontal direction
• 3, 5, 7, 8 – vertical direction
• 2, 4, 10 – TabIndex direction

Demo presentation

Demo presentation contains examples on how to use the Crossword module.