Map initalization language param (#161)

radarlabs · May 21, 2024 · d0c0e3f · d0c0e3f
1 parent f804d3f
commit d0c0e3f
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 19 deletions.
diff --git a/README.md b/README.md
@@ -56,7 +56,7 @@ Radar.initialize('prj_test_pk_...', { /* options */ });
 
 Add the following script in your `html` file
 ```html
-<script src="https://js.radar.com/v4.3.0-beta.0/radar.min.js"></script>
+<script src="https://js.radar.com/v4.3.0-beta.5/radar.min.js"></script>
 ```
 
 Then initialize the Radar SDK
@@ -73,8 +73,8 @@ To create a map, first initialize the Radar SDK with your publishable key. Then
 ```html
 <html>
   <head>
-    <link href="https://js.radar.com/v4.3.0-beta.0/radar.css" rel="stylesheet">
-    <script src="https://js.radar.com/v4.3.0-beta.0/radar.min.js"></script>
+    <link href="https://js.radar.com/v4.3.0-beta.5/radar.css" rel="stylesheet">
+    <script src="https://js.radar.com/v4.3.0-beta.5/radar.min.js"></script>
   </head>
 
   <body>
@@ -98,8 +98,8 @@ To create an autocomplete input, first initialize the Radar SDK with your publis
 ```html
 <html>
   <head>
-    <link href="https://js.radar.com/v4.3.0-beta.0/radar.css" rel="stylesheet">
-    <script src="https://js.radar.com/v4.3.0-beta.0/radar.min.js"></script>
+    <link href="https://js.radar.com/v4.3.0-beta.5/radar.css" rel="stylesheet">
+    <script src="https://js.radar.com/v4.3.0-beta.5/radar.min.js"></script>
   </head>
 
   <body>
@@ -130,8 +130,8 @@ To power [geofencing](https://radar.com/documentation/geofencing/overview) exper
 ```html
 <html>
   <head>
-    <link href="https://js.radar.com/v4.3.0-beta.0/radar.css" rel="stylesheet">
-    <script src="https://js.radar.com/v4.3.0-beta.0/radar.min.js"></script>
+    <link href="https://js.radar.com/v4.3.0-beta.5/radar.css" rel="stylesheet">
+    <script src="https://js.radar.com/v4.3.0-beta.5/radar.min.js"></script>
   </head>
 
   <body>

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "radar-sdk-js",
-  "version": "4.3.0-beta.0",
+  "version": "4.3.0-beta.5",
   "description": "Web Javascript SDK for Radar, location infrastructure for mobile and web apps.",
   "homepage": "https://radar.com",
   "type": "module",

diff --git a/src/types.ts b/src/types.ts
@@ -460,7 +460,7 @@ export interface RadarSearchGeofencesResponse extends RadarResponse {
 }
 
 export interface RadarMapOptions extends Omit<maplibregl.MapOptions, 'transformRequest'> {
-  container: string | HTMLElement;
+  language?: string;
 }
 
 export interface RadarMarkerImage {

diff --git a/src/ui/RadarMap.ts b/src/ui/RadarMap.ts
@@ -6,6 +6,7 @@ import RadarLogoControl from './RadarLogoControl';
 
 import Config from '../config';
 import Logger from '../logger';
+import Navigator from '../navigator';
 
 import type { RadarOptions, RadarMapOptions } from '../types';
 
@@ -30,9 +31,13 @@ const defaultFitMarkersOptions: maplibregl.FitBoundsOptions = {
   padding: 50,
 };
 
-const createStyleURL = (options: RadarOptions, style: string = DEFAULT_STYLE) => (
-  `${options.host}/maps/styles/${style}?publishableKey=${options.publishableKey}`
-);
+const createStyleURL = (options: RadarOptions, mapOptions: RadarMapOptions) => {
+  let url = `${options.host}/maps/styles/${mapOptions.style}?publishableKey=${options.publishableKey}`
+  if (mapOptions.language) {
+    url += `&language=${mapOptions.language}`
+  }
+  return url
+};
 
 // check if style is a Radar style or a custom style
 const isRadarStyle = (style: string) => {
@@ -50,14 +55,13 @@ const getStyle = (options: RadarOptions, mapOptions: RadarMapOptions) => {
   const style = mapOptions.style;
 
   if (!style || (typeof style === 'string' && isRadarStyle(style))) {
-    return createStyleURL(options, style);
+    return createStyleURL(options, mapOptions);
   }
 
   return mapOptions.style; // style object or URL
 };
 
 class RadarMap extends maplibregl.Map {
-  _customMarkerRawSvg: string | undefined;
   _markers: RadarMarker[] = [];
 
   constructor(mapOptions: RadarMapOptions) {
@@ -69,16 +73,17 @@ class RadarMap extends maplibregl.Map {
 
     // configure maplibre options
     const style = getStyle(config, mapOptions);
-    const maplibreOptions: maplibregl.MapOptions = Object.assign({},
+    const maplibreOptions: RadarMapOptions = Object.assign({},
       defaultMaplibreOptions,
       mapOptions,
       { style },
     );
     Logger.debug(`initialize map with options: ${JSON.stringify(maplibreOptions)}`);
 
-    maplibreOptions.transformRequest = (url, resourceType) => {
+    (maplibreOptions as maplibregl.MapOptions).transformRequest = (url, resourceType) => {
+      // this handles when a style is switched
       if (resourceType === 'Style' && isRadarStyle(url)) {
-        url = createStyleURL(config, url);
+        url = createStyleURL(config, { ...maplibreOptions, style: url });
       }
 
       let headers = {

diff --git a/src/version.ts b/src/version.ts
@@ -1 +1 @@
-export default '4.3.0-beta.0';
+export default '4.3.0-beta.5';