Add support for intl key legends based on the host keyboard layout

This is the main commit of PR qmk#1161.

src/components/SettingsPanel.vue

@@ -91,6 +91,28 @@
           </option>
         </select>
       </div>
+      <div>
+        <label
+          class="settings-panel--text"
+          @mouseover="help('osKeyboardLayout')"
+          :title="$t('settingsPanel.osKeyboardLayout.title')"
+          >{{ $t('settingsPanel.osKeyboardLayout.title') }}</label
+        >
+      </div>
+      <div>
+        <select
+          id="setting-panel-os-keyboard-layout"
+          v-model="osKeyboardLayout"
+        >
+          <option
+            v-for="osLayout in osKeyboardLayouts"
+            :key="osLayout"
+            :value="osLayout"
+          >
+            {{ $t('settingsPanel.osKeyboardLayout.label.' + osLayout) }}
+          </option>
+        </select>
+      </div>
       <div>
         <label
           class="settings-panel--clear-keymap"
@@ -109,24 +131,6 @@
           />
         </div>
       </div>
-      <div>
-        <label
-          class="settings-panel--text"
-          @mouseover="help('iso')"
-          :title="$t('settingsPanel.iso.label')"
-          >{{ $t('settingsPanel.iso.label') }}</label
-        >
-      </div>
-      <div>
-        <toggle-button
-          id="setting-toggle-iso"
-          :value="configuratorSettings.iso"
-          :width="defaultWidth"
-          :sync="true"
-          :labels="labels"
-          @change="iso"
-        />
-      </div>
     </div>
     <div v-if="helpText" class="settings-panel--help-text">{{ helpText }}</div>
   </div>
