diff --git a/custom_cards/custom_card_camera/README.md b/custom_cards/custom_card_camera/README.md new file mode 100644 index 000000000..e600d5bd5 --- /dev/null +++ b/custom_cards/custom_card_camera/README.md @@ -0,0 +1,71 @@ +--- +title: Custom Camera Card +hide: + - toc +--- + + +# Custom-card "Camera" + +This is a `custom-card` to display a camera live view. + +![Screenshot](../../docs/assets/img/screenshot_custom_camera1.png) +![Screenshot](../../docs/assets/img/screenshot_custom_camera2.png) + +## Credits + +Author: Eltarius, from the script of [Clemalex](https://forum.hacf.fr/t/dashboard-minimalist/5507/183?u=clemalex) - 2022 +Version: 1.0.0 + +## Changelog + +
+1.0.0 +Initial release. +
+ +## Usage + +```yaml +- type: "custom:button-card" + entity: "camera.sensor" + template: "custom_card_camera" + show_icon: false #True if you set ulm_custom_card_camera_title: true + variables: + ulm_custom_card_camera_title: true + ulm_custom_card_camera_name: "name" + ulm_custom_card_camera_label: "label" +``` + +## Variables + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
VariableExampleRequiredDefaultExplanation
ulm_custom_card_camera_titletrueyesIf you want header card
ulm_custom_card_camera_name"Garden"noName of your choice
ulm_custom_card_camera_label"Room"noLabel of your choice
diff --git a/custom_cards/custom_card_camera/custom_card_camera.yaml b/custom_cards/custom_card_camera/custom_card_camera.yaml new file mode 100644 index 000000000..a5a5d6c47 --- /dev/null +++ b/custom_cards/custom_card_camera/custom_card_camera.yaml @@ -0,0 +1,74 @@ +--- +custom_card_camera: + template: + - "blue_no_state" + show_name: false + show_label: false + styles: + card: + - border-radius: "20px" + - box-shadow: "var(--box-shadow)" + - padding: |- + [[[ + if(variables.ulm_custom_card_camera_title) + return "12px"; + else + return "0px"; + ]]] + img_cell: + - border-radius: "50%" + - place-self: "center" + - width: "42px" + - height: "42px" + grid: + - grid-template-areas: "'i item1' 'i item1' 'item2 item2'" + - grid-template-columns: "min-content auto" + - grid-template-rows: "min-content min-content min-content" + - row-gap: |- + [[[ + if(variables.ulm_custom_card_camera_title) + return "12px"; + else + return "0px"; + ]]] + custom_fields: + item1: + card: + type: "custom:button-card" + show_name: "[[[ return variables.ulm_custom_card_camera_title; ]]]" + show_label: "[[[ return variables.ulm_custom_card_camera_title; ]]]" + show_icon: "[[[ return variables.ulm_custom_card_camera_title; ]]]" + name: "[[[ return variables.ulm_custom_card_camera_name; ]]]" + label: "[[[ return variables.ulm_custom_card_camera_label; ]]]" + styles: + card: + - box-shadow: "none" + - padding: "0" + name: + - align-self: "end" + - justify-self: "start" + - font-weight: "bold" + - font-size: "14px" + - margin-left: "12px" + - filter: "opacity(100%)" + label: + - justify-self: "start" + - align-self: "start" + - font-weight: "bolder" + - font-size: "12px" + - filter: "opacity(40%)" + - margin-left: "12px" + grid: + - grid-template-areas: "'n' 'l'" + - grid-template-columns: "auto" + - grid-template-rows: "min-content min-content" + item2: + card: + type: "picture-entity" + camera_image: "[[[ return entity.entity_id ]]]" + camera_view: "live" + entity: "[[[ return entity.entity_id ]]]" + show_name: false + show_state: false + tap_action: + action: "more-info" diff --git a/custom_cards/custom_card_damix48_power_details/languages/de.yaml b/custom_cards/custom_card_damix48_power_details/languages/de.yaml new file mode 100644 index 000000000..e294d090b --- /dev/null +++ b/custom_cards/custom_card_damix48_power_details/languages/de.yaml @@ -0,0 +1,7 @@ +--- +ulm_custom_card_damix48_power_details_language_variables: + variables: + ulm_custom_card_damix48_power_details_hour: "Stunde" + ulm_custom_card_damix48_power_details_hours: "Stunden" + ulm_custom_card_damix48_power_details_in_the_last: "In der letzten" + ulm_custom_card_damix48_power_details_in_the_lasts: "In den letzten" diff --git a/custom_cards/custom_card_eraycetinay_lock/README.md b/custom_cards/custom_card_eraycetinay_lock/README.md index 64ffdab2f..28806b446 100644 --- a/custom_cards/custom_card_eraycetinay_lock/README.md +++ b/custom_cards/custom_card_eraycetinay_lock/README.md @@ -7,7 +7,7 @@ hide: # Custom-card "Lock" -This is a `custom-card` that works in switch logic with a `lock` entity. Card structure uses `lock`, `unlock` actions and `lock`,`unlock`,`locking`,`unlocking` states. +This is a `custom-card` that works in switch logic with a `lock` entity. Card structure uses `lock`, `unlock` (optional `open`) actions and `lock`,`unlock`,`locking`,`unlocking`, `jammed` states. ![Generic](../../docs/assets/img/custom_card_eraycetinay_lock_locked.png) ![Generic](../../docs/assets/img/custom_card_eraycetinay_lock_unlocked.png) @@ -20,6 +20,8 @@ Version: 0.0.1 ## Changelog
+ 0.0.2 + Added option to only use lock.open 0.0.1 Initial release
@@ -33,6 +35,7 @@ Version: 0.0.1 name: "Door Lock" variables: ulm_custom_card_eraycetinay_lock_tap_control: true + ulm_custom_card_eraycetinay_lock_open: true ``` ## Variables @@ -50,6 +53,12 @@ Version: 0.0.1 no Lock/Unlock on tap action + +ulm_custom_card_eraycetinay_lock_open +true +no +Only use the card to open the door (always sends lock.open on tap) + ## Template code @@ -74,10 +83,15 @@ custom_card_eraycetinay_lock: service: | [[[ if(variables.ulm_custom_card_eraycetinay_lock_tap_control == true){ - if (entity.state == "locked"){ - return "lock.unlock" - } else if (entity.state == "unlocked"){ - return "lock.lock" + if(variables.ulm_custom_card_eraycetinay_lock_open == true){ + return "lock.open" + } else { + if (entity.state == "locked"){ + return "lock.unlock" + } + } else if (entity.state == "unlocked"){ + return "lock.lock" + } } } else { return; @@ -98,10 +112,14 @@ custom_card_eraycetinay_lock: return variables.custom_card_eraycetinay_lock_locked; } else if (entity.state == "unlocked"){ return variables.custom_card_eraycetinay_lock_unlocked; + } else if (entity.state == "open"){ + return variables.ulm_open; } else if (entity.state == "unlocking"){ return variables.custom_card_eraycetinay_lock_unlocking; } else if (entity.state == "locking"){ return variables.custom_card_eraycetinay_lock_locking; + } else if (entity.state == "jammed"){ + return variables.custom_card_eraycetinay_lock_jammed; } else { return entity.state; } @@ -134,9 +152,9 @@ custom_card_eraycetinay_lock: icon: - color: "rgba(var(--color-theme),0.2)" img_cell: - - background-color: "rgba(var(--color-theme),0.05)" - - border-radius: "50%" - - place-self: "center" - - width: "42px" - - height: "42px" + - background-color: "rgba(var(--color-theme),0.05)" + - border-radius: "50%" + - place-self: "center" + - width: "42px" + - height: "42px" ``` diff --git a/custom_cards/custom_card_eraycetinay_lock/custom_card_eraycetinay_lock.yaml b/custom_cards/custom_card_eraycetinay_lock/custom_card_eraycetinay_lock.yaml index 3936ae165..e95cf01d3 100644 --- a/custom_cards/custom_card_eraycetinay_lock/custom_card_eraycetinay_lock.yaml +++ b/custom_cards/custom_card_eraycetinay_lock/custom_card_eraycetinay_lock.yaml @@ -17,10 +17,15 @@ custom_card_eraycetinay_lock: service: | [[[ if(variables.ulm_custom_card_eraycetinay_lock_tap_control == true){ - if (entity.state == "locked"){ - return "lock.unlock" - } else if (entity.state == "unlocked"){ - return "lock.lock" + if(variables.ulm_custom_card_eraycetinay_lock_open == true){ + return "lock.open" + } else { + if (entity.state == "locked"){ + return "lock.unlock" + } + } else if (entity.state == "unlocked"){ + return "lock.lock" + } } } else { return; @@ -41,10 +46,14 @@ custom_card_eraycetinay_lock: return variables.custom_card_eraycetinay_lock_locked; } else if (entity.state == "unlocked"){ return variables.custom_card_eraycetinay_lock_unlocked; + } else if (entity.state == "open"){ + return variables.ulm_open; } else if (entity.state == "unlocking"){ return variables.custom_card_eraycetinay_lock_unlocking; } else if (entity.state == "locking"){ return variables.custom_card_eraycetinay_lock_locking; + } else if (entity.state == "jammed"){ + return variables.custom_card_eraycetinay_lock_jammed; } else { return entity.state; } diff --git a/custom_cards/custom_card_eraycetinay_lock/languages/de.yaml b/custom_cards/custom_card_eraycetinay_lock/languages/de.yaml index 8ed2b7f11..0dec2d439 100644 --- a/custom_cards/custom_card_eraycetinay_lock/languages/de.yaml +++ b/custom_cards/custom_card_eraycetinay_lock/languages/de.yaml @@ -6,3 +6,4 @@ ulm_custom_card_eraycetinay_lock_language_variables: custom_card_eraycetinay_lock_locking: "verriegeln" custom_card_eraycetinay_lock_unlocking: "entriegeln" custom_card_eraycetinay_lock_unavailable: "nicht verfügbar" + custom_card_eraycetinay_lock_jammed: "blockiert" diff --git a/custom_cards/custom_card_eraycetinay_lock/languages/en.yaml b/custom_cards/custom_card_eraycetinay_lock/languages/en.yaml index 4ce36fbba..42977a68e 100644 --- a/custom_cards/custom_card_eraycetinay_lock/languages/en.yaml +++ b/custom_cards/custom_card_eraycetinay_lock/languages/en.yaml @@ -6,3 +6,4 @@ ulm_custom_card_eraycetinay_lock_language_variables: custom_card_eraycetinay_lock_locking: "locking" custom_card_eraycetinay_lock_unlocking: "unlocking" custom_card_eraycetinay_lock_unavailable: "unavailable" + custom_card_eraycetinay_lock_jammed: "jammed" diff --git a/custom_cards/custom_card_heat_pump/languages/de.yaml b/custom_cards/custom_card_heat_pump/languages/de.yaml new file mode 100644 index 000000000..e9b1db55c --- /dev/null +++ b/custom_cards/custom_card_heat_pump/languages/de.yaml @@ -0,0 +1,8 @@ +--- +custom_card_heat_pump_language_variables: + variables: + custom_card_heat_pump_dry: "Trocknen" + custom_card_heat_pump_heat: "Heizen" + custom_card_heat_pump_heat_cool: "Auto" + custom_card_heat_pump_cool: "Kühlen" + custom_card_heat_pump_fan_only: "Nur Lüften" diff --git a/custom_cards/custom_card_heat_pump/languages/en.yaml b/custom_cards/custom_card_heat_pump/languages/en.yaml index 2ac1caee2..f0ccc6542 100644 --- a/custom_cards/custom_card_heat_pump/languages/en.yaml +++ b/custom_cards/custom_card_heat_pump/languages/en.yaml @@ -1,7 +1,6 @@ --- custom_card_heat_pump_language_variables: variables: - custom_card_heat_pump_off: "Off" custom_card_heat_pump_dry: "Dry" custom_card_heat_pump_heat: "Heat" custom_card_heat_pump_heat_cool: "Auto" diff --git a/custom_cards/custom_card_heat_pump/languages/pl.yaml b/custom_cards/custom_card_heat_pump/languages/pl.yaml index 36719bd89..492f6aa89 100644 --- a/custom_cards/custom_card_heat_pump/languages/pl.yaml +++ b/custom_cards/custom_card_heat_pump/languages/pl.yaml @@ -1,7 +1,6 @@ --- custom_card_heat_pump_language_variables: variables: - custom_card_heat_pump_off: "Wyłączone" custom_card_heat_pump_dry: "Osuszanie" custom_card_heat_pump_heat: "Grzanie" custom_card_heat_pump_heat_cool: "Automatycznie" diff --git a/custom_cards/custom_card_httpedo13_thermostat/custom_card_httpedo13_thermostat.yaml b/custom_cards/custom_card_httpedo13_thermostat/custom_card_httpedo13_thermostat.yaml index d24c055fd..539e08e20 100644 --- a/custom_cards/custom_card_httpedo13_thermostat/custom_card_httpedo13_thermostat.yaml +++ b/custom_cards/custom_card_httpedo13_thermostat/custom_card_httpedo13_thermostat.yaml @@ -2,7 +2,6 @@ custom_card_httpedo13_thermostat: template: - "ulm_language_variables" - - "custom_card_httpedo13_thermostat_language_variables" tap_action: action: "toggle" icon: | @@ -15,11 +14,11 @@ custom_card_httpedo13_thermostat: label: >- [[[ if (entity.state =='off') { - return variables.custom_card_httpedo13_thermostat_off; + return variables.ulm_off; } else if (entity.state =='heat') { - return variables.custom_card_httpedo13_thermostat_on; + return variables.ulm_on; } else if (entity.attributes.hvac_action == 'heating') { - return variables.custom_card_httpedo13_thermostat_heating; + return variables.ulm_heating; } return entity.state; ]]] @@ -195,7 +194,6 @@ custom_card_httpedo13_thermostat_with_buttons: entity_id: "[[[ return variables.entity ]]]" icon: "mdi:plus" - custom_card_httpedo13_thermostat_with_buttons_collapse: triggers_update: "all" styles: @@ -330,7 +328,6 @@ custom_card_httpedo13_thermostat_with_buttons_collapse: entity_id: "[[[ return variables.entity ]]]" icon: "mdi:plus" - widget_current_temperature: color: "var(--google-grey-500)" show_icon: false diff --git a/custom_cards/custom_card_httpedo13_thermostat/languages/en.yaml b/custom_cards/custom_card_httpedo13_thermostat/languages/en.yaml deleted file mode 100644 index 351039c57..000000000 --- a/custom_cards/custom_card_httpedo13_thermostat/languages/en.yaml +++ /dev/null @@ -1,6 +0,0 @@ ---- -custom_card_httpedo13_thermostat_language_variables: - variables: - custom_card_httpedo13_thermostat_off: "off" - custom_card_httpedo13_thermostat_on: "on" - custom_card_httpedo13_thermostat_heating: "heating" diff --git a/custom_cards/custom_card_httpedo13_thermostat/languages/pl.yaml b/custom_cards/custom_card_httpedo13_thermostat/languages/pl.yaml deleted file mode 100644 index 4a014ebb0..000000000 --- a/custom_cards/custom_card_httpedo13_thermostat/languages/pl.yaml +++ /dev/null @@ -1,6 +0,0 @@ ---- -custom_card_httpedo13_thermostat_language_variables: - variables: - custom_card_httpedo13_thermostat_off: "wyłączone" - custom_card_httpedo13_thermostat_on: "włączone" - custom_card_httpedo13_thermostat_heating: "grzanie" diff --git a/custom_cards/custom_card_httpedo13_thermostat/languages/pt.yaml b/custom_cards/custom_card_httpedo13_thermostat/languages/pt.yaml deleted file mode 100644 index 9be929b57..000000000 --- a/custom_cards/custom_card_httpedo13_thermostat/languages/pt.yaml +++ /dev/null @@ -1,6 +0,0 @@ ---- -custom_card_httpedo13_thermostat_language_variables: - variables: - custom_card_httpedo13_thermostat_off: "desligado" - custom_card_httpedo13_thermostat_on: "ligado" - custom_card_httpedo13_thermostat_heating: "A aquecer" diff --git a/custom_cards/custom_card_input_number/README.md b/custom_cards/custom_card_input_number/README.md index 997ae0318..ae52f7e34 100644 --- a/custom_cards/custom_card_input_number/README.md +++ b/custom_cards/custom_card_input_number/README.md @@ -14,12 +14,12 @@ The `card_input_number` you can control a input_number entity ## Credits Author: sildehoop - 2021 -Version: 1.0.1 +Version: 1.1.0

Braking changes

- 1.0.1 + 1.1.0 ```yaml #OLD @@ -44,6 +44,10 @@ Version: 1.0.1 ## Changelog +
+1.1.0 +Adds ability to work with counter entities. Compatibility with input number entities is not affected. +
1.0.1 Added option to leave ulm_card_input_number_name empty (takes the friendly_name of the entity) diff --git a/custom_cards/custom_card_input_number/card_input_number.yaml b/custom_cards/custom_card_input_number/card_input_number.yaml index 916c9e293..4f3c37efc 100644 --- a/custom_cards/custom_card_input_number/card_input_number.yaml +++ b/custom_cards/custom_card_input_number/card_input_number.yaml @@ -39,7 +39,14 @@ card_input_number: template: "widget_icon" tap_action: action: "call-service" - service: "input_number.decrement" + service: | + [[[ + if( entity.entity_id.startsWith("input_number.") ) + return "input_number.decrement"; + if( entity.entity_id.startsWith("counter.") ) + return "counter.decrement"; + return ""; + ]]] service_data: entity_id: "[[[ return entity.entity_id ]]]" icon: "mdi:arrow-down" @@ -59,7 +66,14 @@ card_input_number: template: "widget_icon" tap_action: action: "call-service" - service: "input_number.increment" + service: | + [[[ + if( entity.entity_id.startsWith("input_number.") ) + return "input_number.increment"; + if( entity.entity_id.startsWith("counter.") ) + return "counter.increment"; + return ""; + ]]] service_data: entity_id: "[[[ return entity.entity_id ]]]" icon: "mdi:arrow-up" diff --git a/custom_cards/custom_card_nik_door/README.md b/custom_cards/custom_card_nik_door/README.md new file mode 100644 index 000000000..dcc3c0134 --- /dev/null +++ b/custom_cards/custom_card_nik_door/README.md @@ -0,0 +1,178 @@ +--- +title: Minimal Door Lock Card +hide: + - toc +--- + + +# Custom-card "Minimal Door Lock" + +This is a `custom-card` that shows the currenct state of your Lock and allows you to open and close it showing the state with a Minimal Design. + +![Screenshot](../../docs/assets/img/custom_card_nik_door.png) + +## Credits + +Author: Nik - 2022 Version: 1.0.0 + +## Changelog + +
+1.0.0 +Initial release +
+ +## Requirements + +To have the Minimalist cards and custom cards installed + +## Usage + +```yaml +- type: 'custom:button-card' + template: custom_card_nik_door + entity: sensor.nuki_blindato_door_security_state + variables: + ulm_custom_card_entity_1_name: Blindato + ulm_custom_card_entity_1_lock: lock.nuki_blindato_lock +``` + +## Variables + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
VariableExampleRequiredExplanation
ulm_custom_card_entity_1_namesensor.nuki_blindato_door_security_stateYesYour Door Name
ulm_custom_card_entity_1_locklock.nuki_blindato_lockYesYour Door Lock entity
entitysensor.nuki_blindato_door_security_stateYesYour door sensor to track "Open" and "Close" state.
+ +## Template Code + +```yaml +--- +custom_card_nik_door: + template: + - "ulm_language_variables" + variables: + ulm_custom_card_entity_1_name: "[[[ return variables.ulm_custom_card_entity_1_name]]]" + ulm_custom_card_entity_1_lock: "[[[ return variables.ulm_custom_card_entity_1_lock]]]" + show_icon: false + show_name: false + show_label: false + styles: + grid: + - grid-template-areas: > + [[[ + var areas = []; + areas.push("item1 item1"); + areas.push("item2 item2"); + return "\"" + areas.join("\" \"") + "\""; + ]]] + - grid-template-columns: "1fr 1fr" + - grid-template-rows: "min-content" "min-content" + - row-gap: "12px" + card: + - border-radius: "var(--border-radius)" + - box-shadow: "var(--box-shadow)" + - padding: "12px" + + custom_fields: + item1: + card: + type: "custom:button-card" + template: + - "icon_more_info" + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return entity.entity_id]]]" + icon: "mdi:door" + styles: + icon: + - color: "rgba(var(--color-blue),1)" + img_cell: + - background-color: "rgba(var(--color-blue),0.2)" + tap_action: + action: "none" + item2: + card: + type: "custom:button-card" + entity: "[[[ return entity.entity_id]]]" + name: "[[[ return variables.ulm_custom_card_entity_1_name]]]" + label: > + [[[ + return entity.state + ]]] + item2: + card: + type: "custom:button-card" + template: "list_2_items" + custom_fields: + item1: + card: + type: "custom:button-card" + template: "widget_icon" + icon: "mdi:lock-open-variant" + entity: "[[[ return entity.entity_id]]]" + tap_action: + action: "call-service" + service: "lock.open" + service_data: + entity_id: "[[[ return variables.ulm_custom_card_entity_1_lock]]]" + state: + - value: "Open" + styles: + icon: + - color: "rgba(var(--color-red),1)" + img_cell: + - background-color: "rgba(var(--color-red),0.2)" + - value: "Closed & Unlocked" + styles: + icon: + - color: "rgba(var(--color-yellow),1)" + img_cell: + - background-color: "rgba(var(--color-yellow),0.2)" + item2: + card: + type: "custom:button-card" + template: "widget_icon" + icon: "mdi:lock" + entity: "[[[ return entity.entity_id]]]" + tap_action: + action: "call-service" + service: "lock.lock" + service_data: + entity_id: "[[[ return variables.ulm_custom_card_entity_1_lock]]]" + state: + - value: "Closed & Locked" + styles: + icon: + - color: "rgba(var(--color-green),1)" + img_cell: + - background-color: "rgba(var(--color-green),0.2)" +``` diff --git a/custom_cards/custom_card_nik_door/custom_card_nik_door.yaml b/custom_cards/custom_card_nik_door/custom_card_nik_door.yaml new file mode 100644 index 000000000..b45554006 --- /dev/null +++ b/custom_cards/custom_card_nik_door/custom_card_nik_door.yaml @@ -0,0 +1,102 @@ +--- +custom_card_nik_door: + template: + - "ulm_language_variables" + variables: + ulm_custom_card_entity_1_name: "[[[ return variables.ulm_custom_card_entity_1_name]]]" + ulm_custom_card_entity_1_lock: "[[[ return variables.ulm_custom_card_entity_1_lock]]]" + show_icon: false + show_name: false + show_label: false + styles: + grid: + - grid-template-areas: > + [[[ + var areas = []; + areas.push("item1 item1"); + areas.push("item2 item2"); + return "\"" + areas.join("\" \"") + "\""; + ]]] + - grid-template-columns: "1fr 1fr" + - grid-template-rows: "min-content min-content" + - row-gap: "12px" + card: + - border-radius: "var(--border-radius)" + - box-shadow: "var(--box-shadow)" + - padding: "12px" + + custom_fields: + item1: + card: + type: "custom:button-card" + template: + - "icon_more_info" + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return entity.entity_id]]]" + icon: "mdi:door" + styles: + icon: + - color: "rgba(var(--color-blue),1)" + img_cell: + - background-color: "rgba(var(--color-blue),0.2)" + tap_action: + action: "none" + item2: + card: + type: "custom:button-card" + entity: "[[[ return entity.entity_id]]]" + name: "[[[ return variables.ulm_custom_card_entity_1_name]]]" + label: > + [[[ + return entity.state + ]]] + item2: + card: + type: "custom:button-card" + template: "list_2_items" + custom_fields: + item1: + card: + type: "custom:button-card" + template: "widget_icon" + icon: "mdi:lock-open-variant" + entity: "[[[ return entity.entity_id]]]" + tap_action: + action: "call-service" + service: "lock.open" + service_data: + entity_id: "[[[ return variables.ulm_custom_card_entity_1_lock]]]" + state: + - value: "Open" + styles: + icon: + - color: "rgba(var(--color-red),1)" + img_cell: + - background-color: "rgba(var(--color-red),0.2)" + - value: "Closed & Unlocked" + styles: + icon: + - color: "rgba(var(--color-yellow),1)" + img_cell: + - background-color: "rgba(var(--color-yellow),0.2)" + item2: + card: + type: "custom:button-card" + template: "widget_icon" + icon: "mdi:lock" + entity: "[[[ return entity.entity_id]]]" + tap_action: + action: "call-service" + service: "lock.lock" + service_data: + entity_id: "[[[ return variables.ulm_custom_card_entity_1_lock]]]" + state: + - value: "Closed & Locked" + styles: + icon: + - color: "rgba(var(--color-green),1)" + img_cell: + - background-color: "rgba(var(--color-green),0.2)" diff --git a/custom_cards/custom_card_nik_nas/README.md b/custom_cards/custom_card_nik_nas/README.md new file mode 100644 index 000000000..a35aea085 --- /dev/null +++ b/custom_cards/custom_card_nik_nas/README.md @@ -0,0 +1,409 @@ +--- +title: Nas Summary Card +hide: + - toc +--- + + +# Custom-card "Nas Summary Card" + +This is a `custom-card` that shows you a summary for your NAS with sensors, Wake on Lan and collapsed info. Once the NAS is off or unavailable it collapses the info. + +![Screenshot](../../docs/assets/img/custom_card_nik_nas_off.png) +![Screenshot](../../docs/assets/img/custom_card_nik_nas_on.png) + +## Credits + +Author: Nik - 2022 +Version: 1.0.0 + +## Changelog + +
+1.0.0 +Initial release +
+ +## Requirements + +To have the Minimalist cards and custom cards installed + +## Usage + +```yaml +- type: "custom:button-card" + template: "custom_card_nik_nas" + entity: switch.qnap_wol + variables: + graph_span: "1d" + chart_type: "radialBar" + entity_1: + entity_id: "sensor.nas_cpu_temperature" + icon: '' + name: "Temp" + color: "yellow" + max_value: 100 + entity_2: + entity_id: "sensor.nas_memory_usage" + icon: '' + name: "Memory" + color: "blue" + max_value: 100 + entity_3: + entity_id: "sensor.nas_cpu_usage" + icon: '' + name: "CPU" + color: "green" + max_value: 100 + entity_4: + entity_id: "sensor.disk_use_percent" + icon: "mdi:harddisk" + name: "Disk" + color: "red" +``` + +## Variables + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
VariableExampleRequiredExplanation
entityswitch.qnap_wolyesThe Switch to turn On or Off the NAS
chart_typeline, scatter, pie, donut or radialBaryesThe chart type you want to display
graph_span1h, 12min, 1d, 1h25, 10sec, ...yesThe span of the graph as a time interval
entity_idsensor.disk_use_percentyesEntity sensor of choice. 4 entities must be added
iconmdi:cpu-64-bitnomdi icon you want to be exposed in the img_cell, '' will return entity.attributes.icon
namename for the used sensorno'' will return entity.attributes.friendly_name
colorgreen, blue, yellow, red or greynoif you don't use the color variable it will choice a random color
max_value10, 300, ...noMaximum value of the sensor. Default will be 100
+ +## Template Code + +```yaml +--- +custom_card_nik_nas: + variables: + entity_1: + entity_id: + icon: "[[[ return entity.attributes.icon ]]]" + name: "[[[ return entity.attributes.friendly_name ]]]" + color: > + [[[ + var colors = ["yellow", "blue", "red", "green"]; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_2: + entity_id: + icon: "[[[ return entity.attributes.icon ]]]" + name: "[[[ return entity.attributes.friendly_name ]]]" + color: > + [[[ + var colors = ["yellow", "blue", "red", "green"]; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_3: + entity_id: + icon: "[[[ return entity.attributes.icon ]]]" + name: "[[[ return entity.attributes.friendly_name ]]]" + color: > + [[[ + var colors = ["yellow", "blue", "red","green"]; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_4: + entity_id: + icon: "[[[ return entity.attributes.icon ]]]" + name: "[[[ return entity.attributes.friendly_name ]]]" + color: > + [[[ + var colors = ["yellow", "blue", "red","green"]; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + show_name: false + show_state: false + show_label: false + show_icon: false + show_last_changed: false + show_entity_picture: false + styles: + grid: + - grid-template-areas: > + [[[ + var areas = []; + if (entity.state == "off" || entity.state == "unavailable") { + areas.push("item5"); + return "\"" + areas.join("\" \"") + "\""; + } else { + areas.push("item4 item4"); + areas.push("item1 radial"); + areas.push("item2 radial"); + areas.push("item3 radial"); + return "\"" + areas.join("\" \"") + "\""; + } + ]]] + - grid-template-columns: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "1fr"; + } else { + return "35% 65%"; + } + ]]] + - grid-template-rows: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "min-content"; + } else { + return "1fr"; + } + ]]] + card: + - border-radius: "var(--border-radius)" + - box-shadow: "var(--box-shadow)" + - padding: "12px" + custom_fields: + item1: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + item2: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + item3: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + item4: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + item5: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "block"; + } else { + return "none"; + } + ]]] + radial: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_1.entity_id ]]]" + icon: "[[[ return variables.entity_1.icon ]]]" + name: "[[[ return variables.entity_1.name ]]]" + template: "card_generic_swap" + styles: + icon: + - color: "[[[ return `rgba(var(--color-${variables.entity_1.color}), 1)`;]]]" + img_cell: + - background-color: "[[[ return `rgba(var(--color-${variables.entity_1.color}), 0.20)`;]]]" + card: + - box-shadow: "none" + - border-radius: "none" + - padding-top: "1px" + - padding-bottom: "1px" + item2: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_2.entity_id ]]]" + icon: "[[[ return variables.entity_2.icon ]]]" + name: "[[[ return variables.entity_2.name ]]]" + template: "card_generic_swap" + styles: + icon: + - color: "[[[ return `rgba(var(--color-${variables.entity_2.color}), 1)`;]]]" + img_cell: + - background-color: "[[[ return `rgba(var(--color-${variables.entity_2.color}), 0.20)`;]]]" + card: + - box-shadow: "none" + - border-radius: "none" + - padding-top: "1px" + - padding-bottom: "1px" + item3: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_3.entity_id ]]]" + icon: "[[[ return variables.entity_3.icon ]]]" + name: "[[[ return variables.entity_3.name ]]]" + template: "card_generic_swap" + styles: + icon: + - color: "[[[ return `rgba(var(--color-${variables.entity_3.color}), 1)`;]]]" + img_cell: + - background-color: "[[[ return `rgba(var(--color-${variables.entity_3.color}), 0.20)`;]]]" + card: + - box-shadow: "none" + - border-radius: "none" + - padding-top: "1px" + - padding-bottom: "1px" + item4: + card: + type: "horizontal-stack" + cards: + - type: "custom:button-card" + template: "card_input_boolean" + entity: "[[[ return entity.entity_id]]]" + icon: "mdi:nas" + name: "Status" + styles: + card: + - background-color: "transparent" + - box-shadow: "none" + - border: "2px solid var(--google-grey)" + tap_action: + action: "more-info" + + - type: "custom:button-card" + template: "card_generic_swap" + entity: "[[[ return variables.entity_4.entity_id ]]]" + icon: "[[[ return variables.entity_4.icon ]]]" + name: "[[[ return variables.entity_4.name ]]]" + styles: + card: + - background-color: "transparent" + - box-shadow: "none" + - border: "2px solid var(--google-grey)" + icon: + - color: "[[[ return `rgba(var(--color-${variables.entity_4.color}), 1)`;]]]" + img_cell: + - background-color: "[[[ return `rgba(var(--color-${variables.entity_4.color}), 0.20)`;]]]" + tap_action: + action: "none" + item5: + card: + type: "custom:button-card" + template: "card_input_boolean" + entity: "[[[ return entity.entity_id]]]" + icon: "mdi:nas" + name: "Status" + styles: + card: + - background-color: "transparent" + - box-shadow: "none" + - border: "2px solid var(--google-grey)" + tap_action: + action: "more-info" + radial: + card: + type: "custom:apexcharts-card" + graph_span: "[[[ return variables.graph_span ]]]" + chart_type: "[[[ return variables.chart_type ]]]" + style: | + ha-card { + border-radius: "var(--border-radius)"; + box-shadow: none; + padding-left: 10px; + padding-bottom: 0px; + } + header: + show: false + apex_config: + title: + floating: false + align: "top" + style: + fontSize: "2px" + fontWeight: "bold" + chart: + foreColor: "rgb(148,148,148)" + offsetY: 5 + legend: + show: false + series: + - entity: "[[[ return variables.entity_1.entity_id ]]]" + name: "[[[ return variables.entity_1_name ]]]" + color: "[[[ return `var(--google-${variables.entity_1.color})`;]]]" + max: "[[[ return variables.entity_1.max_value ]]]" + - entity: "[[[ return variables.entity_2.entity_id ]]]" + name: "[[[ return variables.entity_2_name ]]]" + color: "[[[ return `var(--google-${variables.entity_2.color})`;]]]" + max: "[[[ return variables.entity_2.max_value ]]]" + - entity: "[[[ return variables.entity_3.entity_id ]]]" + name: "[[[ return variables.entity_3_name ]]]" + color: "[[[ return `var(--google-${variables.entity_3.color})`;]]]" + max: "[[[ return variables.entity_3.max_value ]]]" +``` diff --git a/custom_cards/custom_card_nik_nas/custom_card_nik_nas.yaml b/custom_cards/custom_card_nik_nas/custom_card_nik_nas.yaml new file mode 100644 index 000000000..6d42dbf1c --- /dev/null +++ b/custom_cards/custom_card_nik_nas/custom_card_nik_nas.yaml @@ -0,0 +1,278 @@ +--- +custom_card_nik_nas: + variables: + entity_1: + entity_id: + icon: "[[[ return entity.attributes.icon ]]]" + name: "[[[ return entity.attributes.friendly_name ]]]" + color: > + [[[ + var colors = ["yellow", "blue", "red", "green"]; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_2: + entity_id: + icon: "[[[ return entity.attributes.icon ]]]" + name: "[[[ return entity.attributes.friendly_name ]]]" + color: > + [[[ + var colors = ["yellow", "blue", "red", "green"]; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_3: + entity_id: + icon: "[[[ return entity.attributes.icon ]]]" + name: "[[[ return entity.attributes.friendly_name ]]]" + color: > + [[[ + var colors = ["yellow", "blue", "red","green"]; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_4: + entity_id: + icon: "[[[ return entity.attributes.icon ]]]" + name: "[[[ return entity.attributes.friendly_name ]]]" + color: > + [[[ + var colors = ["yellow", "blue", "red","green"]; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + show_name: false + show_state: false + show_label: false + show_icon: false + show_last_changed: false + show_entity_picture: false + styles: + grid: + - grid-template-areas: > + [[[ + var areas = []; + if (entity.state == "off" || entity.state == "unavailable") { + areas.push("item5"); + return "\"" + areas.join("\" \"") + "\""; + } else { + areas.push("item4 item4"); + areas.push("item1 radial"); + areas.push("item2 radial"); + areas.push("item3 radial"); + return "\"" + areas.join("\" \"") + "\""; + } + ]]] + - grid-template-columns: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "1fr"; + } else { + return "35% 65%"; + } + ]]] + - grid-template-rows: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "min-content"; + } else { + return "1fr"; + } + ]]] + card: + - border-radius: "var(--border-radius)" + - box-shadow: "var(--box-shadow)" + - padding: "12px" + custom_fields: + item1: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + item2: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + item3: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + item4: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + item5: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "block"; + } else { + return "none"; + } + ]]] + radial: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_1.entity_id ]]]" + icon: "[[[ return variables.entity_1.icon ]]]" + name: "[[[ return variables.entity_1.name ]]]" + template: "card_generic_swap" + styles: + icon: + - color: "[[[ return `rgba(var(--color-${variables.entity_1.color}), 1)`;]]]" + img_cell: + - background-color: "[[[ return `rgba(var(--color-${variables.entity_1.color}), 0.20)`;]]]" + card: + - box-shadow: "none" + - border-radius: "none" + - padding-top: "1px" + - padding-bottom: "1px" + item2: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_2.entity_id ]]]" + icon: "[[[ return variables.entity_2.icon ]]]" + name: "[[[ return variables.entity_2.name ]]]" + template: "card_generic_swap" + styles: + icon: + - color: "[[[ return `rgba(var(--color-${variables.entity_2.color}), 1)`;]]]" + img_cell: + - background-color: "[[[ return `rgba(var(--color-${variables.entity_2.color}), 0.20)`;]]]" + card: + - box-shadow: "none" + - border-radius: "none" + - padding-top: "1px" + - padding-bottom: "1px" + item3: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_3.entity_id ]]]" + icon: "[[[ return variables.entity_3.icon ]]]" + name: "[[[ return variables.entity_3.name ]]]" + template: "card_generic_swap" + styles: + icon: + - color: "[[[ return `rgba(var(--color-${variables.entity_3.color}), 1)`;]]]" + img_cell: + - background-color: "[[[ return `rgba(var(--color-${variables.entity_3.color}), 0.20)`;]]]" + card: + - box-shadow: "none" + - border-radius: "none" + - padding-top: "1px" + - padding-bottom: "1px" + item4: + card: + type: "horizontal-stack" + cards: + - type: "custom:button-card" + template: "card_input_boolean" + entity: "[[[ return entity.entity_id]]]" + icon: "mdi:nas" + name: "Status" + styles: + card: + - background-color: "transparent" + - box-shadow: "none" + - border: "2px solid var(--google-grey)" + tap_action: + action: "more-info" + + - type: "custom:button-card" + template: "card_generic_swap" + entity: "[[[ return variables.entity_4.entity_id ]]]" + icon: "[[[ return variables.entity_4.icon ]]]" + name: "[[[ return variables.entity_4.name ]]]" + styles: + card: + - background-color: "transparent" + - box-shadow: "none" + - border: "2px solid var(--google-grey)" + icon: + - color: "[[[ return `rgba(var(--color-${variables.entity_4.color}), 1)`;]]]" + img_cell: + - background-color: "[[[ return `rgba(var(--color-${variables.entity_4.color}), 0.20)`;]]]" + tap_action: + action: "none" + item5: + card: + type: "custom:button-card" + template: "card_input_boolean" + entity: "[[[ return entity.entity_id]]]" + icon: "mdi:nas" + name: "Status" + styles: + card: + - background-color: "transparent" + - box-shadow: "none" + - border: "2px solid var(--google-grey)" + tap_action: + action: "more-info" + radial: + card: + type: "custom:apexcharts-card" + graph_span: "[[[ return variables.graph_span ]]]" + chart_type: "[[[ return variables.chart_type ]]]" + style: | + ha-card { + border-radius: "var(--border-radius)"; + box-shadow: none; + padding-left: 10px; + padding-bottom: 0px; + } + header: + show: false + apex_config: + title: + floating: false + align: "top" + style: + fontSize: "2px" + fontWeight: "bold" + chart: + foreColor: "rgb(148,148,148)" + offsetY: 5 + legend: + show: false + series: + - entity: "[[[ return variables.entity_1.entity_id ]]]" + name: "[[[ return variables.entity_1_name ]]]" + color: "[[[ return `var(--google-${variables.entity_1.color})`;]]]" + max: "[[[ return variables.entity_1.max_value ]]]" + - entity: "[[[ return variables.entity_2.entity_id ]]]" + name: "[[[ return variables.entity_2_name ]]]" + color: "[[[ return `var(--google-${variables.entity_2.color})`;]]]" + max: "[[[ return variables.entity_2.max_value ]]]" + - entity: "[[[ return variables.entity_3.entity_id ]]]" + name: "[[[ return variables.entity_3_name ]]]" + color: "[[[ return `var(--google-${variables.entity_3.color})`;]]]" + max: "[[[ return variables.entity_3.max_value ]]]" diff --git a/custom_cards/custom_card_paddy_welcome/custom_card_paddy_welcome.yaml b/custom_cards/custom_card_paddy_welcome/custom_card_paddy_welcome.yaml index c8df1a213..7bc39030b 100644 --- a/custom_cards/custom_card_paddy_welcome/custom_card_paddy_welcome.yaml +++ b/custom_cards/custom_card_paddy_welcome/custom_card_paddy_welcome.yaml @@ -1,7 +1,7 @@ --- custom_card_paddy_welcome: template: - - "ulm_custom_card_paddy_welcome_language_variables" + - "ulm_language_variables" show_icon: false show_name: false show_label: false @@ -25,13 +25,13 @@ custom_card_paddy_welcome: let welcome = ''; if (time > '18:00'){ - welcome = variables.ulm_custom_card_paddy_welcome_evening; + welcome = variables.ulm_evening; } else if (time > '12:00'){ - welcome = variables.ulm_custom_card_paddy_welcome_afternoon; + welcome = variables.ulm_afternoon; } else if (time > '05:00'){ - welcome = variables.ulm_custom_card_paddy_welcome_morning; + welcome = variables.ulm_morning; } else { - welcome = variables.ulm_custom_card_paddy_welcome_hello; + welcome = variables.ulm_hello; } return welcome + ',
' + user.name + '!'; @@ -48,7 +48,7 @@ custom_card_paddy_welcome: custom_card_paddy_welcome_with_weather: template: - - "ulm_custom_card_paddy_welcome_language_variables" + - "ulm_language_variables" show_icon: false show_name: false show_label: false @@ -72,14 +72,13 @@ custom_card_paddy_welcome_with_weather: let welcome = ''; if (time > '18:00'){ - welcome = variables.ulm_custom_card_paddy_welcome_evening; + welcome = variables.ulm_evening; } else if (time > '12:00'){ - welcome = variables.ulm_custom_card_paddy_welcome_afternoon; + welcome = variables.ulm_afternoon; } else if (time > '05:00'){ - welcome = variables.ulm_custom_card_paddy_welcome_morning; + welcome = variables.ulm_morning; } else { - welcome = variables.ulm_custom_card_paddy_welcome_hello; - } + welcome = variables.ulm_hello; return welcome + ',
' + user.name + '!'; ]]] @@ -133,7 +132,7 @@ custom_card_paddy_welcome_with_weather: custom_card_paddy_welcome_with_news: template: - - "ulm_custom_card_paddy_welcome_language_variables" + - "ulm_language_variables" show_icon: false show_name: false show_label: false @@ -157,14 +156,13 @@ custom_card_paddy_welcome_with_news: let welcome = ''; if (time > '18:00'){ - welcome = variables.ulm_custom_card_paddy_welcome_evening; + welcome = variables.ulm_evening; } else if (time > '12:00'){ - welcome = variables.ulm_custom_card_paddy_welcome_afternoon; + welcome = variables.ulm_afternoon; } else if (time > '05:00'){ - welcome = variables.ulm_custom_card_paddy_welcome_morning; + welcome = variables.ulm_morning; } else { - welcome = variables.ulm_custom_card_paddy_welcome_hello; - } + welcome = variables.ulm_hello; return welcome + ',
' + user.name + '!'; ]]] diff --git a/custom_cards/custom_card_tpx01_aircondition/custom_card_tpx01_aircondition.yaml b/custom_cards/custom_card_tpx01_aircondition/custom_card_tpx01_aircondition.yaml index a5a44b7d6..76e1bf905 100644 --- a/custom_cards/custom_card_tpx01_aircondition/custom_card_tpx01_aircondition.yaml +++ b/custom_cards/custom_card_tpx01_aircondition/custom_card_tpx01_aircondition.yaml @@ -23,15 +23,15 @@ custom_card_tpx01_aircondition: if (entity.state =='off') { return variables.ulm_off; } else if (entity.state =='dry') { - return variables.custom_card_tpx01_aircondition_dry; + return variables.ulm_dry; } else if (entity.state =='heat') { - return variables.custom_card_tpx01_aircondition_heat; + return variables.ulm_heating; } else if (entity.state =='heat_cool') { - return variables.custom_card_tpx01_aircondition_heat_cool; + return variables.ulm_heat_cool; } else if (entity.state =='cool') { - return variables.custom_card_tpx01_aircondition_cool; + return variables.ulm_cooling; } else if (entity.state =='fan_only') { - return variables.custom_card_tpx01_aircondition_fan_only; + return variables.ulm_fan_only; } return entity.state; ]]] diff --git a/custom_cards/custom_card_wsly_pollen/languages/de.yaml b/custom_cards/custom_card_wsly_pollen/languages/de.yaml new file mode 100644 index 000000000..54fd3d8df --- /dev/null +++ b/custom_cards/custom_card_wsly_pollen/languages/de.yaml @@ -0,0 +1,10 @@ +# EN.yaml for custom_card_wsly_pollen +--- +custom_card_wsly_pollen_language_variables: + variables: + custom_card_wsly_pollen_none: "Keine" + custom_card_wsly_pollen_very_low: "Sehr niedrig" + custom_card_wsly_pollen_low: "Niedrig" + custom_card_wsly_pollen_medium: "Mittel" + custom_card_wsly_pollen_high: "Hoch" + custom_card_wsly_pollen_very_high: "Sehr hoch" diff --git a/custom_cards/custom_card_yagrasdemonde_lights_count/languages/de.yaml b/custom_cards/custom_card_yagrasdemonde_lights_count/languages/de.yaml new file mode 100644 index 000000000..3c71ddfba --- /dev/null +++ b/custom_cards/custom_card_yagrasdemonde_lights_count/languages/de.yaml @@ -0,0 +1,9 @@ +--- +ulm_custom_card_yagrasdemonde_lights_count_language_variables: + variables: + ulm_custom_card_yagrasdemonde_lights_count_light_0: "Keine Lampen an" + ulm_custom_card_yagrasdemonde_lights_count_light_1: "1 Lampe an" + ulm_custom_card_yagrasdemonde_lights_count_light_many: "Lampen an" + ulm_custom_card_yagrasdemonde_lights_count_cover_0: "Keine Rollos offen" + ulm_custom_card_yagrasdemonde_lights_count_cover_1: "1 Rollo offen" + ulm_custom_card_yagrasdemonde_lights_count_cover_many: "Rollos offen" diff --git a/custom_components/ui_lovelace_minimalist/lovelace/translations/de.yaml b/custom_components/ui_lovelace_minimalist/lovelace/translations/de.yaml index f61184cc6..e87333535 100644 --- a/custom_components/ui_lovelace_minimalist/lovelace/translations/de.yaml +++ b/custom_components/ui_lovelace_minimalist/lovelace/translations/de.yaml @@ -46,5 +46,5 @@ ulm_language_variables: ulm_hello: "Hallo" ulm_cleaning: "Staubsaugen" ulm_returning: "Auf dem Heimweg" - ulm_docked: "Docked" + ulm_docked: "Angedockt" ulm_mopping: "Wischen" diff --git a/custom_components/ui_lovelace_minimalist/lovelace/ulm_templates/card_templates/cards/card_scenes.yaml b/custom_components/ui_lovelace_minimalist/lovelace/ulm_templates/card_templates/cards/card_scenes.yaml new file mode 100644 index 000000000..a31fed7d4 --- /dev/null +++ b/custom_components/ui_lovelace_minimalist/lovelace/ulm_templates/card_templates/cards/card_scenes.yaml @@ -0,0 +1,219 @@ +--- +card_scenes: + show_icon: false + show_name: true + show_label: false + variables: + entity_1: + entity_id: "" + color: > + [[[ + var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_2: + entity_id: "" + color: > + [[[ + var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_3: + entity_id: "" + color: > + [[[ + var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_4: + entity_id: "" + color: > + [[[ + var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_5: + entity_id: "" + color: > + [[[ + var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_6: + entity_id: "" + color: > + [[[ + var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_7: + entity_id: "" + color: > + [[[ + var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + styles: + grid: + - grid-template-areas: > + [[[ + var pills = [] + const entities = [variables.entity_1.entity_id, variables.entity_2.entity_id, variables.entity_3.entity_id, variables.entity_4.entity_id, variables.entity_5.entity_id, variables.entity_6.entity_id, variables.entity_7.entity_id] + function entity_check(item) { + if (item != "") { + pills.push("item" + (pills.length+1)) + } + } + entities.forEach(entity_check) + return pills.join(" ") + ]]] + - display: "flex" + - grid-template-rows: "min-content" + - justify-content: "space-evenly" + card: + - border-radius: "var(--border-radius)" + - box-shadow: "var(--box-shadow)" + - padding: "12px" + - overflow: "visible" + custom_fields: + item1: + - display: "[[[ return (variables.entity_1.entity_id != '') ? 'block' : 'none' ]]]" + item2: + - display: "[[[ return (variables.entity_2.entity_id != '') ? 'block' : 'none' ]]]" + item3: + - display: "[[[ return (variables.entity_3.entity_id != '') ? 'block' : 'none' ]]]" + item4: + - display: "[[[ return (variables.entity_4.entity_id != '') ? 'block' : 'none' ]]]" + item5: + - display: "[[[ return (variables.entity_5.entity_id != '') ? 'block' : 'none' ]]]" + item6: + - display: "[[[ return (variables.entity_6.entity_id != '') ? 'block' : 'none' ]]]" + item7: + - display: "[[[ return (variables.entity_7.entity_id != '') ? 'block' : 'none' ]]]" + custom_fields: + item1: + card: + type: "custom:button-card" + template: "card_scenes_pill_welcome" + variables: "[[[ return variables.entity_1; ]]]" + entity: "[[[ return variables.entity_1.entity_id ]]]" + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_1.entity_id ]]]" + icon: "[[[ return variables.entity_1.icon ]]]" + item2: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_1.entity_id ]]]" + name: "[[[ return variables.entity_1.name ]]]" + item2: + card: + type: "custom:button-card" + template: "card_scenes_pill_welcome" + variables: "[[[ return variables.entity_2; ]]]" + entity: "[[[ return variables.entity_2.entity_id ]]]" + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_2.entity_id ]]]" + icon: "[[[ return variables.entity_2.icon ]]]" + item2: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_2.entity_id ]]]" + name: "[[[ return variables.entity_2.name ]]]" + item3: + card: + type: "custom:button-card" + template: "card_scenes_pill_welcome" + variables: "[[[ return variables.entity_3; ]]]" + entity: "[[[ return variables.entity_3.entity_id ]]]" + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_3.entity_id ]]]" + icon: "[[[ return variables.entity_3.icon ]]]" + item2: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_3.entity_id ]]]" + name: "[[[ return variables.entity_3.name ]]]" + item4: + card: + type: "custom:button-card" + template: "card_scenes_pill_welcome" + variables: "[[[ return variables.entity_4; ]]]" + entity: "[[[ return variables.entity_4.entity_id ]]]" + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_4.entity_id ]]]" + icon: "[[[ return variables.entity_4.icon ]]]" + item2: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_4.entity_id ]]]" + name: "[[[ return variables.entity_4.name ]]]" + item5: + card: + type: "custom:button-card" + template: "card_scenes_pill_welcome" + variables: "[[[ return variables.entity_5; ]]]" + entity: "[[[ return variables.entity_5.entity_id ]]]" + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_5.entity_id ]]]" + icon: "[[[ return variables.entity_5.icon ]]]" + item2: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_5.entity_id ]]]" + name: "[[[ return variables.entity_5.name ]]]" + item6: + card: + type: "custom:button-card" + template: "card_scenes_pill_welcome" + variables: "[[[ return variables.entity_6; ]]]" + entity: "[[[ return variables.entity_6.entity_id ]]]" + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_6.entity_id ]]]" + icon: "[[[ return variables.entity_6.icon ]]]" + item2: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_6.entity_id ]]]" + name: "[[[ return variables.entity_6.name ]]]" + item7: + card: + type: "custom:button-card" + template: "card_scenes_pill_welcome" + variables: "[[[ return variables.entity_7; ]]]" + entity: "[[[ return variables.entity_7.entity_id ]]]" + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_7.entity_id ]]]" + icon: "[[[ return variables.entity_7.icon ]]]" + item2: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_7.entity_id ]]]" + name: "[[[ return variables.entity_7.name ]]]" diff --git a/custom_components/ui_lovelace_minimalist/lovelace/ulm_templates/card_templates/cards/card_vacuum.yaml b/custom_components/ui_lovelace_minimalist/lovelace/ulm_templates/card_templates/cards/card_vacuum.yaml index 83a9303f6..b4ca43493 100644 --- a/custom_components/ui_lovelace_minimalist/lovelace/ulm_templates/card_templates/cards/card_vacuum.yaml +++ b/custom_components/ui_lovelace_minimalist/lovelace/ulm_templates/card_templates/cards/card_vacuum.yaml @@ -10,12 +10,44 @@ card_vacuum: ulm_card_vacuum_icon: "[[[ return entity.attributes.icon ]]]" ulm_card_vacuum_room: ulm_card_vacuum_room_icon: "[[[ return entity.attributes.icon ]]]" + ulm_card_vacuum_camera: + ulm_card_vacuum_camera_toggle: triggers_update: "all" styles: grid: - - grid-template-areas: "'item1' 'item2'" + - grid-template-areas: > + [[[ + if( variables.ulm_card_vacuum_camera ){ + if ( variables.ulm_card_vacuum_camera_toggle ) { + if( entity.state.toLowerCase() === 'cleaning' ){ + return "'item1' 'item3' 'item2'"; + } else { + return "'item1' 'item2'"; + } + } else { + return "'item1' 'item3' 'item2'"; + } + } else { + return "'item1' 'item2'"; + } + ]]] - grid-template-columns: "1fr" - - grid-template-rows: "min-content min-content" + - grid-template-rows: > + [[[ + if( variables.ulm_card_vacuum_camera ){ + if ( variables.ulm_card_vacuum_camera_toggle ) { + if( entity.state.toLowerCase() === 'cleaning' ){ + return "repeat(3, min-content)"; + } else { + return "repeat(2, min-content)"; + } + } else { + return "repeat(3, min-content)"; + } + } else { + return "repeat(2, min-content)"; + } + ]]] - row-gap: "12px" card: - border-radius: "var(--border-radius)" @@ -34,6 +66,24 @@ card_vacuum: return 'rgba(var(--color-purple),0.1)' } ]]] + custom_fields: + item3: + - display: > + [[[ + if( variables.ulm_card_vacuum_camera ){ + if ( variables.ulm_card_vacuum_camera_toggle ) { + if( entity.state.toLowerCase() === 'cleaning' ){ + return "block"; + } else { + return "none"; + } + } else { + return "block"; + } + } else { + return "none"; + } + ]]] custom_fields: item1: card: @@ -208,3 +258,10 @@ card_vacuum: service: "script.turn_on" service_data: entity_id: "[[[ return variables.ulm_card_vacuum_room ]]]" + item3: + card: + type: "picture-entity" + camera_view: "live" + entity: "[[[ return variables.ulm_card_vacuum_camera ]]]" + show_name: false + show_state: false diff --git a/custom_components/ui_lovelace_minimalist/lovelace/ulm_templates/card_templates/cards/card_welcome_scenes.yaml b/custom_components/ui_lovelace_minimalist/lovelace/ulm_templates/card_templates/cards/card_welcome_scenes.yaml index 66b41b255..866750c88 100644 --- a/custom_components/ui_lovelace_minimalist/lovelace/ulm_templates/card_templates/cards/card_welcome_scenes.yaml +++ b/custom_components/ui_lovelace_minimalist/lovelace/ulm_templates/card_templates/cards/card_welcome_scenes.yaml @@ -2,11 +2,9 @@ card_welcome_scenes: variables: ulm_weather: "[[[ return variables.ulm_weather]]]" - ulm_language: "[[[return window.navigator.language ]]]" + ulm_language: "[[[ return window.navigator.language ]]]" entity_1: - entity_id: - icon: "[[[ return entity.attributes.icon ]]]" - name: "[[[ return entity.attributes.friendly_name ]]]" + entity_id: "" color: > [[[ var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; @@ -14,9 +12,7 @@ card_welcome_scenes: return color; ]]] entity_2: - entity_id: - icon: "[[[ return entity.attributes.icon ]]]" - name: "[[[ return entity.attributes.friendly_name ]]]" + entity_id: "" color: > [[[ var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; @@ -24,9 +20,7 @@ card_welcome_scenes: return color; ]]] entity_3: - entity_id: - icon: "[[[ return entity.attributes.icon ]]]" - name: "[[[ return entity.attributes.friendly_name ]]]" + entity_id: "" color: > [[[ var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; @@ -34,9 +28,7 @@ card_welcome_scenes: return color; ]]] entity_4: - entity_id: - icon: "[[[ return entity.attributes.icon ]]]" - name: "[[[ return entity.attributes.friendly_name ]]]" + entity_id: "" color: > [[[ var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; @@ -44,9 +36,23 @@ card_welcome_scenes: return color; ]]] entity_5: - entity_id: - icon: "[[[ return entity.attributes.icon ]]]" - name: "[[[ return entity.attributes.friendly_name ]]]" + entity_id: "" + color: > + [[[ + var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_6: + entity_id: "" + color: > + [[[ + var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_7: + entity_id: "" color: > [[[ var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; @@ -179,8 +185,8 @@ card_welcome_scenes: type: "custom:button-card" template: > [[[ - if(variables.entity_1.entity_id && variables.entity_2.entity_id && variables.entity_3.entity_id && variables.entity_4.entity_id && variables.entity_5.entity_id){ - return 'card_scenes_welcome' + if(variables?.entity_1?.entity_id != ""){ + return 'card_scenes' } else { return 'card_scenes_welcome_auto' } @@ -196,6 +202,8 @@ card_welcome_scenes: entity_3: "[[[ return variables.entity_3]]]" entity_4: "[[[ return variables.entity_4]]]" entity_5: "[[[ return variables.entity_5]]]" + entity_6: "[[[ return variables.entity_6]]]" + entity_7: "[[[ return variables.entity_7]]]" card_title_welcome: tap_action: action: "none" @@ -224,137 +232,8 @@ card_title_welcome: - font-weight: "bold" - font-size: "1rem" - opacity: "0.4" -card_scenes_welcome: - show_icon: false - show_name: true - show_label: false - styles: - grid: - - grid-template-areas: "'item1 item2 item3 item4 item5'" - - grid-template-columns: "1fr 1fr 1fr 1fr 1fr" - - grid-template-rows: "min-content" - - justify-items: "center" - card: - - border-radius: "var(--border-radius)" - - box-shadow: "var(--box-shadow)" - - padding: "12px" - - overflow: "visible" - custom_fields: - item1: - card: - type: "custom:button-card" - template: "card_scenes_pill_welcome" - entity: "[[[ return variables.entity_1.entity_id ]]]" - custom_fields: - item1: - card: - type: "custom:button-card" - template: "tap_action" - entity: "[[[ return variables.entity_1.entity_id ]]]" - icon: "[[[ return variables.entity_1.icon ]]]" - styles: - icon: - - color: "[[[ return `rgba(var(--color-${variables.entity_1.color}), 1)`;]]]" - img_cell: - - background-color: "[[[ return `rgba(var(--color-${variables.entity_1.color}), 0.20)`;]]]" - item2: - card: - type: "custom:button-card" - template: "tap_action" - entity: "[[[ return variables.entity_1.entity_id ]]]" - name: "[[[ return variables.entity_1.name ]]]" - item2: - card: - type: "custom:button-card" - template: "card_scenes_pill_welcome" - entity: "[[[ return variables.entity_2.entity_id ]]]" - custom_fields: - item1: - card: - type: "custom:button-card" - template: "tap_action" - entity: "[[[ return variables.entity_2.entity_id ]]]" - icon: "[[[ return variables.entity_2.icon ]]]" - styles: - icon: - - color: "[[[ return `rgba(var(--color-${variables.entity_2.color}), 1)`;]]]" - img_cell: - - background-color: "[[[ return `rgba(var(--color-${variables.entity_2.color}), 0.20)`;]]]" - item2: - card: - type: "custom:button-card" - template: "tap_action" - entity: "[[[ return variables.entity_2.entity_id ]]]" - name: "[[[ return variables.entity_2.name ]]]" - item3: - card: - type: "custom:button-card" - template: "card_scenes_pill_welcome" - entity: "[[[ return variables.entity_3.entity_id ]]]" - custom_fields: - item1: - card: - type: "custom:button-card" - template: "tap_action" - entity: "[[[ return variables.entity_3.entity_id ]]]" - icon: "[[[ return variables.entity_3.icon ]]]" - styles: - icon: - - color: "[[[ return `rgba(var(--color-${variables.entity_3.color}), 1)`;]]]" - img_cell: - - background-color: "[[[ return `rgba(var(--color-${variables.entity_3.color}), 0.20)`;]]]" - item2: - card: - type: "custom:button-card" - template: "tap_action" - entity: "[[[ return variables.entity_3.entity_id ]]]" - name: "[[[ return variables.entity_3.name ]]]" - item4: - card: - type: "custom:button-card" - template: "card_scenes_pill_welcome" - entity: "[[[ return variables.entity_4.entity_id ]]]" - custom_fields: - item1: - card: - type: "custom:button-card" - template: "tap_action" - entity: "[[[ return variables.entity_4.entity_id ]]]" - icon: "[[[ return variables.entity_4.icon ]]]" - styles: - icon: - - color: "[[[ return `rgba(var(--color-${variables.entity_4.color}), 1)`;]]]" - img_cell: - - background-color: "[[[ return `rgba(var(--color-${variables.entity_4.color}), 0.20)`;]]]" - item2: - card: - type: "custom:button-card" - template: "tap_action" - entity: "[[[ return variables.entity_4.entity_id ]]]" - name: "[[[ return variables.entity_4.name ]]]" - item5: - card: - type: "custom:button-card" - template: "card_scenes_pill_welcome" - entity: "[[[ return variables.entity_5.entity_id ]]]" - custom_fields: - item1: - card: - type: "custom:button-card" - template: "tap_action" - entity: "[[[ return variables.entity_5.entity_id ]]]" - icon: "[[[ return variables.entity_5.icon ]]]" - styles: - icon: - - color: "[[[ return `rgba(var(--color-${variables.entity_5.color}), 1)`;]]]" - img_cell: - - background-color: "[[[ return `rgba(var(--color-${variables.entity_5.color}), 0.20)`;]]]" - item2: - card: - type: "custom:button-card" - template: "tap_action" - entity: "[[[ return variables.entity_5.entity_id ]]]" - name: "[[[ return variables.entity_5.name ]]]" + +# pill card_scenes_pill_welcome: show_icon: false show_label: false @@ -363,7 +242,7 @@ card_scenes_pill_welcome: - operator: "template" value: > [[[ - return (entity.state !== 'on' && entity.state !== 'playing') + return (entity.state !== 'on' && entity.state !== 'playing' && entity.state != variables?.state) ]]] styles: card: @@ -398,14 +277,58 @@ card_scenes_pill_welcome: show_icon: true show_label: false show_name: false + tap_action: + action: > + [[[ + if(variables?.nav_path){ + return "navigate" + } else { + return "call-service" + } + ]]] + service: > + [[[ + if(entity.entity_id.startsWith("scene.")){ + return "scene.turn_on" + } + else if(entity.entity_id.startsWith("media_player.")){ + return "media_player.media_play_pause" + } + else if(entity.entity_id.startsWith("input_select.")){ + return "input_select.select_option" + } else { + return "homeassistant.toggle" + } + ]]] + navigation_path: "[[[ return variables?.nav_path; ]]]" + service_data: | + [[[ + var obj; + if( entity.entity_id.startsWith("input_select.") ) + obj = { entity_id: entity.entity_id, option: variables.state }; + else + obj = { entity_id: entity.entity_id }; + return obj; + ]]] styles: grid: - grid-template-areas: "i" icon: - - color: "[[[ return `rgba(var(--color-theme), 0.20)`;]]]" + - color: > + [[[ + var color = variables?.color + if(hass.themes.darkMode){var color = "#FAFAFA";} + return `rgba(var(--color-${color}), 1)`; + ]]] - width: "20px" img_cell: - - background-color: "[[[ return `rgba(var(--color-theme), 0.05)`;]]] " + - background-color: > + [[[ + var color = variables?.color + var opacity = '0.20' + if(hass.themes.darkMode){var opacity = '1'} + return `rgba(var(--color-${color}), ${opacity})`; + ]]] - border-radius: "50%" - width: "42px" - height: "42px" @@ -417,7 +340,7 @@ card_scenes_pill_welcome: - operator: "template" value: > [[[ - return (entity.state !== 'on' && entity.state !== 'playing') + return (entity.state !== 'on' && entity.state !== 'playing' && entity.state != variables?.state) ]]] styles: card: @@ -435,6 +358,39 @@ card_scenes_pill_welcome: type: "custom:button-card" show_icon: false show_label: false + tap_action: + action: > + [[[ + if(variables?.nav_path){ + return "navigate" + } else { + return "call-service" + } + ]]] + navigation_path: "[[[ return variables?.nav_path; ]]]" + service: > + [[[ + if(entity.entity_id.startsWith("scene.")){ + return "scene.turn_on" + } + else if(entity.entity_id.startsWith("media_player.")){ + return "media_player.media_play_pause" + } + else if(entity.entity_id.startsWith("input_select.")){ + return "input_select.select_option" + } else { + return "homeassistant.toggle" + } + ]]] + service_data: | + [[[ + var obj; + if( entity.entity_id.startsWith("input_select.") ) + obj = { entity_id: entity.entity_id, option: variables.state }; + else + obj = { entity_id: entity.entity_id }; + return obj; + ]]] styles: grid: - grid-template-areas: "n" @@ -537,13 +493,18 @@ card_scenes_welcome_auto: show_icon: false show_name: true show_label: false + variables: + colors: > + [[[ + var colors = ['yellow', 'blue', 'red', 'purple','green', 'pink']; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] styles: grid: - - grid-template-areas: "'item1 item2 item3 item4 item5'" - - grid-template-columns: "1fr 1fr 1fr 1fr 1fr" - - grid-template-rows: "min-content" - - justify-items: "center" - - column-gap: "24px" + - grid-template-areas: "item1" + - display: "flex" + - justify-content: "center" card: - border-radius: "var(--border-radius)" - box-shadow: "var(--box-shadow)" @@ -554,84 +515,14 @@ card_scenes_welcome_auto: type: "custom:auto-entities" card: type: "grid" - columns: 1 - square: false - card_param: "cards" - sort: - count: 1 - filter: - include: - - domain: "script" - options: - type: "custom:button-card" - template: "card_scenes_pill_welcome" - custom_fields: - item1: - card: - type: "custom:button-card" - template: "tap_action" - entity: "this.entity_id" - icon: "[[[ return variables.entity_1.icon ]]]" - styles: - icon: - - color: "[[[ return `rgba(var(--color-${variables.entity_1.color}), 1)`;]]]" - img_cell: - - background-color: "[[[ return `rgba(var(--color-${variables.entity_1.color}), 0.20)`;]]]" - item2: - card: - type: "custom:button-card" - template: "tap_action" - entity: "this.entity_id" - name: "[[[ return variables.entity_1.name ]]]" - item2: - card: - type: "custom:auto-entities" - card: - type: "grid" - columns: 1 - square: false - card_param: "cards" - sort: - count: 1 - first: 1 - filter: - include: - - domain: "script" - options: - type: "custom:button-card" - template: "card_scenes_pill_welcome" - custom_fields: - item1: - card: - type: "custom:button-card" - template: "tap_action" - entity: "this.entity_id" - icon: "[[[ return variables.entity_2.icon ]]]" - styles: - icon: - - color: "[[[ return `rgba(var(--color-${variables.entity_2.color}), 1)`;]]]" - img_cell: - - background-color: "[[[ return `rgba(var(--color-${variables.entity_2.color}), 0.20)`;]]]" - item2: - card: - type: "custom:button-card" - template: "tap_action" - entity: "this.entity_id" - name: "[[[ return variables.entity_2.name ]]]" - item3: - card: - type: "custom:auto-entities" - card: - type: "grid" - columns: 1 + columns: 5 square: false card_param: "cards" sort: - count: 1 - first: 2 + count: 5 filter: include: - - domain: "script" + - domain: "light" options: type: "custom:button-card" template: "card_scenes_pill_welcome" @@ -639,104 +530,25 @@ card_scenes_welcome_auto: item1: card: type: "custom:button-card" - template: "tap_action" entity: "this.entity_id" - icon: "[[[ return variables.entity_3.icon ]]]" styles: icon: - - color: "[[[ return `rgba(var(--color-${variables.entity_3.color}), 1)`;]]]" + - color: > + [[[ + var color = variables.colors + if(hass.themes.darkMode){var color = "#FAFAFA";} + return `rgba(var(--color-${color}), 1)`; + ]]] + - width: "20px" img_cell: - - background-color: "[[[ return `rgba(var(--color-${variables.entity_3.color}), 0.20)`;]]]" + - background-color: > + [[[ + var color = variables.colors + var opacity = '0.20' + if(hass.themes.darkMode){var opacity = '1'} + return `rgba(var(--color-${color}), ${opacity})`; + ]]] item2: card: type: "custom:button-card" - template: "tap_action" entity: "this.entity_id" - name: "[[[ return variables.entity_3.name ]]]" - item4: - card: - type: "custom:auto-entities" - card: - type: "grid" - columns: 1 - square: false - card_param: "cards" - sort: - count: 1 - first: 3 - filter: - include: - - domain: "script" - options: - type: "custom:button-card" - template: "card_scenes_pill_welcome" - custom_fields: - item1: - card: - type: "custom:button-card" - template: "tap_action" - entity: "this.entity_id" - icon: "[[[ return variables.entity_4.icon ]]]" - styles: - icon: - - color: "[[[ return `rgba(var(--color-${variables.entity_4.color}), 1)`;]]]" - img_cell: - - background-color: "[[[ return `rgba(var(--color-${variables.entity_4.color}), 0.20)`;]]]" - item2: - card: - type: "custom:button-card" - template: "tap_action" - entity: "this.entity_id" - name: "[[[ return variables.entity_4.name ]]]" - item5: - card: - type: "custom:auto-entities" - card: - type: "grid" - columns: 1 - square: false - card_param: "cards" - sort: - count: 1 - first: 4 - filter: - include: - - domain: "script" - options: - type: "custom:button-card" - template: "card_scenes_pill_welcome" - custom_fields: - item1: - card: - type: "custom:button-card" - template: "tap_action" - entity: "this.entity_id" - icon: "[[[ return variables.entity_5.icon ]]]" - styles: - icon: - - color: "[[[ return `rgba(var(--color-${variables.entity_5.color}), 1)`;]]]" - img_cell: - - background-color: "[[[ return `rgba(var(--color-${variables.entity_5.color}), 0.20)`;]]]" - item2: - card: - type: "custom:button-card" - template: "tap_action" - entity: "this.entity_id" - name: "[[[ return variables.entity_5.name ]]]" -### tap_action -tap_action: - tap_action: - action: "call-service" - service: > - [[[ - if(entity.entity_id.startsWith("scene.")){ - return "scene.turn_on" - } - else if(entity.entity_id.startsWith("media_player.")){ - return "media_player.media_play_pause" - } else { - return "homeassistant.toggle" - } - ]]] - service_data: - entity_id: "[[[ return entity.entity_id]]]" diff --git a/docs/assets/img/custom_card_nik_door.png b/docs/assets/img/custom_card_nik_door.png new file mode 100644 index 000000000..8727fec8e Binary files /dev/null and b/docs/assets/img/custom_card_nik_door.png differ diff --git a/docs/assets/img/custom_card_nik_nas_off.png b/docs/assets/img/custom_card_nik_nas_off.png new file mode 100644 index 000000000..7e4399d33 Binary files /dev/null and b/docs/assets/img/custom_card_nik_nas_off.png differ diff --git a/docs/assets/img/custom_card_nik_nas_on.png b/docs/assets/img/custom_card_nik_nas_on.png new file mode 100644 index 000000000..d79d9714c Binary files /dev/null and b/docs/assets/img/custom_card_nik_nas_on.png differ diff --git a/docs/assets/img/screenshot_custom_camera1.png b/docs/assets/img/screenshot_custom_camera1.png new file mode 100644 index 000000000..0d70fd3dc Binary files /dev/null and b/docs/assets/img/screenshot_custom_camera1.png differ diff --git a/docs/assets/img/screenshot_custom_camera2.png b/docs/assets/img/screenshot_custom_camera2.png new file mode 100644 index 000000000..a2c2f1ec2 Binary files /dev/null and b/docs/assets/img/screenshot_custom_camera2.png differ diff --git a/docs/testenv.code-workspace b/docs/testenv.code-workspace new file mode 100644 index 000000000..985f94a15 --- /dev/null +++ b/docs/testenv.code-workspace @@ -0,0 +1,10 @@ +{ + "folders": [ + { + "path": ".." + }, + { + "path": "../../../config" + } + ] +} diff --git a/docs/usage/cards/card_vacuum.md b/docs/usage/cards/card_vacuum.md index 7166b3e33..fec1efdae 100644 --- a/docs/usage/cards/card_vacuum.md +++ b/docs/usage/cards/card_vacuum.md @@ -23,6 +23,8 @@ This is a card to control your Robot-vacuum. It has support for all vacuums whic |`ulm_card_vacuum_label`| | :material-close: | Add a custom label | |`ulm_card_vacuum_room`| | :material-close: | Add a script to clean a specific room | |`ulm_card_vacuum_room_icon`| | :material-close: | Add custom icon to the room script | +|`ulm_card_vacuum_camera`| | :material-close: | Add a camera entity to the card to show the vacuum map | +|`ulm_card_vacuum_camera_toggle`| | :material-close: | Only show the camera entity while cleaning | ## Usage @@ -37,6 +39,8 @@ This is a card to control your Robot-vacuum. It has support for all vacuums whic variables: ulm_card_vacuum_room: "script.clean_kitchen" ulm_card_vacuum_room_icon: "mdi:table-chair" + ulm_card_vacuum_camera: "camera.vacuum_map" + ulm_card_vacuum_camera_toggle: true ``` ??? note "Template Code" diff --git a/docs/usage/cards/card_welcome_scenes.md b/docs/usage/cards/card_welcome_scenes.md index 8f7c6082f..d44f4eb17 100644 --- a/docs/usage/cards/card_welcome_scenes.md +++ b/docs/usage/cards/card_welcome_scenes.md @@ -17,16 +17,29 @@ This is a card which shows the basic needs for your dashboard. This card can gen |----------|---------|------------------|-------------------| | ulm_card_welcome_scenes_collapse | | :material-close: | Enables the collapse function.
requires an `input_boolean` to track the state| | ulm_weather | | :material-check: | This is your weather provider.
Example: `weather.your_provider`| -| ulm_language | Language of your system | :material-close: | You can set a different format with the [BCP-47 language tags](https://www.techonthenet.com/js/language_tags.php)
Example: -`"en-US"` or just `"en"`| -| entity_ | | :material-check: | Support almost all types of entities
Scenes do always show as off | -| icon_ | | :material-close: | The icon to show | -| name_ | | :material-close: | The name to show| -| color_ | Random | :material-close: | Color of the icon
Can choose between: `blue`, `red`, `green`, `yellow`, `pink`, `purple`
If not specified, it will take a random color | +| ulm_language | Language of your system | :material-close: | You can set a different format with the [BCP-47 language tags](https://www.techonthenet.com/js/language_tags.php)
Example: `"en-US"` or just `"en"`| +| entity_1 | auto-entities | :material-close: | Can be any common type of entity
if no entity is specified defaults to auto-entities | +| entity_2 | auto-entities | :material-close: | Can be any common type of entity
if no entity is specified defaults to auto-entities| +| entity_3 | auto-entities | :material-close: | Can be any common type of entity
if no entity is specified defaults to auto-entities| +| entity_4 | auto-entities | :material-close: | Can be any common type of entity
if no entity is specified defaults to auto-entities| +| entity_5 | auto-entities | :material-close: | Can be any common type of entity
if no entity is specified defaults to auto-entities| +| entity_6 | none | :material-close: | Can be any common type of entity | +| entity_7 | none | :material-close: | Can be any common type of entity | -## Collapse +## Entity Variables -!!! note +| Variable | Default | Required | Notes | +|----------|---------|------------------|-------------------| +| _entity_id | | :material-close: | Support almost all types of entities
Scenes do always show as off | +| _icon | | :material-close: | The icon to show | +| _name | | :material-close: | The name to show| +| _color | Random | :material-close: | Color of the icon
Can choose between: `blue`, `red`, `green`, `yellow`, `pink`, `purple`
If not specified, it will take a random color | +| _state | `on` or `playing` | :material-close: | Define `input_select` state or give manual state for pill to be full | +| _nav_path | | :material-close: | Navigate to another view
*Overrides other types of actions* + +## Requirement Collapse Function + +!!! note "" This feature is fully optional. It requires some more manual configuration! You need to create a `input_boolean` in HA to track the state. See [Docs](https://www.home-assistant.io/integrations/input_boolean/). Furthermore, you need to add the `input_boolean` to the variable `ulm_card_welcome_scenes_collapse` **and** to either the `entity` or `triggers_update` to make sure it directly refreshes the state. @@ -35,6 +48,10 @@ Furthermore, you need to add the `input_boolean` to the variable `ulm_card_welco ## Usage +!!! note "" + You can set 1 to 7 entities to show 1 to 7 pills dynamically
+ If set none it uses `auto-entities` with max 5 pills + ```yaml - type: "custom:button-card" template: "card_welcome_scenes" @@ -68,6 +85,16 @@ Furthermore, you need to add the `input_boolean` to the variable `ulm_card_welco icon: "mdi:YOUR_ICON" #OPTIONAL name: "YOUR_NAME" #OPTIONAL color: "yellow" + entity_6: + entity_id: "" + icon: "mdi:YOUR_ICON" #OPTIONAL + name: "YOUR_NAME" #OPTIONAL + color: "pink" + entity_7: + entity_id: "" + icon: "mdi:YOUR_ICON" #OPTIONAL + name: "YOUR_NAME" #OPTIONAL + color: "yellow" ``` ??? note "Auto-entities" @@ -80,31 +107,6 @@ Furthermore, you need to add the `input_boolean` to the variable `ulm_card_welco variables: ulm_card_welcome_scenes_collapse: input_boolean. #OPTIONAl --> uncomment also entity or triggers_update ulm_weather: "weather.YOUR_WEATHERPROVIDER" - entity_1: - entity_id: - icon: - name: - color: "blue" #OPTIONAL - entity_2: - entity_id: - icon: - name: - color: "red" #OPTIONAL - entity_3: - entity_id: - icon: - name: - color: "green" #OPTIONAL - entity_4: - entity_id: - icon: - name: - color: "purple" #OPTIONAL - entity_5: - entity_id: - icon: - name: - color: "yellow" #OPTIONAL ``` ??? note "Random Colors" @@ -121,27 +123,31 @@ Furthermore, you need to add the `input_boolean` to the variable `ulm_card_welco entity_id: "" icon: "mdi:YOUR_ICON" #OPTIONAL name: "YOUR_NAME" #OPTIONAL - color: entity_2: entity_id: "" icon: "mdi:YOUR_ICON" #OPTIONAL name: "YOUR_NAME" #OPTIONAL - color: entity_3: entity_id: "" icon: "mdi:YOUR_ICON" #OPTIONAL name: "YOUR_NAME" #OPTIONAL - color: entity_4: entity_id: "" icon: "mdi:YOUR_ICON" #OPTIONAL name: "YOUR_NAME" #OPTIONAL - color: entity_5: entity_id: "" icon: "mdi:YOUR_ICON" #OPTIONAL name: "YOUR_NAME" #OPTIONAL - color: + entity_6: + entity_id: "" + icon: "mdi:YOUR_ICON" #OPTIONAL + name: "YOUR_NAME" #OPTIONAL + entity_7: + entity_id: "" + icon: "mdi:YOUR_ICON" #OPTIONAL + name: "YOUR_NAME" #OPTIONAL + ``` ??? note "Template Code" diff --git a/docs/usage/custom_cards/custom_card_camera.md b/docs/usage/custom_cards/custom_card_camera.md new file mode 100644 index 000000000..8c0151015 --- /dev/null +++ b/docs/usage/custom_cards/custom_card_camera.md @@ -0,0 +1,71 @@ +--- +title: Custom Camera Card +hide: + - toc +--- + + +# Custom-card "Camera" + +This is a `custom-card` to display a camera live view. + +![Screenshot](../../assets/img/screenshot_custom_camera1.png) +![Screenshot](../../assets/img/screenshot_custom_camera2.png) + +## Credits + +Author: Eltarius, from the script of [Clemalex](https://forum.hacf.fr/t/dashboard-minimalist/5507/183?u=clemalex) - 2022 +Version: 1.0.0 + +## Changelog + +
+1.0.0 +Initial release. +
+ +## Usage + +```yaml +- type: "custom:button-card" + entity: "camera.sensor" + template: "custom_card_camera" + show_icon: false #True if you set ulm_custom_card_camera_title: true + variables: + ulm_custom_card_camera_title: true + ulm_custom_card_camera_name: "name" + ulm_custom_card_camera_label: "label" +``` + +## Variables + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
VariableExampleRequiredDefaultExplanation
ulm_custom_card_camera_titletrueyesIf you want header card
ulm_custom_card_camera_name"Garden"noName of your choice
ulm_custom_card_camera_label"Room"noLabel of your choice
diff --git a/docs/usage/custom_cards/custom_card_eraycetinay_lock.md b/docs/usage/custom_cards/custom_card_eraycetinay_lock.md index e9225e7dc..94cd1f4b2 100644 --- a/docs/usage/custom_cards/custom_card_eraycetinay_lock.md +++ b/docs/usage/custom_cards/custom_card_eraycetinay_lock.md @@ -7,7 +7,7 @@ hide: # Custom-card "Lock" -This is a `custom-card` that works in switch logic with a `lock` entity. Card structure uses `lock`, `unlock` actions and `lock`,`unlock`,`locking`,`unlocking` states. +This is a `custom-card` that works in switch logic with a `lock` entity. Card structure uses `lock`, `unlock` (optional `open`) actions and `lock`,`unlock`,`locking`,`unlocking`, `jammed` states. ![Generic](../../assets/img/custom_card_eraycetinay_lock_locked.png) ![Generic](../../assets/img/custom_card_eraycetinay_lock_unlocked.png) @@ -20,6 +20,8 @@ Version: 0.0.1 ## Changelog
+ 0.0.2 + Added option to only use lock.open 0.0.1 Initial release
@@ -33,6 +35,7 @@ Version: 0.0.1 name: "Door Lock" variables: ulm_custom_card_eraycetinay_lock_tap_control: true + ulm_custom_card_eraycetinay_lock_open: true ``` ## Variables @@ -50,6 +53,12 @@ Version: 0.0.1 no Lock/Unlock on tap action + +ulm_custom_card_eraycetinay_lock_open +true +no +Only use the card to open the door (always sends lock.open on tap) + ## Template code @@ -74,10 +83,15 @@ custom_card_eraycetinay_lock: service: | [[[ if(variables.ulm_custom_card_eraycetinay_lock_tap_control == true){ - if (entity.state == "locked"){ - return "lock.unlock" - } else if (entity.state == "unlocked"){ - return "lock.lock" + if(variables.ulm_custom_card_eraycetinay_lock_open == true){ + return "lock.open" + } else { + if (entity.state == "locked"){ + return "lock.unlock" + } + } else if (entity.state == "unlocked"){ + return "lock.lock" + } } } else { return; @@ -98,10 +112,14 @@ custom_card_eraycetinay_lock: return variables.custom_card_eraycetinay_lock_locked; } else if (entity.state == "unlocked"){ return variables.custom_card_eraycetinay_lock_unlocked; + } else if (entity.state == "open"){ + return variables.ulm_open; } else if (entity.state == "unlocking"){ return variables.custom_card_eraycetinay_lock_unlocking; } else if (entity.state == "locking"){ return variables.custom_card_eraycetinay_lock_locking; + } else if (entity.state == "jammed"){ + return variables.custom_card_eraycetinay_lock_jammed; } else { return entity.state; } @@ -134,9 +152,9 @@ custom_card_eraycetinay_lock: icon: - color: "rgba(var(--color-theme),0.2)" img_cell: - - background-color: "rgba(var(--color-theme),0.05)" - - border-radius: "50%" - - place-self: "center" - - width: "42px" - - height: "42px" + - background-color: "rgba(var(--color-theme),0.05)" + - border-radius: "50%" + - place-self: "center" + - width: "42px" + - height: "42px" ``` diff --git a/docs/usage/custom_cards/custom_card_input_number.md b/docs/usage/custom_cards/custom_card_input_number.md index ab2ec9313..0beabd3ee 100644 --- a/docs/usage/custom_cards/custom_card_input_number.md +++ b/docs/usage/custom_cards/custom_card_input_number.md @@ -14,12 +14,12 @@ The `card_input_number` you can control a input_number entity ## Credits Author: sildehoop - 2021 -Version: 1.0.1 +Version: 1.1.0

Braking changes

- 1.0.1 + 1.1.0 ```yaml #OLD @@ -44,6 +44,10 @@ Version: 1.0.1 ## Changelog +
+1.1.0 +Adds ability to work with counter entities. Compatibility with input number entities is not affected. +
1.0.1 Added option to leave ulm_card_input_number_name empty (takes the friendly_name of the entity) diff --git a/docs/usage/custom_cards/custom_card_nik_door.md b/docs/usage/custom_cards/custom_card_nik_door.md new file mode 100644 index 000000000..8b58c2395 --- /dev/null +++ b/docs/usage/custom_cards/custom_card_nik_door.md @@ -0,0 +1,178 @@ +--- +title: Minimal Door Lock Card +hide: + - toc +--- + + +# Custom-card "Minimal Door Lock" + +This is a `custom-card` that shows the currenct state of your Lock and allows you to open and close it showing the state with a Minimal Design. + +![Screenshot](../../assets/img/custom_card_nik_door.png) + +## Credits + +Author: Nik - 2022 Version: 1.0.0 + +## Changelog + +
+1.0.0 +Initial release +
+ +## Requirements + +To have the Minimalist cards and custom cards installed + +## Usage + +```yaml +- type: 'custom:button-card' + template: custom_card_nik_door + entity: sensor.nuki_blindato_door_security_state + variables: + ulm_custom_card_entity_1_name: Blindato + ulm_custom_card_entity_1_lock: lock.nuki_blindato_lock +``` + +## Variables + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
VariableExampleRequiredExplanation
ulm_custom_card_entity_1_namesensor.nuki_blindato_door_security_stateYesYour Door Name
ulm_custom_card_entity_1_locklock.nuki_blindato_lockYesYour Door Lock entity
entitysensor.nuki_blindato_door_security_stateYesYour door sensor to track "Open" and "Close" state.
+ +## Template Code + +```yaml +--- +custom_card_nik_door: + template: + - "ulm_language_variables" + variables: + ulm_custom_card_entity_1_name: "[[[ return variables.ulm_custom_card_entity_1_name]]]" + ulm_custom_card_entity_1_lock: "[[[ return variables.ulm_custom_card_entity_1_lock]]]" + show_icon: false + show_name: false + show_label: false + styles: + grid: + - grid-template-areas: > + [[[ + var areas = []; + areas.push("item1 item1"); + areas.push("item2 item2"); + return "\"" + areas.join("\" \"") + "\""; + ]]] + - grid-template-columns: "1fr 1fr" + - grid-template-rows: "min-content" "min-content" + - row-gap: "12px" + card: + - border-radius: "var(--border-radius)" + - box-shadow: "var(--box-shadow)" + - padding: "12px" + + custom_fields: + item1: + card: + type: "custom:button-card" + template: + - "icon_more_info" + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return entity.entity_id]]]" + icon: "mdi:door" + styles: + icon: + - color: "rgba(var(--color-blue),1)" + img_cell: + - background-color: "rgba(var(--color-blue),0.2)" + tap_action: + action: "none" + item2: + card: + type: "custom:button-card" + entity: "[[[ return entity.entity_id]]]" + name: "[[[ return variables.ulm_custom_card_entity_1_name]]]" + label: > + [[[ + return entity.state + ]]] + item2: + card: + type: "custom:button-card" + template: "list_2_items" + custom_fields: + item1: + card: + type: "custom:button-card" + template: "widget_icon" + icon: "mdi:lock-open-variant" + entity: "[[[ return entity.entity_id]]]" + tap_action: + action: "call-service" + service: "lock.open" + service_data: + entity_id: "[[[ return variables.ulm_custom_card_entity_1_lock]]]" + state: + - value: "Open" + styles: + icon: + - color: "rgba(var(--color-red),1)" + img_cell: + - background-color: "rgba(var(--color-red),0.2)" + - value: "Closed & Unlocked" + styles: + icon: + - color: "rgba(var(--color-yellow),1)" + img_cell: + - background-color: "rgba(var(--color-yellow),0.2)" + item2: + card: + type: "custom:button-card" + template: "widget_icon" + icon: "mdi:lock" + entity: "[[[ return entity.entity_id]]]" + tap_action: + action: "call-service" + service: "lock.lock" + service_data: + entity_id: "[[[ return variables.ulm_custom_card_entity_1_lock]]]" + state: + - value: "Closed & Locked" + styles: + icon: + - color: "rgba(var(--color-green),1)" + img_cell: + - background-color: "rgba(var(--color-green),0.2)" +``` diff --git a/docs/usage/custom_cards/custom_card_nik_nas.md b/docs/usage/custom_cards/custom_card_nik_nas.md new file mode 100644 index 000000000..eaf2df0dd --- /dev/null +++ b/docs/usage/custom_cards/custom_card_nik_nas.md @@ -0,0 +1,409 @@ +--- +title: Nas Summary Card +hide: + - toc +--- + + +# Custom-card "Nas Summary Card" + +This is a `custom-card` that shows you a summary for your NAS with sensors, Wake on Lan and collapsed info. Once the NAS is off or unavailable it collapses the info. + +![Screenshot](../../assets/img/custom_card_nik_nas_off.png) +![Screenshot](../../assets/img/custom_card_nik_nas_on.png) + +## Credits + +Author: Nik - 2022 +Version: 1.0.0 + +## Changelog + +
+1.0.0 +Initial release +
+ +## Requirements + +To have the Minimalist cards and custom cards installed + +## Usage + +```yaml +- type: "custom:button-card" + template: "custom_card_nik_nas" + entity: switch.qnap_wol + variables: + graph_span: "1d" + chart_type: "radialBar" + entity_1: + entity_id: "sensor.nas_cpu_temperature" + icon: '' + name: "Temp" + color: "yellow" + max_value: 100 + entity_2: + entity_id: "sensor.nas_memory_usage" + icon: '' + name: "Memory" + color: "blue" + max_value: 100 + entity_3: + entity_id: "sensor.nas_cpu_usage" + icon: '' + name: "CPU" + color: "green" + max_value: 100 + entity_4: + entity_id: "sensor.disk_use_percent" + icon: "mdi:harddisk" + name: "Disk" + color: "red" +``` + +## Variables + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
VariableExampleRequiredExplanation
entityswitch.qnap_wolyesThe Switch to turn On or Off the NAS
chart_typeline, scatter, pie, donut or radialBaryesThe chart type you want to display
graph_span1h, 12min, 1d, 1h25, 10sec, ...yesThe span of the graph as a time interval
entity_idsensor.disk_use_percentyesEntity sensor of choice. 4 entities must be added
iconmdi:cpu-64-bitnomdi icon you want to be exposed in the img_cell, '' will return entity.attributes.icon
namename for the used sensorno'' will return entity.attributes.friendly_name
colorgreen, blue, yellow, red or greynoif you don't use the color variable it will choice a random color
max_value10, 300, ...noMaximum value of the sensor. Default will be 100
+ +## Template Code + +```yaml +--- +custom_card_nik_nas: + variables: + entity_1: + entity_id: + icon: "[[[ return entity.attributes.icon ]]]" + name: "[[[ return entity.attributes.friendly_name ]]]" + color: > + [[[ + var colors = ["yellow", "blue", "red", "green"]; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_2: + entity_id: + icon: "[[[ return entity.attributes.icon ]]]" + name: "[[[ return entity.attributes.friendly_name ]]]" + color: > + [[[ + var colors = ["yellow", "blue", "red", "green"]; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_3: + entity_id: + icon: "[[[ return entity.attributes.icon ]]]" + name: "[[[ return entity.attributes.friendly_name ]]]" + color: > + [[[ + var colors = ["yellow", "blue", "red","green"]; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + entity_4: + entity_id: + icon: "[[[ return entity.attributes.icon ]]]" + name: "[[[ return entity.attributes.friendly_name ]]]" + color: > + [[[ + var colors = ["yellow", "blue", "red","green"]; + var color = colors[Math.floor(Math.random() * colors.length)]; + return color; + ]]] + show_name: false + show_state: false + show_label: false + show_icon: false + show_last_changed: false + show_entity_picture: false + styles: + grid: + - grid-template-areas: > + [[[ + var areas = []; + if (entity.state == "off" || entity.state == "unavailable") { + areas.push("item5"); + return "\"" + areas.join("\" \"") + "\""; + } else { + areas.push("item4 item4"); + areas.push("item1 radial"); + areas.push("item2 radial"); + areas.push("item3 radial"); + return "\"" + areas.join("\" \"") + "\""; + } + ]]] + - grid-template-columns: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "1fr"; + } else { + return "35% 65%"; + } + ]]] + - grid-template-rows: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "min-content"; + } else { + return "1fr"; + } + ]]] + card: + - border-radius: "var(--border-radius)" + - box-shadow: "var(--box-shadow)" + - padding: "12px" + custom_fields: + item1: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + item2: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + item3: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + item4: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + item5: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "block"; + } else { + return "none"; + } + ]]] + radial: + - display: > + [[[ + if (entity.state == "off" || entity.state == "unavailable") { + return "none"; + } else { + return "block"; + } + ]]] + custom_fields: + item1: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_1.entity_id ]]]" + icon: "[[[ return variables.entity_1.icon ]]]" + name: "[[[ return variables.entity_1.name ]]]" + template: "card_generic_swap" + styles: + icon: + - color: "[[[ return `rgba(var(--color-${variables.entity_1.color}), 1)`;]]]" + img_cell: + - background-color: "[[[ return `rgba(var(--color-${variables.entity_1.color}), 0.20)`;]]]" + card: + - box-shadow: "none" + - border-radius: "none" + - padding-top: "1px" + - padding-bottom: "1px" + item2: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_2.entity_id ]]]" + icon: "[[[ return variables.entity_2.icon ]]]" + name: "[[[ return variables.entity_2.name ]]]" + template: "card_generic_swap" + styles: + icon: + - color: "[[[ return `rgba(var(--color-${variables.entity_2.color}), 1)`;]]]" + img_cell: + - background-color: "[[[ return `rgba(var(--color-${variables.entity_2.color}), 0.20)`;]]]" + card: + - box-shadow: "none" + - border-radius: "none" + - padding-top: "1px" + - padding-bottom: "1px" + item3: + card: + type: "custom:button-card" + entity: "[[[ return variables.entity_3.entity_id ]]]" + icon: "[[[ return variables.entity_3.icon ]]]" + name: "[[[ return variables.entity_3.name ]]]" + template: "card_generic_swap" + styles: + icon: + - color: "[[[ return `rgba(var(--color-${variables.entity_3.color}), 1)`;]]]" + img_cell: + - background-color: "[[[ return `rgba(var(--color-${variables.entity_3.color}), 0.20)`;]]]" + card: + - box-shadow: "none" + - border-radius: "none" + - padding-top: "1px" + - padding-bottom: "1px" + item4: + card: + type: "horizontal-stack" + cards: + - type: "custom:button-card" + template: "card_input_boolean" + entity: "[[[ return entity.entity_id]]]" + icon: "mdi:nas" + name: "Status" + styles: + card: + - background-color: "transparent" + - box-shadow: "none" + - border: "2px solid var(--google-grey)" + tap_action: + action: "more-info" + + - type: "custom:button-card" + template: "card_generic_swap" + entity: "[[[ return variables.entity_4.entity_id ]]]" + icon: "[[[ return variables.entity_4.icon ]]]" + name: "[[[ return variables.entity_4.name ]]]" + styles: + card: + - background-color: "transparent" + - box-shadow: "none" + - border: "2px solid var(--google-grey)" + icon: + - color: "[[[ return `rgba(var(--color-${variables.entity_4.color}), 1)`;]]]" + img_cell: + - background-color: "[[[ return `rgba(var(--color-${variables.entity_4.color}), 0.20)`;]]]" + tap_action: + action: "none" + item5: + card: + type: "custom:button-card" + template: "card_input_boolean" + entity: "[[[ return entity.entity_id]]]" + icon: "mdi:nas" + name: "Status" + styles: + card: + - background-color: "transparent" + - box-shadow: "none" + - border: "2px solid var(--google-grey)" + tap_action: + action: "more-info" + radial: + card: + type: "custom:apexcharts-card" + graph_span: "[[[ return variables.graph_span ]]]" + chart_type: "[[[ return variables.chart_type ]]]" + style: | + ha-card { + border-radius: "var(--border-radius)"; + box-shadow: none; + padding-left: 10px; + padding-bottom: 0px; + } + header: + show: false + apex_config: + title: + floating: false + align: "top" + style: + fontSize: "2px" + fontWeight: "bold" + chart: + foreColor: "rgb(148,148,148)" + offsetY: 5 + legend: + show: false + series: + - entity: "[[[ return variables.entity_1.entity_id ]]]" + name: "[[[ return variables.entity_1_name ]]]" + color: "[[[ return `var(--google-${variables.entity_1.color})`;]]]" + max: "[[[ return variables.entity_1.max_value ]]]" + - entity: "[[[ return variables.entity_2.entity_id ]]]" + name: "[[[ return variables.entity_2_name ]]]" + color: "[[[ return `var(--google-${variables.entity_2.color})`;]]]" + max: "[[[ return variables.entity_2.max_value ]]]" + - entity: "[[[ return variables.entity_3.entity_id ]]]" + name: "[[[ return variables.entity_3_name ]]]" + color: "[[[ return `var(--google-${variables.entity_3.color})`;]]]" + max: "[[[ return variables.entity_3.max_value ]]]" +```