MiniHass, custom vehicle card | Home Assistant | Page 1

lucid brook Jan 18, 2024, 4:15 PM

#

What folder did you paste the yaml files into?

hexed hatch Jan 18, 2024, 4:19 PM

#

www/community/ui_lovelace_minihass/templates/custom_card_vehicle.yaml

lucid brook Jan 18, 2024, 4:20 PM

#

You need a folder that is named custom_card_vehicle in the template folder, then put the yaml code in there

#

Template card's needs a folder to match the yaml file

hexed hatch Jan 18, 2024, 4:21 PM

#

At witch level ? in www/community or at the root ?

lucid brook Jan 18, 2024, 4:22 PM

#

www/community/ui_lovelace_minihass/templates/custom_card_vehicle/custom_card_vehicle.yaml

#

Did you use a clean yaml dashboard for doing this by the way ?

hexed hatch Jan 18, 2024, 4:23 PM

#

For the test yes, but i would like to incorporate into mine

lucid brook Jan 18, 2024, 4:25 PM

#

Ok let me know if it works or not. I need to go out real quick. Back in about 30

hexed hatch Jan 18, 2024, 4:27 PM

#

Same error Unable to parse YAML: YAMLException: bad indentation of a mapping entry (2:5) 1 | - type: "custom:button-card" #custom ... 2 | template: ---------^ 3 | - custom_card_vehicle 4 | variables

#

Sure let me know when you back

lucid brook Jan 18, 2024, 4:27 PM

#

There is a way to do it with front end as well, but then you need to edit a bunch of code in the card. but I can try to make a guide tomorrow if needed

#

Can you paste your dashboard yaml code into a dpast.org or something? So we can have look?

hexed hatch Jan 18, 2024, 4:28 PM

#

Ah ! in the front end i can't see custom_card_vehicle available

#

Maybe that why

lucid brook Jan 18, 2024, 4:30 PM

#

Many a path issue with the resources? You might want to refresh all yaml files in the devtool

#

Be back soon

lucid brook Jan 18, 2024, 5:14 PM

#

ok I`m back

#

did you get it working, or do you have the same issue stull ?

#

still*

lucid brook Jan 18, 2024, 5:17 PM

#

hexed hatch Maybe that why

culd you paste your yaml files in pastbin, and i can take a look 🙂 but i do think its a path issue

#

in my dashboard.yaml file, i have: button_card_templates: !include_dir_merge_named "/config/ui_lovelace_minihass/templates/"

hexed hatch Jan 18, 2024, 5:22 PM

#

Sorry pastbin is block on my job .. So in my configuration.yaml i have this lovelace: resources: - url: /local/battery-entity-row.js?v=1.3.1 type: module - url: /hacsfiles/weather-card/weather-card.js type: module - url: /www/community/button-card/button-card.js type: module - url: https://fonts.googleapis.com/css2?family=Montserrat:wght@300;700&display=swap" type: css

#

and in the dasboard i copy past the dashboard.yaml you put into the github

#

    template:
      - custom_card_vehicle
    variables:
      label: Battery Range # Test only
      range: > # change the sensor "mg5_range" to a sensor stating remaining milage on the battery.
            [[[ return states['sensor.mg5_range'].state + '<span
            style="font-size:0.2em">km</span>' ]]] 
      soc: sensor.mg5_soc # Sensor from main vehicle battery
      soc_aux: sensor.12v_battery_voltage # sensor for vehicle 12v battery
      engine: binary_sensor.vehicle_running # Sensor from your vehicle checking if engine is: "on" or "off"
      lock: lock.mg5_doors_lock # Lock entity for the lock you want to open
      defrost: switch.mg5_front_window_defroster_heating # Switch entity for defrosting your front window
      defrost2: switch.mg5_rear_window_defroster_heating # Switch entity for defrosting your rear window
      ac: climate.mg5_vehicle_climate # climate entity for turning on/off climate (will open defult climate card)
      charging: binary_sensor.mg5_battery_charging # sensor fro vehicle, checking if the car is charging or not.
      cable: binary_sensor.mg5_cable # sensor from vehicle checking if the cable is plugged in or not.
      image: local/images/vehicle/mg5.png   # Image link for your vehicle, use transperant background / PNG images```

lucid brook Jan 18, 2024, 5:24 PM

#

yeah that might be the problem. because the "dashboard.yaml" in the github is only the card.

#

#

