title: Shooting bullets from player towards mouse?
body: <p>How do I shoot bullets from my Player X and Y towards the mouse x and y? </p>
  
  <p>I can find the angle of the mouse X and Y but I have no idea how to create a bullet which will fly towards the mouse.</p>
  
  <p>The code for the mouse coordinates are (dx, dy).</p>
  
  <p>Also, if you could explain the logic behind what you did and how you did it, I would be greatful.</p>
  
  <p>Thanks!</p>
  
  <p><a href="https://jsfiddle.net/mmkzes7n/15/" rel="nofollow noreferrer">Fiddle</a></p>
  
  <pre><code>  var canvas = document.getElementById('canvas');
    var context = canvas.getContext('2d');
    var pressingDown = false;
    var pressingUp = false;
    var pressingLeft = false;
    var pressingRight = false;
    var mouseX, mouseY;
  
    function Player(x, y) {
      this.x = x;
      this.y = y;
      this.angle;
    }
  
    Player.prototype.draw = function() {
      context.save();
      context.translate(this.x, this.y);
      context.rotate(this.angle);
  
      context.beginPath();
      context.fillStyle = "green";
      context.arc(0, 0, 30, 0, 2 * Math.PI);
      context.fill();
  
      context.fillStyle = "red";
      context.fillRect(0, -10, 50, 20);
  
      context.restore();
    }
  
    Player.prototype.update = function(mouseX, mouseY) {
      var dx = mouseX - this.x;
      var dy = mouseY - this.y;
      this.angle = Math.atan2(dy, dx);
    }
  
  
    canvas.addEventListener('mousemove', mouseMove);
  
  
    function mouseMove(evt) {
      mouseX = evt.x;
      mouseY = evt.y;
    }
  
    var player = new Player(350, 250);
  
  
    function updatePlayer() {
      context.clearRect(0, 0, canvas.width, canvas.height);
      player.draw();
      player.update(mouseX, mouseY);
      updatePlayerPosition();
    }
  
    document.onkeydown = function(event) {
      if (event.keyCode === 83) //s
        pressingDown = true;
      else if (event.keyCode === 87) //w
        pressingUp = true;
      else if (event.keyCode === 65) //a
        pressingLeft = true;
      else if (event.keyCode === 68) //d
        pressingRight = true;
    }
  
    document.onkeyup = function(event) {
      if (event.keyCode === 83) //s
        pressingDown = false;
      else if (event.keyCode === 87) //w
        pressingUp = false;
      else if (event.keyCode === 65) //a
        pressingLeft = false;
      else if (event.keyCode === 68) //d
        pressingRight = false;
    }
  
    updatePlayerPosition = function() {
      if (pressingRight)
        player.x += 1;
      if (pressingLeft)
        player.x -= 1;
      if (pressingDown)
        player.y += 1;
      if (pressingUp)
        player.y -= 1;
    }
  
    function update() {
      updatePlayer();
    }
  
    setInterval(update, 0)
  </code></pre>
  
  <p></p>