How about a feature where the vehicle image is changed to another top-down view of the car when any door is open. Or having an overlay that is applied when doors are open. When all doors are closed, it returns to the normal vehicle image.

The Mercedes App screenshot below is an example of what I mean

I hope I can explain this in a way that makes sense.

Currently the configuration of the icon grid entities use the terms "active" and "inactive" to determine the icon and colour used. But there are cases where those terms don't intuitively represent the state of the entity.

For instance, the lock entity for my vehicle is either "locked" or "unlocked". However the card considers the "locked" state to be "Inactive". This results in the icon colour being red (My "Inactive Colour" is set to Red and "Active" to green) when intuitively it should be the opposite. Red for "unlocked" and green for "locked".

This also applies to the icon. "Inactive" intuitively would mean "Unlocked" which causes a problem trying to display the correct icon based on the entity state and doesn't match up with other entities such as the engine which uses "Active" for on and "Inactive for off (and is logical).

Another example is the plugged-in state. Intuitively "Active" would be "plugged in" (green) and "Inactive" would be "unplugged" (red). But the card treats those in reverse so you end up with the icon being red when it's "plugged in" and "green" if "unplugged" if enabling "Use Active Color".

A couple of proposed solutions would be to a) allow you to specify active/inactive colour and icons for each individual grid entity or b) allow you to set icon and colour based on the actual state of each grid entity rather than how they are treated as "active" or "inactive".

Thanks for hearing me out and please let me know if I'm totally out to lunch on this idea.

Buttons allowing more conditions to show active. (A work around for now is to create a template sensor I suppose.)

When my car for example is charging or plugged I’d like the button to be green/active. Being able to have simple rules for active state per button would make this easier.

For my car for example the states for charging are ‘charging’ and ‘disconnected’ when plugged initially is ‘idle ‘ and ‘charging’

currently I’m not sure what constitutes ‘active’

I quite like the card, so I tried adding it to my Car page, which is a Sections view layout. However, it turns out that this card doesn't work well with Sections unfortunately. Here are two examples:

If you add other cards after this card, they overlap to the point that you can't really read anything on the Ultra Vehicle Card anymore:

In the Edit view you get to see this:

I think this points to the Ultra Vehicle Card not properly defining it's dimensions for the Sections view or something. It looks like the card only gets a small default area assigned, which causes the overlap with cards below this card.

Hello,
I'm wondering what I'm doing wrong that no vehicle image is shown.

I pasted the following link into the main image dialog:
https://ip-modcwp.azureedge.net/modcwp3v5s21201106/2C2CX1qwA--R9eWnjVdza-Rg2mT9s7LuDk5UXHbyAj-XPFznq6_Ssho5w-JI5RO1lgfGcWv3mQVB.was6ryD-fFhXVdmNbSDkJiQH-1080570dayvext_front1080.png

It is changed to:
/api/image/serve/616b9d733a52f17561cd12856b0b688a/original

and I found the file on the following location in SMB
\\config\image\616b9d733a52f17561cd12856b0b688a\original

The file itself is fine on the above location

I also tried to upload the file and different, smaller PNGs with no luck.

Ultra-Vehicle-Card: V1.2.3
Home Assistant Core: 2024.5.5
Home Assistant OS: 12.2

Thanks,
Oliver

Ability to change between km or metric miles.
I can change between imperial units (mi) and metric (km), but my integration (Volvo) reports range etc in metric miles, for example 10 miles = 100 km. So the card says 10 km range, while it is in fact 100 km.

Your _formatLocationState function takes a location name and re-formats it to capitalize each word. It seems like it shouldn't mess with the name chosen by the user when the Zone was created. For example, I've created the following Zone:

However, your code renders it as:

I don't think it is expected behavior to have a card reformatting the zone name in this fashion.

Ultra Vehicle Card Version 1.3.3
Home Assistant: 2024.6.4

Hi,
thanks for your great card. I configured an automation to refresh the data from Kia when pressing an icon.
I can run the automation manually without any issue.
When I click to the icon, the automation is not executed.
I cannot find any message in the debug log.
Any idea?

Here the config:

Here the the yaml code from the config editor:

