Hi, anyone here who can write a nice looking Volvo on call lovelacecard?
This is my setup, i have hacked Xiaomi vacuum cleaner card. But it leaves little room to customize any further at least with my limited knowledge.
1 Like
Hej, I’m also looking for a Volvo oncall card without success…
Would it be possible to share your modified vaccum js file? It looks like a good start!
1 Like
I´m jusing the picture element card. So no js needed 
Below is my code, relpace XXXX with your entity name, i have attached the picture aswell so you can copy the pictures size
elements:
- icon: 'mdi:radiator'
style:
'--paper-item-icon-active-color': green
'--paper-item-icon-color': lightgreen
left: 84%
top: 92%
tap_action:
action: toggle
service: switch.toggle
service_data:
entity_id: switch.XXXX_heater
type: icon
- icon: 'mdi:engine'
style:
'--paper-item-icon-active-color': green
'--paper-item-icon-color': lightgreen
left: 65%
top: 92%
tap_action:
action: toggle
service: switch.toggle
service_data:
entity_id: switch.XXXX_engine
type: icon
- icon: 'mdi:lock'
style:
'--paper-item-icon-color': 'rgb(20, 154, 210)'
left: 41%
top: 92%
tap_action:
action: toggle
service: lock.lock
service_data:
entity_id: lock.XXXX_door_lock
type: icon
- icon: 'mdi:lock-open'
style:
'--paper-item-icon-color': 'rgb(34, 154, 210)'
left: 18%
top: 93%
tap_action:
action: toggle
service: lock.unlock
service_data:
entity_id: lock.XXXX_door_lock
type: icon
- entity: sensor.XXXX_odometer
style:
background-color: 'rgb(54, 65, 78)'
border-color: 'rgb(34, 154, 210)'
border-left-style: solid
color: 'rgb(255, 255, 255)'
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
left: 1%
opacity: 0.8
pointer-events: none
text-shadow: 1px 1px black
top: 10%
transform: 'translate(0%,-50%)'
type: state-label
- entity: sensor.XXXX_fuel_consumption
style:
background-color: 'rgb(54, 65, 78)'
border-color: 'rgb(34, 154, 210)'
border-right-style: solid
color: 'rgb(255, 255, 255)'
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
opacity: 0.8
pointer-events: none
right: 1%
text-shadow: 1px 1px black
top: 10%
transform: 'translate(0%,-50%)'
type: state-label
- entity: sensor.XXXX_fuel_amount
style:
background-color: 'rgb(54, 65, 78)'
border-color: 'rgb(34, 154, 210)'
border-left-style: solid
color: 'rgb(255, 255, 255)'
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
left: 1%
opacity: 0.8
pointer-events: none
text-shadow: 1px 1px black
top: 30%
transform: 'translate(0%,-50%)'
type: state-label
- entity: sensor.XXXX_fuel_level
style:
background-color: 'rgb(54, 65, 78)'
border-color: 'rgb(34, 154, 210)'
border-left-style: solid
color: 'rgb(255, 255, 255)'
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
left: 1%
opacity: 0.8
pointer-events: none
text-shadow: 1px 1px black
top: 50%
transform: 'translate(0%,-50%)'
type: state-label
- entity: device_tracker.volvo_XXXX
style:
background-color: 'rgb(54, 65, 78)'
border-color: 'rgb(34, 154, 210)'
border-left-style: solid
color: 'rgb(255, 255, 255)'
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
left: 1%
opacity: 0.8
pointer-events: none
text-shadow: 1px 1px black
top: 69%
transform: 'translate(0%,-50%)'
type: state-label
- entity: binary_sensor.XXXX_doors
style:
background-color: 'rgb(54, 65, 78)'
border-color: 'rgb(34, 154, 210)'
border-right-style: solid
color: 'rgb(255, 255, 255)'
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
opacity: 0.8
pointer-events: none
right: 1%
text-shadow: 1px 1px black
top: 30%
transform: 'translate(0%,-50%)'
type: state-label
- entity: binary_sensor.XXXX_engine
style:
background-color: 'rgb(54, 65, 78)'
border-color: 'rgb(34, 154, 210)'
border-right-style: solid
color: 'rgb(255, 255, 255)'
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
opacity: 0.8
pointer-events: none
right: 1%
text-shadow: 1px 1px black
top: 50%
transform: 'translate(0%,-50%)'
type: state-label
- entity: binary_sensor.XXXX_windows
style:
background-color: 'rgb(54, 65, 78)'
border-color: 'rgb(34, 154, 210)'
border-right-style: solid
color: 'rgb(255, 255, 255)'
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
opacity: 0.8
pointer-events: none
right: 1%
text-shadow: 1px 1px black
top: 69%
transform: 'translate(0%,-50%)'
type: state-label
image: /local/V602019.png
type: picture-elements
Nice job!! How do you show the adress? Looks great 
Thanks! I use the Google geocode integration in HACS
As long as you don’t call the api every second it is free of charge.
Detta var snyggt. Du har inte lust att dela hur du fick till det såhär?
Tack 
Om det är själva Volvo kortet du tänker på så är det ett picture element card på liknande sätt som Supersonical i sitt exempel här ovan. Jag kan dela min kod när jag får lite tid vid datorn kommande dagarna. Jag har gjort om en del i layouten av kortet men principen är den samma.
Hallå
Om du har lust att dela koden vore det uppskattat!
Here’s my code for the Volvo Card as requested @Helitrox
card:
type: picture-elements
image: /local/img/v60_v5.png
elements:
- type: state-label
entity: sensor.car_range
prefix: 'Räckvidd: '
style:
top: 5%
right: 50px
transform: none
- type: state-label
entity: sensor.car_fuel_level
prefix: (
suffix: )
style:
top: 5%
right: 5px
transform: none
- type: state-label
entity: sensor.car_trip_meter_2
prefix: 'Senast tur: '
style:
top: 28%
right: 5px
transform: none
- type: state-label
entity: sensor.car_odometer
prefix: 'Tot. kört: '
style:
top: 48%
right: 5px
transform: none
- type: state-label
entity: sensor.volvo_v60
style:
top: 70%
right: 5px
transform: none
- type: state-icon
entity: lock.car_door_lock
style:
top: 82%
left: 8%
- type: state-icon
entity: switch.car_heater
style:
top: 82%
left: 16%
- type: state-icon
entity: binary_sensor.car_engine
style:
top: 82%
left: 24%
1 Like
Ah men toppen. Fint det. Stort tack!
Do you use this?
Yes I do, it works most of the time…
I have a blackout…
How do I install volvooncall integration? I can’t add a custom repositories from GitHub for some reason.
I have added to configuration.yaml
volvooncall:
username:
password:
resources:
- lock
but I haven’t installed anything so…
Can I manually add .py-files to make it work? And if so, in what folder?
Tjena igen
Har nu fått lite tid att sitta och leka lite med detta. Får rätt på allt, förutom att bilden jag valt på bilen tar lite väl stor plats, lite som att den skalas ut för att fylla hela kortet. Detta gör att texten inte syns. Vad är det för format, alltså gällande storlek, på bilden du använder? Känns som att HA skalar upp bilden, oavsett om jag gör den mindre i PS tex?
Hej! Ja kommer tyvärr inte ihåg om jag hade samma problem men jag ser att jag skapade flera versioner av bilden innan jag blev nöjd… Här är iaf de två bilderna jag har använt (690x283) och (424x142).
Din bild är kanske för kvadratisk? Du kan ju alltid testa med mina och se om du får ett annat resultat. Posta annars gärna en print screen så är det lite lättare att förstå problemet.
Volvo on call is an official integration. Those entries you mention in the yaml file and a restart of HA should be enough. What does your log say? If you do not see any Volvo on call errors there should be a new lock entity. But I suggest you skip the resource line so you get all available sensors instead.
Tjena
Det funkade när jag provade med din bild. Jag får köra den som mall för formatet. Tack för det
For VW/Skoda
elements:
- type: state-icon
entity: binary_sensor.oct_com_sty_td110_2_0a7f_doors_locked
style:
top: 82%
left: 8%
- type: state-icon
entity: binary_sensor.oct_com_sty_td110_2_0a7f_trunk_locked
style:
top: 82%
left: 16%
- type: state-icon
entity: binary_sensor.oct_com_sty_td110_2_0a7f_hood_closed
style:
top: 82%
left: 24%
- entity: sensor.oct_com_sty_td110_2_0a7f_combined_range
prefix: 'Range: '
style:
background-color: rgb(54, 65, 78)
border-color: rgb(34, 154, 210)
border-left-style: solid
color: rgb(255, 255, 255)
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
left: 1%
opacity: 0.8
pointer-events: none
text-shadow: 1px 1px black
top: 10%
transform: translate(0%,-50%)
type: state-label
- entity: sensor.oct_com_sty_td110_2_0a7f_outside_temperature
style:
background-color: rgb(54, 65, 78)
border-color: rgb(34, 154, 210)
border-right-style: solid
color: rgb(255, 255, 255)
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
opacity: 0.8
pointer-events: none
right: 1%
text-shadow: 1px 1px black
top: 10%
transform: translate(0%,-50%)
type: state-label
- entity: sensor.oct_com_sty_td110_2_0a7f_fuel_level
prefix: 'Fuel: '
style:
background-color: rgb(54, 65, 78)
border-color: rgb(34, 154, 210)
border-left-style: solid
color: rgb(255, 255, 255)
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
left: 1%
opacity: 0.8
pointer-events: none
text-shadow: 1px 1px black
top: 30%
transform: translate(0%,-50%)
type: state-label
- entity: sensor.oct_com_sty_td110_2_0a7f_odometer
prefix: 'km: '
style:
background-color: rgb(54, 65, 78)
border-color: rgb(34, 154, 210)
border-left-style: solid
color: rgb(255, 255, 255)
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
left: 1%
opacity: 0.8
pointer-events: none
text-shadow: 1px 1px black
top: 50%
transform: translate(0%,-50%)
type: state-label
- entity: device_tracker.oct_com_sty_td110_2_0a7f_position
prefix: 'Pos: '
style:
background-color: rgb(54, 65, 78)
border-color: rgb(34, 154, 210)
border-left-style: solid
color: rgb(255, 255, 255)
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
left: 1%
opacity: 0.8
pointer-events: none
text-shadow: 1px 1px black
top: 69%
transform: translate(0%,-50%)
type: state-label
- entity: binary_sensor.oct_com_sty_td110_2_0a7f_doors_locked
prefix: 'Doors: '
style:
background-color: rgb(54, 65, 78)
border-color: rgb(34, 154, 210)
border-right-style: solid
color: rgb(255, 255, 255)
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
opacity: 0.8
pointer-events: none
right: 1%
text-shadow: 1px 1px black
top: 30%
transform: translate(0%,-50%)
type: state-label
- entity: binary_sensor.oct_com_sty_td110_2_0a7f_trunk_locked
prefix: 'Trunk: '
style:
background-color: rgb(54, 65, 78)
border-color: rgb(34, 154, 210)
border-right-style: solid
color: rgb(255, 255, 255)
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
opacity: 0.8
pointer-events: none
right: 1%
text-shadow: 1px 1px black
top: 50%
transform: translate(0%,-50%)
type: state-label
- entity: binary_sensor.oct_com_sty_td110_2_0a7f_windows_closed
prefix: 'Windows: '
style:
background-color: rgb(54, 65, 78)
border-color: rgb(34, 154, 210)
border-right-style: solid
color: rgb(255, 255, 255)
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
opacity: 0.8
pointer-events: none
right: 1%
text-shadow: 1px 1px black
top: 69%
transform: translate(0%,-50%)
type: state-label
image: /local/images/skoda.png
type: picture-elements
[/wrap]
2 Likes
do the heater work with you,?
no entity for toggle is what i see
thanks!