Every file but they're all identical and this commit is confusing me

game.html

@@ -23,22 +23,25 @@
         cc = c.getContext('2d');
         c.height = window.innerHeight;
         c.width = window.innerWidth;
-        setInterval(update, 1000 / 30);
         c.addEventListener('mousemove', function(e) {
             p1y = e.clientY - ph / 2;
-        })
+        });
 
-        //game setup
+        lastTime = Date.now();
+        deltaTime = 0;
+        fps = 0;
+
+        //gameplay variables
         p1y = p2y = 40;
         pt = 10;
         ph = 100;
-        bx = by = xv = yv = 10;
-        reset();
-        bd = 6;
+        bx = by = xv = yv = 500;//just making sure bx and by exist, they'll be reset when the game first starts
+        bd = 12;
         score1 = score2 = 0;
         ais = 5;
 
 
+
         function reset() {
             bx = c.width / 2;
             by = c.height / 2;
@@ -47,9 +50,14 @@
         }
 
         function update() {
+            //measure timing
+            now = Date.now();
+            deltaTime = (now-lastTime)/1000;
+            lastTime = now;
+            fps = 1/deltaTime;
             //move ball
-            bx += xv;
-            by += yv;
+            bx += xv * deltaTime;
+            by += yv * deltaTime;
             if (by < 0 && yv < 0) {
                 yv = -yv;
             }
@@ -61,7 +69,7 @@
                 if (by > p2y && by < p2y + ph) {
                     xv = -xv;
                     dy = by - (p2y + ph / 2);
-                    yv = dy * .3;
+                    yv = dy * 10;
                 } else {
                     score1++;
                     reset();
@@ -71,7 +79,7 @@
                 if (by > p1y && by < p1y + ph) {
                     xv = -xv;
                     dy = by - (p1y + ph / 2);
-                    yv = dy * .3;
+                    yv = dy * 10;//.3
                 } else {
                     score2++
                     reset();
@@ -84,18 +92,33 @@
                 p2y -= ais;
             }
             //draw background
-            cc.fillStyle = 'black';
+            var gradient=cc.createLinearGradient(0,0,c.width,c.height);
+            gradient.addColorStop("0","#ff146e");
+            gradient.addColorStop("1","#145aff");
+            cc.fillStyle=gradient;
+//            cc.fillStyle="white";
             cc.fillRect(0, 0, c.width, c.height);
             //draw paddles
-            cc.fillStyle = 'white';
+            cc.fillStyle = 'cyan';
             cc.fillRect(0, p1y, pt, ph);
+            cc.fillStyle = 'red';
             cc.fillRect(c.width - pt, p2y, pt, ph);
             //draw ball
+            cc.fillStyle = 'lightgreen';
             cc.fillRect(bx - bd / 2, by - bd / 2, bd, bd);
+            //draw scores
+            cc.fillStyle = 'white';
+            cc.font = '20px Times'
             cc.fillText(score1, 100, 100);
             cc.fillText(score2, c.width - 100, 100);
+            //draw framerate
+            cc.fillText("framerate: " + fps, c.width/2 - 100, 100);
+
+            window.requestAnimationFrame(update); //Keep the game running
         }
+        reset() //prepare the game
+        update() //start the game
     </script>
 </body>
 
-</html>
+</html>