thank you for this info.
with the binary sensor it updates quickly but i did wait a little for the update.
as soon as i add the below the icon changes even when the device is not charging
charging_state:
entity: binary_sensor._note_10_pro_is_charging
I have the file, but it is unknown.
I made a ui-lovelace.yaml with this code inside:
resources:
- url: /local/battery-state-card.js
type: module
After that I tried to add it in visual edit as custom item:
Configuration errors detected:
* Custom element not found: battery-state-card
The configuration might be wrong, but it isnât described exactly how to do it.
Try the following
charging_state:
entity: binary_sensor._note_10_pro_is_charging
state: "On" # or whatever the value is for this entity
Have you added the file in the www dir? You need to access HA directory structure and wind the www dir in config and upload the cardâs JS file.
In case you have done it: check if browser is able to download the file (dev tools - F12) or just use the address bar in the browser putting your HA host address with the path /local/battery-state-card.js
I have an other file in that folder that works. So yes, it should be readable.
Pretty sure it doesnât load the ui-lovelace.yaml. Do I have to link that file or is it enough to make it next to the configuration.yaml.
Also, is the .js file the only file I need?
Also, is the .js file the only file I need?
JS is the only file you need.
Pretty sure it doesnât load the ui-lovelace.yaml. Do I have to link that file or is it enough to make it next to the configuration.yaml.
You need to enable yaml mode otherwise the file is not read indeed.
The other way is to do it via configuration although you need to enable advanced mode
In case of any problems with adding custom resource please use a separate thread (an existing one as there is plenty of them) for seeking help
Thanks a lot, it works now and is amazing. 
Is there a way to filter for batteries that are in the same area?
Sorry but no. Area info is not provided with regular entity data and it has to be retrieved via websocket (AFAIK). This means that adding support for âareasâ would be quite a big hassle, hence such feature wonât appear in the nearest future (unless HA will start stamping entities with area info and that data is available via entity-status-update)
ok, thanks for the answer - much appreciated!
Hi Guys.
I use Tado Radiator TRV and the battery in them does not report in a % level. It seems to be Normal or Low. How can use this in the battery card? Show green for Normal and Red for Low.
I thought the state_map may have worked but using the code below its showing my TRV as green and on but I know the battery is Low. Am I missing something or is there another way to achieve this?
type: custom:battery-state-card
title: String values - state map
entities:
- entity: binary_sensor.va1628773120_battery_state
name: Binary sensor state
state_map:
- from: 'on'
to: 100
- from: 'off'
to: 25
Battery State Card
Standard battery reporting
What is the value of binary_sensor.va1628773120_battery_state at the time it shows green? Does a state of on mean Normal or Low?
Hi.
Both Normal and Low show as On. Below is an example of both.
a TRV where its showing Normal and green
A TRV where the state is Low and Red
Then I would suggest to make a template binary sensor thatâs on when the state is normal and off when low, and use that in the card. Others might have better ideas.
Thank you.
Could anyone help with the Syntax of doing this. I know how to create the Template but not sure on the primary syntax for it.
Actually, I lost track of your original question. Looking at your screenshot again, it shows that Normal corresponds with the binary sensor being off, and 'Low` when on. You should probably just switch the state map:
state_map:
- from: 'off' # battery is normal
to: 100
- from: 'on' # battery is low
to: 25
Ignore my reply about a template sensor.
Thanks mate. Switching them around has certainly made the Normal Green and the battery that is low yellow. It now shows a percentage as well. Thank you for your help. much appreciated
I was wondering what the convert is used for: GitHub - maxwroc/battery-state-card: Battery state card for Home Assistant
Can I use an entity with e. g. 54351.2 MB to convert it from MB to % (so this entity can be sorted together with many others already using the unit %)? I donât think so as that usually requires a template sensor - and battery state card is âonlyâ a displaying card, right.
So please: what does the convert do? Could not find an example in the docs (GitHub - maxwroc/battery-state-card: Battery state card for Home Assistant).
The example is actually there - state_map: GitHub - maxwroc/battery-state-card: Battery state card for Home Assistant
It allows you to convert one value to the other. This feature was mainly created to convert strings to int values as some sensors produce only Low/High battery values (are basically a binary sensors). So you cannot use it to convert the units in any reasonable way.
If you want to convert the units please look at the multiplier property. Where you can specify the x where the sensor value will be multiplied by it. And when you change the unit you can always override the original one by unit property.
I hope this solves your problem.
Thank you for explanation. Thatâs a quite powerful handling of string unit entities.
Anyway, what I was hoping to find is not possible as it would include some math (sensor.kiosk_tablet_internal_storage * 100 / sensor.kiosk_tablet_internal_storage_total_space = percentage value - and thatâs a typical job for a template sensor). Learned something though.