feat(journey-maps): extend poi-url-generation with preview flag (#1899)

src/components-examples/journey-maps/angular/journey-maps-full/journey-maps-full-example.html

@@ -185,6 +185,7 @@
             >
           </sbb-select>
         </sbb-form-field>
+        <sbb-checkbox formControlName="includePreview">Include preview-POIs?</sbb-checkbox>
       </li>
       <li>
         <sbb-form-field label="Select zones">

src/components-examples/journey-maps/angular/journey-maps-full/journey-maps-full-example.ts

@@ -193,6 +193,7 @@ export class JourneyMapsFullExample implements OnInit, OnDestroy {
       pointsOfInterestOptions: _fb.group({
         categories: [['park_rail', 'car_sharing', 'bike_parking', 'bike_sharing']],
         environment: ['prod'], // Can also be left empty
+        includePreview: [false], // Can also be left empty
       }),
       zoneGeoJson: [],
       routingGeoJson: [],

src/journey-maps/angular/journey-maps.interfaces.ts

@@ -231,6 +231,8 @@ export interface SbbPointsOfInterestOptions {
   categories: SbbPointsOfInterestCategoryType[];
   /** Configure the environment from which to get the POIs from ('prod' or 'int. default = 'prod'). */
   environment?: SbbPointsOfInterestEnvironmentType;
+  /** Configure whether to include preview-points-of-interest or not */
+  includePreview?: boolean;
 }
 
 /** points of interest category type */

src/journey-maps/angular/journey-maps.ts

@@ -522,16 +522,20 @@ export class SbbJourneyMaps implements OnInit, AfterViewInit, OnDestroy, OnChang
     if (changes.poiOptions) {
       this._executeWhenMapStyleLoaded(() => {
         const poiEnvironmentChanged =
-          !changes.poiOptions.firstChange &&
           changes.poiOptions.previousValue?.environment !==
-            changes.poiOptions.currentValue?.environment;
-
-        if (poiEnvironmentChanged) {
+          changes.poiOptions.currentValue?.environment;
+        const poiPreviewChanged =
+          changes.poiOptions.previousValue?.includePreview !==
+          changes.poiOptions.currentValue?.includePreview;
+        const poiStyleOptionsChanged =
+          !changes.poiOptions.firstChange && (poiEnvironmentChanged || poiPreviewChanged);
+
+        if (poiStyleOptionsChanged) {
           // Update POI-Source-URL
           const currentPoiSource = this._map.getSource(SBB_JOURNEY_POIS_SOURCE) as VectorTileSource;
-          const newPoiSourceUrl = this._urlService.getPoiSourceUrlByEnvironment(
+          const newPoiSourceUrl = this._urlService.getPoiSourceUrlByOptions(
             currentPoiSource.url,
-            this.poiOptions?.environment
+            this.poiOptions
           );
           currentPoiSource.setUrl(newPoiSourceUrl);
           this._map.once('styledata', () => {
@@ -596,7 +600,7 @@ export class SbbJourneyMaps implements OnInit, AfterViewInit, OnDestroy, OnChang
         this.viewportDimensions,
         this.viewportBounds,
         this.getMarkersBounds,
-        this.poiOptions?.environment
+        this.poiOptions
       )
       .subscribe((m) => {
         this._map = m;
@@ -769,9 +773,7 @@ export class SbbJourneyMaps implements OnInit, AfterViewInit, OnDestroy, OnChang
     this._mapStyleOptionsChanged
       .pipe(
         debounceTime(200),
-        switchMap(() =>
-          this._mapInitService.fetchStyle(this._getStyleUrl(), this.poiOptions?.environment)
-        ),
+        switchMap(() => this._mapInitService.fetchStyle(this._getStyleUrl(), this.poiOptions)),
         takeUntil(this._destroyed)
       )
       .subscribe((style) => {

src/journey-maps/angular/services/map/map-init-service.ts

@@ -12,7 +12,7 @@ import { map } from 'rxjs/operators';
 
 import {
   SbbInteractionOptions,
-  SbbPointsOfInterestEnvironmentType,
+  SbbPointsOfInterestOptions,
   SbbViewportBounds,
   SbbViewportDimensions,
 } from '../../journey-maps.interfaces';
@@ -56,9 +56,9 @@ export class SbbMapInitService {
     viewportDimensions?: SbbViewportDimensions,
     viewportBounds?: SbbViewportBounds,
     markerBounds?: LngLatBounds,
-    poiEnvironment?: SbbPointsOfInterestEnvironmentType
+    poiOptions?: SbbPointsOfInterestOptions
   ): Observable<MaplibreMap> {
-    return this.fetchStyle(styleUrl, poiEnvironment).pipe(
+    return this.fetchStyle(styleUrl, poiOptions).pipe(
       map((style) =>
         this._createMap(
           style,
@@ -152,18 +152,15 @@ export class SbbMapInitService {
 
   fetchStyle(
     styleUrl: string,
-    poiEnvironment?: SbbPointsOfInterestEnvironmentType
+    poiOptions?: SbbPointsOfInterestOptions
   ): Observable<StyleSpecification> {
     return this._http.get(styleUrl).pipe(
       map((fetchedStyle) => {
         const style = fetchedStyle as StyleSpecification;
 
         // Set POI-Source-URL
         const poiSource = style.sources[SBB_JOURNEY_POIS_SOURCE] as VectorTileSource;
-        poiSource.url = this._urlService.getPoiSourceUrlByEnvironment(
-          poiSource.url,
-          poiEnvironment
-        );
+        poiSource.url = this._urlService.getPoiSourceUrlByOptions(poiSource.url, poiOptions);
 
         return style;
       })

src/journey-maps/angular/services/map/map-url-service.ts

@@ -1,21 +1,35 @@
 import { Injectable } from '@angular/core';
 
-import { SbbPointsOfInterestEnvironmentType } from '../../journey-maps.interfaces';
+import {
+  SbbPointsOfInterestEnvironmentType,
+  SbbPointsOfInterestOptions,
+} from '../../journey-maps.interfaces';
+
+const URL_SPLITTER = '.json';
 
 @Injectable({ providedIn: 'root' })
 export class SbbMapUrlService {
-  getPoiSourceUrlByEnvironment(
-    url: string,
-    poiEnvironment?: SbbPointsOfInterestEnvironmentType
-  ): string {
-    if (poiEnvironment === 'int') {
-      // Set poi source to integration if needed
-      return url.replace('journey_pois', 'journey_pois_integration');
-    } else if (poiEnvironment === 'prod') {
-      // Reset poi source to prod if needed
-      return url.replace('_integration', '');
+  getPoiSourceUrlByOptions(url: string, options?: SbbPointsOfInterestOptions): string {
+    const [urlStart, urlEnd] = url.split(URL_SPLITTER);
+    let newUrlStart = urlStart.replace('_integration', '').replace('_preview', '');
+
+    newUrlStart = this._setEnvironment(newUrlStart, options?.environment);
+    newUrlStart = this._setPreview(newUrlStart, options?.includePreview);
+
+    return newUrlStart + URL_SPLITTER + urlEnd;
+  }
+
+  private _setPreview(url: string, includePreview?: boolean): string {
+    if (includePreview) {
+      return url + '_preview';
     }
+    return url;
+  }
 
+  private _setEnvironment(url: string, environment?: SbbPointsOfInterestEnvironmentType): string {
+    if (environment === 'int') {
+      return url + '_integration';
+    }
     return url;
   }
 }