From 1cbcdbeee3e317bb4a194cd004b156fe0ace0cd4 Mon Sep 17 00:00:00 2001
From: "Joshua A. Horton" <joshua_horton@sil.org>
Date: Tue, 26 Feb 2019 15:40:37 +0700
Subject: [PATCH] Polishes the fix, better incorporating it into the design.

---
 web/source/osk/visualKeyboard.ts | 26 ++++++++++++--------------
 1 file changed, 12 insertions(+), 14 deletions(-)

diff --git a/web/source/osk/visualKeyboard.ts b/web/source/osk/visualKeyboard.ts
index 90c8491561..8009b45034 100644
--- a/web/source/osk/visualKeyboard.ts
+++ b/web/source/osk/visualKeyboard.ts
@@ -66,10 +66,11 @@ namespace com.keyman.osk {
 
   export abstract class OSKKey {
     spec: OSKKeySpec;
-    layer: string;
+    readonly layer: string;
 
-    constructor(spec: OSKKeySpec) {
+    constructor(spec: OSKKeySpec, layer: string) {
       this.spec = spec;
+      this.layer = layer;
     }
 
     abstract getId(osk: VisualKeyboard): string;
@@ -249,8 +250,8 @@ namespace com.keyman.osk {
   }
 
   export class OSKBaseKey extends OSKKey {
-    constructor(spec: OSKKeySpec) {
-      super(spec);
+    constructor(spec: OSKKeySpec, layer: string) {
+      super(spec, layer);
     }
 
     getId(osk: VisualKeyboard): string {
@@ -313,13 +314,11 @@ namespace com.keyman.osk {
       btn.appendChild(skIcon);
     }
 
-    construct(osk: VisualKeyboard, layout: LayoutFormFactor, layerId: string, rowStyle: CSSStyleDeclaration, totalPercent: number): {element: HTMLDivElement, percent: number} {
+    construct(osk: VisualKeyboard, layout: LayoutFormFactor, rowStyle: CSSStyleDeclaration, totalPercent: number): {element: HTMLDivElement, percent: number} {
       let util = (<KeymanBase>window['keyman']).util;
       let spec = this.spec;
       let isDesktop = util.device.formFactor == 'desktop'
 
-      this.layer = layerId;
-
       let kDiv=util._CreateElement('div');
       kDiv.className='kmw-key-square';
 
@@ -405,8 +404,8 @@ namespace com.keyman.osk {
   }
 
   export class OSKSubKey extends OSKKey {
-    constructor(spec: OSKKeySpec) {
-      super(spec);
+    constructor(spec: OSKKeySpec, layer: string) {
+      super(spec, layer);
     }
 
     getId(osk: VisualKeyboard): string {
@@ -845,8 +844,8 @@ namespace com.keyman.osk {
           for(j=0; j<keys.length; j++) {
             key=keys[j];
             
-            var keyGenerator = new OSKBaseKey(key);
-            var keyTuple = keyGenerator.construct(this, layout, layer['id'], rs, totalPercent);
+            var keyGenerator = new OSKBaseKey(key, layer['id']);
+            var keyTuple = keyGenerator.construct(this, layout, rs, totalPercent);
 
             rDiv.appendChild(keyTuple.element);
             totalPercent += keyTuple.percent;
@@ -1372,8 +1371,7 @@ namespace com.keyman.osk {
       // The holder is position:fixed, but the keys do not need to be, as no scrolling
       // is possible while the array is visible.  So it is simplest to let the keys have
       // position:static and display:inline-block
-      var subKeys=document.createElement('DIV'),i,
-        t,ts,t1,ts1,kDiv,ks,btn,bs;
+      var subKeys=document.createElement('DIV'),i;
 
       var tKey = this.getDefaultKeyObject();
 
@@ -1412,7 +1410,7 @@ namespace com.keyman.osk {
           needsTopMargin = true;
         }
 
-        let keyGenerator = new com.keyman.osk.OSKSubKey(subKeySpec[i]);
+        let keyGenerator = new com.keyman.osk.OSKSubKey(subKeySpec[i], e['key'].layer);
         let kDiv = keyGenerator.construct(this, <HTMLDivElement> e, needsTopMargin);
         
         subKeys.appendChild(kDiv);