From fa94cf2ba37dee2c08f063aebb3d64085af2c15f Mon Sep 17 00:00:00 2001
From: Francisco Hodge <hello@franciscohodge.com>
Date: Sat, 6 Oct 2018 02:26:57 -0400
Subject: [PATCH] PhysicalKeyboard highlighting improvement

---
 src/lib/services/PhysicalKeyboard.js | 27 ++++++++++++++-------------
 1 file changed, 14 insertions(+), 13 deletions(-)

diff --git a/src/lib/services/PhysicalKeyboard.js b/src/lib/services/PhysicalKeyboard.js
index db87dcba..e2c79122 100644
--- a/src/lib/services/PhysicalKeyboard.js
+++ b/src/lib/services/PhysicalKeyboard.js
@@ -16,15 +16,13 @@ class PhysicalKeyboard {
       if(this.simpleKeyboardInstance.options.physicalKeyboardHighlight){
         let buttonPressed = this.getSimpleKeyboardLayoutKey(event);
 
-        this.simpleKeyboardInstance.dispatch(section => {
-          section.setOptions({
-            buttonTheme: [
-              {
-                class: "hg-selectedButton",
-                buttons: `${buttonPressed} {${buttonPressed}}`
-              }
-            ]
-          })
+        this.simpleKeyboardInstance.dispatch(instance => {
+          let buttonDOM = instance.getButtonElement(buttonPressed) || instance.getButtonElement(`{${buttonPressed}}`);
+
+          if(buttonDOM){
+            buttonDOM.style.backgroundColor = this.simpleKeyboardInstance.options.physicalKeyboardHighlightTextColor || "#9ab4d0";
+            buttonDOM.style.color = this.simpleKeyboardInstance.options.physicalKeyboardHighlightBgColor || "white";
+          }
         });
       }
     });
@@ -32,11 +30,14 @@ class PhysicalKeyboard {
     // Removing button style on keyup
     document.addEventListener("keyup", (event) => {
       if(this.simpleKeyboardInstance.options.physicalKeyboardHighlight){
+        let buttonPressed = this.getSimpleKeyboardLayoutKey(event);
 
-        this.simpleKeyboardInstance.dispatch(section => {
-          section.setOptions({
-            buttonTheme: []
-          })
+        this.simpleKeyboardInstance.dispatch(instance => {
+          let buttonDOM = instance.getButtonElement(buttonPressed) || instance.getButtonElement(`{${buttonPressed}}`);
+
+          if(buttonDOM){
+            buttonDOM.removeAttribute("style");
+          }
         });
       }
     });