geodesymiami / insarmaps

3 stars 0 forks source link

For date selection show 'Select start date' and 'Select end date' #38

Closed falkamelung closed 3 years ago

falkamelung commented 3 years ago

It is not clear for the user that the startDate and endDate can be selected by clicking on dates in the displacement window. Can we show that the system expects the startDate and endDate?

image
stackTom commented 3 years ago

done

falkamelung commented 3 years ago

Great! One improvement: after you have hit 'select start Date' you don't know that it was selected as it takes a while until the "recoloring in progress" window pops up. Actually, it looks like it froze. Assuming that it is difficult to make this window to pop up instantaneously, can we do something to show that the selection has worked? Possibilities include (1) the Select start date string switches to 'start date selected' , (2) the little 'Select start date` window disapears to pop up again when it is ready for the next input, (3) one-tenth-of-a-second magnification of the little window to confirm that something has happened

Same for 'Select end date'.

https://user-images.githubusercontent.com/11162588/103575138-36bc2a80-4e9f-11eb-8630-16e316b3ce07.mov

stackTom commented 3 years ago

Yes, I have noticed the same thing. I have moved the line of code which brings up "recoloring in progress message" right after the clicking, but it still still freezes/takes a while. It is strange. The next line of code after the recoloring message is a mapbox function which returns me all rendered features (it is a very slow function and the cause of the freeze). If I take out this call to this mapbox function, the recoloring in progress message comes up immediately, as it should, as it is the next instruction. If I leave this call to the mapbox render function, the recoloring in progress message doesn't come up until AFTER the mapbox render function is finished or close to finishing. It is as if the browser is first calling the mapbox function before showing the recoloring in progress message.

To be honest, I am not entirely clear why it is doing this. Javascript is not like a typical programming language where every instruction is just read from top to bottom. This is mostly true, but there is also something called the Javascript Event loop, which is how all javascript programs run in a web browser. I suspect browsers are doing some weird trick and don't always process the call to rendering the "recoloring in progress" message before the mapbox render function, and I am not sure if this can be changed. I will do some searching/experimenting to see what I find.

stackTom commented 3 years ago

Okay, after some research I figured it out. The loading screen should come up now properly and not simply look like it froze. I actually learned a lot about how the browser renders things. Good, quick read if you know any javascript: https://macarthur.me/posts/when-dom-updates-appear-to-be-asynchronous

stackTom commented 3 years ago

If you see other places where similar freezes occur instead of a loading screen, please let me know. Our site has so many features now, that it is difficult for me to find all the cases. I know seismicity brings up loading screens, but I just tried it with many points, and it never froze. So just open a new issue if you notice other freezes and I will fix them easily.