@ZynanBob Just edit ui-lovelace.yaml and save, you don’t have to restart HA every time or shell command - refresh_lovelace: touch /config/ui-lovelace.yaml
can i ask you how you have made your home_climate sensor. does it contain all your info from your climate. temp, humidity, air quality?
Nullae’s solution is working fine: A different take on designing a Lovelace UI - #4241 by nullae
Simply put the service call in a button.
Use variables.circle_input
@pedolsky Thanks, can you elaborate a little please?
EDIT: Ah ok I see what you mean, so my button card would look like this:
- type: custom:button-card
entity: binary_sensor.windows
name: Windows
tap_action: !include popup/windows.yaml
template:
- base_window
- icon_window
- circle
variables:
circle_input: >
[[[
let number = states['sensor.windows_open'];
if (number) return parseInt(number.state);
]]]
That’s done the trick and I can see the number on the card now. I just need to address the styling, as it looks like the amount of circle showing is very small, due to the number of windows only being 1. It must be using the same styling as my light entities or speaker entities, where the amount of circle circumference showing relates to the state value. Would that need an additional section adding to the existing circle.yaml template to show the full circle for this type of domain or entity?
Hi @VietNgoc
I hope you can help me with 2 things.
- Unifi
- Vaccum
Part 1.
I have a Unifi Dream Machine Pro where I want to achieve it like you i want the “Router” and “AP” layout. See picture. Have followed various guides as well as what you posted but can’t get it to work. Do you have an easier guide on how to get sensors for unifi? If you have like pic and where to put the codes to get it to work. I dont get the sensors even to show up in my setup.
Guide i used:
–
Part 2
I have 2 different dashboards depending on whether it is a large screen or a small one where I run a mixture of Mattia’s setup and Luke’s setup. I got the floorplan part but don’t really know how to draw the white lines, see my picture and your picture. I still have lukes pic with his lines and my background.
Have used Gimp for editing. Do you have an easier guide for how to draw the lines?
The last part is how can I define the zone for my vacuum cleaner? im using Roboroc qmax 7
ad vacuum, you have to save a map image in the configuration of the vacuum camera. Then in the image program add a layer with your floorplan.
camera:
# ROIDMI EVE PLUS VACUUM
- platform: xiaomi_cloud_map_extractor
name: 'Roidmi EVE'
host: !secret roidmi_host
token: !secret roidmi_token
username: !secret vacuum_username
password: !secret vacuum_password
country: 'de'
store_map_raw: true
store_map_image: true
store_map_path: /config/tmp
to define the path of a single room you have to use a custom vacuum card, select the path via UI edit mode, then define the circuits and copy the coordinator points. I have uploaded a simple video guide here.
2 Likes
how exactly did you configure this? I tried to preload the swipe card with
preload_cards:
- swipe-card
but still get the same error.
I use the climate sensor to summarize information about the state of the home, such as the aqi values of individual rooms, temperature, room heating status, etc.
template:
# SENSORS
- sensor:
# SENSOR CLIMATE
- unique_id: climate_index
name: Home Climate
state: >-
{% set aqi = states.sensor.air_quality_index.state | float %}
{% if 0 < aqi < 12 %}
Excellent
{% elif 12.1 < aqi < 35.4 %}
Good
{% elif 35.5 < aqi < 55.4%}
Fair
{% elif 55.5 < aqi < 150.4 %}
Interior
{% elif 150.5 < aqi %}
Poor
{% endif %}
icon: >-
{% if states('sensor.home_climate') in ['Excellent', 'Good'] %}
mdi:leaf
{% elif states('sensor.home_climate') in ['Fair', 'Interior'] %}
ios:aqi-medium
{% else %}
ios:aqi-high
{%- endif %}
attributes:
average_temperature: >-
{{ states.sensor.average_temperature.state }}
average_humidity: >-
{{ states.sensor.average_humidity.state }}
living_room_pm25: >-
{{ states.sensor.dyson_ph04_pm_2_5.state }} µg/m³
bedroom_room_pm25: >-
{{ states.sensor.zhimi_mb3_8b86_pm25.state }} µg/m³
office_pm25: >-
{{ states.sensor.zhimi_mb4_b008_pm25_density.state }} µg/m³
heating: >-
{% set heaters = [
states.climate.bedroom_thermostat,
states.climate.office_thermostat,
states.climate.kids_room_thermostat,
states.climate.living_room_thermostat ] %}
{% set heateron = heaters | selectattr('attributes.hvac_action','eq','heating') | list | count %}
{%- if (heateron != 0) -%}
yes
{% else %}
no
{% endif %}
purifier: >-
{% set purifiers = [
states.fan.dyson_ph04,
states.fan.office_xiaomi_air_purifier,
states.fan.zhimi_mb3_8b86_air_purifier ] %}
{% set purifier_on = purifiers | selectattr('state','eq','on') | list | count %}
{%- if (purifier_on != 0) -%}
yes
{% else %}
no
{% endif %}
heating_on: >-
{% set heateron = [
states.climate.bedroom_thermostat,
states.climate.office_thermostat,
states.climate.kids_room_thermostat,
states.climate.living_room_thermostat ] %}
{{ heateron | selectattr('attributes.hvac_action','eq','heating') | map(attribute='name') | list | replace('Thermostat', '') }}
3 Likes
Apologies, I was in a hurry. Glad, you found it out.
You can use the styles variables of the circle template directly in your button card:
- type: custom:button-card
entity: switch.dummieswitch
template: [base, circle]
variables:
circle_input: >
[[[
let number = states['sensor.eingeschaltete_lampen'];
if (number) return parseInt(number.state);
]]]
styles:
card:
- --c-stroke-color-base: pink
- --c-stroke-color-on: blue
- --c-font-color: red
- --c-font-size: 1.3rem
computes:
For a full circle, you could do the following without altering the circle template itself:
- type: custom:button-card
entity: switch.dummieswitch
template: [base, circle]
variables:
anchor: >
[[[ return parseInt(states['sensor.eingeschaltete_lampen']?.state); ]]]
circle_input: >
[[[ return variables.anchor; ]]]
styles:
card:
- --c-stroke-color-base: >
[[[ return variables.anchor > 0 ? 'blue' : 'grey'; ]]]
- --c-stroke-color-on: none
1 Like
Do you have this running on your current setup? And if so, how did you go about getting this done?
I have HACS and HASS-agent installed on my HA.
I would preferably like a UI button or an automation.
Refreshing, editing or reloading the YAML configuration or files does not work for me. The only thing that is working for me is a full restart of HA to apply and view changes. This can take anywhere from 30 seconds to a few minutes and makes the entire design process tedious.
I have my dashboard files stored in a custom directory with the use of custom templates. Back when I had my dashboard files stored in the main config directory with ui-lovelace.yaml all I would need to do was go to:
Developer Tools > Template Entities
And that would do the trick. This no longer works for me.
@VietNgoc , I’m looking to make a floorplan, I see you use HA-floorplan.
Why did you choose that one over picture-element?
Are we talking about template sensors or the Yaml UI files? Nullae’s solution targets the latter.
If your template entities don’t update anymore, you should check the HA logs.
cant get the “path” button
https://dropover.cloud/793656#ced6f9bb-4bdf-48bb-98cd-d491bbcb6a62
camera:
- platform: xiaomi_cloud_map_extractor
host: !secret xiaomi_vacuum_host
token: !secret xiaomi_vacuum_token
username: !secret xiaomi_cloud_username
password: !secret xiaomi_cloud_password
draw: ['all']
map_transformation:
trim:
top: 15
bottom: 15
left: 0
right: 0
attributes:
- calibration_points
country: 'de'
store_map_raw: true
store_map_image: true
store_map_path: /config/tmp
HI Johannes,
Will you be able to share your full config ?
Thanks !
Bart
What code? I have it all uploaded on github, see how I have it set up there. You can find all the configurations in the documents from the creators of the cards and plugins.