AI game creator

Click here for free DL of the app version that can save data.

No:20036

←

Prev Next

→

particle
Developer User8924｜Date and time 23/10/8 1:00:11
Build time 16.16 sec｜Game capacity 2.415KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

Click here for free DL of the app version that can save data.

// Game initialization
document.addEventListener("DOMContentLoaded", function(event) {
  startGame();
});

// Variables
var score = 0;
var particles = [];

// Function to create particle object
function Particle(x, y, image) {
  this.x = x;
  this.y = y;
  this.image = image;
  this.velocityX = Math.random() * 5 - 2.5;
  this.velocityY = Math.random() * 5 - 2.5;
  
  this.update = function() {
    this.x += this.velocityX;
    this.y += this.velocityY;
  }
}

// Function to start the game
function startGame() {
  setInterval(updateGameArea, 20); // Update the game every 20 milliseconds
  
  // Create particles
  for (var i = 0; i < 10; i++) {
    var x = Math.random() * window.innerWidth;
    var y = Math.random() * window.innerHeight;
    var image = getRandomPictogram();
    particles.push(new Particle(x, y, image));
  }
}

// Function to update the game area
function updateGameArea() {
  clearGameArea();
  moveParticles();
  drawParticles();
}

// Function to clear the game area
function clearGameArea() {
  var canvas = document.getElementById("gameCanvas");
  var context = canvas.getContext("2d");
  context.clearRect(0, 0, canvas.width, canvas.height);
}

// Function to move particles
function moveParticles() {
  for (var i = 0; i < particles.length; i++) {
    particles[i].update();
    checkCollision(particles[i]);
  }
}

// Function to check collision with the walls
function checkCollision(particle) {
  if (particle.x < 0 || particle.x > window.innerWidth) {
    particle.velocityX *= -1;
  }
  
  if (particle.y < 0 || particle.y > window.innerHeight) {
    particle.velocityY *= -1;
  }
}

// Function to draw particles
function drawParticles() {
  var canvas = document.getElementById("gameCanvas");
  var context = canvas.getContext("2d");
  
  for (var i = 0; i < particles.length; i++) {
    var particle = particles[i];
    
    // Draw particle image
    var img = new Image();
    img.src = particle.image;
    context.drawImage(img, particle.x, particle.y, 50, 50);
  }
}

// Function to get random pictogram image
function getRandomPictogram() {
  var pictograms = ["pictogram1.png", "pictogram2.png", "pictogram3.png"];
  var randomIndex = Math.floor(Math.random() * pictograms.length);
  return pictograms[randomIndex];
}

</script>
</head>
<body>
  <canvas id="gameCanvas" width="500" height="500"></canvas>
</body>
</html>