Zamok_V228

ЗКЭ-4-10 LAB

Минималистичный интерактивный учебный стенд кодового замка со светлой и тёмной темами. Проект работает без сборщика: достаточно открыть index.html в современном браузере.

Что умеет стенд

• Проверяет четырёхзначный код посимвольно и сбрасывает схему при первой ошибке.
• Показывает полную векторную перерисовку принципиальной схемы: тиристоры VD5–VD8, транзисторы VT1–VT5, резисторы R1–R20, конденсаторы C1–C6, диоды и мосты VD1–VD11, S1, S2, наборное поле XP/XS, электромагнит YA1, лампу HL1, T1 и FU1.
• Подсвечивает четыре ступени памяти при вводе. После полного кода сохраняет открытое состояние до нажатия «Закрыть замок» или «Сбросить»; автоматического закрытия нет.
• Даёт пояснения к выбранным деталям и узлам, справочник обозначений и пошаговое описание всего цикла. Поддерживает увеличение, развёрнутый просмотр и скачивание отдельного SVG-файла.
• Показывает движение якоря и ригеля, катушку и возвратную пружину. S2 замыкает цепь нагрузки напрямую; повторное нажатие отпускает кнопку. VT5 / VT2 показаны как составной ключ.
• Позволяет назначить собственный код из четырёх разных цифр; настройка хранится только в localStorage браузера.
• Поддерживает клики и цифровые клавиши физической клавиатуры.
• Содержит звук (включается отдельной кнопкой), справку и короткую проверку знаний.
• Адаптирован для телефона, планшета и десктопа. Поддерживает клавиатурный фокус и prefers-reduced-motion.
• При первом открытии учитывает системную тему, затем сохраняет ручной выбор палитры в браузере.
• Сохраняет сапёр, прыжки, змейку и радио в меню «⋯» справа в верхней панели. Закрытие меню не останавливает радио.

Быстрый старт

1. Откройте index.html двойным кликом.
2. По умолчанию введите 1 2 3 4.
3. Откройте «Настройки сценария», чтобы сменить демонстрационный код.

Сам стенд и игры работают локально без сборщика. Для радиопотоков, логотипов станций, прогноза погоды и Google Fonts требуется сеть; при отсутствии шрифтов браузер применит системные.

Структура

Путь	Назначение
index.html	Семантическая разметка экрана, модальных окон и подключение ресурсов.
css/base.css	Переменные дизайна, типографика, базовый сброс и адаптивный каркас страницы.
css/components.css	Карточки, механизм, схема, клавиатура, модальные окна и состояния компонентов.
css/circuit.css	Векторная схема, её состояния и пояснения и компактное меню игр и радио.
js/theme.js	Применение темы до отрисовки, её переключение и сохранение предпочтения.
js/app.js	Вся интерактивная логика, звук, localStorage, модальные окна и тест.
js/schematic.js	Векторные символы, проводники и явные электрические соединения всех компонентов.
js/circuit.js	Описание 49 обозначений, подсветка, масштабирование и развёрнутый просмотр.
assets/zke-4-10-circuit.svg	Самостоятельный векторный чертёж для скачивания.
docs/circuit-netlist.json	Перечень выводов и соединений, использованный при проверке схемы.
assets/circuit-original.png	Исходная фотография для разработки; в интерфейсе не используется.
docs/README.md	Эта инструкция по запуску и составу проекта.
docs/INTERACTION.md	Техническое описание состояний и сценариев интерфейса.
docs/issues.md	Демонстрационный бэклог: примеры входящих пользовательских запросов.

Подробности о поведении — в INTERACTION.md. Примеры задач для развития — в issues.md.