Weird, the file was created in Inkscape so it should behave the same for you.
What are you trying to edit, and how?
I am trying to edit the walls and the furniture to resemble mine on inkscape. I cant edit the individual objects of the svg file rather the whole floor plan as a square.
Ohhh ok, that’s not going to work then. The floor plan was generated with https://floorplanner.com/, and I just imported the bitmap image into Inkscape and created the active elements like the light rectangles.
If you create an account on floorplanner.com, PM me your details/sign-up email and I can try to send you a copy through the site.
Note that high resolution 3d exports are only available if you pay for a Plus account (forget how much I paid).
Ok. Thanks for sharing!
Here is my floorplan, on the remote I’d like the buttons to flash when I click on them, is there an easy way to do this? I tried using the code below which works on the first press but the next press doesn’t blink.
states:
- state: 'on'
class: 'blinking'
- state: 'off'
class: 'blinking'
action:
service: toggle
It seems to work today, although if anyone has a better way of making an icon flash please let me know.
Been working on a themed floorplan based off of some great UI design work I’ve seen previously.
long press popup where the hass floorplan group is toggled on
7 Likes
@tknp Hi! I love the flooplan! I’m working on my own floorplan and was just wondering if you could share how you used long presses to trigger things?
@pplucky We moved to a new house, I will have to see if I still have that old config laying around somewhere
@Jyckle thanks for the kind words. I posted about how I got long presses working in a separate thread at Does floorplan have the ability to detect a long press?. With that addition, you should be able to toggle layers represented by group objects in your svg floorplan.
My floorplan.yaml then has entries like this:
elements:
- group.room_office
action:
domain: class
service: toggle
data:
elements:
- popup.room_office
classes:
- office-on
- office-off
default_class: office-off
and my css file has the on and off state as just toggling the display element
.office-off {
display: none;
}
.office-on {
display: inline !important;
}
1 Like
@tknp Thanks so much for the quick response! One more question for you- so with your setup, is there a way to distinguish between a short and a long press? Like would it be possible to have a short press toggle the lights and a long press pull up that menu?
@Jyckle yup, that’s exactly the behavior I was after and that’s what you should get with what I posted in that other thread. I have short taps to the room toggling entire groups (all lights in the room) on and off like normal and have a contextual popup show up for long presses that supports toggling the individual elements of the groups (single lights).
1 Like
@tknp That’s brilliant! I think this is my last question, and thanks again for the help. So in your floorplan.yaml file, what distinguishes the action that runs on the short press from the action that runs on the long press? For example, if I have
- name: Long Press Room elements: - group.my_room action: domain: class service: toggle data: elements: - popup.my_room classes: - layer-visible - layer-hidden default_class: layer-hidden
And then I also have
- name: Rooms entities: - group.my_room states: - state: 'on' class: 'room-on' - state: 'off' class: 'room-off' action: domain: homeassistant service: toggle
Then how do I get the long press action to only respond to long clicks? Currently they both just toggle when I press the element. Thanks so much for your help!
This is my setup, still work in progress
7 Likes
Ya, that sounds right that they both should toggle but the long press should toggle just the visibility of the popup you have and not the elements while the second block you have should toggle the state of the group.
I went back and diffed my ha-floorplan.html from the official file and the only customizations I have are the extra script import for longclick-1.0.js and commented out https://github.com/pkozul/ha-floorplan/blob/master/www/custom_ui/floorplan/ha-floorplan.html#L232 with
$(svgElement).mayTriggerLongClicks().on('longClick', this.instance.onElementClick.bind({ instance: this.instance, elementId: elementId }));
Maybe you need to comment out the following line?
$(svgElement).on('click', this.instance.onElementClick.bind({ instance: this.instance, elementId: elementId }));