Веб-інтерфейс

SVITRIX використовує сучасний Single Page Application (SPA), побудований на Preact, як веб-інтерфейс. SPA зберігається у файловій системі LittleFS пристрою і взаємодіє з прошивкою через REST API.

Після підключення SVITRIX до вашої Wi-Fi мережі відкрийте IP-адресу пристрою у браузері (порт 80). IP-адреса відображається на матриці при кожному завантаженні.

Сторінки

Сторінка	Маршрут	Опис
Screen	/	Перегляд матриці 32x8 у реальному часі з навігацією між додатками, завантаженням PNG та записом GIF.
Settings	/settings	Налаштування пристрою, розділені на незалежні секції з окремими кнопками збереження: WiFi, мережа, MQTT, NTP/часовий пояс, автентифікація, дисплей, додатки, час і дата, звук, надсилання повідомлень та завантажувач іконок. Є перемикач темної/світлої теми.
Data Fetcher	/datafetcher	Налаштування зовнішніх HTTP-джерел даних, які автоматично отримують та відображають дані на матриці. Детальніше: Збирач даних.
Files	/files	Вбудований файловий менеджер для перегляду, завантаження, редагування та видалення файлів на пристрої (іконки, мелодії, додатки, палітри).
Backup	/backup	Завантаження всіх файлів пристрою як JSON-бекап або відновлення з раніше завантаженого бекапу.
Update	/update	Завантаження прошивки (.bin) для OTA-оновлення. Пристрій перезавантажується автоматично після успішного оновлення.

Перше налаштування (режим AP)

Коли SVITRIX не може підключитися до збереженої WiFi мережі, він створює власну точку доступу:

Параметр	Значення
Назва мережі	svitrix_XXXXX
Пароль	12345678

Підключіться до цієї мережі та відкрийте http://192.168.4.1 у браузері. З'явиться мінімальна сторінка налаштування WiFi зі сканером мереж та підключенням. Після підключення до домашнього WiFi пристрій перезавантажиться і повний SPA стане доступним.

Розгортання SPA

Веб-інтерфейс зберігається окремо від прошивки у розділі файлової системи LittleFS. Після прошивки firmware завантажте файли SPA на пристрій:

cd web && npm run upload

Це збирає SPA та завантажує його в кореневу директорію LittleFS на пристрої. SPA-бандл — приблизно 18 КБ (gzip) і включає всі 6 сторінок.

Порада

Після завантаження SPA зберігається між оновленнями прошивки. Перезавантажувати SPA потрібно лише при оновленні самого веб-інтерфейсу.

Налаштування — докладний опис

Сторінка налаштувань організована у незалежні секції. Кожна секція має власну кнопку Save — зберігається тільки те, що ви змінили.

Перемикач темної/світлої теми (☀/☽) розташований у правому куті панелі навігації. Ваш вибір зберігається у браузері.

Інформаційна панель

Панель у верхній частині сторінки з інформацією про пристрій у реальному часі: версія прошивки, вільна RAM, рівень WiFi-сигналу, освітленість (lux), час роботи, температура, вологість та поточна яскравість.

WiFi

Сканування доступних мереж, вибір мережі та введення пароля для підключення. Пристрій перезавантажується після підключення.

Мережа

Увімкніть Static IP для налаштування фіксованої IP-адреси, шлюзу, маски підмережі та DNS-сервера замість DHCP.

MQTT

Підключення до MQTT-брокера для інтеграції з Home Assistant та віддаленого керування:

• Broker — ім'я хоста або IP MQTT-брокера
• Port — за замовчуванням 1883
• Username / Password — облікові дані брокера
• Prefix — префікс MQTT-топіків (за замовчуванням: ID пристрою)
• Home Assistant Discovery — автоматичне виявлення пристрою в HA

NTP та часовий пояс

• NTP Server — сервер часу (за замовчуванням: pool.ntp.org)
• Timezone — POSIX-рядок часового поясу (знайдіть свій на posix_tz_db)

Автентифікація

