3Д модель уже готова!
1. Структура логики (общая схема поведения)
A. Цикл роликов:
3 видео (MP4, 15 секунд каждый) играют по кругу.
После завершения 3-го видео автоматически запускается 3D карта.
B. 3D-карта:
Позволяет
Вращение Z — 360°, X и Y — 180°
Масштаб до 200%
Кнопка «Назад» — возвращает к видеоциклу
Если 20 сек. нет взаимодействия — автоматический выход в видеоцикл
C. В любой момент в видеоцикле:
Кнопка «Показать карту» — сразу переключается на 3D карту
---
2. Стек технологий (офлайн, под тач):
Видеоплеер: HTML5 <video> или WebGL-плеер (если анимации с альфа)
3D карта: WebGL-сцена через Three.js или Spline (встраиваемо)
UI + логика: JavaScript (или TypeScript), с управлением DOM, событиями тача и таймерами
---
3. Логика реализации — подробный шаг за шагом
Шаг 1: Видеоплеер с циклом
Шаг 2: Кнопка «Показать карту»
Шаг 3: Подключаем 3D карту
Шаг 4: Вращение и масштаб
Шаг 5: Кнопка «Назад»