[..]
icon_grid_entities:
   - sensor.ev9_last_updated_at
icon_interactions:
  sensor.ev9_last_updated_at:
    type: automation
    automation: automation.kia_update
[..]

Hi,

Not sure if it is due to the latest Ultra Vehicle Card update, or due to the HACS update to 2.0, but in the HA app (on iOS) the error "Custom element doesn't exist: ultra-vehicle-card" is displayed in stead of the card.

In a browser, both on Windows and iOS it works just fine.

Not sure what to look for or check.

Any suggestions?

Maybe this is just a "me" issue but if I create a fresh card and upload an image it displays correctly. But as soon as I add an sensor for the "Charging Status Entity" the vehicle image disappears with "no image available".

I was just trying to test with previous versions to see if I could nail down the version it started happening with but It MIGHT be a bug related to whether the vehicle is actually charging as my car JUST stopped charging and now I can't replicate the issue.

The integration I'm using (Skoda) has the URL of the car image stored in an entity.

Can you add the option of using an entity as the image source?

entity id: sensor.oda_model_image_url_large
name: Oda Model image URL (Large)
content: https://ip-modcwp.azureedge.net/blablablatruncated/front.png

To prevent mismatches between cached and "should be used" files a forceful update on the client side is needed.

You can see the same with all addons, similar to UVC.

But I think that it might not be possible to add the HACS Tag to all files, but that appears to be why some add a version to it instead:

This could be a nice solution to prevent these mismatches and (bugs that come with it).

I suddenly got som aditional info: common.battery and common.range below battery and distance(sees picture)
I have cleared cache, but still same issue

I have a Kia and it looks like it only updates on request. I would like to call an action on a button click to perform an action

action: perform-action
  perform_action: kia_uvo.update
  target: {}
  data:
    device_id: mykia

FYI, I tried to join the discord but it says Invite Invalid, may be expired...

Hi,

My card looks like this:

While I'd like it to show the full mileage (in my case 141,351 km)

I'm not sure why mine does this. Other examples seem to show the full mileage.

No idea what's wrong, but suddenly my battery level is not shown.

I would like to set up different colors for the icons and their state so I can make them look like the icons on the dash.

Example for when all warning lights are active:

Thanks for the awesome extension.
I tried to "donate with PayPal" in the HACS screen, it does not work.
Clicking on the same link on github opens paypal correctly.
Perhaps check that...

I wanted to integrate this card in my front-end, which is made up by some vertical stacks. When trying to switch to the manual code-edit, the page freezes and after some time the browsers asks to stop the running of scripts. I've observed this behaviour in both Microsoft Edge and Firefox on a Macbook runnning Sonoma 14.5 and also on Safari on my iPhone.

Debugging the window in Firefox results in the following error (in Dutch):

Fout tijdens het ophalen van een originele bron: request failed with status 404
Bron-URL: https://homeassistant.home.weavel.nl/unknown/node_modules/@codemirror/language/dist/index.js

When I remove the card from the dashboard the editor no longer freezes. This does not happen when editing another stack where the card is not present. Let me know if you need more! Thank you so much for creating this card!

I have a different charge image. But it will not change to this image when charging.
AND i also suddenly common.battery, and common.range under the value. Not seen this before

I have a problem with this line of code:
const isCharging = chargingStatusEntity && chargingStatusEntity.state.toLowerCase() === 'charging';
On my car, the charging entity is a boolean item and it has on/off status based on the current state of the vehicle.
I don't have any status that would be showing "charging".
I can do a workaround and provide virtual status, of course, but it would be nicer if the extension could detect the type of the sensor and if it is boolean, act accordingly, if it is sensor, compare it with some word...

I have added a sensor with remaining range to the card config, but it doesnt show in the card

I dont have an entity with % charge, so have left this blank

Hi, just noticed the values for my vehicle are being pulled correctly however the card does not have the option to toggle between KM's and Miles. Although the value is correct the descriptor shows miles incorrectly. Can we please have a toggle to select between these?

Hey there,

I have a component for my NIU E-Scooter that reports the state of the sensor as an integer:

Since Ultra-Vehicle-Card doesn't treat these as "True/False", the "active" states are not displayed properly:

