title: Make a bullet object in p5.js javascript
body: <p>i was making a javascript game in p5.js. I made a lot of the game, then wanted to add some combat. I made a weapon that shoots bullets. But now the bullet is hard to make. So here is how my weapon works:</p>
  
  <ol>
  <li>it starts from the player location</li>
  <li>it founds the y rotation of the mouse click (looks from the center of the screen and looks what degree rotation it is (360 degrees))</li>
  <li>looks to the y rotation of the mouse click</li>
  <li>goes off in the distance</li>
  </ol>
  
  <p>So how do I make the bullet? I have the base script, but the bullet only gets deleted when it hits a enemy, only goes to the mosue, has a dumb algorthm for path finding to the mouse, you can have only one bullet at once , and if it does not hit any enemies, it just sits on the ground like a mine.</p>
  
  <p>Here is the psuedo code(no programming rules at all lol):</p>
  
  <pre><code>Make bullet(playerPositionX,playerPositionY,mouseX,mousey) as a object:
   starter x and y = playerPostionX and playerPositionY
   lookTowards a point(mouseX,mouseY)
   goto the point(mouseX and mouseY) from the starter X and Y
   movespeed is 20pixel per frame
  </code></pre>
  
  <p>So here is what i got in my game right now is:
  The sketch script:</p>
  
  <pre><code>var player;
  var enemy;
  var bullet;
  var score = 0;
  function setup(){
    createCanvas(600,600);
    player = new Player();
    enemy = new Enemy();
    textSize(20);
  }
  function draw(){
    clear();
    background(51);
    enemy.show();
    enemy.moveToPlayer(player.x, player.y);
    player.show();
    player.MovePlayer();
    if (bullet != undefined){
      bullet.show();
      bullet.toMouse();
      if (dist(bullet.x,bullet.y,enemy.x,enemy.y) &lt;= enemy.r){
        enemy = new Enemy();
        score += 100;
        bullet = undefined;
      }
    }
    fill(255);
    text(score,500,500,100,100)
  }
  function mousePressed(){
    //if (enemy.clicked(mouseX,mouseY)){
    bullet = new Bullet(mouseX,mouseY,player.x,player.y);
    //enemy = new Enemy();
    //}
  }
  </code></pre>
  
  <p>The bullet script:</p>
  
  <pre><code>function Bullet(X,Y,PX,PY){
    this.speed = 20;
    this.x = PX;
    this.y = PY;
    this.r = 5;
    this.show = function(){
      fill(255,255,0);
      stroke(128,128,0);
      circle(this.x,this.y,this.r);
    }
    this.toMouse = function(){
      if (Y &lt; this.y){
        this.y += -1*this.speed;
      } else if (Y &gt; this.y) {
        this.y += 1*this.speed;
      }
      if (X &lt; this.x){
        this.x += -1*this.speed;
      } else if (X &gt; this.x){
        this.x += 1*this.speed;
      }
    }
  
  }
  </code></pre>
  
  <p>The enemy script:</p>
  
  <pre><code>function Enemy(){
    this.r = 25;
    this.x = 0+this.r;
    this.y = 0+this.r;
    this.chance = random(0,1);
    console.log(this.chance);
    if (this.chance &lt;= 0.10){
      this.speed = 3;
      this.r = 15;
      this.red = 0;
      this.green = 0;
      this.blue = 255;
    } else {
      this.speed = 2;
      this.red = 255;
      this.green = 0;
      this.blue = 0;
    }
    this.show = function(){
      fill(this.red,this.green,this.blue);
      stroke(128,0,0);
      circle(this.x,this.y,this.r);
    }
    this.moveToPlayer = function(playerX,playerY){
      if (playerY &lt; this.y){
        this.y += -1*this.speed;
      } else if (playerY &gt; this.y) {
        this.y += 1*this.speed;
      }
      if (playerX &lt; this.x){
        this.x += -1*this.speed;
      } else if (playerX &gt; this.x){
        this.x += 1*this.speed;
      }
    }
    /*
    this.clicked = function(mX,mY){
      if (dist(mX,mY,this.x,this.y) &lt;= this.r){
        return true;
      }
      return false;
    }
    */
  }
  </code></pre>
  
  <p>The player script:</p>
  
  <pre><code>function Player(){
    this.x = width/2;
    this.y = height/2;
    this.r = 20;
    this.speed = 4;
    this.show = function(){
      fill(0,255,0);
      stroke(0,128,0);
      circle(this.x,this.y,this.r);
    }
    this.moveY = function(number){
      this.y += (number*this.speed);
    }
    this.moveX = function(number){
      this.x += (number*this.speed);
    }
    this.MovePlayer = function(){
      if (keyIsDown(UP_ARROW)){
        if (this.y + (-1*20) &gt; 0)
          this.moveY(-1);
      }
      if (keyIsDown(DOWN_ARROW)){
        if (this.y + (1*20) &lt; height)
          this.moveY(1);
      }
      if (keyIsDown(LEFT_ARROW)){
        if (this.x + (-1*20) &gt; 0)
          this.moveX(-1);
      }
      if (keyIsDown(RIGHT_ARROW)){
        if (this.x + (1*20) &lt; width)
          this.moveX(1);
      }
    }
  }
  </code></pre>
  
  <p>The html file has everything it needs
  Thanks for advance!</p>
  
  <p><div class="snippet" data-lang="js" data-hide="true" data-console="false" data-babel="false">
  <div class="snippet-code snippet-currently-hidden">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var player;
  var enemy;
  var bullet;
  var score = 0;
  function setup(){
    createCanvas(600,600);
    player = new Player();
    enemy = new Enemy();
    textSize(20);
  }
  function draw(){
    clear();
    background(51);
    enemy.show();
    enemy.moveToPlayer(player.x, player.y);
    player.show();
    player.MovePlayer();
    if (bullet != undefined){
      bullet.show();
      bullet.toMouse();
      if (dist(bullet.x,bullet.y,enemy.x,enemy.y) &lt;= enemy.r){
        enemy = new Enemy();
        score += 100;
        bullet = undefined;
      }
    }
    fill(255);
    text(score,500,500,100,100)
  }
  function mousePressed(){
    //if (enemy.clicked(mouseX,mouseY)){
    bullet = new Bullet(mouseX,mouseY,player.x,player.y);
    //enemy = new Enemy();
    //}
  }
  
  function Bullet(X,Y,PX,PY){
    this.speed = 20;
    this.x = PX;
    this.y = PY;
    this.r = 5;
    this.show = function(){
      fill(255,255,0);
      stroke(128,128,0);
      circle(this.x,this.y,this.r);
    }
    this.toMouse = function(){
      if (Y &lt; this.y){
        this.y += -1*this.speed;
      } else if (Y &gt; this.y) {
        this.y += 1*this.speed;
      }
      if (X &lt; this.x){
        this.x += -1*this.speed;
      } else if (X &gt; this.x){
        this.x += 1*this.speed;
      }
    }
  
  }
  
  function Enemy(){
    this.r = 25;
    this.x = 0+this.r;
    this.y = 0+this.r;
    this.chance = random(0,1);
    console.log(this.chance);
    if (this.chance &lt;= 0.10){
      this.speed = 3;
      this.r = 15;
      this.red = 0;
      this.green = 0;
      this.blue = 255;
    } else {
      this.speed = 2;
      this.red = 255;
      this.green = 0;
      this.blue = 0;
    }
    this.show = function(){
      fill(this.red,this.green,this.blue);
      stroke(128,0,0);
      circle(this.x,this.y,this.r);
    }
    this.moveToPlayer = function(playerX,playerY){
      if (playerY &lt; this.y){
        this.y += -1*this.speed;
      } else if (playerY &gt; this.y) {
        this.y += 1*this.speed;
      }
      if (playerX &lt; this.x){
        this.x += -1*this.speed;
      } else if (playerX &gt; this.x){
        this.x += 1*this.speed;
      }
    }
    /*
    this.clicked = function(mX,mY){
      if (dist(mX,mY,this.x,this.y) &lt;= this.r){
        return true;
      }
      return false;
    }
    */
  }
  
  function Player(){
    this.x = width/2;
    this.y = height/2;
    this.r = 20;
    this.speed = 4;
    this.show = function(){
      fill(0,255,0);
      stroke(0,128,0);
      circle(this.x,this.y,this.r);
    }
    this.moveY = function(number){
      this.y += (number*this.speed);
    }
    this.moveX = function(number){
      this.x += (number*this.speed);
    }
    this.MovePlayer = function(){
      if (keyIsDown(UP_ARROW)){
        if (this.y + (-1*20) &gt; 0)
          this.moveY(-1);
      }
      if (keyIsDown(DOWN_ARROW)){
        if (this.y + (1*20) &lt; height)
          this.moveY(1);
      }
      if (keyIsDown(LEFT_ARROW)){
        if (this.x + (-1*20) &gt; 0)
          this.moveX(-1);
      }
      if (keyIsDown(RIGHT_ARROW)){
        if (this.x + (1*20) &lt; width)
          this.moveX(1);
      }
    }
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/p5.js"&gt;&lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>