One thing I am confused about at the moment is how you say you “see my original screen”. I don’t know how that is appearing if it is not in your ui-lovelace.yaml particularly when you show a screen capture further down where you have selected OVERVIEW and you have that error message? What do you select to see that “original screen”?
Also can you confirm you have floorplan-card.js in config/www/floorplan
After changing the code in your previous post, I ended up with no change when I click restart. My original screen in Overview no change. This one.
With the CSS, this error shows which is where I’m at now.
I told you it’s doing my head in. What am I doing wrong?
Hang on I think I might have just seen it. In your ui-lovelace.yaml you have single quotes around light-off and light-on. Remove those and see what happens.
Look at my example here if not sure: Floorplan now available as a Lovelace card
I can see you have too many spaces there. The c of class should be under the e but not sure if that will cause a problem. If that doesn’t fix it then download simple.css again and try this
- entities:
- switch.kitchen_2_lights
- switch.kitchen_3_lights
name: Lights
states:
- class: background-off
state: 'off'
- class: background-on
state: 'on'
Also make sure you are doing a SHIFT-F5 to reload which will clear out the browser cache (edit: on chrome. not sure of others)
You champion, Some progress.
It loads just cannot toggle it yet.
Have to continue tomorrow. Work is calling. Thank you so, so much. It is gratefully appreciated.
Good luck with it. Toggling should just be a matter of adding the below. See my example above. From here just just baby steps with changing the CSS to see what that does and add more entities to your plan.
action:
service: switch.toggle
Hello everyone, this topic is very interesting, I once made this project with this result, if you are interested here is a tutorial.
I leave the link. https://www.domoticaeconomica.com/floor-plan-y-ui-lovelace-home-assistant/
1 Like
Good evening I have floorplan in panel mode and it works very well I would like to put it in card mode using the same image file but it doesn’t work can you help me?
Do you have panel: true anywhere in your ui-lovelace.yaml? If so trying removing it.
- badges: []
cards:
- config:
image: /local/custom_ui/floorplan/disegno.svg?v=1.1.14
log_level: error
more_info: true
panel: true
rules:
- action:
service: homeassistant.toggle
element: switch.bagno
entity: switch.bagno
image_template: /local/custom_ui/floorplan/bagnon_$(entity.state).svg
state: image
stylesheet: /local/custom_ui/floorplan/floorplan.css?v=1.1.14
type: ‘custom:floorplan-card’
icon: ‘mdi:floor-plan’
id: system
pan_zoom: null
panel: true
path: floorplan
title: floorplan
I have tried all the ways but from the side panel it always works
I see panel: true in two places. Have you tried removing BOTH of those?
with the version of HA 0.115 to you still works?
Just broke for me with 0.115
What happened? Have you fixed it? I have no problems…
2020-09-19 18:50:11 ERROR (MainThread) [homeassistant.components.frontend] Please remove extra_html_url from your frontend config. It is no longer supported
2020-09-19 18:50:11 ERROR (MainThread) [homeassistant.components.frontend] Please remove javascript_version from your frontend con fig. It is no longer supported
2020-09-19 18:50:11 ERROR (MainThread) [homeassistant.components.panel_custom] Unable to register panel Floorplan: Either js_url, module_url or html_url is required.