JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper" class="noSelect">
		<div id="canvas" style="overflow: auto; width: 700px; height: 500px; float: left; display: inline; position: relative;">
			<canvas id="Game" width="600px" height="400px" style="border: 2px solid #000000; position: absolute;">update your browser, fool!</canvas>
		</div>
	</div>

JavaScript

//global variables
		//create the canvas
		var canvas = document.getElementById("Game");
		var ctx = canvas.getContext("2d");
		//game speed
		var FPS = 30;
		//mouse position handlers
		var mx = 10;
		var my = 10;
		var cursorx = 0;
		var cursory = 0;
		
		//canvas object.  The drawing of data will be based upon relative data, and this is the relative data.  Basically, how big is the canvas, and what point are we calling the origin?
		var canWindow = {
			relX: 0, //x value of the dot that exists in the top-left corner of the viewing window
			relY: 0, //y value of the dot that exists in the top-left corner of the viewing window
			windowSize: [600, 400], //self-explanatory
			totalCanvasSize: [600, 400], //total size of the area we are working with
			pointPosition: new Array(), //array to store vertex objects
		}
		
		//construct the position tracker
		for (i=0; i<=canWindow.totalCanvasSize[1]/10; i++) {
			canWindow.pointPosition[i] = new Array();
			for (k=0; k<=canWindow.totalCanvasSize[0]/10; k++) {
				canWindow.pointPosition[i][k] = 0;
			}
		}

		//The point class.  Master class for all points
		function Point(x, y) {
			//position variable
			this.positionOnCanvas = [x, y];
			this.tick = function() { //tick function that is in all point classes (in this case it does nothing)
			}
		}
		
		//the temporary point class.  Useful for displaying points that don't do anything yet
		function TempPoint(x, y) {
			//position variable
			this.positionOnCanvas = [x, y];
			this.tick = function() { //tick function that is in all point classes
				//get the relative position of the point
				var posx = this.positionOnCanvas[0] - canWindow.relX;
				var poxy = this.positionOnCanvas[1] - canWindow.relY;
				//draw the point
				ctx.fillStyle = "blue";
				ctx.fillRect(posx-2, poxy-2, 4, 4);
			}
		}
		//set temp's parent to the Point class
		TempPoint.prototype = new Point();
		
		//the LinePoint class.  Each line consists of two points.
		function LinePoint(x, y,...