Person Card
Description¶
The card_person
shows if a person is home
or not_home
. If you have setup other zones, it will show these as well.
Variables¶
Variable | Default | Required | Notes |
---|---|---|---|
entity | The person entity | ||
ulm_card_person_entity | The person entity | ||
ulm_card_person_use_entity_picture | If you set this to true, the card shows the entity picture from your user, otherwise (set to false) shows the icon. Default is false. | ||
ulm_card_person_zone1 | Set another zone (beside "home") to use for the card. You can set up two zones besides "home". | ||
ulm_card_person_zone2 | Set another zone (beside "home") to use for the card. You can set up two zones besides "home". | ||
ulm_address | Show an address as label, add an entity with a geo location |
Usage¶
- type: 'custom:button-card'
template: card_person
entity: person.username
variables:
ulm_card_person_entity: person.username
ulm_card_person_use_entity_picture: true
ulm_card_person_zone1: zone.work
ulm_card_person_zone2: zone.school
ulm_address: sensor.s10_mike_gegeocodeerde_locatie
Template Code
card_person.yaml
---
### Card Person ###
card_person:
template:
- "icon_info_bg"
- "ulm_translation_engine"
variables:
ulm_card_person_use_entity_picture: false
ulm_card_person_zone1: ""
ulm_card_person_zone2: ""
ulm_address: ""
triggers_update: "all"
tap_action:
action: "more-info"
entity: "[[[ return variables.ulm_card_person_entity; ]]]"
show_label: true
show_name: true
label: >
[[[
if (variables.ulm_address){
return states[variables.ulm_address].state
} else {
let state = states[variables.ulm_card_person_entity].state;
let option = ["home", "not_home", "unavailable", "unknown"]
return (option.includes(state)) ? variables.ulm_translation_state : state
}
]]]
name: "[[[ return states[variables.ulm_card_person_entity].attributes.friendly_name ]]]"
entity: "[[[ return variables.ulm_card_person_entity; ]]]"
icon: "mdi:face-man"
show_entity_picture: "[[[ return variables.ulm_card_person_use_entity_picture ]]]"
entity_picture: "[[[ return variables.ulm_card_person_use_entity_picture ? states[variables.ulm_card_person_entity].attributes.entity_picture\
\ : null ]]]"
styles:
icon:
- color: "rgba(var(--color-theme),0.9)"
- width: >
[[[
return !variables.ulm_card_person_use_entity_picture ? "20px" : "42px";
]]]
- place-self: >
[[[
return !variables.ulm_card_person_use_entity_picture ? "center" : "stretch stretch";
]]]
custom_fields:
notification:
- border-radius: "50%"
- position: "absolute"
- left: "38px"
- top: "8px"
- height: "16px"
- width: "16px"
- border: "2px solid var(--card-background-color)"
- font-size: "12px"
- line-height: "14px"
- background-color: >
[[[
return (states[variables.ulm_card_person_entity].state !== 'home') ? "rgba(var(--color-green),1)" : "rgba(var(--color-blue),1)";
]]]
custom_fields:
notification: >
[[[
if (states[variables.ulm_card_person_entity].state !== 'home') {
if (states[variables.ulm_card_person_entity].state === states[variables.ulm_card_person_zone1]?.attributes?.friendly_name) {
var icon = states[variables.ulm_card_person_zone1].attributes.icon !== null ? states[variables.ulm_card_person_zone1].attributes.icon : 'mdi:help-circle'
return '<ha-icon icon="' + icon + '" style="width: 10px; height: 10px; color: var(--primary-background-color);"></ha-icon>';
} else if (states[variables.ulm_card_person_entity].state === states[variables.ulm_card_person_zone2]?.attributes?.friendly_name) {
var icon = states[variables.ulm_card_person_zone2].attributes.icon !== null ? states[variables.ulm_card_person_zone2].attributes.icon : 'mdi:help-circle'
return '<ha-icon icon="' + icon + '" style="width: 10px; height: 10px; color: var(--primary-background-color);"></ha-icon>';
} else {
return '<ha-icon icon="mdi:home-minus" style="width: 10px; height: 10px; color: var(--primary-background-color);"></ha-icon>';
}
} else {
return '<ha-icon icon="mdi:home-variant" style="width: 10px; height: 10px; color: var(--primary-background-color);"></ha-icon>';
}
]]]