WordPress / wp20.wordpress.net

Celebrating 20 years of WordPress
6 stars 1 forks source link

Scroll to map to inform user of filtering #50

Closed iandunn closed 1 year ago

iandunn commented 1 year ago

Fixes #42

The filter form appears above the map, and the map may take up the whole viewport. If that happens, the user may not notice the list is filtering as they type, and may be confused. This scrolls down to the map when they type or submit, to make it more obvious.

The viewport is also scrolled if they submit the form. That's an edge case, but it doesn't hurt to cover it.

The horizontal scrolling wasn't introduced in this PR, it appears in trunk. I opened #51 to track it.

scroll

StevenDufresne commented 1 year ago

This is a good start. I am getting some jumping as I type which suggests we need some debouncing.

Based on my interpretation of the designs, I think the search should be filtering events on the map. I can't seem to find that functionality included elsewhere in a ticket or PR. Should map events be filtered on search, would we need to scroll the viewport?

marko-srb commented 1 year ago
Screen Shot 2023-04-07 at 13 14 58

@iandunn Great. Several points:

  1. Can we make space for the 'No events...' smaller in height? And can we center it? (see above screenshot for reference)
  2. Regarding Steve's point about filtering events on the map. We didn't have this on wp15, but if possible it would be neat to have that functionality now. Let us know if that's possible.

Thanks!

iandunn commented 1 year ago
  1. No problem! I centered the no results message in f3057da350ee72a28e12cb9251608239a3b134a4 (for #40), but haven't adjusted the height yet. That's visible on the staging site now.

    Right now the spacing between the map and the list is 40px, and that's also the amount between the map and no results. Do you want those to be different from each other? If so, can you give me px values, or add it to the Figma? It's hard to get precise values from screenshots.

  2. I'll look into it 👍🏻
iandunn commented 1 year ago

Filtering the map markers looks doable, but it's not trivial, so I opened #54 to keep the scope here limited.

iandunn commented 1 year ago

I modified the approach used to scroll, and I think that fixed the jumping that @StevenDufresne mentioned.

adamwoodnz commented 1 year ago

Still getting the jumping unfortunately:

what's on scroll

I think this is related to the comments on the debouncing above.