ericberman / MyFlightbookWeb

The website and service for MyFlightbook
48 stars 18 forks source link

When naming a search query, the mouse cursor has to hover over the small window to not lose focus (which prevents typing) #1054

Closed zartom closed 1 year ago

ericberman commented 1 year ago

Switched to a modal popup instead of a drop menu. Fix will go live next time I update the website...

zartom commented 1 year ago

Same thing happens in the flight details view

ericberman commented 1 year ago

Huh? Where is there an edit box in a pop-up in flight details?

zartom commented 1 year ago

Not an edit box, but a small window with options (such as edit) It's easier because there is no typing involved, but a bit strange that it closes when not hovering over it (especially in higher screen resolutions)

ericberman commented 1 year ago

Umm, you’re talking about the downward facing chevron? I use that for hover menus in a gajillion places. You hover, then click/tap on the item you want. It works the same everywhere. I’m not quite sure what you’d propose I do here? The search box did make some sense because of the inline text box, so there was a fo us issue. But otherwise

zartom commented 1 year ago

Well, I assumed it was a bug, not a feature, with the UI setting as I thought the wanted behavior was to have the window open even when the cursor exits its borders, but I understand now it is by design choice so not really a bug. I also didn't realize it was used in many places. As for my suggestion, now that everybody is accustomed to touch interfaces (smartphones, tablets) I think it is better to click outside the region of the popup window to close it, just like on an iPad. Especially since here, it doesn't even obscure other UI elements behind it when open. This also begs the question, why not put all the entries as a second permanent line of icons below the buttons instead of an overflow menu? But I digress

image So now when I want to edit a flight, I click on the chevron symbol and then have to move down and then left instead of directly moving it to the menu entry in order to keep it in focus...

ericberman commented 1 year ago

Tap/click away to dismiss works exactly as you describe on a touch screen.

I deliberately shifted this particular menu a bit to the left because it's on the right edge. E.g., I can remove the left shift and it's like this: image But if you're on a narrow screen it gets squished: image Shifting it left avoids that. I do the same thing for the same reason in the main logbook screen: image Whereas in other places where it's not on the right side, I don't shift it: image

Note that if you have a mouse, you can just hover over the chevron, you don't need to click. (If you're using a touch screen, you tap).

I don't put the items all visible on the 2nd row for two reasons: (a) tons of clutter - especially since over time more gets added to that (I'd want to include the text, so right there it would be at least two rows of text), and (b) the menu is identical to what's in the main logbook screen (one piece of code that I can re-use)