(e.g. IsLocked entity with value of 1 is shown to be inactive in the card)

Could be added as an option when setting up the entities

When using the Visual editor this seems to be outdated compared to the desired code. Example:

Code after adding card:

type: custom:ultra-vehicle-card
title: My Vehicle
image_url: ''
vehicle_type: EV
unit_type: mi
battery_level_entity: ''
battery_range_entity: ''
fuel_level_entity: ''
fuel_range_entity: ''
charging_status_entity: ''
location_entity: ''
mileage_entity: ''
show_battery: true
show_battery_range: true
show_fuel: true
show_fuel_range: true
show_location: true
show_mileage: true
icon_grid_entities: []
custom_icons: {}
hybrid_display_order: fuel_first
car_state_entity: ''
charge_limit_entity: ''
show_car_state: true
show_charge_limit: true
cardBackgroundColor: ''
barBackgroundColor: ''
barFillColor: ''
limitIndicatorColor: ''
iconActiveColor: ''
iconInactiveColor: ''

Code after setting the vehicle to Fuel settings:

title: My Vehicle
image_url: ''
vehicle_type: Fuel
unit_type: mi
level_entity: ''
range_entity: ''
charging_status_entity: ''
location_entity: ''
mileage_entity: ''
show_level: true
show_range: true
show_location: true
show_mileage: true
icon_grid_entities: []
custom_icons: {}
type: custom:ultra-vehicle-card
battery_level_entity: ''
battery_range_entity: ''
fuel_level_entity: ''
fuel_range_entity: ''
show_battery: true
show_battery_range: true
show_fuel: true
show_fuel_range: true
hybrid_display_order: fuel_first
car_state_entity: ''
charge_limit_entity: ''
show_car_state: true
show_charge_limit: true
cardBackgroundColor: ''
barBackgroundColor: ''
barFillColor: ''
limitIndicatorColor: ''
iconActiveColor: ''
iconInactiveColor: ''

The battery_level_entity is changed to level_entity (also for range) and this is where the set entity is entered. But this does not display the fuel level. Manually changing the code to set it to fuel_level_entity fixes this.

I am trying to set up an icon to allow me toggle my charger's locked status using a script (As toggle does not work on locks).

I want the status icons to relate to the entity I have chosen (Wallbox MQTT Lock) but I was to trigger a script when the icon is clicked.
When I choose "Trigger" as the interaction there is no option to choose which script/automation I wish to trigger.

I have restarted HomeAssistant, did an "Empty Cache and Hard Reload" in Chrome, used different browsers but there is no option to choose which script I wish to trigger?

Any advise on this?

Thanks for your work on this card

It looks like the light mode charge bar has not been optimized. The blue has low contrast to the black background.

I'm super excited for the potential of this card! I installed version 1.1.0 yesterday and added all the sensors... then after upgrading to 1.1.6 I noticed that the battery level and range disappeared. I then stepped back the versions and found that I had to go all the way back to 1.1.0 to restore the visibility of the battery level and range.

I can't get the Location Entity field to work, it shows my device tracker entity friendly name instead of its state:

In this case it should display "Chélieu":

I tried with various location tracker entities (not just the car), it always shows the friendly name.

Hi, I downloaded the plugin today, and it looks fantastic.

But the new grid view doesnt work, when I try to add a car entity in the grid search field, the entity doesnt appear to be found, and it is not visible in the card etc:

In the card, the speedometer now shows me 2.1 kkm, how can I make it show 2100 km, as happened until 3/4 days ago?

Is it possible to get the value of an entity, insted of a icon?? (the icons below picture)
(see picture)

As title says, the fuel and range is only shown in EV mode, not fuel.

title: Yngve
image_url: >-
vehicle_type: Fuel
unit_type: km
level_entity: sensor.ysn705_fuel_level
range_entity: sensor.ysn705_range
charging_status_entity: sensor.ysn705_fuel_level
location_entity: device_tracker.ysn705_position
mileage_entity: sensor.ysn705_odometer
show_level: true
show_range: true
show_location: true
show_mileage: true
icon_grid_entities: []
custom_icons: {}
type: custom:ultra-vehicle-card