this is my dashboard.yaml file

#

then i have a folder inside the minihass folder called views, inside there i have all of my "view tabs" for different stuff.
So my car.yaml looks like this:

#

i can try to make a quick file for you.. if you dont want the folder structure that we use in these types of templates

#

hold on

#

try to add the 3 first lines of the last screenshot. that might help you out

hexed hatch Jan 18, 2024, 6:10 PM

#

Ok so i copy your printscreen dashboard.yaml : ``` title: Dasboard
background: "var(--background)"
icon: mdi:view-dashboard-variant-outline
kiosk-mode:
mobile_settings:
hide_header: true

views:
- !include /homeassistant/www/community/ui_lovelace_minihass/templates/custom_card_vehicle/car.yaml

button_card_templates: !include_dir_merge_named "/homeassistant/www/community/ui_lovelace_minihass/templates/" and got thisUnable to parse YAML: YAMLException: unknown tag !<!include> (9:104) 6 | ... 7 | ... 8 | ... 9 | ... s/custom_card_vehicle/car.yaml -----------------------------------------^ 10 | ... 11 | ...```

#

looks likes doesnt love !include

lucid brook Jan 18, 2024, 6:18 PM

#

You should be able to just state car.yaml

#

Without the path

hexed hatch Jan 18, 2024, 6:21 PM

#

#

I was able to save dashboard but

lucid brook Jan 18, 2024, 6:24 PM

#

You might need to reload the yaml, clear browser and such ?

#

Or it might be the path to the card that is wrong. Look how different yours and mine are

#

For the button card inclusion

hexed hatch Jan 18, 2024, 6:54 PM

#

Im sorry i think im too newbie to do this !

#

What i see in my architecture is thaht :

lucid brook Jan 18, 2024, 7:00 PM

#

You placed the folder in the wrong place. You should move it to the config folder not in the www folder

#

Tame the whole minihass folder and .over to /config/ same place as where your configuration.yaml is located

hexed hatch Jan 18, 2024, 7:01 PM

#

Ok i put at that level :

lucid brook Jan 18, 2024, 7:02 PM

#

Yes

#

You need to make a folder called views in the minihass folder as well. And put the car.yaml inside

#

so ok let me write down the structure 2 sec

#

Main folder:
ui_lovelace_minihass
|--dashboard
|--templates

#

the folder named custom_card_vehicle goes inside the templates one.

#

then inside the dashboard there should be

dashbord.yaml
view (folder)

inside the view folder, your car.yaml should be

#

lucid brook Jan 18, 2024, 7:06 PM

#

hexed hatch Im sorry i think im too newbie to do this !

dont be sorry

hexed hatch Jan 18, 2024, 7:11 PM

#

Ok ! so look like this now :

lucid brook Jan 18, 2024, 7:12 PM

#

ok, now show me what is inside the dashboard.yaml please

#

oh you aldready did sorry....

hexed hatch Jan 18, 2024, 7:14 PM

#

I can update you : ``` title: Dasboard
background: "var(--background)"
icon: mdi:view-dashboard-variant-outline
kiosk-mode:
mobile_settings:
hide_header: true

views:
- !include car.yaml

button_card_templates: !include_dir_merge_named "/ui_lovelace_minihass/templates/"

type: "custom:button-card" #custom card for vehicle
template:
- custom_card_vehicle
variables:
label: Battery Range # Test only
range: > # change the sensor "mg5_range" to a sensor stating remaining milage on the battery.
[[[ return states['sensor.mg5_range'].state + '<span
style="font-size:0.2em">km</span>' ]]]
soc: sensor.mg5_soc # Sensor from main vehicle battery
soc_aux: sensor.12v_battery_voltage # sensor for vehicle 12v battery
engine: binary_sensor.vehicle_running # Sensor from your vehicle checking if engine is: "on" or "off"
lock: lock.mg5_doors_lock # Lock entity for the lock you want to open
defrost: switch.mg5_front_window_defroster_heating # Switch entity for defrosting your front window
defrost2: switch.mg5_rear_window_defroster_heating # Switch entity for defrosting your rear window
ac: climate.mg5_vehicle_climate # climate entity for turning on/off climate (will open defult climate card)
charging: binary_sensor.mg5_battery_charging # sensor fro vehicle, checking if the car is charging or not.
cable: binary_sensor.mg5_cable # sensor from vehicle checking if the cable is plugged in or not.
image: local/images/vehicle/mg5.png # Image link for your vehicle, use transperant background / PNG images```

