Fix toggleable button in hand-tracking example (#5504)

Author: vincentfretin

examples/showcase/hand-tracking/button.js

@@ -3,7 +3,7 @@ AFRAME.registerComponent('button', {
   schema: {
     label: {default: 'label'},
     width: {default: 0.11},
-    toggable: {default: false}
+    toggleable: {default: false}
   },
   init: function () {
     var el = this.el;
@@ -58,7 +58,7 @@ AFRAME.registerComponent('button', {
     var el = this.el;
     el.setAttribute('material', {color: 'green'});
     el.emit('click');
-    if (this.data.togabble) {
+    if (this.data.toggleable) {
       if (el.is('pressed')) {
         el.removeState('pressed');
       } else {

examples/showcase/hand-tracking/index.html

@@ -55,7 +55,7 @@
         <a-entity id="sphereButton" button="label: sphere" position="-0.15 0 0"></a-entity>
         <a-entity id="boxButton" button="label: box" position="0 0 0"></a-entity>
         <a-entity id="torusButton" button="label: torus" position="0.15 0 0"></a-entity>
-        <a-entity id="darkModeButton" button="label: Dark Mode; width: 0.20; toggable: true" position="0 -0.10 0"></a-entity>
+        <a-entity id="darkModeButton" button="label: Dark Mode; width: 0.20; toggleable: true" position="0 -0.10 0"></a-entity>
       </a-entity>
       <a-entity hand-tracking-controls="hand: left"></a-entity>
       <a-entity hand-tracking-controls="hand: right"></a-entity>

examples/test/layer/button.js

@@ -3,7 +3,7 @@ AFRAME.registerComponent('button', {
   schema: {
     label: {default: 'label'},
     width: {default: 0.50},
-    toggable: {default: false}
+    toggleable: {default: false}
   },
   init: function () {
     var el = this.el;