Un juego de fusiónar cosas's game

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

No:22706

119

←

Prev Next

→

Un juego de fusiónar cosas
Developer User3408｜Date and time 23/10/24 7:50:14
Build time 108.224 sec｜Game capacity 6.669KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Juego de Fusión</title>
    <style>
      #game-board {
        display: flex;
        flex-wrap: wrap;
        width: 300px;
        height: 300px;
        border: 2px solid black;
      }
      
      .cell {
        width: 95px;
        height: 95px;
        border: 1px solid gray;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
      }
    </style>
  </head>
  <body>
    <div id="game-board"></div>
    
    <script>
      // Pictogramas para la fusión de cosas
      const pictograms = {
        2: "🍎",
        4: "🍌",
        8: "🍊",
        16: "🍇",
        32: "🍉",
        64: "🍓",
        128: "🍍",
        256: "🥥",
        512: "🍒",
        1024: "🍋",
        2048: "🍏"
      }
      
      // Crear el tablero del juego
      let board = [];
      let size = 4; // tamaño del tablero (4x4 en este caso)
      
      function createBoard() {
        for (let i = 0; i < size; i++) {
          board[i] = [];
          for (let j = 0; j < size; j++) {
            board[i][j] = 0;
          }
        }
      }
      
      // Actualizar la visualización del tablero
      function updateBoard() {
        const gameBoard = document.getElementById("game-board");
        gameBoard.innerHTML = "";
      
        for (let i = 0; i < size; i++) {
          for (let j = 0; j < size; j++) {
            const cellValue = board[i][j];
            const cell = document.createElement("div");
            cell.classList.add("cell");
            cell.innerHTML = pictograms[cellValue] || "";
            gameBoard.appendChild(cell);
          }
        }
      }
      
      // Obtener una celda aleatoria vacía en el tablero
      function getRandomEmptyCell() {
        const emptyCells = [];
      
        for (let i = 0; i < size; i++) {
          for (let j = 0; j < size; j++) {
            if (board[i][j] === 0) {
              emptyCells.push({ row: i, column: j });
            }
          }
        }
        
        if (emptyCells.length > 0) {
          const randomIndex = Math.floor(Math.random() * emptyCells.length);
          return emptyCells[randomIndex];
        } else {
          return null;
        }
      }
      
      // Colocar un nuevo pictograma en el tablero (2 o 4)
      function placeNewPictogram() {
        const newPictogramValue = Math.random() < 0.9 ? 2 : 4;
        const emptyCell = getRandomEmptyCell();
      
        if (emptyCell) {
          const { row, column } = emptyCell;
          board[row][column] = newPictogramValue;
          updateBoard();
        }
      }
      
      // Inicialización del juego
      function startGame() {
        createBoard();
        placeNewPictogram();
        placeNewPictogram();
        updateBoard();
      }
      
      // Movimiento hacia la izquierda
      function moveLeft() {
        let hasMoved = false;
        
        for (let i = 0; i < size; i++) {
          for (let j = 1; j < size; j++) {
            if (board[i][j] !== 0) {
              let k = j;
      
              while (k > 0 && board[i][k-1] === 0) {
                board[i][k-1] = board[i][k];
                board[i][k] = 0;
                k--;
                hasMoved = true;
              }
      
              if (k > 0 && board[i][k-1] === board[i][k]) {
                board[i][k-1] *= 2;
                board[i][k] = 0;
                hasMoved = true;
              }
            }
          }
        }
        
        if (hasMoved) {
          placeNewPictogram();
          updateBoard();
        }
      }
      
      // Movimiento hacia arriba
      function moveUp() {
        let hasMoved = false;
      
        for (let i = 1; i < size; i++) {
          for (let j = 0; j < size; j++) {
            if (board[i][j] !== 0) {
              let k = i;
      
              while (k > 0 && board[k-1][j] === 0) {
                board[k-1][j] = board[k][j];
                board[k][j] = 0;
                k--;
                hasMoved = true;
              }
      
              if (k > 0 && board[k-1][j] === board[k][j]) {
                board[k-1][j] *= 2;
                board[k][j] = 0;
                hasMoved = true;
              }
            }
          }
        }
      
        if (hasMoved) {
          placeNewPictogram();
          updateBoard();
        }
      }
      
      // Movimiento hacia la derecha
      function moveRight() {
        let hasMoved = false;
      
        for (let i = 0; i < size; i++) {
          for (let j = size - 2; j >= 0; j--) {
            if (board[i][j] !== 0) {
              let k = j;
      
              while (k < size - 1 && board[i][k+1] === 0) {
                board[i][k+1] = board[i][k];
                board[i][k] = 0;
                k++;
                hasMoved = true;
              }
      
              if (k < size - 1 && board[i][k+1] === board[i][k]) {
                board[i][k+1] *= 2;
                board[i][k] = 0;
                hasMoved = true;
              }
            }
          }
        }
      
        if (hasMoved) {
          placeNewPictogram();
          updateBoard();
        }
      }
      
      // Movimiento hacia abajo
      function moveDown() {
        let hasMoved = false;
      
        for (let i = size - 2; i >= 0; i--) {
          for (let j = 0; j < size; j++) {
            if (board[i][j] !== 0) {
              let k = i;
      
              while (k < size - 1 && board[k+1][j] === 0) {
                board[k+1][j] = board[k][j];
                board[k][j] = 0;
                k++;
                hasMoved = true;
              }
      
              if (k < size - 1 && board[k+1][j] === board[k][j]) {
                board[k+1][j] *= 2;
                board[k][j] = 0;
                hasMoved = true;
              }
            }
          }
        }
      
        if (hasMoved) {
          placeNewPictogram();
          updateBoard();
        }
      }
      
      // Manejo de eventos de teclado
      document.addEventListener("keydown", function(event) {
        if (event.keyCode === 37 || event.key === "ArrowLeft") {
          moveLeft();
        } else if (event.keyCode === 38 || event.key === "ArrowUp") {
          moveUp();
        } else if (event.keyCode === 39 || event.key === "ArrowRight") {
          moveRight();
        } else if (event.keyCode === 40 || event.key === "ArrowDown") {
          moveDown();
        }
      });
      
      // Iniciar el juego al cargar la página
      startGame();
    </script>
  </body>
</html>