Dropdown for layer settings doesn't show on mouse click about frontend

[madpsy]

I too am seeing this issue with FF 69.0b8 on Mac. No errors in console, the dropdown simply doesn't appear.

[madpsy]

Perfect - tested and works a treat. Thanks!

[linusg]

The dropdown for the layer settings does not open if I click on it with the mouse, it only shows when I focus to it using the TAB key.

I can't reproduce this - Firefox 65 on Linux Mint.

It uses :focus-within, you might research if there are issues on macOS with that.

.dropdown:focus-within .dropdown-body {
  display: block;
}

BTW, are you sure you don't want to contributute this to the owntracks project ;-)?

I'll consider this at a later point, right now I think it's best for me to develop this independently and not as an owntracks recorder issue/PR.

I'm about 60% done with rebuilding the whole thing with yarn, webpack, Babel etc which will improve maintainability drastically - the owntracks-maintainers would have to agree on using this more modern approach as opposed to their current static files only.

I love the new UI

Thanks! 😄

and I'd hate to copy your UI files to my installation everytime the recorder gets an update.

That's not how you're supposed to deploy it! Just copy the directory somewhere outside the owntracks root directory and configure your server, nginx in my case, to serve the UI at whatever URL you'd like.

[wollew]

It uses :focus-within, you might research if there are issues on macOS with that.

I found someone else with the same problem, no solution though: https://stackoverflow.com/questions/53414462/focus-within-only-works-when-focusing-button-with-keyboard-not-with-click-in-f

That's not how you're supposed to deploy it! Just copy the directory somewhere outside the owntracks root directory and configure your server, nginx in my case, to serve the UI at whatever URL you'd like.

Yes, I could do that, but as ot-recorder already has a HTTP-server running, I would've preferred using that one. Where/how would I configure the recorder-API endpoint if it's running on it's own server?

[linusg]

Regarding the :focus-within issue, you might search Bugzilla as well and file a bug. Again, it works for me ™️.

Yes, I could do that, but as ot-recorder already has a HTTP-server running, I would've preferred using that one

Using a reverse proxy is pretty common though.

Where/how would I configure the recorder-API endpoint if it's running on it's own server?

Right now the API endpoint is expected to be available at the same host as the UI:

https://github.com/linusg/owntracks-ui/blob/d34076e11ff0ec615c107f01fb1e7e89c46d887d/static/main.js#L116

https://github.com/linusg/owntracks-ui/blob/d34076e11ff0ec615c107f01fb1e7e89c46d887d/static/main.js#L143

https://github.com/linusg/owntracks-ui/blob/d34076e11ff0ec615c107f01fb1e7e89c46d887d/static/main.js#L149

etc.

So if you host the UI at owntracks.example.com, the API endpoint is expected to be owntracks.example.com/api/... and owntracks.example.com/ws/....

If it was example.com/owntracks, it would be example.com/api/... and example.com/ws/...

This will be configurable during build time using an .env file.

[ckrey]

It happens in Safari on Mac, ok when using Chrome on Mac.

[madpsy]

Indeed - Safari also doesn't work so I'm starting to think this isn't a specific FF bug, unless of course both happen to suffer from the same bug/'feature'.

[linusg]

This is fixed as of 9f522dd. Sorry it took so long!

The new dropdown implementation doesn't use :focus-within anymore.

I published a new release v2.0.0-beta.3 which contains this as well as other fixes and additions, please try it out (the image should build on Docker Hub shortly, you can of course build from source as well).

[wollew]

Yep, can confirm it's fixed for me, too. Thanks.