@@ -157,7 +161,8 @@ export default {
     ...mapState('app', [
       'tutorialEnabled',
       'configuratorSettings',
-      'languages'
+      'languages',
+      'osKeyboardLayouts'
     ]),
     language: {
       get() {
@@ -166,6 +171,14 @@ export default {
       async set(value) {
         await this.changeLanguage(value);
       }
+    },
+    osKeyboardLayout: {
+      get() {
+        return this.configuratorSettings.osKeyboardLayout;
+      },
+      async set(value) {
+        await this.changeOSKeyboardLayout(value);
+      }
     }
   },
   methods: {
@@ -174,6 +187,7 @@ export default {
     ...mapActions('app', [
       'toggleDarkMode',
       'changeLanguage',
+      'changeOSKeyboardLayout',
       'toggleClearLayerDefault',
       'toggleIso'
     ]),
@@ -203,12 +217,15 @@ export default {
         case 'language':
           this.helpText = this.$t('settingsPanel.language.help');
           break;
-        case 'clearLayer':
-          this.helpText = this.$t('settingsPanel.clearLayer.help');
+        case 'osKeyboardLayout':
+          this.helpText = this.$t('settingsPanel.osKeyboardLayout.help');
           break;
         case 'iso':
           this.helpText = this.$t('settingsPanel.iso.help');
           break;
+        case 'clearLayer':
+          this.helpText = this.$t('settingsPanel.clearLayer.help');
+          break;
       }
 
       if (this.clearTextTimer) {

src/i18n/de.csv

@@ -111,8 +111,12 @@ settingsPanel:displaySizes:title,strg + alt + u
 settingsPanel:fastInput:help,"Gib die Tasten über die Tastatur ein, ohne auf die einzelnen Positionen zu klicken"
 settingsPanel:fastInput:label,Schnelle Eingabe
 settingsPanel:fastInput:title,strg + alt + f
-settingsPanel:iso:help,ISO-Legenden standardmäßig anzeigen
-settingsPanel:iso:label,Verwenden Sie ISO-Schlüssellegenden
+settingsPanel:osKeyboardLayout:help,
+settingsPanel:osKeyboardLayout:label:keymap_german,Deutsch (Deutschland & Österreich)
+settingsPanel:osKeyboardLayout:label:keymap_russian,Russisch
+settingsPanel:osKeyboardLayout:label:keymap_uk,Englisch (UK)
+settingsPanel:osKeyboardLayout:label:keymap_us,Englisch (US)
+settingsPanel:osKeyboardLayout:title,
 settingsPanel:kcno:label,KC_NO
 settingsPanel:kctrns:label,KC_TRNS
 settingsPanel:language:help,

src/i18n/en.csv

@@ -111,8 +111,12 @@ settingsPanel:displaySizes:title,ctrl + alt + u
 settingsPanel:fastInput:help,Input keys via keyboard without clicking each position.
 settingsPanel:fastInput:label,Fast Input
 settingsPanel:fastInput:title,ctrl + alt + f
-settingsPanel:iso:help,Display ISO legends by default
-settingsPanel:iso:label,Use ISO key legends
+settingsPanel:osKeyboardLayout:title,Host Keyboard Layout
+settingsPanel:osKeyboardLayout:help,Change the key legends to match with your host keyboard layout.
+settingsPanel:osKeyboardLayout:label:keymap_us,English (US)
+settingsPanel:osKeyboardLayout:label:keymap_uk,English (UK)
+settingsPanel:osKeyboardLayout:label:keymap_german,German (Germany & Austria)
+settingsPanel:osKeyboardLayout:label:keymap_russian,Russian
 settingsPanel:kcno:label,KC_NO
 settingsPanel:kctrns:label,KC_TRNS
 settingsPanel:language:help,Change the language of the user interface

src/i18n/es.csv

@@ -111,8 +111,12 @@ settingsPanel:displaySizes:title,ctrl + alt + u
 settingsPanel:fastInput:help,Ingresar teclas por medio del teclado sin hacer click en cada posición.
 settingsPanel:fastInput:label,Entrada rápida
 settingsPanel:fastInput:title,ctrl + alt + f
-settingsPanel:iso:help,Mostrar leyendas ISO de forma predeterminada
-settingsPanel:iso:label,Utilice leyendas clave ISO
+settingsPanel:osKeyboardLayout:title,
+settingsPanel:osKeyboardLayout:help,
+settingsPanel:osKeyboardLayout:label:keymap_german,Alemán (Alemania y Austria)
+settingsPanel:osKeyboardLayout:label:keymap_russian,Ruso
+settingsPanel:osKeyboardLayout:label:keymap_uk,Inglés (Reino Unido)
+settingsPanel:osKeyboardLayout:label:keymap_us,Inglés (Estados Unidos)
 settingsPanel:kcno:label,KC_NO
 settingsPanel:kctrns:label,KC_TRNS
 settingsPanel:language:help,

src/i18n/fr.csv

@@ -111,8 +111,12 @@ settingsPanel:displaySizes:title,ctrl + alt + u
 settingsPanel:fastInput:help,Permet d'entrer les touches via votre clavier sans cliquer sur chaque position.
 settingsPanel:fastInput:label,Entrée Rapide
 settingsPanel:fastInput:title,ctrl + alt + f
-settingsPanel:iso:help,Afficher les légendes ISO par défaut
-settingsPanel:iso:label,Utiliser les légendes des clés ISO
+settingsPanel:osKeyboardLayout:title,Disposition des touches du système d'opération
+settingsPanel:osKeyboardLayout:help,Change les légendes des touches pour qu'elles collent avec la disposition des touches du système.
+settingsPanel:osKeyboardLayout:label:keymap_german,Allemand (Allemagne & Autriche)
+settingsPanel:osKeyboardLayout:label:keymap_russian,Russe
+settingsPanel:osKeyboardLayout:label:keymap_uk,Anglais (Royaume-Uni)
+settingsPanel:osKeyboardLayout:label:keymap_us,Anglais (États-Unis)
 settingsPanel:kcno:label,KC_NO
 settingsPanel:kctrns:label,KC_TRNS
 settingsPanel:language:help,

src/i18n/it.csv

@@ -111,8 +111,12 @@ settingsPanel:displaySizes:title,Ctrl + Alt + U
 settingsPanel:fastInput:help,Inserire i tasti tramite la tastiera senza fare clic su ogni posizione.
 settingsPanel:fastInput:label,Ingresso rapido
 settingsPanel:fastInput:title,Ctrl + Alt + F
-settingsPanel:iso:help,Visualizza le legende ISO automaticamente
-settingsPanel:iso:label,Usa le legende delle chiavi ISO
+settingsPanel:osKeyboardLayout:title,
+settingsPanel:osKeyboardLayout:help,
+settingsPanel:osKeyboardLayout:label:keymap_german,Tedesco (Germania e Austria)
+settingsPanel:osKeyboardLayout:label:keymap_russian,Russo
+settingsPanel:osKeyboardLayout:label:keymap_uk,Inglese (Regno Unito)
+settingsPanel:osKeyboardLayout:label:keymap_us,Inglese (US)
 settingsPanel:kcno:label,KC_NO
 settingsPanel:kctrns:label,KC_TRNS
 settingsPanel:language:help,Cambia lingua dell'interfaccia utente

src/i18n/ja.csv

@@ -111,8 +111,12 @@ settingsPanel:displaySizes:title,ctrl + alt + u
 settingsPanel:fastInput:help,各位置をクリックせずキーボードでキーを入力する
 settingsPanel:fastInput:label,高速入力
 settingsPanel:fastInput:title,ctrl + alt + f
-settingsPanel:iso:help,デフォルトでISO凡例を表示
-settingsPanel:iso:label,ISOキーの凡例を使用する
+settingsPanel:osKeyboardLayout:title,
+settingsPanel:osKeyboardLayout:help,
+settingsPanel:osKeyboardLayout:label:keymap_german,ドイツ語（ドイツ・オーストリア）
+settingsPanel:osKeyboardLayout:label:keymap_russian,ロシア語
+settingsPanel:osKeyboardLayout:label:keymap_uk,英語 (UK)
+settingsPanel:osKeyboardLayout:label:keymap_us,英語 (US)
 settingsPanel:kcno:label,KC_NO
 settingsPanel:kctrns:label,KC_TRNS
 settingsPanel:language:help,ユーザインタフェースの言語を変更する

src/i18n/ms.csv

@@ -111,8 +111,12 @@ settingsPanel:displaySizes:title,ctrl + alt + u
 settingsPanel:fastInput:help,Masukkan kekunci melalui papan kekunci tanpa klik setiap posisi.
 settingsPanel:fastInput:label,Input cepat
 settingsPanel:fastInput:title,ctrl + alt + f
-settingsPanel:iso:help,Paparkan lagenda ISO secara lalai
-settingsPanel:iso:label,Gunakan lagenda kunci ISO
+settingsPanel:osKeyboardLayout:title,
+settingsPanel:osKeyboardLayout:help,
+settingsPanel:osKeyboardLayout:label:keymap_german,
+settingsPanel:osKeyboardLayout:label:keymap_russian,
+settingsPanel:osKeyboardLayout:label:keymap_uk,
+settingsPanel:osKeyboardLayout:label:keymap_us,
 settingsPanel:kcno:label,KC_NO
 settingsPanel:kctrns:label,KC_TRNS
 settingsPanel:language:help,

src/i18n/pl-PL.csv

@@ -111,8 +111,12 @@ settingsPanel:displaySizes:title,Ctrl + Alt + U
 settingsPanel:fastInput:help,Autmatyczne podświetlanie kolejnego klawisza po zdefiniowaniu funkcji poprzedniego.
 settingsPanel:fastInput:label,Szybkie wprowadzanie
 settingsPanel:fastInput:title,Ctrl + Alt + F
-settingsPanel:iso:help,Domyślnie wyświetlaj legendy ISO
-settingsPanel:iso:label,Użyj legendy kluczy ISO
+settingsPanel:osKeyboardLayout:title,
+settingsPanel:osKeyboardLayout:help,
+settingsPanel:osKeyboardLayout:label:keymap_german,Niemiecki (Niemcy i Austria)
+settingsPanel:osKeyboardLayout:label:keymap_russian,Rosyjski
+settingsPanel:osKeyboardLayout:label:keymap_uk,Angielski (UK)
+settingsPanel:osKeyboardLayout:label:keymap_us,Angielski (US)
 settingsPanel:kcno:label,KC_NO
 settingsPanel:kctrns:label,KC_TRNS
 settingsPanel:language:help,

src/i18n/pt-BR.csv

@@ -111,8 +111,12 @@ settingsPanel:displaySizes:title,ctrl + alt + u
 settingsPanel:fastInput:help,Entrada de comandos a partir do teclado sem clicar em outra posição.
 settingsPanel:fastInput:label,Entrada rápida
 settingsPanel:fastInput:title,ctrl + alt + f
-settingsPanel:iso:help,Exibir legendas ISO por padrão
-settingsPanel:iso:label,Use as legendas da chave ISO
+settingsPanel:osKeyboardLayout:title,
+settingsPanel:osKeyboardLayout:help,
+settingsPanel:osKeyboardLayout:label:keymap_german,Alemão (Alemanha e Áustria)
+settingsPanel:osKeyboardLayout:label:keymap_russian,Russo
+settingsPanel:osKeyboardLayout:label:keymap_uk,Inglês (Reino Unido)
+settingsPanel:osKeyboardLayout:label:keymap_us,Inglês (EUA)
 settingsPanel:kcno:label,KC_NO
 settingsPanel:kctrns:label,KC_TRNS
 settingsPanel:language:help,

src/i18n/ru.csv

@@ -111,8 +111,12 @@ settingsPanel:displaySizes:title,ctrl + alt + u
 settingsPanel:fastInput:help,Ввод клавиш через клавиатуру без необходимости нажимать на каждую позицию
 settingsPanel:fastInput:label,Быстрый ввод
 settingsPanel:fastInput:title,ctrl + alt + f
-settingsPanel:iso:help,Отображать легенды ISO по умолчанию
-settingsPanel:iso:label,Используйте ключевые легенды ISO
+settingsPanel:osKeyboardLayout:title,Раскладка клавиатуры операционной системы
+settingsPanel:osKeyboardLayout:help,Изменяет легенды клавиш в соответствии с раскладкой клавиатуры операционной системы.
+settingsPanel:osKeyboardLayout:label:keymap_german,Немецкий (Германия и Австрия)
+settingsPanel:osKeyboardLayout:label:keymap_russian,Русский
+settingsPanel:osKeyboardLayout:label:keymap_uk,Английский (Великобритания)
+settingsPanel:osKeyboardLayout:label:keymap_us,Английский (США)
 settingsPanel:kcno:label,KC_NO
 settingsPanel:kctrns:label,KC_TRNS
 settingsPanel:language:help,

src/i18n/zh-CN.csv

@@ -111,8 +111,12 @@ settingsPanel:displaySizes:title,ctrl + alt + u
 settingsPanel:fastInput:help,直接通过键盘输入键位
 settingsPanel:fastInput:label,快速输入
 settingsPanel:fastInput:title,ctrl + alt + f
-settingsPanel:iso:help,默认显示 ISO 图例
-settingsPanel:iso:label,使用 ISO 密钥图例
+settingsPanel:osKeyboardLayout:title,
+settingsPanel:osKeyboardLayout:help,
+settingsPanel:osKeyboardLayout:label:keymap_german,德语（德国和奥地利）
+settingsPanel:osKeyboardLayout:label:keymap_russian,俄语
+settingsPanel:osKeyboardLayout:label:keymap_uk,英语（英国）
+settingsPanel:osKeyboardLayout:label:keymap_us,英语（美国）
 settingsPanel:kcno:label,
 settingsPanel:kctrns:label,
 settingsPanel:language:help,更改用户界面语言

src/i18n/zh.csv

@@ -109,8 +109,12 @@ settingsPanel:displaySizes:title,
 settingsPanel:fastInput:help,
 settingsPanel:fastInput:label,
 settingsPanel:fastInput:title,
-settingsPanel:iso:help,
-settingsPanel:iso:label,
+settingsPanel:osKeyboardLayout:title,
+settingsPanel:osKeyboardLayout:help,
+settingsPanel:osKeyboardLayout:label:keymap_german,
+settingsPanel:osKeyboardLayout:label:keymap_russian,
+settingsPanel:osKeyboardLayout:label:keymap_uk,
+settingsPanel:osKeyboardLayout:label:keymap_us,
 settingsPanel:kcno:label,KC_NO
 settingsPanel:kctrns:label,KC_TRNS
 settingsPanel:language:help,

src/store/modules/app/actions.js

@@ -140,6 +140,11 @@ const actions = {
     commit('setCurrentLanguage', lang);
     await dispatch('saveConfiguratorSettings');
   },
+  async changeOSKeyboardLayout({ dispatch, commit }, osLayout) {
+    commit('setOSKeyboardLayout', osLayout);
+    this.commit('keycodes/changeKeyLegends');
+    await dispatch('saveConfiguratorSettings');
+  },
   // if init state we just load and not toggling
   async toggleDarkMode({ commit, state, dispatch }, init) {
     let darkStatus = state.configuratorSettings.darkmodeEnabled;
@@ -160,8 +165,6 @@ const actions = {
       iso = !iso;
     }
     commit('setIso', iso);
-    const keyboardLayout = iso ? 'enableIso' : 'disableIso';
-    this.commit(`keycodes/${keyboardLayout}`);
     await dispatch('saveConfiguratorSettings');
   },
   async toggleClearLayerDefault({ commit, state, dispatch }) {

src/store/modules/app/mutations.js

@@ -181,6 +181,9 @@ const mutations = {
   setDarkmode(state, value) {
     state.configuratorSettings.darkmodeEnabled = value;
   },
+  setOSKeyboardLayout(state, value) {
+    state.configuratorSettings.osKeyboardLayout = value;
+  },
   setIso(state, value) {
     state.configuratorSettings.iso = value;
   },

src/store/modules/app/state.js

@@ -15,7 +15,8 @@ function setDefaultConfiguratorSettings() {
     favoriteKeyboard: '',
     favoriteColor: '',
     clearLayerDefault: false,
-    iso: false
+    iso: false,
+    osKeyboardLayout: 'keymap_us'
   };
   localStorageSet(CONSTS.configuratorSettings, JSON.stringify(initialConfig));
   return initialConfig;
@@ -75,6 +76,13 @@ const state = {
     { value: 'ja', label: '日本語' },
     { value: 'zh-CN', label: '简体中文' }
   ],
+  osKeyboardLayouts: [
+    // The labels are translatable strings
+    'keymap_us',
+    'keymap_uk',
+    'keymap_german',
+    'keymap_russian'
+  ],
   snowflakes: false
 };