Lovelace floorplan and some complaints

Hi guys,

I just wanted to share my simple lovelace interface. I wanted to make it work easily on mobile too, so I finally got around to make a proper floor plan and add my lights and thermostats and camera to it:

There are some motion sensors that will light up a “jumping man” in the kitchen and inside bathroom, too.

I was highly expectant of Lovelace, but it’s been a bit of a pain. Firstly, the editor always jumps to the top (using Firefox), so it’s really hard to actually edit items further down the list. And actually, I was expecting a bit more help from the lovelace UI. Right now the card picker is the only actual useful thing, anything from there you need to edit in YAML and for this you constantly need the documentation, even though Lovelace should know what kind of card are possible in a picture-elements card, for example.

Then there are some reeally basic (IMHO) things missing, like a template item that can be used in the picture-elements card. Even though my thermostats report the temperature, I had to make template sensors to display a single temperature per room. I thought that was exactly what lovelace wanted to avoid: adding items to the config only to have them displayed in the frontend.

And a simple confirmation dialog would also be needed. Here, when I tap on the radiators, I want them to heat up, but a confirmation would be nice (especially on smaller screens). I know I can change the tap_action to more_info, but it’s not really the same.

And just dialogs in general: I would like a weather forecast card to appear when I tap on the weather symbol, but instead I had to make an extra view with it and navigate to it. Works, but is not ideal.

Anyway, these are my thoughts and maybe I’ll contribute one or two items that I complained about :slight_smile:

Stefan

Great thing about Lovelace is you can make whatever you want. You want a template item in the frontend, make it. You want a custom popup card, make it (already exists). It’s a highly customizable framework, but a handful of part-time volunteer developers can only make it evolve so quickly :wink:

great work! how do you fix your icon scale is same as where you see it on pc chrome or phone app?
mine state-icon or state-badge/state-label size tend to be different on phone, but its normal on pc google chrome

Well it’s definitely not possible to achieve pixel-perfect matching, so you’ll have to play around a bit. Here are two screenshots from phone and PC at around the same time (I added a second cam and the internet throughput by now):

Phone:

PC:

So definitely different, but ok for me, given the constraints of each device. Notice how I shifted the bottom-most temperature reading further to the right to have the actual numbers be legible on each device.

can you share the code plz