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

No:35053

rie um jogo onde vc pode irá andar para todos os l..ALL
Developer User16419｜Date and time 24/1/13 5:33:45
Build time 19.354 sec｜Game capacity 5.373KB｜

Script

Jogo Labirinto

Toque nos quadrados para criar um novo labirinto.

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

<!DOCTYPE html>
<html>
<head>
  <script>
    function createMaze() {
      var maze = [
        [1, 1, 1, 1, 1],
        [1, 2, 3, 0, 1],
        [1, 1, 1, 1, 1],
        [9, 0, 1, 3, 1],
        [1, 1, 1, 1, 1]
      ];

drawMaze(maze);
    }

function drawMaze(maze) {
      var container = document.getElementById("maze-container");
      container.innerHTML = "";

for (var i = 0; i < maze.length; i++) {
        var row = document.createElement("div");
        row.className = "row";

for (var j = 0; j < maze[i].length; j++) {
          var cell = document.createElement("div");

switch (maze[i][j]) {
            case 1:
              cell.className = "wall";
              break;
            case 2:
              cell.className = "player";
              break;
            case 3:
              cell.className = "door";
              break;
            case 9:
              cell.className = "exit";
              break;
            default:
              cell.className = "empty";
          }

row.appendChild(cell);
        }

container.appendChild(row);
      }
    }

function movePlayer(direction) {
      var maze = document.getElementsByClassName("row");
      var playerRow, playerCol;

// Find current player position
      for (var i = 0; i < maze.length; i++) {
        var rowCells = maze[i].childNodes;

for (var j = 0; j < rowCells.length; j++) {
          if (rowCells[j].classList.contains("player")) {
            playerRow = i;
            playerCol = j;
            break;
          }
        }
      }

// Move player based on direction
      switch (direction) {
        case "up":
          if (playerRow > 0 && maze[playerRow - 1].childNodes[playerCol].classList.contains("empty")) {
            maze[playerRow].childNodes[playerCol].classList.remove("player");
            maze[playerRow - 1].childNodes[playerCol].classList.add("player");
          }
          break;
        case "down":
          if (playerRow < maze.length - 1 && maze[playerRow + 1].childNodes[playerCol].classList.contains("empty")) {
            maze[playerRow].childNodes[playerCol].classList.remove("player");
            maze[playerRow + 1].childNodes[playerCol].classList.add("player");
          }
          break;
        case "left":
          if (playerCol > 0 && maze[playerRow].childNodes[playerCol - 1].classList.contains("empty")) {
            maze[playerRow].childNodes[playerCol].classList.remove("player");
            maze[playerRow].childNodes[playerCol - 1].classList.add("player");
          }
          break;
        case "right":
          if (playerCol < maze[0].childNodes.length - 1 && maze[playerRow].childNodes[playerCol + 1].classList.contains("empty")) {
            maze[playerRow].childNodes[playerCol].classList.remove("player");
            maze[playerRow].childNodes[playerCol + 1].classList.add("player");
          }
          break;
      }

checkGoal();
    }

function checkGoal() {
      var maze = document.getElementsByClassName("row");
      var playerRow, playerCol, goalRow, goalCol;

// Find current player and goal positions
      for (var i = 0; i < maze.length; i++) {
        var rowCells = maze[i].childNodes;

for (var j = 0; j < rowCells.length; j++) {
          if (rowCells[j].classList.contains("player")) {
            playerRow = i;
            playerCol = j;
          }

if (rowCells[j].classList.contains("exit")) {
            goalRow = i;
            goalCol = j;
          }
        }
      }

// Check if player reached the goal
      if (playerRow === goalRow && playerCol === goalCol) {
        alert("Parabéns, você venceu!");
        createMaze();
      }
    }
  </script>

.row {
      display: flex;
      flex-direction: row;
    }

.wall,
    .player,
    .door,
    .exit,
    .empty {
      width: 50px;
      height: 50px;
    }

.wall {
      background-color: black;
    }

.player {
      background-color: blue;
    }

.door {
      background-color: yellow;
    }

.exit {
      background-color: green;
    }

.empty {
      background-color: white;
    }
  </style>
</head>
<body onload="createMaze()">
  <h1>Jogo Labirinto</h1>
  <p>Toque nos quadrados para criar um novo labirinto.</p>
  <div id="maze-container"></div>

var xStart = null;
    var yStart = null;

function handleTouchStart(event) {
      xStart = event.touches[0].clientX;
      yStart = event.touches[0].clientY;
    }

function handleTouchEnd(event) {
      var xEnd = event.changedTouches[0].clientX;
      var yEnd = event.changedTouches[0].clientY;

var xDiff = xStart - xEnd;
      var yDiff = yStart - yEnd;

if (Math.abs(xDiff) > Math.abs(yDiff)) {
        if (xDiff > 0) {
          movePlayer("left");
        } else {
          movePlayer("right");
        }
      } else {
        if (yDiff > 0) {
          movePlayer("up");
        } else {
          movePlayer("down");
        }
      }
    }
  </script>
</body>
</html>