diff --git a/esphome/esp-bedside-panel.yaml b/esphome/esp-bedside-panel.yaml index 2a4c4d7..8b1fdb5 100644 --- a/esphome/esp-bedside-panel.yaml +++ b/esphome/esp-bedside-panel.yaml @@ -6,6 +6,7 @@ # https://home.fox.co.nz/gitea/zorruno/zorruno-homeassistant/src/branch/master/esphome/esp-bedside-panel.yaml #:########################################################################################:# # VERSIONS: +# V1.21 2026-07-18 Replaced bottom navigation text with icons and live time # V1.20 2026-07-18 Swapped Bedtime/Jobs, defaulted Doorbell and refined Climate icons # V1.18 2026-07-18 Added Lounge Fire, six Security cameras, Jobs page and weather/tide header # V1.17 2026-07-18 Swapped Bedroom Climate/Atto buttons and removed Garage test logs @@ -121,12 +122,12 @@ substitutions: # Device Naming device_name: "esp-bedside-panel" friendly_name: "ESP Bedside Panel" - description_comment: "Guition JC1060P470C_I_W_Y ESP32-P4 bedside control panel. Compact Bedtime, bottom Jobs Summary, Doorbell default and icon-refined Climate controls. (Layout V1.1)" + description_comment: "Guition JC1060P470C_I_W_Y ESP32-P4 bedside control panel. Icon-only bottom navigation with live 24-hour clock buttons. (Layout V1.1)" device_area: "Bedroom" # Project Naming project_name: "Guition.JC1060P470C_I_W_Y" - project_version: "v1.20" + project_version: "v1.21" # Passwords & Secrets api_key: !secret esp-api_key @@ -291,6 +292,7 @@ esphome: - script.execute: refresh_api_indicator - script.execute: refresh_button_states - script.execute: refresh_sleep_timer + - script.execute: refresh_navigation_time #:########################################################################################:# # ESP PLATFORM AND FRAMEWORK: @@ -416,6 +418,8 @@ time: - rx8130.write_time: id: rtc_time + - script.execute: refresh_navigation_time + #:########################################################################################:# # I2C: # https://esphome.io/components/i2c.html @@ -563,6 +567,29 @@ font: - "\U000F0335" # mdi-lightbulb - "\U000F06D9" # mdi-garage - "\U000F1054" # mdi-outdoor-lamp + - "\U000F014E" # mdi-clipboard-check + + # Large bottom-navigation icons. + - file: "https://raw.githubusercontent.com/Templarian/MaterialDesign-Webfont/master/fonts/materialdesignicons-webfont.ttf" + id: font_mdi_navigation + size: 50 + bpp: 4 + glyphs: + - "\U000F004D" # mdi-arrow-left + - "\U000F07A8" # mdi-car-estate + - "\U000F050F" # mdi-thermometer + - "\U000F068A" # mdi-shield-home + + # Live 24-hour time shown in bottom-right clock buttons. + - file: + type: gfonts + family: Roboto + weight: 500 + id: font_navigation_time + size: 42 + bpp: 4 + glyphs: + - "0123456789:" # Compact Vehicles-page icon font. - file: "https://raw.githubusercontent.com/Templarian/MaterialDesign-Webfont/master/fonts/materialdesignicons-webfont.ttf" @@ -1047,6 +1074,61 @@ globals: # Refresh all state-dependent LVGL button colours #:########################################################################################:# script: + #:######################################################################################:# + # BOTTOM NAVIGATION LIVE TIME + #:######################################################################################:# + - id: refresh_navigation_time + mode: restart + then: + - if: + condition: + lambda: |- + return ( + id(lvgl_ready) && + id(ha_time).now().is_valid() + ); + + then: + - lvgl.label.update: + id: clock_now_button_label + text: !lambda |- + auto now = id(ha_time).now(); + char buffer[8]; + now.strftime(buffer, sizeof(buffer), "%H:%M"); + return std::string(buffer); + + - lvgl.label.update: + id: jobs_clock_button_label + text: !lambda |- + auto now = id(ha_time).now(); + char buffer[8]; + now.strftime(buffer, sizeof(buffer), "%H:%M"); + return std::string(buffer); + + - lvgl.label.update: + id: vehicles_clock_button_label + text: !lambda |- + auto now = id(ha_time).now(); + char buffer[8]; + now.strftime(buffer, sizeof(buffer), "%H:%M"); + return std::string(buffer); + + - lvgl.label.update: + id: climate_clock_button_label + text: !lambda |- + auto now = id(ha_time).now(); + char buffer[8]; + now.strftime(buffer, sizeof(buffer), "%H:%M"); + return std::string(buffer); + + - lvgl.label.update: + id: security_clock_button_label + text: !lambda |- + auto now = id(ha_time).now(); + char buffer[8]; + now.strftime(buffer, sizeof(buffer), "%H:%M"); + return std::string(buffer); + # Update Bedroom and Clock status values after LVGL has finished constructing. - id: refresh_header_status mode: restart @@ -2166,6 +2248,8 @@ interval: return id(ha_time).now().is_valid(); then: + - script.execute: refresh_navigation_time + - lvgl.label.update: id: clock_time_label text: !lambda |- @@ -3227,9 +3311,16 @@ lvgl: bg_color: 0x34495C widgets: - label: - x: 10 + align: LEFT_MID + x: 12 + text: "\U000F014E" + text_font: font_mdi_button + text_color: 0xAFC7DC + + - label: + x: 47 y: 7 - width: 170 + width: 132 text: "Jobs Summary" text_font: font_header text_align: CENTER @@ -3237,9 +3328,9 @@ lvgl: - label: id: bedroom_jobs_summary_value_label - x: 10 + x: 47 y: 29 - width: 170 + width: 132 height: 54 text: "--" text_font: font_header @@ -3263,8 +3354,8 @@ lvgl: - label: id: climate_navigation_button_label align: CENTER - text: "Climate" - text_font: font_button + text: "\U000F050F" + text_font: font_mdi_navigation text_color: 0xFFFFFF bg_color: 0x315843 bg_opa: COVER @@ -3290,8 +3381,8 @@ lvgl: - label: id: atto_navigation_button_label align: CENTER - text: "Atto (Hold)" - text_font: font_button + text: "\U000F07A8" + text_font: font_mdi_navigation text_color: 0xFFFFFF bg_color: 0x3E4652 bg_opa: COVER @@ -3325,8 +3416,8 @@ lvgl: - label: id: security_navigation_button_label align: CENTER - text: "Security" - text_font: font_button + text: "\U000F068A" + text_font: font_mdi_navigation text_color: 0xFFFFFF bg_color: 0x493535 bg_opa: COVER @@ -3365,8 +3456,8 @@ lvgl: - label: id: clock_now_button_label align: CENTER - text: "Clock" - text_font: font_button + text: "--:--" + text_font: font_navigation_time text_color: 0xFFFFFF bg_color: 0x214F72 bg_opa: COVER @@ -3413,8 +3504,8 @@ lvgl: widgets: - label: align: CENTER - text: "Back" - text_font: font_button + text: "\U000F004D" + text_font: font_mdi_navigation text_color: 0xFFFFFF on_click: - lvgl.page.show: @@ -3437,9 +3528,10 @@ lvgl: bg_color: 0x2E6A96 widgets: - label: + id: jobs_clock_button_label align: CENTER - text: "Clock" - text_font: font_button + text: "--:--" + text_font: font_navigation_time text_color: 0xFFFFFF on_click: - lvgl.page.show: @@ -4091,8 +4183,8 @@ lvgl: widgets: - label: align: CENTER - text: "Back" - text_font: font_button + text: "\U000F004D" + text_font: font_mdi_navigation text_color: 0xFFFFFF on_click: - lvgl.page.show: @@ -4115,9 +4207,10 @@ lvgl: bg_color: 0x2E6A96 widgets: - label: + id: vehicles_clock_button_label align: CENTER - text: "Clock" - text_font: font_button + text: "--:--" + text_font: font_navigation_time text_color: 0xFFFFFF on_click: - lvgl.page.show: @@ -4862,8 +4955,8 @@ lvgl: widgets: - label: align: CENTER - text: "Back" - text_font: font_button + text: "\U000F004D" + text_font: font_mdi_navigation text_color: 0xFFFFFF on_click: - lvgl.page.show: @@ -4886,9 +4979,10 @@ lvgl: bg_color: 0x2E6A96 widgets: - label: + id: climate_clock_button_label align: CENTER - text: "Clock" - text_font: font_button + text: "--:--" + text_font: font_navigation_time text_color: 0xFFFFFF on_click: - lvgl.page.show: @@ -5208,8 +5302,8 @@ lvgl: widgets: - label: align: CENTER - text: "Back" - text_font: font_button + text: "\U000F004D" + text_font: font_mdi_navigation text_color: 0xFFFFFF on_click: - lambda: |- @@ -5237,9 +5331,10 @@ lvgl: bg_color: 0x2E6A96 widgets: - label: + id: security_clock_button_label align: CENTER - text: "Clock" - text_font: font_button + text: "--:--" + text_font: font_navigation_time text_color: 0xFFFFFF on_click: - lambda: |-