added more options

ParisNeo · Jul 15, 2024 · 36331a5 · 36331a5
1 parent 4e26ace
commit 36331a5
Showing 1 changed file with 13 additions and 1 deletion.
diff --git a/level_app/index.html b/level_app/index.html
@@ -49,10 +49,22 @@
                 const offsetX = Math.min(Math.max(x * 10, -maxOffset), maxOffset);
                 const offsetY = Math.min(Math.max(y * 10, -maxOffset), maxOffset);
 
+                bubble.style.transform = `translate(${offsetX}px, ${-offsetY}px)`;
+            });
+        } else if (window.DeviceOrientationEvent) {
+            window.addEventListener('deviceorientation', function(event) {
+                const bubble = document.getElementById('bubble');
+                const x = event.beta; // In degree in the range [-180,180]
+                const y = event.gamma; // In degree in the range [-90,90]
+                const maxOffset = 135; // half of the level's width/height minus half of the bubble's width/height
+
+                const offsetX = Math.min(Math.max(y * 1.5, -maxOffset), maxOffset);
+                const offsetY = Math.min(Math.max(x * 1.5, -maxOffset), maxOffset);
+
                 bubble.style.transform = `translate(${offsetX}px, ${-offsetY}px)`;
             });
         } else {
-            alert("DeviceMotionEvent is not supported on your device.");
+            alert("DeviceMotionEvent and DeviceOrientationEvent are not supported on your device.");
         }
     </script>
 </body>