search

rerun-io / rerun

Visualize streams of multimodal data. Fast, easy to use, and simple to integrate. Built in Rust using egui.
https://rerun.io/
Apache License 2.0
6.22k stars 287 forks source link

"Save blueprint" UI and a bit confusing in web / dark mode #5884

Open ralfbiedert opened 5 months ago

ralfbiedert commented 5 months ago

Describe the annoyance

Minor nit: I just tried 0.15 in my browser (FF 124, dark UI) and was playing with blueprints. At first I tried to open a recording, and the UI looks like so:

open

So my mind is being conditioned like clearly the interactable UI elements are "dark buttons", and that works as expected. A little later I then tried to save a blueprint where the UI looks like this:

blueprint

My intuitive reaction was to click "Ok", and I was a bit surprised when the dialog just disappeared. At first I assumed it already downloaded the file without me noticing, but it turns out I had to literally click into the gray text.

The same issue is also present in the "Save recording ..." dialog.

Suggestion

I think the clearest and most efficient way (in terms of intent and click count) would be having 2 buttons, one that downloads and closes the modal, and the other one that just closes the modal (e.g., named "Download" or "Save", and "Cancel"). That would also be consistent with how the (native Windows) desktop dialog is labeled:

Screenshot_1

Desktop (please complete the following information):

emilk commented 5 months ago

Thanks for the issue!

This dialog is created by rfd. We should consider replacing it with our own Rerun-themed dialog, or make a PR to rfd to improve theirs (e.g. to make it CSS stylable).

However, there is a second problem I'd like to fix with this dialog: it requires too many clicks. The "click here to download your file" dialog should be unnecessary. I believe its only there because some browsers only allow you to download files as a response to a user action (a click), and rfd is made to work also if a background process spawns the file dialog. But, we should be able to fix that since we only spawn the dialog on clicks (or keyboard shortcuts), though this might require some small changes to eframe (to call update on each click, not just on requestAnimationFrame).

abey79 commented 5 months ago

Regarding CSS styling of rfd overlay, it seems that it uses fairly well defined ids:

image

However, it does emit corresponding inline CSS in a <style> tag. It would be nice to have an option for rfd to skip that, but I believe we could readily override this in our external CSS by using !important.