AI game creator

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

No:8401

2173

←

Prev Next

→

Ak
Developer User4184｜Date and time 23/7/15 18:05:32
Build time 32.251 sec｜Game capacity 3.937KB｜

Script

Sure! Here's a simple game implemented as a single HTML file using JavaScript. The game is called "Pictogram Shooter" and it involves shooting pictograms on a smartphone screen. The game uses touch events for interaction.

This game displays pictograms falling from the top of the screen, and the objective is to tap on them to score points. If a pictogram reaches the bottom of the screen without being tapped, a life is lost. The game ends when all lives are lost. The score and remaining lives are displayed at the top-left corner of the screen.

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Pictogram Shooter</title>
  <style>
    body {
      margin: 0;
      overflow: hidden;
    }
    canvas {
      background-color: #000;
      display: block;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas"></canvas>

// Game variables
    let canvas;
    let context;
    let pictograms = [];
    let score = 0;
    let lives = maxLives;

// Initialize the game
    function init() {
      canvas = document.getElementById('gameCanvas');
      canvas.width = canvasWidth;
      canvas.height = canvasHeight;
      context = canvas.getContext('2d');

canvas.addEventListener('click', shootPictogram);
      setInterval(spawnPictogram, 1000);

requestAnimationFrame(update);
    }

// Update game state
    function update() {
      context.clearRect(0, 0, canvas.width, canvas.height);

// Update and draw pictograms
      pictograms.forEach((pictogram, index) => {
        pictogram.y += pictogramSpeed;
        context.fillText(pictogram.symbol, pictogram.x, pictogram.y);

if (pictogram.y > canvas.height) {
          if (lives > 0) {
            lives--;
          } else {
            endGame();
          }
          pictograms.splice(index, 1);
        }
      });

// Draw score and lives
      context.fillStyle = '#fff';
      context.font = '20px Arial';
      context.fillText('Score: ' + score, 10, 30);
      context.fillText('Lives: ' + lives, 10, 60);

requestAnimationFrame(update);
    }

// Spawn a random pictogram
    function spawnPictogram() {
      if (pictograms.length < maxPictogramsOnScreen) {
        const symbol = getRandomSymbol();
        const posX = Math.random() * (canvas.width - pictogramSize);
        const pictogram = { symbol: symbol, x: posX, y: -pictogramSize };
        pictograms.push(pictogram);
      }
    }

// Shoot a pictogram on click
    function shootPictogram(event) {
      const clickX = event.clientX;
      const clickY = event.clientY;

pictograms.forEach((pictogram, index) => {
        const pictogramLeft = pictogram.x;
        const pictogramRight = pictogram.x + pictogramSize;
        const pictogramTop = pictogram.y;
        const pictogramBottom = pictogram.y + pictogramSize;

if (
          clickX >= pictogramLeft &&
          clickX <= pictogramRight &&
          clickY >= pictogramTop &&
          clickY <= pictogramBottom
        ) {
          score += scoreIncrement;
          pictograms.splice(index, 1);
        }
      });
    }

// Generate a random pictogram symbol
    function getRandomSymbol() {
      const symbols = ['🌻', '🐶', '🍕', '🚀', '🎉'];
      const randomIndex = Math.floor(Math.random() * symbols.length);
      return symbols[randomIndex];
    }

// End the game
    function endGame() {
      context.clearRect(0, 0, canvas.width, canvas.height);

context.fillStyle = '#fff';
      context.font = '40px Arial';
      context.fillText('Game Over', canvas.width / 2, canvas.height / 2);
    }

// Start the game
    init();
  </script>
</body>
</html>
```