From 0fb4a91396f545c21c8a2c5129ab62e3279f5bc5 Mon Sep 17 00:00:00 2001
From: binh-dam-ibigroup <56846598+binh-dam-ibigroup@users.noreply.github.com>
Date: Mon, 18 Sep 2023 17:47:37 -0400
Subject: [PATCH 1/8] fix(enhanced-stop-marker): Remove duplicate stop popups.
---
lib/components/map/enhanced-stop-marker.js | 35 ++++++++++++++--------
1 file changed, 22 insertions(+), 13 deletions(-)
diff --git a/lib/components/map/enhanced-stop-marker.js b/lib/components/map/enhanced-stop-marker.js
index ad5d7fa4f..3e0dd8668 100644
--- a/lib/components/map/enhanced-stop-marker.js
+++ b/lib/components/map/enhanced-stop-marker.js
@@ -81,6 +81,18 @@ class EnhancedStopMarker extends Component {
this.setLocation('to')
}
+ onMarkerClick = (e) => {
+ // Make a copy because getElementsByClassName returns a live collection.
+ const elements = Array.from(
+ document.getElementsByClassName('maplibregl-popup-close-button')
+ )
+ elements.forEach((el) => {
+ if (el.parentElement.firstChild.firstChild.id !== 'enh-stop-popup') {
+ el.click()
+ }
+ })
+ }
+
setLocation(locationType) {
const { setLocation, stop } = this.props
const { lat, lon, name } = stop
@@ -108,22 +120,11 @@ class EnhancedStopMarker extends Component {
const { ModeIcon } = this.context
const stopIcon = mode ? :
- const icon = (
-
- {stopIcon}
-
- )
-
return (
+
)
}
From e33413aeb46b97113522fb9380e78c83d9355747 Mon Sep 17 00:00:00 2001
From: binh-dam-ibigroup <56846598+binh-dam-ibigroup@users.noreply.github.com>
Date: Mon, 18 Sep 2023 18:02:09 -0400
Subject: [PATCH 2/8] refactor(enhanced-stop-marker): Extract constants and add
comment about the duplicate popup fix.
---
lib/components/map/enhanced-stop-marker.js | 12 ++++++++++--
1 file changed, 10 insertions(+), 2 deletions(-)
diff --git a/lib/components/map/enhanced-stop-marker.js b/lib/components/map/enhanced-stop-marker.js
index 3e0dd8668..7e3a99a72 100644
--- a/lib/components/map/enhanced-stop-marker.js
+++ b/lib/components/map/enhanced-stop-marker.js
@@ -65,6 +65,8 @@ const BaseStopIcon = styled.div`
}
`
+const activeContentId = 'enh-stop-popup'
+
class EnhancedStopMarker extends Component {
static contextType = ComponentContext
@@ -86,8 +88,14 @@ class EnhancedStopMarker extends Component {
const elements = Array.from(
document.getElementsByClassName('maplibregl-popup-close-button')
)
+ // HACK: If an OTP2 tile stop is right underneath the marker, the tile event handler in OTP-UI
+ // will fire before this one, and the popup from the regular stop layer will appear
+ // (even if we render the StopViewerOverlay after the OTP2 overlays in DefaultMap),
+ // so there will be two (duplicate) stop popups.
+ // We want to show the popup for the enhanced marker instead of the one from the tile handler
+ // because the stop marker has a much larger UI surface than the circle from the tile layer.
elements.forEach((el) => {
- if (el.parentElement.firstChild.firstChild.id !== 'enh-stop-popup') {
+ if (el.parentElement.firstChild.firstChild.id !== activeContentId) {
el.click()
}
})
@@ -124,7 +132,7 @@ class EnhancedStopMarker extends Component {