diff options
1 files changed, 12 insertions, 0 deletions
| -rw-r--r-- | Year 2/Computer Graphics with WebGL/Project/Project.html | 12 |
diff --git a/Year 2/Computer Graphics with WebGL/Project/Project.html b/Year 2/Computer Graphics with WebGL/Project/Project.html index 7b62624..809a0ed 100644 --- a/Year 2/Computer Graphics with WebGL/Project/Project.html +++ b/Year 2/Computer Graphics with WebGL/Project/Project.html @@ -133,6 +133,8 @@ h2 { var pauseAnimations = false;
var t = 0;
+ var lastTime = 0;
+ var frames = 0;
function drawFrame()
{
if (startT == -1) { startT = Date.now(); t = 0; }
@@ -140,6 +142,13 @@ h2 { if (pauseAnimations) startT += (candidat - t)*100;
else t = candidat;
+ var now = Math.floor(Date.now() / 1000);
+ if (now - lastTime >= 1) {
+ fpsElem.innerText = Math.floor(frames / (now - lastTime));
+ frames = 0;
+ lastTime = now;
+ }
+
gl.clear(gl.COLOR_BUFFER_BIT+gl.DEPTH_BUFFER_BIT);
updateCamera();
@@ -149,6 +158,7 @@ h2 { if (!pauseAnimations || t == 0) animations.forEach((a) => a(t));
stars.forEach((s) => s.draw());
+ frames++;
requestAnimationFrame(drawFrame);
}
</script>
@@ -177,11 +187,13 @@ h2 { <p>
Debugging colors: <input type="checkbox" id="debug-mode"><br>
Toggle coordinates: <input type="checkbox" id="coordinates-cb"><br>
+ Toggle fps: <input type="checkbox" id="fps-cb"><br>
Only horizontal mouse movement: <input type="checkbox" id="only-horizontal"><br>
Only vertical mouse movement: <input type="checkbox" id="only-vertical">
</p>
</div>
</div>
<div id="coordinates"></div>
+ <div id="fps"></div>
<script src="menu.js"></script>
</body>
|