لعبة الوصول إلى نقطة الفوز's game

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

No:38364

←

Prev Next

→

لعبة الوصول إلى نقطة الفوز
Developer User6662｜Date and time 24/1/24 17:06:41
Build time 10.368 sec｜Game capacity 2.402KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

<!DOCTYPE html>
<html>
  <head>
    <title>لعبة الوصول إلى نقطة الفوز</title>
    <style>
      .gameboard {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
      }
      .cell {
        width: 50px;
        height: 50px;
        border: 1px solid black;
      }
      .player {
        font-size: 30px;
        line-height: 50px;
      }
    </style>
  </head>
  <body>
    <div class="gameboard"></div>

const playerIcon = '👧';
      const goalIcon = '🏁';
      const emptyIcon = '⬜';

const gridSize = 5; // Adjust the grid size as needed
      let playerPosition = { x: 0, y: 0 };

// Generate the game grid
      for (let i = 0; i < gridSize * gridSize; i++) {
        const cell = document.createElement('div');
        cell.className = 'cell';
        cell.innerText = emptyIcon;
        gameboard.appendChild(cell);
        cells.push(cell);
      }

// Set the player and goal positions
      cells[0].innerText = playerIcon;
      cells[cells.length - 1].innerText = goalIcon;

// Handle arrow key navigation
      document.addEventListener('keydown', (event) => {
        const key = event.key;
        let newPosition = { x: playerPosition.x, y: playerPosition.y };

if (key === 'ArrowUp' && playerPosition.y > 0) {
          newPosition.y--;
        } else if (key === 'ArrowDown' && playerPosition.y < gridSize - 1) {
          newPosition.y++;
        } else if (key === 'ArrowLeft' && playerPosition.x > 0) {
          newPosition.x--;
        } else if (key === 'ArrowRight' && playerPosition.x < gridSize - 1) {
          newPosition.x++;
        }

if (newPosition.x !== playerPosition.x || newPosition.y !== playerPosition.y) {
          cells[getIndex(playerPosition.x, playerPosition.y)].innerText = emptyIcon;
          playerPosition = newPosition;
          cells[getIndex(playerPosition.x, playerPosition.y)].innerText = playerIcon;

if (playerPosition.x === gridSize - 1 && playerPosition.y === gridSize - 1) {
            alert('أحرزت الفوز!');
          }
        }
      });

// Helper function to get index from x and y coordinates
      function getIndex(x, y) {
        return y * gridSize + x;
      }
    </script>
  </body>
</html>