JSFiddle - React, Tailwind, and code Playground

by Michael Prosser

HTML

<span id="coords">0,0</span>

JavaScript

function AISHOOTER(config){
	
	var t = this;
  
  t.canvas = document.createElement('canvas');
  t.canvas.setAttribute('width',1000);
  t.canvas.setAttribute('height',1000);
  
  var body = document.querySelector('body');
  body.appendChild(t.canvas);
  
	t.ctx = t.canvas.getContext("2d");
	
	if(!config){
		
		config = {
			
			position: {
				x: 0,
				y: 0
			},
			yaw: 2,
			speed_patrol: 0.01,
			speed_rotate: 1
			
			
		}
		
	}
	
	t.move = function(){
		
		config.position.y += Math.cos(config.yaw) * config.speed_patrol;
		config.position.x += Math.sin(config.yaw) * config.speed_patrol;
    
    t.dom.innerText = config.position.x + ',' + config.position.y;

	}
  
  t.dom = document.getElementById('coords');
	
	t.render = function(){

		//ctx.clearRect(0, 0, canvas.width, canvas.height);

		//ctx.fillRect(x,y,150,75);

		t.move();

		window.requestAnimationFrame(t.render);

	}
	
	window.requestAnimationFrame(t.render);
	
}

var ai = new AISHOOTER();