AI game creator

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

No:37939

←

Prev Next

→

Alcoholic
Developer User17159｜Date and time 24/1/21 22:14:58
Build time 14.058 sec｜Game capacity 3.899KB｜

Script

Sure, here's a simple game implementation using JavaScript, HTML, and pictograms. The objective is to catch the falling drinks using your smartphone controls. Save the following code as a HTML file and open it on your smartphone to play.

To use pictograms, you can replace the placeholder `emozi_himawari.png` image file with a pictogram image of your choice. Make sure to put the actual pictogram image in the same directory as the HTML file and update the `drinkImage.src` accordingly. This game uses the smartphone's tilt controls to move the player and catch the falling drinks. The player needs to avoid missing any drinks to score points. The current score is displayed on the top left corner of the canvas. Feel free to modify and enhance the game as per your requirements. Enjoy playing!

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

```html
<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <title>Alcoholic Game</title>
   <style>
      canvas {
         border: 1px solid black;
         display: block;
         margin: 0 auto;
      }
   </style>
</head>
<body>
   <canvas id="gameCanvas" width="400" height="600"></canvas>

const spriteWidth = 60;
      const spriteHeight = 60;
      const maxDrinks = 10;
      const drinkSpeed = 2;
      let score = 0;

const player = {
         x: canvas.width / 2 - spriteWidth / 2,
         y: canvas.height - spriteHeight,
         width: spriteWidth,
         height: spriteHeight
      };

let drinks = [];
      for (let i = 0; i < maxDrinks; i++) {
         drinks.push({
            x: Math.random() * (canvas.width - spriteWidth),
            y: Math.random() * -canvas.height,
            width: spriteWidth,
            height: spriteHeight
         });
      }

// Function to draw the game objects
      function draw() {
         ctx.clearRect(0, 0, canvas.width, canvas.height);
         ctx.drawImage(drinkImage, player.x, player.y);
         drinks.forEach(function (drink) {
            ctx.drawImage(drinkImage, drink.x, drink.y);
         });

ctx.font = "20px Arial";
         ctx.fillText("Score: " + score, 10, 30);
      }

// Function to update game state
      function update() {
         drinks.forEach(function (drink, index) {
            drink.y += drinkSpeed;

if (drink.y + drink.height > canvas.height) {
               drink.y = Math.random() * -canvas.height;
               drink.x = Math.random() * (canvas.width - spriteWidth);
            }

if (detectCollision(player, drink)) {
               score++;
               drink.y = Math.random() * -canvas.height;
               drink.x = Math.random() * (canvas.width - spriteWidth);
            }
         });
      }

// Function to detect collisions between two objects
      function detectCollision(obj1, obj2) {
         return (
            obj1.x < obj2.x + obj2.width &&
            obj1.x + obj1.width > obj2.x &&
            obj1.y < obj2.y + obj2.height &&
            obj1.y + obj1.height > obj2.y
         );
      }

// Handle mobile device tilt controls
      window.addEventListener("deviceorientation", handleOrientation, true);

function handleOrientation(event) {
         let x = event.gamma; // Tilt along the x-axis

// Calculate the new position of the player based on device tilt
         let newPos = Math.min(
            Math.max(player.x - x * 2, 0),
            canvas.width - player.width
         );
         player.x = newPos;
      }

// Game loop
      function gameLoop() {
         draw();
         update();
         requestAnimationFrame(gameLoop);
      }

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

To use pictograms, you can replace the placeholder `drink.png` image file with a pictogram image of your choice. Make sure to put the actual pictogram image in the same directory as the HTML file and update the `drinkImage.src` accordingly.

This game uses the smartphone's tilt controls to move the player and catch the falling drinks. The player needs to avoid missing any drinks to score points. The current score is displayed on the top left corner of the canvas.

Feel free to modify and enhance the game as per your requirements. Enjoy playing!