#

Better like this lol :

lucid brook Jan 18, 2024, 7:15 PM

#

ok i se the problem.

#

change the include to this: button_card_templates: !include_dir_merge_named "/config/ui_lovelace_minihass/templates/"
Then remove everything below

#

because that information is inside the car.yaml file

hexed hatch Jan 18, 2024, 7:17 PM

#

Ok great, so looking like this now :

lucid brook Jan 18, 2024, 7:19 PM

#

ok wierd, just take away the /config/ then, and se what happens

hexed hatch Jan 18, 2024, 7:19 PM

#

no change :

lucid brook Jan 18, 2024, 7:20 PM

#

button_card_templates: !include_dir_merge_named "/config/ui_lovelace_minihass/templates/"

#

your 6 first lines have a space to much.

title
background
icon
kiosk_mode

should have no space from the left

hexed hatch Jan 18, 2024, 7:23 PM

#

Great

#

lucid brook Jan 18, 2024, 7:23 PM

#

now you still have the error?

hexed hatch Jan 18, 2024, 7:23 PM

#

Not in the yaml

#

Now how i import this one into the dashboard ?

lucid brook Jan 18, 2024, 7:25 PM

#

no, this is your new dashboard but you need to let the configuration.yaml to know where the new dashboard is located

#

#

this is a copy of my whole config file, but the important part is the dashboards:

hexed hatch Jan 18, 2024, 7:27 PM

#

Oh ok but is it possible to put already on my existing dashboard intead have a new dashboard

lucid brook Jan 18, 2024, 7:28 PM

#

if you dashboard is using front-end to edit dashboard no

#

but i can make the card so you can it, but then you need to edit allot of stuff just so you are warned

hexed hatch Jan 18, 2024, 7:29 PM

#

Ok like sensor and stuff

lucid brook Jan 18, 2024, 7:30 PM

#

yes

#

thats the thing with this type of template, you only need to change the few sensors that are in that car.yaml file..
But if you want to use the front-end, you need to go true about 3-400 lines of code 🙂

hexed hatch Jan 18, 2024, 7:39 PM

#

Holy shit

#

lol

#

Is it possible to add the new dashboard here :

lucid brook Jan 18, 2024, 7:41 PM

#

if you add the lines i showed you from my config file

#

  dashboards:
    home-dashboard:
      mode: yaml
      filename: "ui_lovelace_minihass/dashboard/dashboard.yaml"   #path to your dashboard.yaml
      title: Home UI                       #a title of the dashboard you like
      icon: mdi:script
      show_in_sidebar: true

#

then you reboot your home assistant, and it should be visible there.

NOTE: you cant edit it from the front end, only thrue that editor thingy

hexed hatch Jan 18, 2024, 7:51 PM

#

Ok i just reboot and i see on the left pane. i think they remain only few thing :

lucid brook Jan 18, 2024, 7:53 PM

#

can you show me the car.yaml file ?

hexed hatch Jan 18, 2024, 7:54 PM

#

i didnt change yet the sensor :

lucid brook Jan 18, 2024, 7:56 PM

#

https://dpaste.org/Xx2L1

#

it should look like that, sorry my file was wrong on github i se

hexed hatch Jan 18, 2024, 7:59 PM

#

Ahah ok ! So now is it because i need to update sensor ?

lucid brook Jan 18, 2024, 8:00 PM

#

I do belive so yes

lucid brook Jan 19, 2024, 8:46 AM

#

Did you get it working ?

hexed hatch Jan 19, 2024, 3:41 PM

#

Yes !

#

Thanks you very much for your time

lucid brook Jan 19, 2024, 4:16 PM

#

Nice!

#

Screenshot please 🙂

lucid brook Jan 19, 2024, 5:32 PM

#

hexed hatch Thanks you very much for your time

It's always nice to see others use it 🙂

hexed hatch Jan 19, 2024, 10:04 PM

#

I have inspired about your card because your is for electric and i have gas .. lol so here a screenshot ! not perfect but still working on it ! I would like to add the green circle flashing like your and put black background

lucid brook Jan 20, 2024, 7:50 AM

#

Looks good , but you can't add that pulse effect with the picture elements card... I 🤔 i think

lucid brook Jan 20, 2024, 8:42 AM

#

You can do it, with a custom button card

#MiniHass, custom vehicle card