From addb8e3111be2fbf4660b3e0de94cd2745aedb0f Mon Sep 17 00:00:00 2001
From: c727 <crusader727@gmx.de>
Date: Fri, 1 Jun 2018 16:50:28 +0200
Subject: [PATCH] Localize cover, fan, light, media player, history charts
 (#1244)

* Localize cover, fan, light, media player, history charts

* Don't capitalize
---
 src/components/state-history-charts.js        |  8 +++---
 .../more-info/controls/more-info-cover.js     | 25 ++++++-------------
 .../more-info/controls/more-info-fan.js       |  9 ++++---
 .../more-info/controls/more-info-light.js     | 11 ++++----
 .../controls/more-info-media_player.js        |  5 ++--
 src/translations/en.json                      | 22 ++++++++++++++++
 6 files changed, 49 insertions(+), 31 deletions(-)

diff --git a/src/components/state-history-charts.js b/src/components/state-history-charts.js
index f0dc16453e..ec64c77c38 100644
--- a/src/components/state-history-charts.js
+++ b/src/components/state-history-charts.js
@@ -5,7 +5,9 @@ import { PolymerElement } from '@polymer/polymer/polymer-element.js';
 import './state-history-chart-line.js';
 import './state-history-chart-timeline.js';
 
-class StateHistoryCharts extends PolymerElement {
+import LocalizeMixin from '../mixins/localize-mixin.js';
+
+class StateHistoryCharts extends LocalizeMixin(PolymerElement) {
   static get template() {
     return html`
     <style>
@@ -21,11 +23,11 @@ class StateHistoryCharts extends PolymerElement {
     }
     </style>
     <template is="dom-if" class="info" if="[[_computeIsLoading(isLoadingData)]]">
-      <div class="info">Loading state history...</div>
+      <div class="info">[[localize('ui.components.history_charts.loading_history')]]</div>
     </template>
 
     <template is="dom-if" class="info" if="[[_computeIsEmpty(isLoadingData, historyData)]]">
-      <div class="info">No state history found.</div>
+      <div class="info">[[localize('ui.components.history_charts.no_history_found')]]</div>
     </template>
 
     <template is="dom-if" if="[[historyData.timeline.length]]">
diff --git a/src/dialogs/more-info/controls/more-info-cover.js b/src/dialogs/more-info/controls/more-info-cover.js
index 98d1f05587..d75ba2a9ed 100644
--- a/src/dialogs/more-info/controls/more-info-cover.js
+++ b/src/dialogs/more-info/controls/more-info-cover.js
@@ -10,11 +10,13 @@ import CoverEntity from '../../../util/cover-model.js';
 import attributeClassNames from '../../../common/entity/attribute_class_names';
 import featureClassNames from '../../../common/entity/feature_class_names';
 
+import LocalizeMixin from '../../../mixins/localize-mixin.js';
+
 {
   const FEATURE_CLASS_NAMES = {
     128: 'has-set_tilt_position',
   };
-  class MoreInfoCover extends PolymerElement {
+  class MoreInfoCover extends LocalizeMixin(PolymerElement) {
     static get template() {
       return html`
     <style include="iron-flex"></style>
@@ -39,7 +41,7 @@ import featureClassNames from '../../../common/entity/feature_class_names';
 
       <div class="current_position">
         <ha-labeled-slider
-          caption="Position" pin=""
+          caption="[[localize('ui.card.cover.position')]]" pin=""
           value="{{coverPositionSliderValue}}"
           disabled="[[!entityObj.supportsSetPosition]]"
           on-change="coverPositionSliderChanged"
@@ -48,7 +50,7 @@ import featureClassNames from '../../../common/entity/feature_class_names';
 
       <div class="tilt">
         <ha-labeled-slider
-          caption="Tilt position" pin="" extra=""
+          caption="[[localize('ui.card.cover.tilt_position')]]" pin="" extra=""
           value="{{coverTiltPositionSliderValue}}"
           disabled="[[!entityObj.supportsSetTiltPosition]]"
           on-change="coverTiltPositionSliderChanged">
@@ -67,28 +69,17 @@ import featureClassNames from '../../../common/entity/feature_class_names';
 
     static get properties() {
       return {
-        hass: {
-          type: Object,
-        },
-
+        hass: Object,
         stateObj: {
           type: Object,
           observer: 'stateObjChanged',
         },
-
         entityObj: {
           type: Object,
           computed: 'computeEntityObj(hass, stateObj)',
         },
-
-        coverPositionSliderValue: {
-          type: Number,
-        },
-
-        coverTiltPositionSliderValue: {
-          type: Number,
-        },
-
+        coverPositionSliderValue: Number,
+        coverTiltPositionSliderValue: Number
       };
     }
 
diff --git a/src/dialogs/more-info/controls/more-info-fan.js b/src/dialogs/more-info/controls/more-info-fan.js
index 437022d793..00c3f4e258 100644
--- a/src/dialogs/more-info/controls/more-info-fan.js
+++ b/src/dialogs/more-info/controls/more-info-fan.js
@@ -12,11 +12,12 @@ import '../../../components/ha-attributes.js';
 
 import attributeClassNames from '../../../common/entity/attribute_class_names';
 import EventsMixin from '../../../mixins/events-mixin.js';
+import LocalizeMixin from '../../../mixins/localize-mixin.js';
 
 /*
  * @appliesMixin EventsMixin
  */
-class MoreInfoFan extends EventsMixin(PolymerElement) {
+class MoreInfoFan extends LocalizeMixin(EventsMixin(PolymerElement)) {
   static get template() {
     return html`
     <style include="iron-flex"></style>
@@ -45,7 +46,7 @@ class MoreInfoFan extends EventsMixin(PolymerElement) {
     <div class\$="[[computeClassNames(stateObj)]]">
 
       <div class="container-speed_list">
-        <paper-dropdown-menu label-float="" dynamic-align="" label="Speed">
+        <paper-dropdown-menu label-float="" dynamic-align="" label="[[localize('ui.card.fan.speed')]]">
           <paper-listbox slot="dropdown-content" selected="{{speedIndex}}">
             <template is="dom-repeat" items="[[stateObj.attributes.speed_list]]">
               <paper-item>[[item]]</paper-item>
@@ -56,7 +57,7 @@ class MoreInfoFan extends EventsMixin(PolymerElement) {
 
       <div class="container-oscillating">
         <div class="center horizontal layout single-row">
-          <div class="flex">Oscillate</div>
+          <div class="flex">[[localize('ui.card.fan.oscillate')]]</div>
           <paper-toggle-button checked="[[oscillationToggleChecked]]" on-change="oscillationToggleChanged">
           </paper-toggle-button>
         </div>
@@ -64,7 +65,7 @@ class MoreInfoFan extends EventsMixin(PolymerElement) {
 
       <div class="container-direction">
         <div class="direction">
-          <div>Direction</div>
+          <div>[[localize('ui.card.fan.direction')]]</div>
           <paper-icon-button icon="hass:rotate-left" on-click="onDirectionLeft" title="Left" disabled="[[computeIsRotatingLeft(stateObj)]]"></paper-icon-button>
           <paper-icon-button icon="hass:rotate-right" on-click="onDirectionRight" title="Right" disabled="[[computeIsRotatingRight(stateObj)]]"></paper-icon-button>
         </div>
diff --git a/src/dialogs/more-info/controls/more-info-light.js b/src/dialogs/more-info/controls/more-info-light.js
index 70279b9f02..d3ee5b5d07 100644
--- a/src/dialogs/more-info/controls/more-info-light.js
+++ b/src/dialogs/more-info/controls/more-info-light.js
@@ -12,6 +12,7 @@ import '../../../components/ha-labeled-slider.js';
 
 import featureClassNames from '../../../common/entity/feature_class_names';
 import EventsMixin from '../../../mixins/events-mixin.js';
+import LocalizeMixin from '../../../mixins/localize-mixin.js';
 
 {
   const FEATURE_CLASS_NAMES = {
@@ -24,7 +25,7 @@ import EventsMixin from '../../../mixins/events-mixin.js';
   /*
    * @appliesMixin EventsMixin
    */
-  class MoreInfoLight extends EventsMixin(PolymerElement) {
+  class MoreInfoLight extends LocalizeMixin(EventsMixin(PolymerElement)) {
     static get template() {
       return html`
     <style include="iron-flex"></style>
@@ -83,22 +84,22 @@ import EventsMixin from '../../../mixins/events-mixin.js';
     <div class\$="[[computeClassNames(stateObj)]]">
 
       <div class="control brightness">
-        <ha-labeled-slider caption="Brightness" icon="hass:brightness-5" max="255" value="{{brightnessSliderValue}}" on-change="brightnessSliderChanged"></ha-labeled-slider>
+        <ha-labeled-slider caption="[[localize('ui.card.light.brightness')]]" icon="hass:brightness-5" max="255" value="{{brightnessSliderValue}}" on-change="brightnessSliderChanged"></ha-labeled-slider>
       </div>
 
       <div class="control color_temp">
-        <ha-labeled-slider caption="Color Temperature" icon="hass:thermometer" min="[[stateObj.attributes.min_mireds]]" max="[[stateObj.attributes.max_mireds]]" value="{{ctSliderValue}}" on-change="ctSliderChanged"></ha-labeled-slider>
+        <ha-labeled-slider caption="[[localize('ui.card.light.color_temperature')]]" icon="hass:thermometer" min="[[stateObj.attributes.min_mireds]]" max="[[stateObj.attributes.max_mireds]]" value="{{ctSliderValue}}" on-change="ctSliderChanged"></ha-labeled-slider>
       </div>
 
       <div class="control white_value">
-        <ha-labeled-slider caption="White Value" icon="hass:file-word-box" max="255" value="{{wvSliderValue}}" on-change="wvSliderChanged"></ha-labeled-slider>
+        <ha-labeled-slider caption="[[localize('ui.card.light.white_value')]]" icon="hass:file-word-box" max="255" value="{{wvSliderValue}}" on-change="wvSliderChanged"></ha-labeled-slider>
       </div>
 
       <ha-color-picker class="control color" on-colorselected="colorPicked" desired-hs-color="{{colorPickerColor}}" throttle="500" hue-segments="24" saturation-segments="8">
       </ha-color-picker>
 
       <div class="control effect_list">
-        <paper-dropdown-menu label-float="" dynamic-align="" label="Effect">
+        <paper-dropdown-menu label-float="" dynamic-align="" label="[[localize('ui.card.light.effect')]]">
           <paper-listbox slot="dropdown-content" selected="{{effectIndex}}">
             <template is="dom-repeat" items="[[stateObj.attributes.effect_list]]">
               <paper-item>[[item]]</paper-item>
diff --git a/src/dialogs/more-info/controls/more-info-media_player.js b/src/dialogs/more-info/controls/more-info-media_player.js
index 6da722cc5b..70638514c5 100644
--- a/src/dialogs/more-info/controls/more-info-media_player.js
+++ b/src/dialogs/more-info/controls/more-info-media_player.js
@@ -14,12 +14,13 @@ import HassMediaPlayerEntity from '../../../util/hass-media-player-model.js';
 import attributeClassNames from '../../../common/entity/attribute_class_names';
 import isComponentLoaded from '../../../common/config/is_component_loaded.js';
 import EventsMixin from '../../../mixins/events-mixin.js';
+import LocalizeMixin from '../../../mixins/localize-mixin.js';
 
 {
   /*
    * @appliesMixin EventsMixin
    */
-  class MoreInfoMediaPlayer extends EventsMixin(PolymerElement) {
+  class MoreInfoMediaPlayer extends LocalizeMixin(EventsMixin(PolymerElement)) {
     static get template() {
       return html`
     <style include="iron-flex iron-flex-alignment"></style>
@@ -99,7 +100,7 @@ import EventsMixin from '../../../mixins/events-mixin.js';
       </div>
       <!-- TTS -->
       <div hidden\$="[[computeHideTTS(ttsLoaded, playerObj)]]" class="layout horizontal end">
-        <paper-input id="ttsInput" label="Text to speak" class="flex" value="{{ttsMessage}}" on-keydown="ttsCheckForEnter"></paper-input>
+        <paper-input id="ttsInput" label="[[localize('ui.card.media_player.text_to_speak')]]" class="flex" value="{{ttsMessage}}" on-keydown="ttsCheckForEnter"></paper-input>
         <paper-icon-button icon="hass:send" on-click="sendTTS"></paper-icon-button>
       </div>
     </div>
diff --git a/src/translations/en.json b/src/translations/en.json
index 4be10565e8..7ec899fe4d 100644
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -329,6 +329,24 @@
       "camera": {
         "not_available": "Image not available"
       },
+      "cover": {
+        "position": "Position",
+        "tilt_position": "Tilt position"
+      },
+      "fan": {
+        "speed": "Speed",
+        "oscillate": "Oscillate",
+        "direction": "Direction"
+      },
+      "light": {
+        "brightness": "Brightness",
+        "color_temperature": "Color temperature",
+        "white_value": "White value",
+        "effect": "Effect"
+      },
+      "media_player": {
+        "text_to_speak": "Text to speak"
+      },
       "persistent_notification": {
         "dismiss": "Dismiss"
       },
@@ -382,6 +400,10 @@
         "future": "In {time}",
         "never": "Never"
       },
+      "history_charts": {
+        "loading_history": "Loading state history...",
+        "no_history_found": "No state history found."
+      },
       "service-picker": {
         "service": "Service"
       }