Table of Contents

Элементы страницы уровня

Движок собирает страницу уровня из блоков с постоянными идентификаторами. Зная их, из скрипта задания или из своего css можно спрятать, переименовать или переоформить почти любую часть страницы.

Готовые рецепты «скрыть коды», «переименовать подсказку» и подобные собраны на странице Типичные скрипты. Здесь — карта самой страницы и те приёмы, которые в рецепты не попали.

Карта страницы

Идентификатор Что это
#autoupdateable Весь изменяемый блок страницы. Именно его содержимое движок заменяет при автообновлении уровня
#out_task Текст задания
#out_hints Блок подсказок
#out_codes Блок кодов уровня
#out_bonuses Блок бонусов
#out_global_bonuses Блок сквозных бонусов
#out_answer_frame, #out_answer Форма ввода ответа
#answer_button Кнопка «Ответить»
#button_finish_task Кнопка «Завершить задание» (появляется при опции «Закрыть задание: Разумно»)
#out_limit Блок «ответы заблокированы» с таймером #limit
#out_toggle_theme Переключатель тёмного режима в меню «Настройки»
#out_toggle_answers, #out_toggle_sounds Переключатели предыдущих ответов и звуков

Отдельные коды, бонусы и подсказки адресуются по номеру: #c1, #c2 — коды, #b1, #b2 — бонусы, #gb1 — сквозные бонусы, #hb1 — подсказки. Эти же идентификаторы используются в Replacer.

Всё, что вы прячете скриптом, остаётся в исходном коде страницы — игрок может это увидеть. Если содержимое должно быть недоступно, прячьте его шаблоном на сервере, а не стилями в браузере.

Принудительная тема оформления

По умолчанию игрок сам выбирает светлое или тёмное оформление. Если уровень задуман под конкретную тему (например, «ночная» локация), тему можно навязать и убрать переключатель:

// Тёмная тема
$('#out_toggle_theme').hide();
$('#theme_css').attr('href', dark_theme_css);
$('#theme_d_css').attr('href', dark_theme_d_css);
// Светлая тема
$('#out_toggle_theme').hide();
$('#theme_css').attr('href', light_theme_css);
$('#theme_d_css').attr('href', light_theme_d_css);

#theme_css — это стили движка, #theme_d_css — стили оформления вашего домена; менять надо оба, иначе половина страницы останется в прежней теме. Переменные light_theme_css, dark_theme_css, light_theme_d_css, dark_theme_d_css движок подставляет на страницу сам.

Тема переключается только на этом уровне. На следующем вернётся выбор игрока.

Пример с тёмной темой | Пример со светлой темой

Своё оформление блокировки ответов

Когда на уровне настроен лимит попыток и игроки его исчерпали, движок показывает блок #out_limit с таймером до разблокировки. Блок можно не только переоформить, но и повесить на него собственный элемент — например, затемнить весь экран, пока ввод недоступен.

Свой элемент кладётся в текст задания, а в скрипте его видимость привязывается к видимости #out_limit:

document.getElementById('answers_blocked').style.display = document.getElementById('out_limit').style.display;

Скрипт задания выполняется после каждого обновления уровня, поэтому состояние элемента будет пересчитываться вместе с таймером блокировки.

Пример в игре

Настройка лимита попыток

Сам лимит (сколько ответов и за какое время) настраивается не скриптом, а в параметрах уровня — см. Лимиты попыток ввода.