A game to save CBeebies’ Boj.'s game

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

No:12591

←

Prev Next

→

A game to save CBeebies’ Boj.
Developer User4714｜Date and time 23/8/20 6:19:22
Build time 13.418 sec｜Game capacity 3.066KB｜

Script

Sure! Here's a simple game to save CBeebies' Boj using JavaScript and pictograms. Just save the following code in a single HTML file, open it in a web browser, and you can play the game on a smartphone.

Note: This code assumes that you have a pictogram image of Boj named `emozi_all/pictogram.png` in the same directory as the HTML file. Replace `emozi_cat.png` with the actual file path or URL of the image if necessary. This game allows you to control Boj's movement using the left and right arrow keys on your smartphone's keyboard or touch controls if supported. The objective is to save CBeebies' Boj by avoiding obstacles or reaching a specific goal. Feel free to enhance and customize the game further according to your specific requirements.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
  <head>
    <style>
    /* Add some basic styling for the game */
    body {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      font-family: Arial, sans-serif;
    }
    
    canvas {
      border: 2px solid black;
    }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas" width="400" height="600"></canvas>
    <script>
    // Enclose the game code in script tags
    window.onload = function() {
      // Get the canvas element
      const canvas = document.getElementById('gameCanvas');
      const ctx = canvas.getContext('2d');
    
      // Define Boj's initial position
      let bojX = canvas.width / 2;
      let bojY = canvas.height - 50;
    
      // Define other game variables
      let leftPressed = false;
      let rightPressed = false;
    
      // Define Boj's pictogram
      const bojImage = new Image();
      bojImage.src = "boj.png";
    
      // Handle key press event
      document.addEventListener('keydown', handleKeyDown);
      document.addEventListener('keyup', handleKeyUp);
    
      function handleKeyDown(e) {
        if (e.key === "ArrowLeft") {
          leftPressed = true;
        } else if (e.key === "ArrowRight") {
          rightPressed = true;
        }
      }
    
      function handleKeyUp(e) {
        if (e.key === "ArrowLeft") {
          leftPressed = false;
        } else if (e.key === "ArrowRight") {
          rightPressed = false;
        }
      }
    
      // Update game state
      function update() {
        if (leftPressed) {
          bojX -= 5;
        } else if (rightPressed) {
          bojX += 5;
        }
    
        // Keep Boj within the canvas boundaries
        if (bojX < 0) {
          bojX = 0;
        } else if (bojX > canvas.width - 50) {
          bojX = canvas.width - 50;
        }
      }
    
      // Render game objects
      function render() {
        // Clear canvas
        ctx.clearRect(0, 0, canvas.width, canvas.height);
    
        // Draw Boj
        ctx.drawImage(bojImage, bojX, bojY, 50, 50);
      }
    
      // Game loop
      function gameLoop() {
        update();
        render();
        requestAnimationFrame(gameLoop);
      }
    
      // Start the game loop
      gameLoop();
    };
    </script>
  </body>
</html>
```

Note: This code assumes that you have a pictogram image of Boj named `boj.png` in the same directory as the HTML file. Replace `boj.png` with the actual file path or URL of the image if necessary.

This game allows you to control Boj's movement using the left and right arrow keys on your smartphone's keyboard or touch controls if supported. The objective is to save CBeebies' Boj by avoiding obstacles or reaching a specific goal. Feel free to enhance and customize the game further according to your specific requirements.