Adjust gravity and jump force

game.js

@@ -160,7 +160,7 @@ function getObjects(world, z, x, glContext) {
 }
 
 function updatePhysics(params) {
-    params.camera.velocity[1] -= 9.8 / 60 / 60;
+    params.camera.velocity[1] += params.gravity / 60 / 60;
 
     const oldPos = params.camera.position;
     const targetPos = params.flying ? oldPos : params.camera.position.map((v, i) => v + params.camera.velocity[i]);
@@ -243,6 +243,14 @@ export function setupParamPanel(params) {
     document.querySelector('#ambiant').oninput = e => {
         params.ambiantLight = e.target.value / 100;
     };
+    document.querySelector('#gravity').oninput = e => {
+        params.gravity = e.target.value;
+        document.querySelector('#gravityValue').textContent = e.target.value;
+    };
+    document.querySelector('#jumpForce').oninput = e => {
+        params.jumpForce = e.target.value / 100;
+        document.querySelector('#jumpForceValue').textContent = e.target.value / 100;
+    };
 
     const collapsibles = document.getElementsByClassName("collapsible");
     for (const collapsible of collapsibles) {
@@ -309,7 +317,7 @@ export function initUiListeners(params, canvas) {
                     case 'Space':
                         if (!params.flying) {
                             if (params.jumpAmount > 0) {
-                                const amount = 0.08;
+                                const amount = params.jumpForce;
                                 params.camera.velocity[1] = amount;
                                 params.jumpAmount -= 1;
                             }

index.html

@@ -63,6 +63,15 @@
                     <input type="range" min="0" max="100" value="50" class="slider" id="ambiant" />
                 </p>
             </div>
+            <div class="paramPanel">
+                <h3>Physics</h3>
+                <p>
+                    Gravity: <span id="gravityValue"></span><input type="range" min="-100" max="100" value="-10" class="slider" id="gravity" />
+                </p>
+                <p>
+                    Jump force: <span id="jumpForceValue"></span><input type="range" min="-100" max="100" value="10" class="slider" id="jumpForce" />
+                </p>
+            </div>
         </div>
     </div>
 </body>

index.js

@@ -28,6 +28,8 @@ async function main() {
         isOnGround: false,
         world: makeWorld(),
         worldGl: await initWorldGl(gl),
+        gravity: -17,
+        jumpForce: 0.11,
     }
 
     setupParamPanel(params);