JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="mainCanvas" width="800" height="600" />

JavaScript

var canvas = document.getElementById("mainCanvas");
var ctx = canvas.getContext("2d");

/* paddle */
var paddleHeight = 100;
var paddleWidth  = 10;
var paddleY      = (canvas.height-paddleHeight)/2;

/* paddle movement */

var upPressed    = false;
var downPressed  = false;

/* ball */

var ballRadius = 15;
var xBall = canvas.width/2;
var yBall = canvas.height/2;

/* ball movement */

var dxBall = 3.5;
var dyBall = 3.5;

var score  = 0;

// Maths
function Mathematics()
{

}

Mathematics.prototype.PointInRect = function(pnt_x, pnt_y, rect_x, rect_y, rect_w, rect_h)
{
    if ( (pnt_x >= rect_x) && (pnt_x <= rect_x + rect_w - 1) )
    {
        if ( (pnt_y >= rect_y) && (pnt_y <= rect_y + rect_h - 1) )
        {return true;}
    }
    return false;
}

Mathematics.prototype.RectToRectCollision = function(rect1_x, rect1_y, rect1_w, rect1_h,
                             rect2_x, rect2_y, rect2_w, rect2_h)
{
    // top-left corner
    if ( this.PointInRect(rect1_x, rect1_y, rect2_x, rect2_y, rect2_w, rect2_h) ){return true;}
    // top-right corner
    if ( this.PointInRect(rect1_x + rect1_w - 1, rect1_y, rect2_x, rect2_y, rect2_w, rect2_h) ){return true;}
    // bottom-right corner
    if ( this.PointInRect(rect1_x + rect1_w - 1, rect1_y + rect1_h - 1, rect2_x, rect2_y, rect2_w, rect2_h) ){return true;}
    // bottom-left corner
    if ( this.PointInRect(rect1_x, rect1_y + rect1_h - 1, rect2_x, rect2_y, rect2_w, rect2_h) ){return true;}
    // Check to see if rectangle 2 is hit any part of rectanlge 1
    // top-left corner
    if ( this.PointInRect(rect2_x, rect2_y, rect1_x, rect1_y, rect1_w, rect1_h) ){return true;}
    // top-right corner
    if ( this.PointInRect(rect2_x + rect2_w - 1, rect2_y, rect1_x, rect1_y, rect1_w, rect1_h) ){return true;}
    // bottom-right corner
    if ( this.PointInRect(rect2_x + rect2_w - 1, rect2_y + rect2_h - 1, rect1_x, rect1_y, rect1_w, rect1_h) ){return true;}
    // bottom-left corner
    if ( this.PointInRect(rect2_x, rect2_y +...