Див. розділ Автентифікація нижче.

Нічний режим

Розклад режиму зниженої яскравості з одним кольором для нічного використання (напр. годинник у спальні):

• Enable Night Mode — увімкнути/вимкнути функцію
• Start / End — часовий діапазон (напр. 21:00 до 06:00, підтримує перехід через опівніч)
• Night Brightness — яскравість дисплею вночі (1–50)
• Night Color — колір тексту в нічному режимі (за замовчуванням: червоний — менше втомлює очі)
• Block Auto-Transition — якщо увімкнено, додатки не перемикаються автоматично; використовуйте кнопки для навігації

Під час запланованого часу дисплей затемнюється до налаштованої яскравості, а весь текст відображається обраним нічним кольором. Коли часове вікно закінчується, нормальні налаштування відновлюються автоматично.

Дисплей

• Matrix Power — увімкнути/вимкнути LED-матрицю
• Auto Brightness — автоматичне регулювання яскравості за освітленістю
• Brightness — ручний рівень яскравості (0–255)
• Gamma — гамма-корекція (0.5–3.0)
• Uppercase — примусовий верхній регістр тексту
• Text Color — колір тексту за замовчуванням для всіх додатків
• Color Correction / Color Temperature — розширене налаштування кольорів LED

Додатки

Увімкнення/вимкнення вбудованих додатків з індивідуальним вибором кольору:

• Time, Date, Temperature (з кольором), Humidity (з кольором), Battery (з кольором)

Поведінка додатків:

• App Duration — тривалість показу кожного додатку (1–60с)
• Auto Transition — автоматичне перемикання між додатками
• Transition Effect — візуальний ефект перемикання (None, Slide, Dim, Zoom тощо)
• Transition Speed — швидкість анімації переходу (100–2000мс)
• Scroll Speed — швидкість прокрутки тексту
• Block Navigation — заблокувати перемикання додатків кнопками

Час і дата

• Time Format / Date Format — рядки формату strftime (напр., %H:%M, %d.%m.%y)
• Time Mode — стиль відображення: Plain Text, Calendar, Calendar Top, Calendar Alt, Big Digits або Binary
• Start on Monday — тиждень починається з понеділка
• Celsius — температура в °C (вимк = °F)
• Time / Date Color — індивідуальні кольори для часу та дати
• Show Weekday — показувати індикатор дня тижня
• Weekday Active / Inactive Color — кольори точок дня тижня
• Calendar Header / Text / Body Color — кольори блоку календаря

Звук

• Sound Enabled — увімкнути/вимкнути зуммер
• Volume — рівень гучності зуммера (0–30)

Надсилання повідомлення

Надіслати одноразове повідомлення на дисплей:

• Text — текст повідомлення (обов'язковий)
• Icon — ID іконки або назва файлу з /ICONS/
• Icon Layout — розташування іконки: зліва, справа або приховати
• Duration — тривалість показу повідомлення (1–60с)
• Rainbow — переливання тексту кольорами веселки
• Color — колір тексту (коли Rainbow вимкнено)
• Sound — відтворити звуковий файл з /MELODIES/
• RTTTL — відтворити мелодію у форматі RTTTL

Завантажувач іконок

Завантаження іконок з бібліотеки LaMetric:

1. Введіть номер ID іконки
2. Натисніть Preview для перегляду
3. Натисніть Download для збереження в папку /ICONS/ на пристрої

Дії

• Save Display Settings — зберегти всі налаштування дисплею одразу (якщо окремі кнопки Save були пропущені)
• Reset Defaults — відновити всі налаштування до заводських (потребує підтвердження)
• Reboot — перезавантажити пристрій (потребує підтвердження)

Автентифікація

Ви можете встановити логін та пароль у Settings → Authentication. Після налаштування кожна сторінка, API-запит і застосунок SVITRIX вимагатимуть ці облікові дані. Залиште обидва поля порожніми для вимкнення автентифікації.

Увага

Не втрачайте облікові дані автентифікації — інакше доведеться повністю скинути пристрій.