Floorplan for Home Assistant

Can anyone let me know how to make state condition of one entity based on another entity

Ie. change class if another sensor is on (such as movement detection will go red if alarm entity is on and green if not.

Got the Fire Tablet. Had to rework a lot of the floorplan since monitor to 7 inch tablet is much different. Here’s my work in progress.

Next update will be in the form of a blog post. :slight_smile:

2 Likes

Got the same tablet. Will have to try that as well. Good work!

BTW, are you using HTTPS? Also, have you tried using the floorplan on your tablet while outside your home network?

Hi @pkozul, I am using SSL. No issues… works perfect. I haven’t tried the tablet outside the network but I’ve hit Floorplan on my IOS and other devices outside the network without issues.

My new issue I am running into is with the Kitchen and Living room groups. groups doesn’t seem to toggle the lights on and off… Have you done any groups yet?

BTW: For the fire tablet - download wallpanel to run floorplan.

OK, HA groups are now supported, so if you already have your entities defined as groups within HA, then you can simply include those groups in your floorplan config rather than include a potentially huge list of individual entities.

  - name: Light Groups
    entities:
      - group.office_lights
      - group.hallway_lights
      - group.kitchen_lights
      - group.outdoor_pool_lights
      - group.outdoor_front_lights

    states:
      - state: 'on'
        class: 'room-on'
      - state: 'off'
        class: 'room-off'

Also, the floorplan is a bit smarter now in that it will log error messages if any specified groups do not exist within HA. It also logs errors if the SVG file doesn’t contain any of the elements it is supposed to. Error handling of other scenarios will be added where appropriate, which will make it easier to find any typos or other issues that may not be obvious.

Latest version is now ready on GitHub.

3 Likes

A bit of experimental functionality added. If you want your floorplan to support panning and zooming, simply add pan_zoom: to your floorplan config:

      name: Floorplan
      image: /local/custom_ui/floorplan/floorplan.svg
      stylesheet: /local/custom_ui/floorplan/floorplan.css
      pan_zoom:

You also need to grab the file www/custom_ui/floorplan/svg-pan-zoom.min.js and include it in the floorplan HTML file:

www/custom_ui/floorplan/ha-floorplan.html

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://momentjs.com/downloads/moment.js"></script>
<script src="svg-pan-zoom.min.js"></script>

The GitHub repo has been updated to reflect all of this.

If you try this for yourself, let me know how it goes.

3 Likes

Great… I can confirm that HA and floorplan are working fine on my Amazon Fire tablet. I am running HA with HTTPS, and am able to access it all from a remote location without issue. All good!

1 Like

This looks amazing. As a feature suggestion for the future (also mention on HAD thread), it would be amazing if this were integrated into HADashboard too.

You can use iframe widget, works like charm.

1 Like

Perfect, I’ll give it a try.

OK, this might sound simple to people, but took me some time figuring out. Using the first method wasn’t working for me, basically because I already have a lot of views. I ended up fixing my 2 floorplans by using:

# groups.yaml
floorplan:
  name: Floorplan
  view: true
  entities:
  - group.floorplans
floorplans:
  name: Floorplans
  view: false
  entities:
  - sensor.last_motion
  - binary_sensor.groundfloor
  - binary_sensor.firstfloor

Not doing so and only the part ‘floorplans’ with the view on true gets me two sensors and svg’s inside the modal popping up. Glad I fixed it know (and yes I am using both methods). Nice work @pkozul, I really like this addition to my setup.
Will need to play with the group thing though :slight_smile:

4 Likes

It would be great if we can add the logging as a debug option.

Sometimes I like to add more entities into the yaml file since it requires a reboot before actually adding them into the svg file. It would be great to have the missing svg entries be optional.

Maybe a
Warnings: entry in the yaml?

1 Like

Yep, warnings: is now an option in the config. GitHub repo updated to cater for this.

2 Likes

In my configuration.yaml I have the following -

binary_sensor:

  • platform: mqtt
    state_topic: “home-assistant/window/contact”

How would I go about visualising this sensor in floorplan?

Hi,
I am trying to implement Floor-plan but its not loading as you can see in below picture.

Can you please help me whats wrong with it?

When I have seen this in the past, it was due to an open tag or something in the SVG. Best bet is to start rolling back changes to a known good config. and then build from there.

I keep getting this error:

Failed to load resource: the server responded with a status of 404 floorplan.css?cacheBuster=1498749059177

Is it possible to make grouping optional as well? I was using groups in configuration before as following (the only problem is that toggle service wasn’t working)

- name: DefService 
    entities: 
      - group.vlad_restroom_lights
      - group.living_room_fan_lamp
    states:   
      - state: 'on'
        class: 'light-on'
      - state: 'off'
        class: 'light-off'

But with recent update I need to represent each object from group separately, which I don’t want to do :slight_smile: I don have them on SVG file grouped together just for visual representation, but I don’t want to control them separately.

Something like

unwrap: false 

would be great.

I did not change in original files, just follow mentioned steps.
I tried from begin but no luck.

I think there’s an error in last commit. In ha-floorplan.html change line 636 to be

if ((this.config.warnings === null) || (this.config.warnings !== undefined)) {