{{indexmenu_n>15}}
====== Level Page Elements ======

The engine assembles the level page out of blocks with permanent identifiers. Once you know them, you can hide, rename or restyle almost any part of the page from the [[en:authors_main:task_editor:advanced:author_scripts|task script]] or from your own CSS.

Ready-made recipes — "hide the codes", "rename the hint" and the like — are collected on the [[en:authors_main:task_editor:advanced:author_scripts:author_scripts_examples|Typical scripts]] page. This page is the map of the page itself, plus the techniques that did not make it into the recipes.

===== Page Map =====

^ Identifier ^ What it is ^
| ''#autoupdateable'' | The whole updatable part of the page. This is exactly what the engine replaces when the level auto-refreshes |
| ''#out_task'' | Task text |
| ''#out_hints'' | Hints block |
| ''#out_codes'' | Level codes block |
| ''#out_bonuses'' | Bonuses block |
| ''#out_global_bonuses'' | Global (spanning) bonuses block |
| ''#out_answer_frame'', ''#out_answer'' | Answer input form |
| ''#answer_button'' | The **"Answer"** button |
| ''#button_finish_task'' | The **"Finish the task"** button (appears with the "Close level: Smart" option) |
| ''#out_limit'' | The "answers are blocked" block, with the ''#limit'' timer |
| ''#out_toggle_theme'' | The dark mode switch in the "Settings" menu |
| ''#out_toggle_answers'', ''#out_toggle_sounds'' | The previous answers and sounds switches |

Individual codes, bonuses and hints are addressed by number: ''#c1'', ''#c2'' — codes, ''#b1'', ''#b2'' — bonuses, ''#gb1'' — spanning bonuses, ''#hb1'' — hints. The same identifiers are used in [[en:authors_main:task_editor:advanced:author_scripts#replacing_elements_in_a_task_with_elements_from_bonuses_codes_hints|Replacer]].

> Everything you hide with a script stays in the page source and a player can still find it. If the content must really be unavailable, hide it with a [[en:authors_main:task_editor:advanced:edit_templates|template]] on the server rather than with styles in the browser.

===== Forcing a Theme =====

By default the player chooses light or dark styling. If a level is designed around a particular theme (a "night" location, for example), the theme can be forced and the switch removed:

<code JavaScript>
// Dark theme
$('#out_toggle_theme').hide();
$('#theme_css').attr('href', dark_theme_css);
$('#theme_d_css').attr('href', dark_theme_d_css);
</code>

<code JavaScript>
// Light theme
$('#out_toggle_theme').hide();
$('#theme_css').attr('href', light_theme_css);
$('#theme_d_css').attr('href', light_theme_d_css);
</code>

''#theme_css'' holds the engine styles and ''#theme_d_css'' the styles of your own domain; both have to be changed, otherwise half of the page stays in the previous theme. The variables ''light_theme_css'', ''dark_theme_css'', ''light_theme_d_css'' and ''dark_theme_d_css'' are put on the page by the engine itself.

The theme is switched on this level only. On the next one the player's own choice comes back.

[[https://qeng.org/game.php?jump_to&gid=3493&task_id=52060|Example with a dark theme]] | [[https://qeng.org/game.php?jump_to&gid=3493&task_id=52064|Example with a light theme]]

===== Custom Styling for the Answer Lockout =====

When a level has an attempt limit and the players have used it up, the engine shows the ''#out_limit'' block with a countdown to the unlock. The block can not only be restyled — you can also hang your own element on it, dimming the whole screen while input is unavailable, for instance.

Your element goes into the task text, and the script ties its visibility to the visibility of ''#out_limit'':

<code JavaScript>
document.getElementById('answers_blocked').style.display = document.getElementById('out_limit').style.display;
</code>

The task script runs after every level refresh, so the state of the element is recomputed together with the lockout timer.

[[https://qeng.org/game.php?jump_to&gid=3493&task_id=75513|Example in game]]

===== Configuring the Attempt Limit =====

The limit itself (how many answers and over what period) is configured not by a script but in the level settings — see [[en:authors_main:task_editor:task_settings#attempt_limits|Attempt Limits]].