- JavaScript 62.7%
- CSS 21.6%
- HTML 15.7%
| Filename | Latest commit message | Latest commit date |
|---|---|---|
- 6 предустановленных техник (Квадрат, Расслабление, Вейль, Когерентное, Простое, Длинный выдох) - Пользовательские техники с валидацией (2-6 фаз, макс 9 сек) - N-угольники: линия, треугольник, квадрат, пятиугольник, шестиугольник - Сохранение пользовательских техник в IndexedDB - Фиксированные размеры и центрирование фигур |
||
| icons | ||
| alpine.min.js | ||
| app.js | ||
| index.html | ||
| LICENSE | ||
| manifest.json | ||
| README.md | ||
| styles.css | ||
| sw.js | ||
Дыхательные техники
PWA-приложение для визуализации дыхательных техник — анимированный индикатор движется по периметру N-угольника.
Функции
- 6 предустановленных техник: Квадрат, Расслабление, Вейль, Когерентное, Простое, Длинный выдох
- Пользовательские техники — создавайте свои (2-6 фаз, макс 9 сек на фазу), сохраняются в IndexedDB
- Визуализация — индикатор движется по фигуре: линия (2 фазы), треугольник (3), квадрат (4), пятиугольник (5), шестиугольник (6)
- Плавные переходы — цифры и надписи плавно затухают и появляются
- Цветовые циклы — каждый цикл новый цвет
- Свечение — активное ребро светится, завершённые сохраняют цвет
- PWA — установите на устройство для offline-работы
- Автотемы — светлая и тёмная тема (системная настройка)
Разработка
npx serve
Откройте http://localhost:3000
Стек
- Alpine.js (локальная копия)
- Vanilla CSS с CSS-переменными
- Canvas API для отрисовки фигур
- IndexedDB для пользовательских техник
- Service Worker (cache-first)
Лицензия
GPLv3