set keyboard layout on control.

src/component/main.vue

@@ -117,6 +117,10 @@
           sensitivity: 1,
         },
         clipboard: null,
+        keyboard: {
+          layout: '',
+          variant: '',
+        },
         host_id: null,
         implicit_hosting: false,
       },
@@ -280,6 +284,10 @@
       Vue.set(this.state.control.scroll, 'sensitivity', value)
     }
 
+    public setKeyboard(layout: string, variant: string = '') {
+      Vue.set(this.state.control, 'keyboard', { layout, variant })
+    }
+
     public setScreenSize(width: number, height: number, rate: number) {
       //this.api.room.screenConfigurationChange({ screenConfiguration: { width, height, rate } })
       this.websocket.send('screen/set', { width, height, rate })
@@ -496,6 +504,14 @@
       document.removeEventListener('click', this.unmute)
     }
 
+    @Watch('controlling')
+    @Watch('state.control.keyboard')
+    updateKeyboard() {
+      if (this.controlling && this.state.control.keyboard.layout) {
+        this.websocket.send('keyboard/map', this.state.control.keyboard)
+      }
+    }
+
     @Watch('state.screen.size')
     onResize() {
       const { width, height } = this.state.screen.size

src/component/types/state.ts

@@ -50,6 +50,7 @@ export interface Video {
 export interface Control {
   scroll: Scroll
   clipboard: Clipboard | null
+  keyboard: Keyboard
   host_id: string | null
   implicit_hosting: boolean
 }
@@ -63,6 +64,11 @@ export interface Clipboard {
   text: string
 }
 
+export interface Keyboard {
+  layout: string
+  variant: string
+}
+
 /////////////////////////////
 // Screen
 /////////////////////////////