[PR] Search map feature

[solderq35]

Issue

#250

Work Done

Work Still Needed

QoL

• option to clear search results?
• x button?
• see about dropdown for results hiding
• on mobile, what if the tooltip is out of range?
  • even on desktop, recenter map maybe?
    • is there a way to detect manually if the building is out of range of window?
    • https://stackoverflow.com/questions/22948096/get-the-bounding-box-of-the-visible-leaflet-map maybe

Styling

• find better places to put search input field, results
• dropdown for results, hide when not typing (mimic standard search bar ui)
• dynamic search results height
• maximum amount of results (10 or 20?)
• overflow scroll in results?
• mobile styling in general

[solderq35]

Desktop

Mobile

Next Steps

• should height of the SideMenu respond to number of search results? right now looks too tall
• sidemenu too close to bottom of screen on mobile
• zooms in on text input on mobile, leading to zoom issues
  • look into bigger text input on mobile?
  • alternatively, have something to zoom back out on mobile?
  • re-center map around building (both mobile and desktop? would include zoom)
  • mobile has parts of map out of range as noted earlier

[solderq35]

idea - scrolling ticker ui on long building names

[solderq35]

Summary of Changes

Highlights chosen building in yellow on both desktop (hover) and mobile (click, technically hover.

Re-centers map around the building you clicked.

No longer automatically zooms in when typing input on mobile.

Desktop

Mobile