52 tsk10403 display building info

[DallaliRim]

Summary

Created a Building Info Popup that displays the relevant building information (Building name, building code, address, website link, opening hours, and accessibility. Added interactive building markers to the map with clustering support to reduce clutter and improve usability at different zoom levels. Each building is now represented by a clickable marker displaying its building code, with visual feedback for selection. When zoomed out, nearby buildings are grouped into cluster markers that display the number of buildings contained, reducing visual clutter. Additionally, updated the app color scheme and header logo to better align with the UI design and improve visual consistency across light and dark modes.

Related Issues

Closes:

• TSK1.02.02 – Apply styles to campus buildings on the map #46
• TSK1.04.02 – Design the building info pop-up #51
• TSK1.04.03 – Display building info pop-up (Building name, campus, opening hours, contact info, etc.) #52

Changes Made

• Created a Building Info Card layout
• Added clickable building markers displaying building codes
• Implemented marker clustering with custom cluster markers showing building counts (e.g. 9+)
• Highlighted the selected building marker via color inversion
• Synced marker and polygon selection to open the Building Info Card
• Improved map usability by reducing marker clutter at low zoom levels
• Updated app color scheme for improved visual consistency
• Added theme-aware header logo to match light and dark modes

Testing

• Manual testing performed (verified marker & polygon selection, clustering behavior, zoom interactions, and Building Info Card display)
• Unit tests added or updated (if applicable)
• All tests pass locally / in CI

Checklist (Author & Reviewer)

• Code follows project conventions
• The change was run locally and works as expected
• Acceptance criteria met
• No breaking changes

[CanadianMaple-Syrup]

Overall pretty good, but there are a few minor changes that need to be made.

The CL building has an incorrect marker placement.

The GS building either has an incorrect marker or an incorrect polygon (both buildings have the same address on google maps)

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!

[sonarqubecloud]

Quality Gate failed

Failed conditions
1 Security Hotspot
0.0% Coverage on New Code (required ≥ 80%)

See analysis details on SonarQube Cloud

[DallaliRim]

Finally looks good guys! Thanks for the help 🥹

[CanadianMaple-Syrup]

All changes that I requested have been made. Will need other people's approval first since I also coded in this branch

[YehJordan]

Everything here looks good now :) Other than the cluster bug for IOS (To solve later), everything from the logo to the clickable building info pop ups work very well (For IOS). Good work 👍

[CanadianMaple-Syrup]

Quality Gate failed

Failed conditions 1 Security Hotspot 0.0% Coverage on New Code (required ≥ 80%)

See analysis details on SonarQube Cloud

The failed security hotspot isn't an issue since it is parsing static data

[JenLys]

Implementation looks good
All stylistic elements have been followed: correct colour codes, proper logo sizing, good overlays, and information pop-ups work and concord with the UI mockups.
CL building marker has been fixed 👍

Re-tested on Android and although the clusters work well it seems that there is a slight little glitch once I zoom-- something I haven't noticed during my earlier tests (see screen recording below). This is minor and can be negligeable: however long-term this might be frustrating for sensory sensitive users. This cluster issue might be perhaps related to what is happening on IOS? *to see during a later sprint

Great work! :)

Screen recording of the tiny info pop-up glitch: https://drive.google.com/file/d/1tMDxK5CcZqnfs1rL3EcEAKeTnko9ehyG/view?usp=drivesdk