Edit esp-bedside-panel.yaml

This commit is contained in:
ESPHome Device Builder
2026-07-16 19:07:51 +12:00
parent 54f4da6c18
commit 5403d27f10
+160 -83
View File
@@ -6,6 +6,7 @@
# https://home.fox.co.nz/gitea/zorruno/zorruno-homeassistant/src/branch/master/esphome/esp-bedside-panel.yaml
#:########################################################################################:#
# VERSIONS:
# V0.8k 2026-07-16 Revised Bedroom header and added five-button navigation row
# V0.8j 2026-07-16 Added delayed Home Assistant state synchronisation for button highlighting at startup
# V0.8i 2026-07-16 Moved Clock date upward, added missing value glyphs and increased Clock to 190px
# V0.8h 2026-07-16 Updated local environment entities and added Moon / Outdoor readings
@@ -54,6 +55,7 @@
# - The 24-hour clock font is increased cautiously from 170px to 190px.
# - The display remains in its native 1024x600 landscape orientation.
# - The default page contains nine Bedroom / nearby controls.
# - The bottom navigation row contains Bedtime, Climate, Future1, Future2 and Clock.
# - After the configured idle period:
# - The large clock page is displayed.
# - Backlight brightness is reduced.
@@ -77,12 +79,12 @@ substitutions:
# Device Naming
device_name: "esp-bedside-panel"
friendly_name: "ESP Bedside Panel"
description_comment: "Guition JC1060P470C_I_W_Y ESP32-P4 bedside clock and Home Assistant control panel. Startup state synchronisation for LVGL button highlighting. (Layout V1.1)"
description_comment: "Guition JC1060P470C_I_W_Y ESP32-P4 bedside clock and Home Assistant control panel. Compact Bedroom status header and five-button navigation row. (Layout V1.1)"
device_area: "Bedroom"
# Project Naming
project_name: "Guition.JC1060P470C_I_W_Y"
project_version: "v0.8j"
project_version: "v0.8k"
# Passwords & Secrets
api_key: !secret esp-api_key
@@ -261,10 +263,9 @@ api:
level: INFO
format: "API connected: ESP Bedside Panel is online"
- lvgl.label.update:
id: bedroom_connection_label
text: "HA connected"
text_color: 0x65D483
- lvgl.widget.update:
id: bedroom_connection_indicator
bg_color: 0x65D483
# HA may deliver imported entity states before all LVGL widgets are ready.
# Run a delayed two-pass refresh so startup colours always match HA.
@@ -276,10 +277,21 @@ api:
level: WARN
format: "API disconnected: ESP Bedside Panel is offline from Home Assistant"
- lvgl.label.update:
id: bedroom_connection_label
text: "HA offline"
text_color: 0xF06A6A
# Allow another API client to remain connected before showing offline.
- delay: 500ms
- if:
condition:
api.connected:
then:
- lvgl.widget.update:
id: bedroom_connection_indicator
bg_color: 0x65D483
else:
- lvgl.widget.update:
id: bedroom_connection_indicator
bg_color: 0xF06A6A
#:########################################################################################:#
# OTA:
@@ -663,6 +675,19 @@ script:
- id: refresh_button_states
mode: restart
then:
- if:
condition:
api.connected:
then:
- lvgl.widget.update:
id: bedroom_connection_indicator
bg_color: 0x65D483
else:
- lvgl.widget.update:
id: bedroom_connection_indicator
bg_color: 0xF06A6A
- lvgl.widget.update:
id: north_lights_button
bg_color: !lambda |-
@@ -869,20 +894,20 @@ lvgl:
bg_opa: COVER
widgets:
- label:
x: 35
y: 14
text: "Bedroom"
text_font: font_title
text_color: 0xFFFFFF
- label:
id: bedroom_connection_label
x: 38
y: 57
text: "Waiting for HA"
text_font: font_small
text_color: 0xF0A45D
# Home Assistant API status:
# Green = connected, red = disconnected.
- obj:
id: bedroom_connection_indicator
x: 30
y: 25
width: 18
height: 18
radius: 9
bg_color: 0xF06A6A
bg_opa: COVER
border_width: 0
shadow_width: 0
clickable: false
# Four status readings across the top
- label:
@@ -1195,71 +1220,20 @@ lvgl:
data:
entity_id: "${bathroom_fan_entity}"
- button:
id: clock_now_button
x: 35
y: 475
width: 280
height: 92
widgets:
- label:
id: clock_now_button_label
align: CENTER
text: "Show Clock"
text_font: font_button
text_color: 0xFFFFFF
bg_color: 0x214F72
bg_opa: COVER
border_width: 2
border_color: 0x3E7FA7
radius: 16
on_click:
- lvgl.page.show:
id: clock_page
animation: FADE_IN
time: 250ms
- light.turn_on:
id: display_backlight
brightness: "${clock_brightness}"
transition_length: 1500ms
- button:
id: spare_navigation_button
x: 340
y: 475
width: 280
height: 92
widgets:
- label:
id: spare_navigation_button_label
align: CENTER
text: "Climate"
text_font: font_button
text_color: 0xFFFFFF
bg_color: 0x315843
bg_opa: COVER
border_width: 2
border_color: 0x548C6C
radius: 16
on_click:
- lvgl.page.show:
id: climate_page
animation: MOVE_LEFT
time: 220ms
#:################################################################################:#
# BEDROOM PAGE BOTTOM NAVIGATION
#:################################################################################:#
- button:
id: bedtime_button
x: 645
x: 18
y: 475
width: 344
width: 190
height: 92
widgets:
- label:
id: bedtime_button_label
align: CENTER
text: "Hold for Bedtime"
text: "Bedtime (Hold)"
text_font: font_button
text_color: 0xFFFFFF
bg_color: 0x3B3048
@@ -1267,6 +1241,8 @@ lvgl:
border_width: 2
border_color: 0x735E88
radius: 16
pressed:
bg_color: 0x584668
on_long_press:
then:
@@ -1277,13 +1253,114 @@ lvgl:
- lvgl.label.update:
id: bedtime_button_label
text: "Bedtime Activated"
text: "Activated"
- delay: 2s
- lvgl.label.update:
id: bedtime_button_label
text: "Hold for Bedtime"
text: "Bedtime (Hold)"
- button:
id: climate_navigation_button
x: 216
y: 475
width: 190
height: 92
widgets:
- label:
id: climate_navigation_button_label
align: CENTER
text: "Climate"
text_font: font_button
text_color: 0xFFFFFF
bg_color: 0x315843
bg_opa: COVER
border_width: 2
border_color: 0x548C6C
radius: 16
pressed:
bg_color: 0x416F55
on_click:
- lvgl.page.show:
id: climate_page
animation: MOVE_LEFT
time: 220ms
- button:
id: future_1_navigation_button
x: 414
y: 475
width: 190
height: 92
widgets:
- label:
id: future_1_navigation_button_label
align: CENTER
text: "Future1"
text_font: font_button
text_color: 0xAEB8C4
bg_color: 0x28313D
bg_opa: COVER
border_width: 2
border_color: 0x445365
radius: 16
pressed:
bg_color: 0x34404F
- button:
id: future_2_navigation_button
x: 612
y: 475
width: 190
height: 92
widgets:
- label:
id: future_2_navigation_button_label
align: CENTER
text: "Future2"
text_font: font_button
text_color: 0xAEB8C4
bg_color: 0x28313D
bg_opa: COVER
border_width: 2
border_color: 0x445365
radius: 16
pressed:
bg_color: 0x34404F
- button:
id: clock_now_button
x: 810
y: 475
width: 190
height: 92
widgets:
- label:
id: clock_now_button_label
align: CENTER
text: "Clock"
text_font: font_button
text_color: 0xFFFFFF
bg_color: 0x214F72
bg_opa: COVER
border_width: 2
border_color: 0x3E7FA7
radius: 16
pressed:
bg_color: 0x2E6A96
on_click:
- lvgl.page.show:
id: clock_page
animation: FADE_IN
time: 250ms
- light.turn_on:
id: display_backlight
brightness: "${clock_brightness}"
transition_length: 1500ms
#:####################################################################################:#
# CLIMATE PAGE