Workshop › Asteroids › Step 16 of 41

Making a rock

What we are doing

An asteroid has a position, a velocity and a size: 3 big, 2 medium, 1 small. Its radius comes from the table SIZES. It flies in a random direction, smaller ones faster. shape holds how far each of its 10 corners is from the center; all 1 for now.

```js
const SIZES = [0, 15, 28, 45] // asteroid radius for size 1, 2 and 3

function makeAsteroid(x, y, size) {
  const angle = Math.random() * Math.PI * 2
  const speed = 0.6 + Math.random() * (4 - size) * 0.5 // smaller asteroids are faster
  const shape = Array.from({ length: 10 }, () => 1)
  return { x, y, vx: Math.cos(angle) * speed, vy: Math.sin(angle) * speed, size, r: SIZES[size], shape }
}
```

What it means

Your turn

  1. Under BULLET_LIFE write SIZES.
  2. Above function shoot() { write makeAsteroid, followed by an empty line.

Skills: Arrays and objects, Velocity and gravity

All steps

  1. Black space
  2. Where the ship is
  3. Which way it points
  4. A triangle ship
  5. Which keys are down?
  6. Turning
  7. The game loop
  8. Thrust and drift
  9. A little friction
  10. A speed limit
  11. Around the screen
  12. Making a bullet
  13. Fire!
  14. Bullets fly
  15. A lifetime for bullets
  16. Making a rock
  17. Four big rocks
  18. Drawing the rocks
  19. Jagged rocks
  20. Drifting rocks
  21. When do two circles touch?
  22. Breaking a rock
  23. Bullets hit rocks
  24. Points
  25. Show the score
  26. Losing a life
  27. A rock hits the ship
  28. Show the lives
  29. What time is it?
  30. A moment of safety
  31. Blink while safe
  32. Waves of rocks
  33. The next wave
  34. Faster every wave
  35. One function to start
  36. Playing or over
  37. Game over
  38. Best score
  39. GAME OVER
  40. Play again
  41. Build it yourself: hyperspace