diff --git a/src/state/index.js b/src/state/index.js
index 1a468ec..f51f846 100644
--- a/src/state/index.js
+++ b/src/state/index.js
@@ -29,6 +29,7 @@ AFRAME.registerState({
     inVR: false,
     isPaused: false,  // Playing, but paused. Not active during menu.
     isPlaying: false,  // Not in the menu AND not paused.
+    keyboardActive: false,
     menu: {
       active: true,
       playButtonText: 'Play'
@@ -56,8 +57,7 @@ AFRAME.registerState({
       hasPrev: false,
       results: [],
     },
-    searchResultsPage: [],
-    showKeyboard: false
+    searchResultsPage: []
   },
 
   handlers: {
@@ -86,8 +86,12 @@ AFRAME.registerState({
       state.challenge.isLoading = true;
     },
 
-    closekeyboard: (state) => {
-      state.showKeyboard = false;
+    keyboardclose: (state) => {
+      state.keyboardActive = false;
+    },
+
+    keyboardopen: (state) => {
+      state.keyboardActive = true;
     },
 
     /**
@@ -115,10 +119,6 @@ AFRAME.registerState({
       state.menuSelectedChallenge.difficulty = difficulty;
     },
 
-    openkeyboard: (state) => {
-      state.showKeyboard = true;
-    },
-
     pausegame: (state) => {
       state.isPaused = true;
     },
diff --git a/src/templates/menu.html b/src/templates/menu.html
index 715fbfb..09d8b8f 100644
--- a/src/templates/menu.html
+++ b/src/templates/menu.html
@@ -194,17 +194,23 @@
   animation__mouseleave1="property: slice9.color; type: color; from: #FFF; to: #999; startEvents: mouseleave; pauseEvents: mouseenter; dur: 150"
   animation__mouseenter2="property: scale; from: 1 1 1; to: 1.1 1.1 1.1; startEvents: mouseenter; pauseEvents: mouseleave; dur: 150"
   animation__mouseleave2="property: scale; to: 1 1 1; from: 1.1 1.1 1.1; startEvents: mouseleave; pauseEvents: mouseenter; dur: 150"
-  bind-toggle__raycastable="menu.active && !showKeyboard"
-  bind__visible="menu.active && !showKeyboard"
-  proxy-event="event: click; to: a-scene; as: openkeyboard">
+  bind-toggle__raycastable="menu.active && !keyboardActive"
+  bind__visible="menu.active && !keyboardActive"
+  proxy-event="event: click; to: a-scene; as: keyboardopen">
   <a-entity mixin="textFont" text="align: center; color: #AAA; wrapCount: 20; value:SEARCH SONG" position="0 -0.07 0.01"></a-entity>
 </a-entity>
 
 
-<a-entity id="keyboard" super-keyboard="label: Search song name or author:; width: 1; hand: {{ DEBUG_KEYBOARD and '#mouseCursor' or '#rightHand' }}; imagePath: assets/img/keyboard/; injectToRaycasterObjects: false" position="0 0.8 -1" rotation="-40 0 0" keyboard-raycastable search bind__super-keyboard="show: showKeyboard"
-proxy-event__dismiss="event: superkeyboarddismiss; to: a-scene; as: closekeyboard"
-proxy-event__accept="event: superkeyboardinput; to: a-scene; as: closekeyboard"
-></a-entity>
+<a-entity
+  id="keyboard"
+  bind__super-keyboard="show: keyboardActive"
+  super-keyboard="label: Search song name or author:; width: 1; hand: {{ DEBUG_KEYBOARD and '#mouseCursor' or '#rightHand' }}; imagePath: assets/img/keyboard/; injectToRaycasterObjects: false"
+  position="0 0.8 -1"
+  rotation="-40 0 0"
+  keyboard-raycastable
+  search
+  proxy-event__dismiss="event: superkeyboarddismiss; to: a-scene; as: keyboardclose"
+  proxy-event__accept="event: superkeyboardinput; to: a-scene; as: keyboardclose"></a-entity>
 
 <!-- Representation of the song information during play mode. Not part of menu.
      TODO: Move to different template along with score and such. -->