From: Michael D. Lowis <mike@mdlowis.com>
Date: Wed, 14 Nov 2018 02:17:26 +0000 (-0500)
Subject: added fps counter and removed unused fields
X-Git-Url: https://git.mdlowis.com/?a=commitdiff_plain;h=0865ea0b007d9a2e6f6e4611818e63be612a82e1;p=proto%2Fjstoys.git

added fps counter and removed unused fields
---

diff --git a/raycast.html b/raycast.html
index 6b014ba..53dc55e 100644
--- a/raycast.html
+++ b/raycast.html
@@ -17,6 +17,19 @@ const FOCAL_LENGTH = 0.8;
 const VIEW_SCALER = 1.0;
 const MAP_SIZE = 32;
 
+const FrameTimer = (()=>{
+    let prev = 1, curr = 1;
+    const ctx = display.getContext('2d');
+    return {
+        update: (now) => (prev = curr, curr = now, (curr - prev) / 1000),
+        render: () => {
+            ctx.fillStyle = "Red";
+            ctx.font = "normal 12pt Arial";
+            ctx.fillText(Math.round(1/((curr - prev) / 1000)) + " fps", 10, 26);
+        }
+    };
+})();
+
 const Controls = (()=>{
     const self = { states: { 'left': false, 'right': false, 'forward': false, 'backward': false } };
     const codes = { 37: 'left', 39: 'right', 38: 'forward', 40: 'backward' };
@@ -125,6 +138,7 @@ const Camera = (()=>{
                 ctx.fillRect(i, wall.top, 1, wall.height);
             }
         });
+
         ctx.restore();
     };
 
@@ -143,8 +157,6 @@ const Camera = (()=>{
                 stepX.length2 = dx * dx + dy * dy;
                 stepX.height = Map.get(stepX.x - (data.cos < 0 ? 1 : 0), stepX.y);
                 stepX.distance = origin.distance + Math.sqrt(stepX.length2);
-                stepX.shading = data.cos < 0 ? 2 : 0;
-                stepX.offset = stepX.y - Math.floor(stepX.y);
             }
 
             if (data.sin !== 0) {
@@ -154,8 +166,6 @@ const Camera = (()=>{
                 stepY.length2 = dx * dx + dy * dy;
                 stepY.height = Map.get(stepY.x, stepY.y - (data.sin < 0 ? 1 : 0));
                 stepY.distance = origin.distance + Math.sqrt(stepY.length2);
-                stepY.shading = data.sin < 0 ? 2 : 1;
-                stepY.offset = stepY.x - Math.floor(stepY.x);
             }
 
             origin = (stepX.length2 < stepY.length2 ? stepX : stepY);
@@ -170,12 +180,11 @@ const Camera = (()=>{
 
 (() => {
     Map.randomize();
-    let time = 0;
     const loop = (now) => {
-        const seconds = (now - time) / 1000;
+        const seconds = FrameTimer.update(now);
         Player.update(seconds);
         Camera.render();
-        time = now;
+        FrameTimer.render();
         requestAnimationFrame(loop);
     };
     requestAnimationFrame(loop);