From fda50c598e164647715190bae012369e55932990 Mon Sep 17 00:00:00 2001 From: miles-grant-ibigroup Date: Thu, 18 Apr 2024 13:09:42 -0400 Subject: [PATCH 1/6] avoid non-itin-view jumping --- lib/components/app/responsive-webapp.js | 4 +++- lib/components/map/route-preview-overlay.tsx | 16 ++++++++++++---- 2 files changed, 15 insertions(+), 5 deletions(-) diff --git a/lib/components/app/responsive-webapp.js b/lib/components/app/responsive-webapp.js index 74fea9add..668434186 100644 --- a/lib/components/app/responsive-webapp.js +++ b/lib/components/app/responsive-webapp.js @@ -62,6 +62,7 @@ class ResponsiveWebapp extends Component { formChanged, intl, location, + mainPanelContent, map, matchContentToUrl, query, @@ -98,7 +99,7 @@ class ResponsiveWebapp extends Component { setLocationToCurrent({ locationType: 'from' }, intl) setMapCenter(map, pt) } - } else if (query.from && query.to) { + } else if (query.from && query.to && mainPanelContent === null) { map?.fitBounds([query.from, query.to], { duration: 500, padding: getFitBoundsPadding(map, 0.2) @@ -259,6 +260,7 @@ const mapStateToProps = (state) => { activeSearchId: state.otp.activeSearchId, currentPosition: state.otp.location.currentPosition, locale: state.otp.ui.locale, + mainPanelContent: state.otp.ui.mainPanelContent, mobileScreen: state.otp.ui.mobileScreen, modeGroups: state.otp.config.modeGroups, popupContent: state.otp.ui.popup, diff --git a/lib/components/map/route-preview-overlay.tsx b/lib/components/map/route-preview-overlay.tsx index 8b02e7362..0559cf021 100644 --- a/lib/components/map/route-preview-overlay.tsx +++ b/lib/components/map/route-preview-overlay.tsx @@ -14,6 +14,7 @@ import { type Props = { from: Location geometries: string[] + mainPanelContent: number | null to: Location visible?: boolean } @@ -21,17 +22,23 @@ type Props = { * This overlay will display thin gray lines for a set of geometries. It's to be used * as a stopgap until we make full use of Transitive! */ -const RoutePreviewOverlay = ({ from, geometries, to, visible }: Props) => { +const RoutePreviewOverlay = ({ + from, + geometries, + mainPanelContent, + to, + visible +}: Props) => { // Center the map over the endpoints when this overlay is shown. const { current: map } = useMap() useEffect(() => { - if (visible) { + if (visible && mainPanelContent === null) { map?.fitBounds([from, to], { duration: 500, padding: getFitBoundsPadding(map, 0.2) }) } - }, [map, visible, from, to]) + }, [map, visible, from, to, mainPanelContent]) if (!geometries || !visible) return <> @@ -76,7 +83,7 @@ const RoutePreviewOverlay = ({ from, geometries, to, visible }: Props) => { // TODO: Typescript state const mapStateToProps = (state: any) => { - const { activeSearchId, config } = state.otp + const { activeSearchId, config, ui } = state.otp // Only show this overlay if the metro UI is explicitly enabled if (config.itinerary?.showFirstResultByDefault !== false) { return {} @@ -102,6 +109,7 @@ const mapStateToProps = (state: any) => { return { from, geometries, + mainPanelContent: ui.mainPanelContent, to, visible: // We need an explicit check for undefined and null because 0 From 6852042a79e3dc191dcbea0e22a976e205432d48 Mon Sep 17 00:00:00 2001 From: miles-grant-ibigroup Date: Wed, 29 May 2024 11:21:29 -0400 Subject: [PATCH 2/6] update yarn lock --- yarn.lock | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/yarn.lock b/yarn.lock index 78e072aa4..f950b13b7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2434,7 +2434,7 @@ "@opentripplanner/location-icon" "^1.4.1" flat "^5.0.2" -"@opentripplanner/geocoder@^2.0.1", "@opentripplanner/geocoder@^2.2.2": +"@opentripplanner/geocoder@^2.2.2": version "2.2.2" resolved "https://registry.yarnpkg.com/@opentripplanner/geocoder/-/geocoder-2.2.2.tgz#8ddc669287ccdfff1a5cce14d1fa8049421c6480" integrity sha512-tJIOOE5N9kpMj0ji1YyVfWwg4yAFVs7Ks+EET67acql768bXwRE6rHoX6oaHvKhbCDjaQ7kuPIwi1BYWHQgg0Q== From 87aea76f2e20b54481afe50b408f00531ccaf901 Mon Sep 17 00:00:00 2001 From: miles-grant-ibigroup Date: Wed, 29 May 2024 11:27:16 -0400 Subject: [PATCH 3/6] stop codespell fixing correct word --- .github/workflows/codespell.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/.github/workflows/codespell.yml b/.github/workflows/codespell.yml index b1568432d..753c8a436 100644 --- a/.github/workflows/codespell.yml +++ b/.github/workflows/codespell.yml @@ -16,3 +16,4 @@ jobs: # Also, the a11y test file has a false positive and the ignore list does not work # see https://github.com/opentripplanner/otp-react-redux/pull/436/checks?check_run_id=3369380014 skip: ./.git,yarn.lock,./a11y/a11y.test.js,./a11y/mocks,./percy/percy.test.js,./percy/mock.har,./i18n,./__tests__/mocks,otpSchema.json,./percy/mocks/*.json + ignore_words_list: MapPin From bf505a4f1213b8a2949957f20cc00cab181ee737 Mon Sep 17 00:00:00 2001 From: miles-grant-ibigroup Date: Wed, 29 May 2024 11:32:48 -0400 Subject: [PATCH 4/6] slow down map panning --- lib/actions/map.js | 2 +- lib/components/app/responsive-webapp.js | 2 +- lib/components/map/route-preview-overlay.tsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/lib/actions/map.js b/lib/actions/map.js index 17cb19a69..933457b2f 100644 --- a/lib/actions/map.js +++ b/lib/actions/map.js @@ -22,7 +22,7 @@ export function setMapCenter(map /* MapRef */, location) { const { lat, lon } = location if (map && !isNaN(lat) && !isNaN(lon)) { const center = [lon, lat] - map.panTo(center) + map.panTo(center, { speed: 0.8 }) } } } diff --git a/lib/components/app/responsive-webapp.js b/lib/components/app/responsive-webapp.js index 668434186..734ba04b6 100644 --- a/lib/components/app/responsive-webapp.js +++ b/lib/components/app/responsive-webapp.js @@ -101,7 +101,7 @@ class ResponsiveWebapp extends Component { } } else if (query.from && query.to && mainPanelContent === null) { map?.fitBounds([query.from, query.to], { - duration: 500, + duration: 600, padding: getFitBoundsPadding(map, 0.2) }) } else if (query.from && !query.to) { diff --git a/lib/components/map/route-preview-overlay.tsx b/lib/components/map/route-preview-overlay.tsx index d1ebc7beb..1e071c0c3 100644 --- a/lib/components/map/route-preview-overlay.tsx +++ b/lib/components/map/route-preview-overlay.tsx @@ -35,7 +35,7 @@ const RoutePreviewOverlay = ({ useEffect(() => { if (visible && mainPanelContent === null) { map?.fitBounds([from, to], { - duration: 500, + duration: 600, padding: getFitBoundsPadding(map, 0.2) }) } From caece5280cfe073480208e81e5601f263e9fed40 Mon Sep 17 00:00:00 2001 From: miles-grant-ibigroup Date: Wed, 29 May 2024 11:57:47 -0400 Subject: [PATCH 5/6] feat: add `map. autoFlyOnTripFormUpdate` config key --- example-config.yml | 1 + lib/components/app/responsive-webapp.js | 24 ++++++++++++++---------- lib/util/config-types.ts | 1 + 3 files changed, 16 insertions(+), 10 deletions(-) diff --git a/example-config.yml b/example-config.yml index 6f534b86a..ee1008107 100644 --- a/example-config.yml +++ b/example-config.yml @@ -115,6 +115,7 @@ persistence: map: initLat: 45.52 initLon: -122.682 + # autoFlyOnTripFormUpdate: false baseLayers: - name: Streets # These tiles are free to use, but not in production diff --git a/lib/components/app/responsive-webapp.js b/lib/components/app/responsive-webapp.js index 734ba04b6..dc7d26f72 100644 --- a/lib/components/app/responsive-webapp.js +++ b/lib/components/app/responsive-webapp.js @@ -58,6 +58,7 @@ class ResponsiveWebapp extends Component { componentDidUpdate(prevProps) { const { activeSearchId, + autoFly, currentPosition, formChanged, intl, @@ -99,15 +100,17 @@ class ResponsiveWebapp extends Component { setLocationToCurrent({ locationType: 'from' }, intl) setMapCenter(map, pt) } - } else if (query.from && query.to && mainPanelContent === null) { - map?.fitBounds([query.from, query.to], { - duration: 600, - padding: getFitBoundsPadding(map, 0.2) - }) - } else if (query.from && !query.to) { - setMapCenter(map, query.from) - } else if (query.to && !query.from) { - setMapCenter(map, query.to) + } else if (mainPanelContent === null && autoFly !== false) { + if (query.from && query.to) { + map?.fitBounds([query.from, query.to], { + duration: 600, + padding: getFitBoundsPadding(map, 0.2) + }) + } else if (query.from && !query.to) { + setMapCenter(map, query.from) + } else if (query.to && !query.from) { + setMapCenter(map, query.to) + } } // If the path changes (e.g., via a back button press) check whether the @@ -417,9 +420,10 @@ class RouterWrapperWithAuth0 extends Component { } const mapStateToWrapperProps = (state) => { - const { homeTimezone, persistence, reactRouter } = state.otp.config + const { homeTimezone, map, persistence, reactRouter } = state.otp.config return { auth0Config: getAuth0Config(persistence), + autoFly: map.autoFlyOnTripFormUpdate, defaultLocale: getDefaultLocale(state.otp.config, state.user.loggedInUser), homeTimezone, locale: state.otp.ui.locale, diff --git a/lib/util/config-types.ts b/lib/util/config-types.ts index 89f060b1f..22530305e 100644 --- a/lib/util/config-types.ts +++ b/lib/util/config-types.ts @@ -220,6 +220,7 @@ export type SupportedOverlays = | MapTileLayerConfig export interface MapConfig { + autoFlyOnTripFormUpdate?: boolean baseLayers?: BaseLayerConfig[] initLat?: number initLon?: number From e8b3a85fe0e51e00f2857f685c418823d6e9c098 Mon Sep 17 00:00:00 2001 From: miles-grant-ibigroup Date: Fri, 31 May 2024 14:52:08 -0400 Subject: [PATCH 6/6] finish merge --- .github/workflows/codespell.yml | 1 - 1 file changed, 1 deletion(-) diff --git a/.github/workflows/codespell.yml b/.github/workflows/codespell.yml index 2e01c715b..06c6da3f4 100644 --- a/.github/workflows/codespell.yml +++ b/.github/workflows/codespell.yml @@ -17,4 +17,3 @@ jobs: # Also, the a11y test file has a false positive and the ignore list does not work # see https://github.com/opentripplanner/otp-react-redux/pull/436/checks?check_run_id=3369380014 skip: ./.git,yarn.lock,./a11y/a11y.test.js,./a11y/mocks,./percy/percy.test.js,./percy/mock.har,./i18n,./__tests__/mocks,otpSchema.json,./percy/mocks/*.json - ignore_words_list: MapPin