Hey, I really love your card. Thanks for your work!
It would be awesome to get some localization to other languages (mainly the "90% Fuel" text in the card and the name of the home zone)

If you need some help with translation to German I am willing to help.

the possibility to choose phev cars has disappeared

          What I did was add trigger which will work for Automations (if needed, look I get it why would you want to trigger an automation to happen if it's uhhh automated) scripts, scenes or any entity that is in the entity picker that needs triggered vs toggled.

Originally posted by @WJDDesigns in #47 (comment)

I installed the latest version 1.5.1.
I am still see only "automation" and no "trigger" in the "Icon Grid" section under "Interaction".
If I click to the icon the automation selected under "Interaction" is still not executed.
I cannot see any script or scenes in the entity picker...

The card is pretty neat. It would be awesome to support hybrid cars that have both electric and gas range.

In the icon grid, I've added 2 entities - doors locked and car connected to charger.
However, both display only question marks instead of icons relevant for the actual sensor.

The entity has proper icon in the device page.

Adding entities to the icon grid does not work, icons are not found:

I have added the entities in the icon grid by searching them from inside the card config GUI:

But after selecting them from the search results dropdown, the features appear color coded as error, and the icons do not show in the card as the top image shows.

Those entities do exist and work otherwise:

Hi,
nice card. It is very useful but in mu case some of the display data come from entity attributes and not from value/state.
Is possible to support source also from attributes or support template as source?

For example the charge of the EV Battery in my case is:
{{ sensor.fordpass_elvehcharging.attributes.BatteryCharge }}

Regards
L.

Hi,

I love your card. It is very nice, I created my own with an image card, but this is so much better.

One request though: please remove the code that transforms the state of the vehicle status entity to lowercase, then splits it by _ and makes all bits uppercase. I think a card displaying info should not mess with capitalisation. The user can change it through a template sensor if needed.

My status entity displays for example: Charging | Ending in 40 minutes | 11 kW

When passes through your filter it gets messed up.

I can fork your repo and easily fix it, but I think it will also benefit other users (as the display layer should not mess with the content)

Thanks for the awesome card!

I'd love to be able to click the icons to interact with them, i.e. to turn on a/c or stop charging.

It doesn't need to trigger the actions directly by clicking the icon but at least open the entity dialog when clicking them.

Currently the card provides its own basic styling options in the form of colour pickers for various elements. However, if one uses HA themes which also react to the device’s dark mode, the styling provided by the card doesn’t automatically adapt.

With version 1.4.0 the image entity is no longer displayed and a default image (lambo) is shown instead.

Hi,

After the big HACS upgrade, the add-on stopped working :

Tried reinstalling, but that doesn't fix the issue.

My car integration provides a device_tracker entity that uses the zones known in Home Assistant as a state. The device_tracker entity uses the exact zone name, so they are properly capitalized (as long as the zone name is capitalized). However, the 'home' and 'away' states are not capitalized. Most/all cards in Home Assistant that use a device_tracker show these as 'Home' and 'Away'. However, this card does not.
Would it be possible to capitalize the device_tracker if the state is not capitalized?

Thank you for releasing this car, it's great!

It would be cool if I could set custom bar colors for different values, similar to gauges. Like when the SoC is less than 20% it's red, orange when it's below 50% and otherwise blue or something. Right now it's always orange for me when not loading and that seems wrong.

Hi

Not really any issues, more a question.
What is the icon grid used for?
I have added 2 sensors and choosen icon.

But besides the icons nothing else is displayed and when I press the icons nothing really happens.

Code:

icon_grid_entities:
  - sensor.zaptec_charger_charge_power
  - sensor.erfans_bil_time_charge_complete
custom_icons:
  sensor.zaptec_charger_charge_power: mdi:battery-charging
  sensor.erfans_bil_time_charge_complete: mdi:timer

What is the meaning with this, what am I missing?
Btw, really cool feature, great job!

I read over the tickets that were closed yesterday for the image displaying a lambo instead of the vehicle, and it appears to still be happening, as well as common_away. I verified that I'm running 1.5.1 and have also verified that it's not a caching issue, I opened in a separate browser, as well as private mode.

I also tried to upload my own image to circumvent the online grab, but it's not working either.