From 43c938b5fa67b322fa2db8004f7ef0908e7fe53d Mon Sep 17 00:00:00 2001 From: Ahmad Bamieh Date: Tue, 29 Jan 2019 03:55:32 -0800 Subject: [PATCH] [i18n] Translate directives (#28654) localize directives --- src/ui/public/directives/confirm_click.js | 6 +- src/ui/public/directives/field_name.js | 74 ++++++++++++++++--- .../boolean_field_name_icon.html | 2 +- .../conflict_field_name_icon.html | 2 +- .../date_field_name_icon.html | 2 +- .../geo_point_field_name_icon.html | 2 +- .../field_name_icons/ip_field_name_icon.html | 2 +- .../murmur3_field_name_icon.html | 2 +- .../number_field_name_icon.html | 2 +- .../source_field_name_icon.html | 2 +- .../string_field_name_icon.html | 2 +- .../unknown_field_name_icon.html | 2 +- src/ui/public/directives/paginate.js | 7 +- .../partials/table_cell_filter.html | 4 +- src/ui/public/directives/truncated.js | 12 ++- 15 files changed, 93 insertions(+), 30 deletions(-) diff --git a/src/ui/public/directives/confirm_click.js b/src/ui/public/directives/confirm_click.js index cbee20e01d969..68f706079ed9f 100644 --- a/src/ui/public/directives/confirm_click.js +++ b/src/ui/public/directives/confirm_click.js @@ -20,12 +20,14 @@ import { uiModules } from '../modules'; uiModules .get('kibana') - .directive('confirmClick', function ($window) { + .directive('confirmClick', function ($window, i18n) { return { restrict: 'A', link: function ($scope, $elem, attrs) { $elem.bind('click', function () { - const message = attrs.confirmation || 'Are you sure?'; + const message = attrs.confirmation || i18n('common.ui.directives.confirmClickButtonLabel', { + defaultMessage: 'Are you sure?' + }); if ($window.confirm(message)) { // eslint-disable-line no-alert const action = attrs.confirmClick; if (action) { diff --git a/src/ui/public/directives/field_name.js b/src/ui/public/directives/field_name.js index da739814097f4..383d7cdc18e0c 100644 --- a/src/ui/public/directives/field_name.js +++ b/src/ui/public/directives/field_name.js @@ -18,6 +18,7 @@ */ import $ from 'jquery'; +import { template } from 'lodash'; import '../filters/short_dots'; import booleanFieldNameIcon from './field_name_icons/boolean_field_name_icon.html'; import conflictFieldNameIcon from './field_name_icons/conflict_field_name_icon.html'; @@ -33,7 +34,18 @@ import unknownFieldNameIcon from './field_name_icons/unknown_field_name_icon.htm import { uiModules } from '../modules'; const module = uiModules.get('kibana'); -module.directive('fieldName', function ($compile, $rootScope, $filter) { +const compiledBooleanFieldNameIcon = template(booleanFieldNameIcon); +const compiledConflictFieldNameIcon = template(conflictFieldNameIcon); +const compiledDateFieldNameIcon = template(dateFieldNameIcon); +const compiledGeoPointFieldNameIcon = template(geoPointFieldNameIcon); +const compiledIpFieldNameIcon = template(ipFieldNameIcon); +const compiledMurmur3FieldNameIcon = template(murmur3FieldNameIcon); +const compiledNumberFieldNameIcon = template(numberFieldNameIcon); +const compiledSourceFieldNameIcon = template(sourceFieldNameIcon); +const compiledStringFieldNameIcon = template(stringFieldNameIcon); +const compiledUnknownFieldNameIcon = template(unknownFieldNameIcon); + +module.directive('fieldName', function ($compile, $rootScope, $filter, i18n) { return { restrict: 'AE', scope: { @@ -43,15 +55,51 @@ module.directive('fieldName', function ($compile, $rootScope, $filter) { }, link: function ($scope, $el) { const typeToIconMap = { - boolean: booleanFieldNameIcon, - conflict: conflictFieldNameIcon, - date: dateFieldNameIcon, - geo_point: geoPointFieldNameIcon, - ip: ipFieldNameIcon, - murmur3: murmur3FieldNameIcon, - number: numberFieldNameIcon, - source: sourceFieldNameIcon, - string: stringFieldNameIcon, + boolean: compiledBooleanFieldNameIcon({ + booleanFieldAriaLabel: i18n('common.ui.directives.fieldNameIcons.booleanAriaLabel', { + defaultMessage: 'Boolean field' + }), + }), + conflict: compiledConflictFieldNameIcon({ + conflictingFieldAriaLabel: i18n('common.ui.directives.fieldNameIcons.conflictFieldAriaLabel', { + defaultMessage: 'Conflicting field' + }), + }), + date: compiledDateFieldNameIcon({ + dateFieldAriaLabel: i18n('common.ui.directives.fieldNameIcons.dateFieldAriaLabel', { + defaultMessage: 'Date field' + }), + }), + geo_point: compiledGeoPointFieldNameIcon({ + geoPointFieldAriaLabel: i18n('common.ui.directives.fieldNameIcons.geoPointFieldAriaLabel', { + defaultMessage: 'Date field' + }), + }), + ip: compiledIpFieldNameIcon({ + ipAddressFieldAriaLabel: i18n('common.ui.directives.fieldNameIcons.ipAddressFieldAriaLabel', { + defaultMessage: 'IP address field' + }), + }), + murmur3: compiledMurmur3FieldNameIcon({ + murmur3FieldAriaLabel: i18n('common.ui.directives.fieldNameIcons.murmur3FieldAriaLabel', { + defaultMessage: 'Murmur3 field' + }), + }), + number: compiledNumberFieldNameIcon({ + numberFieldAriaLabel: i18n('common.ui.directives.fieldNameIcons.numberFieldAriaLabel', { + defaultMessage: 'Number field' + }), + }), + source: compiledSourceFieldNameIcon({ + sourceFieldAriaLabel: i18n('common.ui.directives.fieldNameIcons.sourceFieldAriaLabel', { + defaultMessage: 'Source field' + }), + }), + string: compiledStringFieldNameIcon({ + stringFieldAriaLabel: i18n('common.ui.directives.fieldNameIcons.stringFieldAriaLabel', { + defaultMessage: 'String field' + }), + }), }; function typeIcon(fieldType) { @@ -59,7 +107,11 @@ module.directive('fieldName', function ($compile, $rootScope, $filter) { return typeToIconMap[fieldType]; } - return unknownFieldNameIcon; + return compiledUnknownFieldNameIcon({ + unknownFieldAriaLabel: i18n('common.ui.directives.fieldNameIcons.unknownFieldAriaLabel', { + defaultMessage: 'Unknown field' + }), + }); } $rootScope.$watchMulti.call($scope, [ diff --git a/src/ui/public/directives/field_name_icons/boolean_field_name_icon.html b/src/ui/public/directives/field_name_icons/boolean_field_name_icon.html index 8fe0d9215c16d..f863acf5b71bb 100644 --- a/src/ui/public/directives/field_name_icons/boolean_field_name_icon.html +++ b/src/ui/public/directives/field_name_icons/boolean_field_name_icon.html @@ -1,4 +1,4 @@ diff --git a/src/ui/public/directives/field_name_icons/conflict_field_name_icon.html b/src/ui/public/directives/field_name_icons/conflict_field_name_icon.html index e8cae9ba63eb4..d90dd392044b9 100644 --- a/src/ui/public/directives/field_name_icons/conflict_field_name_icon.html +++ b/src/ui/public/directives/field_name_icons/conflict_field_name_icon.html @@ -1,4 +1,4 @@ diff --git a/src/ui/public/directives/field_name_icons/date_field_name_icon.html b/src/ui/public/directives/field_name_icons/date_field_name_icon.html index 4d5acc08b1475..051f33971214c 100644 --- a/src/ui/public/directives/field_name_icons/date_field_name_icon.html +++ b/src/ui/public/directives/field_name_icons/date_field_name_icon.html @@ -1,4 +1,4 @@ diff --git a/src/ui/public/directives/field_name_icons/geo_point_field_name_icon.html b/src/ui/public/directives/field_name_icons/geo_point_field_name_icon.html index cb6d12a3b3225..730eb780028c5 100644 --- a/src/ui/public/directives/field_name_icons/geo_point_field_name_icon.html +++ b/src/ui/public/directives/field_name_icons/geo_point_field_name_icon.html @@ -1,4 +1,4 @@ diff --git a/src/ui/public/directives/field_name_icons/ip_field_name_icon.html b/src/ui/public/directives/field_name_icons/ip_field_name_icon.html index 107b7e3e902d8..a509485251548 100644 --- a/src/ui/public/directives/field_name_icons/ip_field_name_icon.html +++ b/src/ui/public/directives/field_name_icons/ip_field_name_icon.html @@ -1,4 +1,4 @@ diff --git a/src/ui/public/directives/field_name_icons/murmur3_field_name_icon.html b/src/ui/public/directives/field_name_icons/murmur3_field_name_icon.html index 44f2b63ca9135..ea7ca535d36cd 100644 --- a/src/ui/public/directives/field_name_icons/murmur3_field_name_icon.html +++ b/src/ui/public/directives/field_name_icons/murmur3_field_name_icon.html @@ -1,5 +1,5 @@ diff --git a/src/ui/public/directives/field_name_icons/number_field_name_icon.html b/src/ui/public/directives/field_name_icons/number_field_name_icon.html index feea51e909f94..9971555b63f01 100644 --- a/src/ui/public/directives/field_name_icons/number_field_name_icon.html +++ b/src/ui/public/directives/field_name_icons/number_field_name_icon.html @@ -1,5 +1,5 @@ diff --git a/src/ui/public/directives/field_name_icons/source_field_name_icon.html b/src/ui/public/directives/field_name_icons/source_field_name_icon.html index 8a54edcfa1674..59c3053ff8cff 100644 --- a/src/ui/public/directives/field_name_icons/source_field_name_icon.html +++ b/src/ui/public/directives/field_name_icons/source_field_name_icon.html @@ -1,4 +1,4 @@ diff --git a/src/ui/public/directives/field_name_icons/string_field_name_icon.html b/src/ui/public/directives/field_name_icons/string_field_name_icon.html index 0fe1dad51e785..d16a9073f61cc 100644 --- a/src/ui/public/directives/field_name_icons/string_field_name_icon.html +++ b/src/ui/public/directives/field_name_icons/string_field_name_icon.html @@ -1,5 +1,5 @@ diff --git a/src/ui/public/directives/field_name_icons/unknown_field_name_icon.html b/src/ui/public/directives/field_name_icons/unknown_field_name_icon.html index c6574f85bec0b..ee2edee4e9450 100644 --- a/src/ui/public/directives/field_name_icons/unknown_field_name_icon.html +++ b/src/ui/public/directives/field_name_icons/unknown_field_name_icon.html @@ -1,5 +1,5 @@ diff --git a/src/ui/public/directives/paginate.js b/src/ui/public/directives/paginate.js index 4302a48f0f8e7..3d571785868d8 100644 --- a/src/ui/public/directives/paginate.js +++ b/src/ui/public/directives/paginate.js @@ -22,7 +22,7 @@ import { uiModules } from '../modules'; import paginateControlsTemplate from '../partials/paginate_controls.html'; uiModules.get('kibana') - .directive('paginate', function ($parse, $compile) { + .directive('paginate', function ($parse, $compile, i18n) { return { restrict: 'E', scope: true, @@ -61,12 +61,15 @@ uiModules.get('kibana') controller: function ($scope, $document) { const self = this; const ALL = 0; + const allSizeTitle = i18n('common.ui.directives.paginate.size.allDropDownOptionLabel', { + defaultMessage: 'All', + }); self.sizeOptions = [ { title: '10', value: 10 }, { title: '25', value: 25 }, { title: '100', value: 100 }, - { title: 'All', value: ALL } + { title: allSizeTitle, value: ALL } ]; // setup the watchers, called in the post-link function diff --git a/src/ui/public/directives/partials/table_cell_filter.html b/src/ui/public/directives/partials/table_cell_filter.html index dd1610d45c2e5..165ad9f43e392 100644 --- a/src/ui/public/directives/partials/table_cell_filter.html +++ b/src/ui/public/directives/partials/table_cell_filter.html @@ -8,14 +8,14 @@ data-test-subj="filterForCellValue" ng-click="onFilterClick($event, false)" class="fa fa-search-plus" - tooltip="Filter for value" + tooltip="{{ ::'common.ui.directives.tableCellFilter.filterForValueTooltip' | i18n: {defaultMessage: 'Filter for value'} }}" tooltip-append-to-body="1" > diff --git a/src/ui/public/directives/truncated.js b/src/ui/public/directives/truncated.js index 60bd77136c8fe..c3b672c8b0f03 100644 --- a/src/ui/public/directives/truncated.js +++ b/src/ui/public/directives/truncated.js @@ -25,7 +25,7 @@ import 'angular-sanitize'; const module = uiModules.get('kibana', ['ngSanitize']); -module.directive('kbnTruncated', function () { +module.directive('kbnTruncated', function (i18n) { return { restrict: 'E', scope: { @@ -48,11 +48,17 @@ module.directive('kbnTruncated', function () { } $scope.truncated = true; $scope.expanded = false; - $scope.action = 'more'; + const showLessText = i18n('common.ui.directives.truncated.showLessLinkText', { + defaultMessage: 'less' + }); + const showMoreText = i18n('common.ui.directives.truncated.showMoreLinkText', { + defaultMessage: 'more' + }); + $scope.action = showMoreText; $scope.toggle = () => { $scope.expanded = !$scope.expanded; $scope.content = $scope.expanded ? source : truncated; - $scope.action = $scope.expanded ? 'less' : 'more'; + $scope.action = $scope.expanded ? showLessText : showMoreText; }; } };