diff --git a/lib/components/app/responsive-webapp.js b/lib/components/app/responsive-webapp.js index ee4c3c684..2d9c165b6 100644 --- a/lib/components/app/responsive-webapp.js +++ b/lib/components/app/responsive-webapp.js @@ -55,6 +55,23 @@ class ResponsiveWebapp extends Component { /** Lifecycle methods **/ + // Check if the position has changed enough to update the currentPosition + // (prevent constant updates in nearby view) + positionShouldUpdate = (position) => { + const { currentPosition } = this.props + if (!currentPosition.coords) return true + const latChanged = + Math.abs( + position?.coords?.latitude - currentPosition?.coords?.latitude + ) >= 0.001 + const lonChanged = + Math.abs( + position?.coords?.longitude - currentPosition?.coords?.longitude + ) >= 0.001 + + return latChanged || lonChanged + } + /* eslint-disable-next-line complexity */ componentDidUpdate(prevProps) { const { @@ -69,6 +86,7 @@ class ResponsiveWebapp extends Component { map, matchContentToUrl, query, + receivedPositionResponse, setLocationToCurrent, setMapCenter } = this.props @@ -119,6 +137,21 @@ class ResponsiveWebapp extends Component { } } + navigator.geolocation.watchPosition( + // On success + (position) => { + const shouldUpdate = this.positionShouldUpdate(position) + if (shouldUpdate) { + receivedPositionResponse({ position }) + } + }, + // On error + (error) => { + console.log('error in watchPosition', error) + }, + // Options + { enableHighAccuracy: true } + ) // If the path changes (e.g., via a back button press) check whether the // main content needs to switch between, for example, a viewer and a search. if (!isEqual(location.pathname, prevProps.location.pathname)) { @@ -154,7 +187,6 @@ class ResponsiveWebapp extends Component { map, matchContentToUrl, parseUrlQueryString, - receivedPositionResponse, setNetworkConnectionLost } = this.props // Add on back button press behavior. @@ -180,18 +212,6 @@ class ResponsiveWebapp extends Component { // Test location availability on load getCurrentPosition(intl) // Also, watch for changes in position on mobile - navigator.geolocation.watchPosition( - // On success - (position) => { - receivedPositionResponse({ position }) - }, - // On error - (error) => { - console.log('error in watchPosition', error) - }, - // Options - { enableHighAccuracy: true } - ) } // Handle routing to a specific part of the app (e.g. stop viewer) on page // load. (This happens prior to routing request in case special routerId is @@ -426,10 +446,12 @@ class RouterWrapperWithAuth0 extends Component { } const mapStateToWrapperProps = (state) => { - const { homeTimezone, map, persistence, reactRouter } = state.otp.config + const { homeTimezone, location, map, persistence, reactRouter } = + state.otp.config return { auth0Config: getAuth0Config(persistence), autoFly: map.autoFlyOnTripFormUpdate, + currentPosition: location?.currentPosition, defaultLocale: getDefaultLocale(state.otp.config, state.user.loggedInUser), homeTimezone, locale: state.otp.ui.locale,