mirror of
https://github.com/Matysh/houseplan-card
synced 2026-09-29 03:09:36 +00:00
Dashboard 5
Интерактивный HTML-прототип финальной компоновки информационной панели House Plan по итогам встречи 8 сентября 2026 года и требованиям issue #437.
Запуск
Откройте папку через локальный HTTP-сервер:
python -m http.server 8768
После запуска страница доступна по адресу http://127.0.0.1:8768/.
Главное отличие версии 5
- панель плавает поверх плана и не изменяет его рабочую область;
- в горизонтальной ориентации экрана располагается справа;
- в вертикальной ориентации экрана автоматически перемещается вниз;
- положение пересчитывается при изменении размера окна или повороте устройства;
- габариты панели зависят от содержимого и ограничиваются доступным экраном;
- в нижнем положении панель центрируется и сохраняет компактную ширину по содержимому;
- собственный заголовок возвращён в панель;
- в шапке House Plan находится компактный составной контрол без текста;
- левая половина контрола открывает общий диалог настройки;
- правая половина показывает и скрывает панель;
- переключатель видимости в диалоге управляет тем же состоянием;
- отдельное состояние сворачивания панели отсутствует;
- блоки не сворачиваются ни в просмотре, ни в настройках;
- появление и скрытие анимируется в направлении текущего края;
- в режиме киоска учитываются плавающие элементы управления.
Основные файлы
index.html— интерфейс House Plan и разметка панели/диалогов;dashboard-5.js— модель, адаптивная позиция, настройки и взаимодействия;dashboard-5.css— компоновка, анимации, темы и киоск;styles.css,components.css— базовое оформление плана;svg/— локальные иконки.
Ограничение прототипа
Список сущностей остаётся демонстрационным, а конфигурация сохраняется в localStorage. В продуктовой реализации источником сущностей должен быть hass.states, а хранение необходимо интегрировать со штатной конфигурацией House Plan.
Полный пакет передачи разработчикам описан в DEVELOPER-HANDOFF.md. Текст, который можно использовать при прикреплении архива к issue, находится в ISSUE-HANDOFF.md.