Thank you for your quick reply,I hope you’ll get back up and running soon. Looking forward to seeing your config !
@lukevink Based on what I’ve read you use floorplan also for mobile. How is your experience since then ?
How do you apply this gift to the floorplan in your video ? Can you explain?
@gabrymed right now just as a simple overlay (mix-blend-mode: lighten)
- action: none
entity: input_select.moment_of_day
hold_action:
action: none
state_image:
nacht: /local/ui/floorplan/tuin/tuinplan_night.jpg
middag: /local/ui/floorplan/tuin/tuinplan_day.jpg
...
- action: none
image: /local/ui/floorplan/weather/dust_overlay_perfectloop_comp.gif
style:
left: 50%
mix-blend-mode: lighten
top: 50%
width: 110%
tap_action:
action: none
type: image
i haven’t yet mapped it with the current amount of pollen, so i can’t give you an example on that… but I imagine adding something like this should work:
style:
opacity: '${ states[''INSERT POLLEN ENITITY''].attributes.OPTIONALLY INSERT DESIRED ATTRIBUTE/ 100}'
Thanks a lot, it works with your config example. Now i’ll try to adjust with opacity state filter.
I’ll ask you something in case…Thanks
Hello guys,
I’m new to hassio and I’m trying to implement the floorplan UI on my hassio copying only the necessary .js and .yaml files. I’m almost there but I have a problem when long-press a light bulb → Button-card template color_light is missing. I can’t find anywhere the color_light template. Can you please help me?
Thank you,
Sorin
Can someone explain to me why the local image files aren’t loading for me? I cleared the browser cache but it isn’t working
please post your code
from: Now Playing Media View
- title: Media
icon: 'mdi:play-circle'
panel: true
badges: []
cards:
- elements:
######################### SPEAKER CONTROL BAR #########################
# controls an IR blaster to control my 'not connected' surround sound speakers
- action: none
entity: switch.speakers
hold_action:
action: none
state_image:
'off': /local/ui/btns/speakers_PowerOff.png
'on': /local/ui/btns/speakers_PowerOn.png
style:
left: 31.7%
top: 86.3%
width: 12.578125%
tap_action:
action: toggle
type: image
- action: none
hold_action:
action: none
image: /local/ui/btns/speakers_volumeBG.png
style:
left: 81.5%
top: 86%
width: 25.820312499999996%
tap_action:
action: none
type: image
- action: none
entity: switch.speakers_up
hold_action:
action: none
state_image:
'off': /local/ui/btns/speakers_volumeUp.png
'on': /local/ui/btns/speakers_volumeUp.png
style:
left: 87.8%
top: 86%
width: 15%
tap_action:
action: toggle
type: image
- action: none
entity: switch.speakers_down
hold_action:
action: none
state_image:
'off': /local/ui/btns/speakers_volumeDown.png
'on': /local/ui/btns/speakers_volumeDown.png
style:
left: 75.3%
top: 86%
width: 15%
tap_action:
action: toggle
type: image
- action: none
entity: switch.projector_audio
hold_action:
action: none
state_image:
'off': /local/ui/btns/speakers_bluetooth.png
'on': /local/ui/btns/speakers_projector.png
style:
left: 51.5%
top: 86%
width: 27.890625%
tap_action:
action: toggle
type: image
Where are the pictures stored? looks like the card cannot find them, don’t forget it is case sensitive
also try this
type: picture-elements
image: /local/ui/btns/speakers_PowerOff.png
elements:
- action: none
entity: switch.speakers
hold_action:
action: none
state_image:
'off': /local/ui/btns/speakers_PowerOff.png
'on': /local/ui/btns/speakers_PowerOn.png
style:
left: 31.7%
top: 86.3%
width: 12.578125%
tap_action:
action: toggle
type: image
Rooky mistake. I didn’t set the entity to a valid switch
@lukevink
I’ve created the sunlight_pct and sunlight_opacity sensors.
but still the opacity for daylight does not work.
here is a small piece of my card configuration. I’ve tried with mix-blend mode under the element style, same result.
style: |
ha-card {
background: none;
width: 90%;
margin: 0 auto;
}
hui-image-element {
position: absolute;
mix-blend-mode: lighten;
pointer-events: none;
transform: translate(0,0) !important;
top: 0;
left: 0;
}
elements:
- type: conditional
conditions:
- entity: sun.sun
state: above_horizon
elements:
- type: image
image: /local/floorplan2/lights/floorplan-day.png
style:
opacity: ${states['sensor.sunlight_opacity'].state}
When I change the opacity to (for example)
style:
opacity: 0.26
the opacity works.
Any one got a suggestion?
thanks. I used Sketchup to build and Enscape to render . Enscape uses your GPU so it can be used realtime and way more fast to render the images than sweethome3d. Which also are more realistic
Downside is that it will cost a bit of time to master yet 2 more applications in a (what was for me) very time consuming project ';D
Is anyone willing to help me with my floorplan? I have some mockups but I’m having a hard time here. Please dm me or message me on discord: Schnitzel#6684
What exactly do you need help with? 3d modelling, coding, something else? You’ll have more chance of getting help if you narrow it down a bit.