JSFiddle - React, Tailwind, and code Playground
by WolfeSVK
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.11/p5.min.js"></script>
JavaScript
var smokes = [];
var bullets = [];
var debug = false;
function PlayerShip (x, y, angle, size, col) {
this.pos = createVector(x, y);
this.angle = angle;
this.col = col;
this.size = size;
this.vel = createVector(0, 0);
this.acc = createVector(0, 0);
this.isThrusting = false;
var friction = 0.01;
this.thrust = function() {
var thruster = createVector(cos(radians(this.angle-90)), sin(radians(this.angle-90)));
thruster.mult(size*2);
thruster.mult(-1);
thruster.add(this.pos);
smokes.push(new Smoke(thruster.x, thruster.y, this.size, 100));
//smokes.push(new Smoke(this.pos.x, this.pos.y, this.size, 100));
ship.acc.set(cos(radians(ship.angle-90)), sin(radians(ship.angle-90)));
this.isThrusting = true;
}
this.rotLeft = function() {
this.angle -= 8;
}
this.rotRight = function() {
this.angle += 8;
}
this.shoot = function() {
var gun = createVector(cos(radians(this.angle-90)), sin(radians(this.angle-90)));
gun.mult(size);
gun.add(this.pos);
var bulletVel = createVector(cos(radians(this.angle-90)), sin(radians(this.angle-90)));
bulletVel.mult(this.vel.mag()+5);
bullets.push(new Bullet(gun.x, gun.y, bulletVel, this.size/2, 100));
}
this.update = function() {
if (this.angle >360)
this.angle -= 360;
if (this.angle <0)
this.angle = 360-this.angle;
this.acc.normalize();
this.acc.div(10);
// console.log(this.vel.mag());
this.vel.add(this.acc);
this.vel.limit(6);
this.pos.add(this.vel);
//this.acc.set(0, 0);
if (this.pos.x-this.size>width)
this.pos.x = -this.size;
if (this.pos.x+this.size<0)
this.pos.x = width+this.size;
if (this.pos.y-this.size>height)
this.pos.y = -this.size;
if (this.pos.y+this.size<0)
this.pos.y = height+this.size;
this.vel.mult(1-friction);
};
this.draw = function() {
var x = this.pos.x;
var y = this.pos.y;
push();
...