The user can now enable CPU stress to simulate an

Lukas Meier · Lukas Meier · commit 56fad2a435f8 · 2020-03-06T09:38:11.000+01:00
FPS-Drop
diff --git a/index.html b/index.html
@@ -12,14 +12,22 @@
       }
       #canvas{
         border: 1px solid #dedede;
-        margin: 50px auto;
         display: block;
         background-color: #fff;
         box-shadow: 15px 15px 15px rgba(0,0,0,0.2);
+        margin-bottom: 50px;
+      }
+
+      #container{
+        margin: 50px auto;
+        width: 1000px;
       }
     </style>
   </head>
   <body>
-    <canvas width="1000" height="500" id="canvas"></canvas>
+    <div id="container">
+      <canvas width="1000" height="500" id="canvas"></canvas>
+      <input type="checkbox" id="stress"><label for="stress">Stress the CPU to simulate FPS-Drop?</label>
+    </div>
   </body>
 </html>
diff --git a/js/main.js b/js/main.js
@@ -1,3 +1,12 @@
 window.onload = function () {
     window["graph"] = new Graph();
+    var stress = document.getElementById("stress");
+    stress.onchange = function () {
+        if (stress.checked) {
+            window["graph"].dropFps = true;
+        }
+        else {
+            window["graph"].dropFps = false;
+        }
+    };
 };
diff --git a/ts/Graph.ts b/ts/Graph.ts
@@ -169,6 +169,7 @@ class Graph {
     this.drawDurationGraph();
     this.drawScrollPercentage();
     this.drawFps();
+
     if (this.dropFps) {
       this.overload();
     }
@@ -319,7 +320,7 @@ class Graph {
    * to stress the CPU and drop the FPS
    * Call this in the draw() function
    */
-  overload() {
+  overload(): void {
     this.songs.forEach(song => {
       for (let i = 0; i < 100; i++) {
         let sqrt = Math.sqrt(this.timeStringToSeconds(song.duration));
diff --git a/ts/main.ts b/ts/main.ts
@@ -1,3 +1,11 @@
 window.onload = () => {
   window["graph"] = new Graph();
+  const stress = document.getElementById("stress") as HTMLInputElement
+  stress.onchange = () => {
+    if(stress.checked){
+      window["graph"].dropFps = true;
+    }else{
+      window["graph"].dropFps = false;
+    }
+  }
 };
