Floorplan for Home Assistant

Third party integrations Floorplan
325

You can use iframe widget, works like charm.

1 Like
326

Perfect, I’ll give it a try.

327

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
328

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
329

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

2 Likes
330

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?

331

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?

1366×768 67.9 KB

332

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.

333

I keep getting this error:

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

334

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.

335

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

336

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)) {
337

Now fixed in the GitHub repo. Thanks for letting me know!

338

@vkorn, I think the latest version supports groups again. You should be able to toggle them on/off.

Hmm … after testing though, I see the toggle get sent to HA but HA is not shutting down the groups. :frowning:

A work around is to build an input_boolean and use that a a trigger to shut down a group of lights.

339

Hi, I have changed line 636 but same problem?

I have Home Assistant ver 0.41.0

340

Okay, I figure out, problem is chrome. It not loading in chrome browser, work well in fire fox.

Thanks,

341

@vkorn, thanks

problem solved. after change the line, I just removed browser cache. its working on all browsers.

342

@mudasar8k, glat it helped, I think pkozul already pushed changes to the repo.

P.S, finally I’m close enough to saying that I’m satisfied with my current setup :slight_smile:
Managed to tweak styles depending on device, so on wall-tablet black background and no menu/header.
Thank you for this project!

img
img1410×1069 400 KB

4 Likes
343

@vkorn How did you get rid of the top menu bar?

344

In panels/floorplan.html you’ll need to do following:

Add new style


      [hidden] {
        display: none !important;
      }

Add new property

showHeader: {
        type: Boolean, 
        value: true, 
      },

New attribute to the toolbar element

<app-toolbar hidden$='{{!showHeader}}'>

And do whatever you want inside attached method. In my case I have extended original config and checking who is using UI (looking up IP address of caller) so only on my wall-mounted dashboard I’m changing appearance:

attached() {
      var self = this;
      var cfg = this.panel.config;
      $.getJSON(cfg.ip_service, function (data) {
          if (cfg.fs_sources.indexOf(data.ip) != -1 || 
            (data.name !== '' && cfg.fs_sources.indexOf(data.name))){
            document.body.style.backgroundColor = cfg.fs_color;
            self.showHeader = false;
          }
        });
    },
5 Likes