search

ratgdo / esphome-ratgdo

ratgdo for ESPHome
GNU General Public License v2.0
308 stars 75 forks source link

[FEATURE REQUEST] Tool Tips on Web UI buttons #220

Closed edrikk closed 1 month ago

edrikk commented 3 months ago

Updating as although this item started as a feature request, the majority of the items are implementation limited due to the limited functionality the web server provides.

Renamed the ticket to focus on the one item that appears to be a bug/not working:

https://github.com/ratgdo/esphome-ratgdo/issues/220#issuecomment-1931695645

Original text of this ticket is left below for context of first few replies.

Hi, I just wanted to document this feature request in support of the Web UI's usability. It's a collection of thoughts after my initial install of this firmware:

Cheers,

PaulWieland commented 3 months ago

Its covered in the docs...

edrikk commented 3 months ago

Cool - yeah for sure. Suggesting that putting some of that in the UI (self contained firmware in a way) might help new users -- and not having to go to the docs...

PS. Unless I'm missing it, I don't think the docs say what the up arrow for "lock remotes" does either :)

PaulWieland commented 3 months ago

I don't think the feature you are asking for is supported by ESP Home.

rlowens commented 3 months ago
  • Adding a hover over tool tip on each of the buttons with a quick word on what it does would be extremely helpful.

Not possible in ESPHome currently. The web server UI isn't really configurable like that. Feel free to suggest or code that in https://github.com/esphome/feature-requests/issues My search over the last hour hasn't found that as a previous suggestion.

There is the ability to use custom css and js, but I don't think that helps us put descriptions on specific items in the table.

I suppose we could hack in description entries by creating them as template binary sensors, marking them internal so they don't get shown to Home Assistant, and enable showing internal items on the web server UI. But it seems pretty hacky. You can't specify the order of items in the web server UI (yet), so they would have to be alphabetically ordered, like "Lock remotes: when locked, this disables any wireless remotes."

e.g. "Lock Remotes" should probably just be "Lock/Unlock garage door" - that's the result from a User's point of view.

It DOES NOT lock the garage door - it can still be operated via other methods (the wired wall panel, the web server UI, Home Assistant and anything connected via that, the ratgdo's dry contact inputs, maybe another method I'm missing).

PS. Unless I'm missing it, I don't think the docs say what the up arrow for "lock remotes" does either :)

Good point. Anyone know why this up arrow appears here? image Clicking it results in this log entry: image ('Lock remotes' Does not support Open.)

Probably an error in the code for the ratgdo lock?

edrikk commented 3 months ago

Thanks - agree with all the statements. Hacking things just to get that in doesn't help much for sure. Maybe just a link on the page to the docs might be sufficient?

PaulWieland commented 3 months ago

The link is on the ESP Web Tools installation / flasher page.

edrikk commented 3 months ago

Yes - I mean within the local device's Web UI - unless the esphome framework is quite limited in what it allows/how it draws the page so can't be put in a 'proper' place on the page.

Just trying to think like someone who is not as intimately aware (who is likely the one that would like the link actually) - even if they saw it as part of web tools install, they probably won't remember that they did 2 months later.

As another workflow, I flashed the bin directly from mqtt firmware. After that I adopted and have been flashing using esphome. I had no idea that the link was there. I actually never used the old or new web flasher for esphome version...

rlowens commented 3 months ago

I mean within the local device's Web UI - unless the esphome framework is quite limited in what it allows/how it draws the page so can't be put in a 'proper' place on the page.

It is not possible to add a link to the documentation with ESPHome's current web server component. As least not in any way I can think of. Unless that's something that can be done with a custom js or css file (I'm no web programming expert).

edrikk commented 3 months ago

Ok thanks. Unfortunate how limited the component seems to be. Understood though. Do you guys prefer if I close this request or just leave it open just in case/for the future?

rlowens commented 3 months ago

Maybe just rename it to be about the broken "up arrow" button on the Remote Lock?

rlowens commented 3 months ago

Well, I have found a way to add more information to the ESPHome web server UI, using a custom web server. Here's what the KAUF PLF10 plug https://github.com/KaufHA/PLF10 looks like: image ... image

This is accomplished with compiling with KAUF's custom web server included in https://github.com/KaufHA/common

The custom text is at https://github.com/KaufHA/common/blob/8daf46725d69334b4314f86b7e298b52d6c7e832/esphome-webserver/v2/esp-app.ts#L189

So, we could fork esphome/web_server ourselves and modify that file to put our own link and descriptive text at the top of the web server UI.

edrikk commented 3 months ago

Will leave it to you guys to decide if the effort is worthwhile vs upstream maintainability. If not worthwhile, absolutely makes sense.

The homekit fork has altered web server for sure... Displaying QR codes etc for homekit onboarding as example: https://github.com/ratgdo/homekit-ratgdo/commit/73860afce0dbbd3b466bce6a4b4e596c6d9a7780

marcone commented 2 months ago

Its covered in the docs...

The docs don't seem to mention that nonfunctional up-arrow:

image

Am I missing something?

PaulWieland commented 1 month ago

yes, you were mislead by the change in the issue title. The original title was [FEATURE REQUEST] Tool Tips on Web UI buttons