[6.x] Translations for Coordinate Map (#23952)

.i18nrc.json

@@ -8,6 +8,7 @@
     "markdownVis": "src/core_plugins/markdown_vis",
     "metricVis": "src/core_plugins/metric_vis",
     "statusPage": "src/core_plugins/status_page",
+    "tileMap": "src/core_plugins/tile_map",
     "tagCloud": "src/core_plugins/tagcloud",
     "xpack.idxMgmt": "x-pack/plugins/index_management",
     "xpack.watcher": "x-pack/plugins/watcher"

src/core_plugins/tile_map/public/base_maps_visualization.js

@@ -27,7 +27,7 @@ import { toastNotifications } from 'ui/notify';
 const MINZOOM = 0;
 const MAXZOOM = 22;//increase this to 22. Better for WMS
 
-export function BaseMapsVisualizationProvider(serviceSettings) {
+export function BaseMapsVisualizationProvider(serviceSettings, i18n) {
 
   /**
    * Abstract base class for a visualization consisting of a map with a single baselayer.
@@ -195,7 +195,9 @@ export function BaseMapsVisualizationProvider(serviceSettings) {
     }
 
     async _updateData() {
-      throw new Error('Child should implement this method to respond to data-update');
+      throw new Error(i18n('tileMap.baseMapsVisualization.childShouldImplementMethodErrorMessage', {
+        defaultMessage: 'Child should implement this method to respond to data-update',
+      }));
     }
 
     _hasESResponseChanged(data) {

src/core_plugins/tile_map/public/coordinate_maps_visualization.js

@@ -18,6 +18,7 @@
  */
 
 import _ from 'lodash';
+import { i18n } from '@kbn/i18n';
 import { GeohashLayer } from './geohash_layer';
 import { BaseMapsVisualizationProvider } from './base_maps_visualization';
 import { AggConfig } from 'ui/vis/agg_config';
@@ -219,7 +220,9 @@ export function CoordinateMapsVisualizationProvider(Notifier, Private) {
           esResp = await searchSource.fetch();
         } catch(error) {
           toastNotifications.addDanger({
-            title: `Unable to get bounds`,
+            title: i18n.translate('tileMap.coordinateMapsVisualization.unableToGetBoundErrorTitle', {
+              defaultMessage: 'Unable to get bounds',
+            }),
             text: `${error.message}`,
           });
           return;

src/core_plugins/tile_map/public/editors/_tooltip_formatter.js

@@ -19,7 +19,7 @@
 
 import $ from 'jquery';
 
-export function TileMapTooltipFormatterProvider($compile, $rootScope) {
+export function TileMapTooltipFormatterProvider($compile, $rootScope, i18n) {
 
   const $tooltipScope = $rootScope.$new();
   const $el = $('<div>').html(require('./_tooltip.html'));
@@ -37,11 +37,11 @@ export function TileMapTooltipFormatterProvider($compile, $rootScope) {
         value: metricAgg.fieldFormatter()(feature.properties.value)
       },
       {
-        label: 'Latitude',
+        label: i18n('tileMap.tooltipFormatter.latitudeLabel', { defaultMessage: 'Latitude' }),
         value: feature.geometry.coordinates[1]
       },
       {
-        label: 'Longitude',
+        label: i18n('tileMap.tooltipFormatter.longitudeLabel', { defaultMessage: 'Longitude' }),
         value: feature.geometry.coordinates[0]
       }
     ];

src/core_plugins/tile_map/public/editors/tile_map_vis_params.html

@@ -1,7 +1,11 @@
 <!-- vis type specific options -->
 <div class="kuiSideBarSection">
   <div class="form-group">
-    <label for="coordinateMapOptionsMapType">Map type</label>
+    <label
+      for="coordinateMapOptionsMapType"
+      i18n-id="tileMap.visParams.mapTypeLabel"
+      i18n-default-message="Map type"
+    ></label>
       <select
         id="coordinateMapOptionsMapType"
         name="agg"
@@ -15,9 +19,12 @@
 
 
   <div class="kuiSideBarFormRow" >
-    <label class="kuiSideBarFormRow__label" for="colorSchema">
-      Color Schema
-    </label>
+    <label
+      class="kuiSideBarFormRow__label"
+      for="colorSchema"
+      i18n-id="tileMap.visParams.colorSchemaLabel"
+      i18n-default-message="Color Schema"
+    ></label>
     <div class="kuiSideBarFormRow__control">
       <select
         id="colorSchema"
@@ -30,9 +37,10 @@
 
   <div ng-if="editorState.params.mapType === 'Heatmap'" class="form-group">
     <div>
-      <label>
-        Cluster size
-      </label>
+      <label
+        i18n-id="tileMap.visParams.clusterSizeLabel"
+        i18n-default-message="Cluster size"
+      ></label>
       <div class="visEditorAgg__formRow--flex">
         <input
           name="heatClusterSize"
@@ -55,9 +63,12 @@
   <vislib-basic-options></vislib-basic-options>
 
   <div class="kuiSideBarFormRow">
-    <label class="kuiSideBarFormRow__label" for="desaturateMapTiles">
-      Desaturate tiles
-    </label>
+    <label
+      class="kuiSideBarFormRow__label"
+      for="desaturateMapTiles"
+      i18n-id="tileMap.visParams.desaturateTilesLabel"
+      i18n-default-message="Desaturate tiles"
+    ></label>
 
     <div class="kuiSideBarFormRow__control">
       <input
@@ -69,7 +80,7 @@
       >
       &nbsp;
       <icon-tip
-        content="'Reduce the vibrancy of tile colors. This does not work in any version of Internet Explorer.'"
+        content="{{::'tileMap.visParams.reduceVibrancyOfTileColorsTip' | i18n: {defaultMessage: '\'Reduce the vibrancy of tile colors. This does not work in any version of Internet Explorer.\''} }}"
         position="'right'"
       ></icon-tip>
     </div>

src/core_plugins/tile_map/public/editors/wms_options.html

@@ -3,16 +3,21 @@
 
   <div class="kuiSideBarSection">
     <div class="kuiSideBarSectionTitle">
-      <div class="kuiSideBarSectionTitle__text">
-        Base Layer Settings
-      </div>
+      <div
+        class="kuiSideBarSectionTitle__text"
+        i18n-id="tileMap.wmsOptions.baseLayerSettingsTitle"
+        i18n-default-message="Base Layer Settings"
+      ></div>
     </div>
 
 
     <div class="kuiSideBarFormRow" ng-show="!options.enabled">
-      <label class="kuiSideBarFormRow__label" for="tmsLayers">
-        Layers
-      </label>
+      <label
+        class="kuiSideBarFormRow__label"
+        for="tmsLayers"
+        i18n-id="tileMap.wmsOptions.layersLabel"
+        i18n-default-message="Layers"
+      ></label>
       <div class="kuiSideBarFormRow__control">
         <select
           id="tmsLayers"
@@ -24,9 +29,12 @@
     </div>
 
     <div class="kuiSideBarFormRow">
-      <label class="kuiSideBarFormRow__label" for="wmsCompliantMapServer">
-        WMS map server
-      </label>
+      <label
+        class="kuiSideBarFormRow__label"
+        for="wmsCompliantMapServer"
+        i18n-id="tileMap.wmsOptions.wmsMapServerLabel"
+        i18n-default-message="WMS map server"
+      ></label>
 
       <div class="kuiSideBarFormRow__control">
         <input
@@ -37,23 +45,28 @@
         >
         &nbsp;
         <icon-tip
-          content="'Use WMS compliant map tile server. For advanced users only.'"
+          content="{{::'tileMap.wmsOptions.useWMSCompliantMapTileServerTip' | i18n: {defaultMessage: '\'Use WMS compliant map tile server. For advanced users only.\''} }}"
           position="'right'"
         ></icon-tip>
       </div>
     </div>
 
     <div ng-show="options.enabled">
       <div class="form-group">
-        <p>WMS is an OGC standard for map image services. For more information, go <a
-          href="http://www.opengeospatial.org/standards/wms">here</a>.</p>
-        <br>
+        <p
+          i18n-id="tileMap.wmsOptions.wmsDescription"
+          i18n-default-message="WMS is an OGC standard for map image services. For more information, go {wmsLink}."
+          i18n-values="{
+            wmsLink:  '<a href=\'http://www.opengeospatial.org/standards/wms\'>' + wmsLinkText + '</a>'
+          }"
+        ></p>
+		<br>
         <label>
-          WMS url*
-          <icon-tip
-            position="'right'"
-            content="'The URL of the WMS web service'"
-          ></icon-tip>
+          <span
+            i18n-id="tileMap.wmsOptions.wmsUrlLabel"
+            i18n-default-message="WMS url*"
+          ></span>
+          <icon-tip position="'right'" content="{{::'tileMap.wmsOptions.urlOfWMSWebServiceTip' | i18n: {defaultMessage: '\'The URL of the WMS web service\''} }}"></icon-tip>
         </label>
         <input type="text" class="form-control"
                name="wms.url"
@@ -62,11 +75,11 @@
 
       <div class="form-group">
         <label>
-          WMS layers*
-          <icon-tip
-            position="'right'"
-            content="'A comma separated list of layers to use'"
-          ></icon-tip>
+          <span
+            i18n-id="tileMap.wmsOptions.wmsLayersLabel"
+            i18n-default-message="WMS layers*"
+          ></span>
+          <icon-tip position="'right'" content="{{::'tileMap.wmsOptions.listOfLayersToUseTip' | i18n: {defaultMessage: '\'A comma separated list of layers to use\''} }}"></icon-tip>
         </label>
         <input type="text" class="form-control"
                ng-require="options.enabled"
@@ -76,11 +89,11 @@
 
       <div class="form-group">
         <label>
-          WMS version*
-          <icon-tip
-            position="'right'"
-            content="'The version of WMS the server supports'"
-          ></icon-tip>
+          <span
+            i18n-id="tileMap.wmsOptions.wmsVersionLabel"
+            i18n-default-message="WMS version*"
+          ></span>
+          <icon-tip position="'right'" content="{{::'tileMap.wmsOptions.versionOfWMSserverSupportsTip' | i18n: {defaultMessage: '\'The version of WMS the server supports\''} }}"></icon-tip>
         </label>
         <input type="text" class="form-control"
                name="wms.options.version"
@@ -89,11 +102,11 @@
 
       <div class="form-group">
         <label>
-          WMS format*
-          <icon-tip
-            position="'right'"
-            content="'Usually image/png or image/jpeg. Use png if the server will return transparent layers.'"
-          ></icon-tip>
+          <span
+            i18n-id="tileMap.wmsOptions.wmsFormatLabel"
+            i18n-default-message="WMS format*"
+          ></span>
+          <icon-tip position="'right'" content="{{::'tileMap.wmsOptions.imageFormatToUseTip' | i18n: {defaultMessage: '\'Usually image/png or image/jpeg. Use png if the server will return transparent layers.\''} }}"></icon-tip>
         </label>
         <input type="text" class="form-control"
                name="wms.options.format"
@@ -102,11 +115,11 @@
 
       <div class="form-group">
         <label>
-          WMS attribution
-          <icon-tip
-            position="'right'"
-            content="'Attribution string for the lower right corner'"
-          ></icon-tip>
+          <span
+            i18n-id="tileMap.wmsOptions.wmsAttributionLabel"
+            i18n-default-message="WMS attribution"
+          ></span>
+          <icon-tip position="'right'" content="{{::'tileMap.wmsOptions.attributionStringTip' | i18n: {defaultMessage: '\'Attribution string for the lower right corner\''} }}"></icon-tip>
         </label>
         <input type="text" class="form-control"
                name="wms.options.attribution"
@@ -115,18 +128,21 @@
 
       <div class="form-group">
         <label>
-          WMS styles*
-          <icon-tip
-            position="'right'"
-            content="'A comma separated list of WMS server supported styles to use. Blank in most cases.'"
-          ></icon-tip>
+          <span
+            i18n-id="tileMap.wmsOptions.wmsStylesLabel"
+            i18n-default-message="WMS styles*"
+          ></span>
+          <icon-tip position="'right'" content="{{::'tileMap.wmsOptions.wmsServerSupportedStylesListTip' | i18n: {defaultMessage: '\'A comma separated list of WMS server supported styles to use. Blank in most cases.\''} }}"></icon-tip>
         </label>
         <input type="text" class="form-control"
                name="wms.options.styles"
                ng-model="options.options.styles">
       </div>
 
-      <p>* if this parameter is incorrect, maps will fail to load.</p>
+      <p
+        i18n-id="tileMap.wmsOptions.mapLoadFailDescription"
+        i18n-default-message="* if this parameter is incorrect, maps will fail to load."
+      ></p>
 
 
     </div>

src/core_plugins/tile_map/public/editors/wms_options.js

@@ -21,7 +21,7 @@ import { uiModules } from 'ui/modules';
 import wmsOptionsTemplate from './wms_options.html';
 const module = uiModules.get('kibana');
 
-module.directive('wmsOptions', function (serviceSettings) {
+module.directive('wmsOptions', function (serviceSettings, i18n) {
   return {
     restrict: 'E',
     template: wmsOptionsTemplate,
@@ -31,6 +31,7 @@ module.directive('wmsOptions', function (serviceSettings) {
       collections: '=',
     },
     link: function ($scope) {
+      $scope.wmsLinkText = i18n('tileMap.wmsOptions.wmsLinkText', { defaultMessage: 'here' });
 
       new Promise((resolve, reject) => {
 

src/core_plugins/tile_map/public/geohash_layer.js

@@ -19,6 +19,7 @@
 
 import L from 'leaflet';
 import _ from 'lodash';
+import { i18n } from '@kbn/i18n';
 
 import { KibanaMapLayer } from 'ui/vis/map/kibana_map_layer';
 import { HeatmapMarkers } from './markers/heatmap';
@@ -83,7 +84,12 @@ export class GeohashLayer extends KibanaMapLayer {
         }, this._zoom, this._featureCollectionMetaData.max);
         break;
       default:
-        throw new Error(`${this._geohashOptions.mapType} mapType not recognized`);
+        throw new Error(i18n.translate('tileMap.geohashLayer.mapTitle', {
+          defaultMessage: '{mapType} mapType not recognized',
+          values: {
+            mapType: this._geohashOptions.mapType,
+          },
+        }));
 
     }