CHANNELS:

All
AlphaLazer posted 2 years ago
AlphaLazer posted 2 years ago

sorry first post here didn't give it the canvas tag and not sure how to lol

0
AlphaLazer posted 2 years ago
Best Reply

actually I figured it out fellas! incase anybody else is curious I replaced the start of my animate script with this:

function animate() {
  const animationId = window.requestAnimationFrame(animate);

  // Clear the canvas
  c.clearRect(0, 0, canvas.width, canvas.height);

  // Check if the camera has reached the end of the canvas
  const reachedEndX = player.position.x < offset.x || player.position.x > offset.x + canvas.width;
  const reachedEndY = player.position.y < offset.y || player.position.y > offset.y + canvas.height;

  // Render the game elements
  if (reachedEndX || reachedEndY) {
    // Render black background
    c.fillStyle = 'black';
    c.fillRect(0, 0, canvas.width, canvas.height);
  } else {
    // Render the image background
    background.draw();
  }

  // Render the rest of the elements
  renderables.forEach((renderable) => {
    renderable.draw();
  });

  let moving = true;
  player.animate = false;

  if (battle.initiated) return;

  // Rest of the code... 
}

2

Want to participate?

Create a free Chris Courses account to begin

or
Sign In

Providing the lift to launch your development career

© 2024 Chris Courses. All rights reserved.