merged master

README.md

@@ -34,7 +34,7 @@ to create a new or improve an existing language. Let us know if you changed some
  * Run `python3 update-translations.py`
  * Review your changes via e.g. http://localhost:3000/?locale=en and with `git diff`. Make sure that is the only one with `git status`.
 
-Please note that the translations the server-side turn instructions are located in [a different repository](https://github.com/graphhopper/graphhopper/blob/master/docs/core/translations.md).
+Please note that the translations for the server-side turn instructions are located in [a different repository](https://github.com/graphhopper/graphhopper/blob/master/docs/core/translations.md).
 
 ## Advanced configuration
 

config.js

@@ -23,6 +23,7 @@ const config = {
         details: [
             'road_class',
             'road_environment',
+            'road_access',
             'surface',
             'max_speed',
             'average_speed',
@@ -39,8 +40,8 @@ const config = {
     //
     // profiles: {
     //    car:{}, small_truck:{}, truck:{}, scooter:{},
-    //    foot:{ details: ['foot_network'] }, hike:{ details: ['foot_network'] },
-    //    bike:{ details: ['get_off_bike', 'bike_network'] }, mtb:{ details: ['get_off_bike', 'bike_network'] }, racingbike:{ details: ['get_off_bike', 'bike_network'] },
+    //    foot:{ details: ['foot_network', 'access_conditional'] }, hike:{ details: ['foot_network', 'access_conditional'] },
+    //    bike:{ details: ['get_off_bike', 'bike_network', 'access_conditional'] }, mtb:{ details: ['get_off_bike', 'bike_network', 'access_conditional'] }, racingbike:{ details: ['get_off_bike', 'bike_network', 'access_conditional'] },
     // }
     //
     // E.g. the 'bike' entry will add a "bike" profile for which we send a request with the specified 'details' parameter. You can even change the profile itself when you specify

package.json

@@ -21,8 +21,8 @@
         "custom-model-editor": "github:graphhopper/custom-model-editor#3a46b6981d170b7eb70d621bbb92caed149e5a97",
         "geojson": "^0.5.0",
         "heightgraph": "github:easbar/Leaflet.Heightgraph#5f4f0b1fff3646aa071981381f5955c9e6f111f0",
-        "ol": "7.4.0",
-        "ol-mapbox-style": "10.6.0",
+        "ol": "8.1.0",
+        "ol-mapbox-style": "12.2.1",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "react-responsive": "^9.0.0"

src/api/Api.ts

@@ -221,7 +221,12 @@ export class ApiImpl implements Api {
             request.heading_penalty = 120
         }
 
-        if (args.points.length <= 2 && args.maxAlternativeRoutes > 1 && !(request as any)['curbsides'] && !args.profile.startsWith("cp_")) {
+        if (
+            args.points.length <= 2 &&
+            args.maxAlternativeRoutes > 1 &&
+            !(request as any)['curbsides'] &&
+            !args.profile.startsWith('cp_')
+        ) {
             return {
                 ...request,
                 'alternative_route.max_paths': args.maxAlternativeRoutes,

src/api/graphhopper.d.ts

@@ -93,6 +93,7 @@ export interface Instruction {
     readonly sign: number
     readonly text: string
     readonly street_name: string
+    readonly motorway_junction: string
     readonly time: number
 }
 
@@ -104,6 +105,8 @@ interface Details {
     readonly toll: [number, number, string][]
     readonly max_speed: [number, number, number][]
     readonly average_speed: [number, number, number][]
+    readonly road_access: [number, number, string][]
+    readonly access_conditional: [number, number, string][]
     readonly track_type: [number, number, string][]
     readonly country: [number, number, string][]
     readonly get_off_bike: [number, number, boolean][]

src/layers/UsePathsLayer.tsx

@@ -64,13 +64,20 @@ function addUnselectedPathsLayer(map: Map, paths: Path[]) {
     })
     const layer = new VectorLayer({
         source: new VectorSource({
-            features: new GeoJSON().readFeatures(createUnselectedPaths(paths)),
+            features: paths.map((path: Path, index) => {
+                const f = new Feature({
+                    index: index,
+                })
+                if (path.points?.coordinates)
+                    f.setGeometry(new LineString(path.points.coordinates.map(c => fromLonLat(c))))
+                return f
+            }),
         }),
         style: () => style,
         opacity: 0.8,
+        zIndex: 1,
     })
     layer.set(pathsLayerKey, true)
-    layer.setZIndex(1)
     map.addLayer(layer)
 
     // select an alternative path if clicked
@@ -160,38 +167,21 @@ function addSelectedPathsLayer(map: Map, selectedPath: Path, updateMoreFrequentl
     ] as Feature[]
 
     const layer = new VectorLayer({
-        source: new VectorSource({ features: features }),
+        source: new VectorSource({
+            features: [new Feature(new LineString(selectedPath.points.coordinates.map(c => fromLonLat(c))))],
+        }),
         style: feature => styles[(feature.getGeometry() as Geometry).getType()],
-        opacity: 0.8,
         // when navigating we need this for re-routing (see also useCurrentLocationLayer where this is necessary)
         updateWhileAnimating: updateMoreFrequently,
         updateWhileInteracting: updateMoreFrequently,
+        opacity: 0.8,
+        zIndex: 2,
     })
 
     layer.set(selectedPathLayerKey, true)
-    layer.setZIndex(2)
     map.addLayer(layer)
 }
 
-function createUnselectedPaths(paths: Path[]) {
-    const featureCollection: FeatureCollection = {
-        type: 'FeatureCollection',
-        features: paths.map((path, index) => {
-            return {
-                type: 'Feature',
-                properties: {
-                    index,
-                },
-                geometry: {
-                    ...path.points,
-                    coordinates: path.points.coordinates.map(c => fromLonLat(c)),
-                },
-            }
-        }),
-    }
-    return featureCollection
-}
-
 function removeSelectPathInteractions(map: Map) {
     map.getInteractions()
         .getArray()

src/sidebar/RoutingResults.tsx

@@ -27,6 +27,7 @@ import { TNSettingsState, TurnNavigationStoreState } from '@/stores/TurnNavigati
 import Cross from '@/sidebar/times-solid.svg'
 import * as config from 'config'
 import FordIcon from '@/sidebar/routeHints/water.svg'
+import CondAccessIcon from '@/sidebar/routeHints/remove_road.svg'
 import FerryIcon from '@/sidebar/routeHints/directions_boat.svg'
 import PrivateIcon from '@/sidebar/routeHints/privacy_tip.svg'
 import StepsIcon from '@/sidebar/routeHints/floor.svg'
@@ -79,28 +80,46 @@ function RoutingResult({
         : styles.resultSummary
 
     useEffect(() => setExpanded(isSelected && isExpanded), [isSelected])
-    const fordInfo = getInfoFor(path.points, path.details.road_environment, { ford: true })
-    const tollInfo = getInfoFor(path.points, path.details.toll, { all: true, hgv: ApiImpl.isTruck(profile) })
-    const ferryInfo = getInfoFor(path.points, path.details.road_environment, { ferry: true })
+    const fordInfo = getInfoFor(path.points, path.details.road_environment, s => s === 'ford')
+    const tollInfo = getInfoFor(
+        path.points,
+        path.details.toll,
+        s => s === 'all' || (s === 'hgv' && ApiImpl.isTruck(profile))
+    )
+    const ferryInfo = getInfoFor(path.points, path.details.road_environment, s => s === 'ferry')
+    const accessCondInfo = getInfoFor(path.points, path.details.access_conditional, s => s != null && s.length > 0)
+    const privateOrDeliveryInfo = ApiImpl.isMotorVehicle(profile)
+        ? getInfoFor(
+              path.points,
+              path.details.road_access,
+              s => s === 'private' || s === 'customers' || s === 'delivery'
+          )
+        : new RouteInfo()
     const badTrackInfo = !ApiImpl.isMotorVehicle(profile)
         ? new RouteInfo()
-        : getInfoFor(path.points, path.details.track_type, { grade2: true, grade3: true, grade4: true, grade5: true })
+        : getInfoFor(
+              path.points,
+              path.details.track_type,
+              s => s === 'grade2' || s === 'grade3' || s === 'grade4' || s === 'grade5'
+          )
     const trunkInfo = ApiImpl.isMotorVehicle(profile)
         ? new RouteInfo()
-        : getInfoFor(path.points, path.details.road_class, { motorway: true, trunk: true })
+        : getInfoFor(path.points, path.details.road_class, s => s === 'motorway' || s === 'trunk')
     const stepsInfo = !ApiImpl.isBikeLike(profile)
         ? new RouteInfo()
-        : getInfoFor(path.points, path.details.road_class, { steps: true })
+        : getInfoFor(path.points, path.details.road_class, s => s === 'steps')
     const steepInfo = ApiImpl.isMotorVehicle(profile) ? new RouteInfo() : getHighSlopeInfo(path.points, 15)
     const getOffBikeInfo = !ApiImpl.isBikeLike(profile)
         ? new RouteInfo()
-        : getInfoFor(path.points, path.details.get_off_bike, { true: true })
+        : getInfoFor(path.points, path.details.get_off_bike, s => s)
     const countriesInfo = crossesBorderInfo(path.points, path.details.country)
 
     const showHints =
         fordInfo.distance > 0 ||
         tollInfo.distance > 0 ||
         ferryInfo.distance > 0 ||
+        accessCondInfo.distance > 0 ||
+        privateOrDeliveryInfo.distance > 0 ||
         trunkInfo.distance > 0 ||
         badTrackInfo.distance > 0 ||
         stepsInfo.distance > 0 ||
@@ -237,6 +256,32 @@ function RoutingResult({
                             selected={selectedRH}
                             segments={ferryInfo.segments}
                         />
+                        <RHButton
+                            setDescription={b => setDescriptionRH(b)}
+                            description={tr('way_contains_restrictions')}
+                            setType={t => setSelectedRH(t)}
+                            type={'access_conditional'}
+                            child={<CondAccessIcon />}
+                            value={
+                                accessCondInfo.distance > 0 &&
+                                metersToShortText(accessCondInfo.distance, showDistanceInMiles)
+                            }
+                            selected={selectedRH}
+                            segments={accessCondInfo.segments}
+                        />
+                        <RHButton
+                            setDescription={b => setDescriptionRH(b)}
+                            description={tr('way_contains', [tr('private_sections')])}
+                            setType={t => setSelectedRH(t)}
+                            type={'private'}
+                            child={<PrivateIcon />}
+                            value={
+                                privateOrDeliveryInfo.distance > 0 &&
+                                metersToShortText(privateOrDeliveryInfo.distance, showDistanceInMiles)
+                            }
+                            selected={selectedRH}
+                            segments={privateOrDeliveryInfo.segments}
+                        />
                         <RHButton
                             setDescription={b => setDescriptionRH(b)}
                             description={tr('way_contains_toll')}
@@ -309,7 +354,7 @@ function RoutingResult({
                     {descriptionRH && <div>{descriptionRH}</div>}
                 </div>
             )}
-            {isExpanded && <Instructions instructions={path.instructions} />}
+            {isExpanded && <Instructions instructions={path.instructions} us={showDistanceInMiles} />}
             {isExpanded && (
                 <div className={styles.routingResultRoadData}>
                     {tr('road_data_from')}: {info.road_data_timestamp}
@@ -403,17 +448,19 @@ function toBBox(segment: Coordinate[]): Bbox {
     return bbox as Bbox
 }
 
-function getInfoFor(points: LineString, details: [number, number, any][], values: { [Identifier: string]: boolean }) {
+function getInfoFor(points: LineString, details: [number, number, any][], fnc: { (s: any): boolean }) {
     if (!details) return new RouteInfo()
     let info = new RouteInfo()
     const coords = points.coordinates
     for (const i in details) {
-        if (values[details[i][2]]) {
+        if (fnc(details[i][2])) {
             const from = details[i][0],
                 to = details[i][1]
             const segCoords: Coordinate[] = []
             for (let i = from; i < to; i++) {
-                info.distance += calcDistPos(coords[i], coords[i + 1])
+                const dist = calcDistPos(coords[i], coords[i + 1])
+                info.distance += dist
+                if (dist == 0) info.distance += 0.01 // some obstacles have no length when mapped as a node like fords
                 segCoords.push(toCoordinate(coords[i]))
             }
             segCoords.push(toCoordinate(coords[to]))

src/sidebar/SettingsBox.tsx

@@ -111,10 +111,7 @@ export default function SettingsBox({ turnNavSettings }: { turnNavSettings: TNSe
 function SettingsToggle({ title, enabled, onClick }: { title: string; enabled: boolean; onClick: () => void }) {
     return (
         <div className={styles.settingsToggle} onClick={onClick}>
-            <PlainButton
-                style={{ color: enabled ? '' : 'lightgray' }}
-                className={styles.toggleButton}
-            >
+            <PlainButton style={{ color: enabled ? '' : 'lightgray' }} className={styles.toggleButton}>
                 {enabled ? <OnIcon /> : <OffIcon />}
             </PlainButton>
             <div style={{ color: enabled ? '#5b616a' : 'gray' }}>{title}</div>

src/sidebar/instructions/Instructions.module.css

@@ -24,6 +24,16 @@
     margin-top: 1rem;
 }
 
+.motorwayJunction {
+    font-weight: bold;
+    font-size: smaller;
+    color: white;
+    width: fit-content;
+    margin: 3px 0;
+    padding: 5px;
+    border-radius: 3px;
+}
+
 .distance {
     grid-column: 2 / span 1;
     font-size: small;

src/sidebar/instructions/Instructions.tsx

@@ -25,19 +25,18 @@ import { InstructionClicked } from '@/actions/Actions'
 import { useContext } from 'react'
 import { SettingsContext } from '@/contexts/SettingsContext'
 
-export default function (props: { instructions: Instruction[] }) {
+export default function (props: { instructions: Instruction[]; us: boolean }) {
     return (
         <ul className={styles.instructionsList}>
             {props.instructions.map((instruction, i) => (
-                <Line key={i} instruction={instruction} index={i} />
+                <Line key={i} instruction={instruction} index={i} us={props.us} />
             ))}
         </ul>
     )
 }
 
-const Line = function ({ instruction, index }: { instruction: Instruction; index: number }) {
+const Line = function ({ instruction, index, us }: { instruction: Instruction; index: number; us: boolean }) {
     const settings = useContext(SettingsContext)
-
     return (
         <li
             className={styles.instruction}
@@ -52,6 +51,11 @@ const Line = function ({ instruction, index }: { instruction: Instruction; index
         >
             {getTurnSign(instruction.sign, index, undefined)}
             <span className={styles.mainText}>{instruction.text}</span>
+            {instruction.motorway_junction && (
+                <span style={{ background: us ? '#00674c' : '#003399' }} className={styles.motorwayJunction}>
+                    {instruction.motorway_junction}
+                </span>
+            )}
             <span className={styles.distance}>{metersToText(instruction.distance, settings.showDistanceInMiles)}</span>
         </li>
     )

src/sidebar/search/AddressInput.tsx

@@ -174,9 +174,7 @@ export default function AddressInput(props: AddressInputProps) {
                         setHasFocus(true)
                         props.clearDragDrop()
                     }}
-                    onBlur={() => {
-
-                    }}
+                    onBlur={() => {}}
                     value={text}
                     placeholder={tr(
                         type == QueryPointType.From ? 'from_hint' : type == QueryPointType.To ? 'to_hint' : 'via_hint'

src/stores/RouteStore.ts

@@ -33,6 +33,8 @@ export default class RouteStore extends Store<RouteStoreState> {
                 toll: [],
                 road_environment: [],
                 road_class: [],
+                road_access: [],
+                access_conditional: [],
                 track_type: [],
                 country: [],
                 get_off_bike: [],