fix hover state by emitting mouseleave when option is no longer active (fixes #1)

src/components/active-color.js

@@ -19,6 +19,9 @@ AFRAME.registerComponent('active-color', {
       el.setAttribute('material', 'color', this.data.color);
     } else {
       el.setAttribute('material', 'color', this.defaultColor);
+      if (el.components.animation__mouseleave) {
+        setTimeout(() => { el.emit('mouseleave', null, false); });
+      }
     }
   },
 });

src/index.html

@@ -44,7 +44,7 @@
       </a-entity>
 
       <a-entity id="cameraRig">
-        <a-entity id="camera" position="0 1.6 0.5" camera look-controls></a-entity>
+        <a-entity id="camera" position="0 1.6 0.5" camera look-controls wasd-controls></a-entity>
         <a-entity id="leftHand"
           saber-controls="hand: left"
           proxy-event__pause="event: menudown; to: a-scene; as: pause"