How can you increase an object's velocity if it collides with another object in JavaScript?

Question

I am currently working on a project in Code.org's Game Lab. In this game, if the object(bee) collides with another object, it's velocity should increase permanently. Is there any way to do this? Here is a link:

https://studio.code.org/projects/gamelab/bObYvRkfcSN938ptuiIyH0ZdF1de4jhaiOYZLgfTTwM/edit

Here is a code snippet:

//Making the bee
var bee = createSprite(200, 200);
//Set animation for 'bee' as bee_1
bee.setAnimation("bee_1");
//Scaling the bee tp 0.5x
bee.scale = 0.5;

var velocity = 2;
bee.velocityY = velocity;

//Making the walls


function draw() {
  background("white");

  createEdgeSprites();

  bee.bounceOff(edges);

  if (bee.isTouching(edges)) {
    velocity = velocity * 1.25;
  }
  /*
  if (keyDown("up")) {
    bee.velocityX = 0;
    bee.velocityY = velocity * -1;
  }
  else if (keyDown("down")) {
    bee.velocityX = 0;
    bee.velocityY = velocity;
  }
  else if (keyDown("right")) {
    bee.velocityX = velocit;
    bee.velocityY = 0;
  }
  else if (keyDown("left")) {
    bee.velocityX = -2;
    bee.velocityY = 0;
  }
  
  if (velocity>15) {
    velocity = 10;
  }
  else if (velocity<-15) {
    velocity = -10;
  }*/

  drawSprites();
}

Unfortunately, the snippet cannot be run as I don't have access to the HTML and CSS code. I have tried using the isTouching() method, but that method only works as long as the bee is touching the walls. I need a way to make it so that when the bee collides with any object (I plan on adding more sprites which will function as walls), the velocity variable is set to 1.25 times itself. i.e.

if (<insert condition here>) {
    velocity = velocity * 1.25;
}

I would appreciate any other tips on how to improve my code also.

score 0 · Answer 1 · edited May 14 '20 at 23:16

I did what you wanted me to do for the velocity, and added how I think you could improve your code. You don't have to do the changes if you don't want to. It is just optional. Here is the code of the conditional by itself:

  if (bee.bounceOff(s_edges)) {
    velocity = velocity * 1.25;
  }

if you want the full code then here it is:

showMobileControls(false, true, true, true);

var player = createGroup();
//Making the bee
var bee = createSprite(200,200);
//Set animation for 'bee' as bee_1
bee.setAnimation("bee_1");
//Scaling the bee to 0.5x
//I changed it to 1 for us to see it better. I also made the "exit" bigger
bee.scale = 1;
player.add(bee);

//Game Over animation
var endAnimation = createGroup();
var gameOver = createSprite(200,200);
gameOver.setAnimation("GameOver");
gameOver.scale = 0.5;
endAnimation.add(gameOver);

//I turned it off for it to look "better"
bee.debug = false;

var velocity = 5;

//Making the edges
var s_edges = createGroup();
var edge_left = createSprite(2.5,200,5,400);
var ebound_left = createSprite(2.49,200,5,400);
var edge_right = createSprite(397.5,200,5,400);
var ebound_right = createSprite(397.61,200,5,400);
var edge_top = createSprite(200,2.5,400,5);
var ebound_top = createSprite(200,2.49,400,5);
var edge_bottom = createSprite(132.5,397.7,355,5);
var ebound_bottom = createSprite(170,397.5,340,5);
var bound = createSprite(370,440,100,30);
var left_bound = createSprite(311,408,8,40);
var right_bound = createSprite(397,408,10,40);
s_edges.add(edge_left);
s_edges.add(edge_right);
s_edges.add(edge_top);
s_edges.add(edge_bottom);

var bounds = createGroup();
bounds.add(bound);
bounds.add(left_bound);
bounds.add(right_bound);

var failsafe = createGroup();
failsafe.add(ebound_bottom);


function draw() {
  var checker = bee.isTouching(s_edges);
  
  background("white");
  
     if (checker === true) {
      velocity = velocity *1.25;
    }
  
    if (keyDown("up")) {
      bee.velocityX = 0;
      bee.velocityY = velocity * -1;
    }
    else if (keyDown("down")) {
      bee.velocityX = 0;
      bee.velocityY = velocity;
    }
    else if (keyDown("right")) {
      bee.velocityX = velocity;
      bee.velocityY = 0;
    }
    else if (keyDown("left")) {
      bee.velocityX = velocity * -1;
      bee.velocityY = 0;
    }
    
    if (velocity>25) {
      velocity = 10;
    }
    else if (velocity<-25) {
      velocity = -10;
    }
  //I did what you wanted for the increase velocity over here
  if (bee.bounceOff(s_edges)) {
    velocity = velocity * 1.25;
  }
    
    bee.bounceOff(s_edges);
    bee.collide(bounds);
    failsafe.collide(bee);
    
      drawSprites(s_edges);
      drawSprites(player);
      drawSprites(bounds);
  //I changed the bee x and y
    if (bee.y>390 && 311<bee.x<311) {
      bee.destroy();
      background("gray");
      drawSprites(endAnimation);
    }
}

If you want it in code.org then here it is: https://studio.code.org/projects/gamelab/9Plf9wVdWthBxs8ML0ebRFWoQ73oI_VPiUk_o_tNhtk

I forgot to say that if you need more help then just reply to my answer, and I'll try to help — SECRETABC, May 14 '20 at 22:02
Thanks a lot. However, when you hold any of the arrow keys down and repeatedly bounce against the edge, sometimes, it glitches out and exits the canvas. Is there any way to fix this? Sometimes, this glitch activates the end animation too. — Ishaan Masil, May 15 '20 at 03:23
I saw a line of code that you did that managed the velocity if it goes too fast. Did it work? If it did not then reply, and I'll try to help. `if (velocity>25) { velocity = 10; } else if (velocity<-25) { velocity = -10; } ` — SECRETABC, May 15 '20 at 08:56
It works, but sometimes it causes the glitch when it gets to say, 19, then it resets, but the player loses control. — Ishaan Masil, May 16 '20 at 06:45
I didn't notice it. Maybe you could send a video if that's possible. A link is good. Include in the video what is happening. — SECRETABC, May 17 '20 at 08:35

How can you increase an object's velocity if it collides with another object in JavaScript?

1 Answers1