Un juego donde somos un conejo,tienes que atrapar zanahorias que estarán en distintos lugares,estarán todos los botones para moverte's game

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

No:40568

←

Prev Next

→

Un juego donde somos un conejo,tienes que atrapar ..ALL
Developer User18058｜Date and time 24/2/3 14:01:28
Build time 14.258 sec｜Game capacity 4.256KB｜

Script

🥕

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>Juego del Conejo</title>
  <style>
    #game-container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 500px;
      width: 500px;
      border: 1px solid black;
    }
    .carrot {
      font-size: 50px;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <div id="game-container">
    <p class="carrot">🥕</p>
  </div>

// Crea un arreglo con las posiciones posibles de las zanahorias
    const carrotPositions = [
      { top: 50, left: 100 },
      { top: 200, left: 250 },
      { top: 350, left: 400 }
    ];

// Genera una zanahoria de forma aleatoria
    function generateCarrot() {
      // Elimina cualquier zanahoria existente
      const existingCarrot = document.querySelector('.carrot');
      if (existingCarrot) {
        gameContainer.removeChild(existingCarrot);
      }
      
      // Elige una posición aleatoria para la zanahoria
      const randomPositionIndex = Math.floor(Math.random() * carrotPositions.length);
      const randomPosition = carrotPositions[randomPositionIndex];
      
      // Crea y agrega la zanahoria al contenedor del juego
      const carrot = document.createElement('p');
      carrot.className = 'carrot';
      carrot.textContent = '🥕';
      carrot.style.top = randomPosition.top + 'px';
      carrot.style.left = randomPosition.left + 'px';
      gameContainer.appendChild(carrot);
      
      // Agrega el evento al hacer clic en la zanahoria
      carrot.addEventListener('click', () => {
        generateCarrot();
      });
    }

// Genera la primera zanahoria
    generateCarrot();

// Captura los eventos de movimiento del dispositivo
    function handleDeviceMotion(event) {
      const gamma = event.gamma;  // Movimiento lateral (izquierda y derecha)
      const beta = event.beta;    // Movimiento vertical (arriba y abajo)

// Calcula el desplazamiento en píxeles basado en los valores del dispositivo
      const displacementX = getPixelDisplacement(gamma);
      const displacementY = getPixelDisplacement(beta);

// Mueve el conejo según el desplazamiento calculado
      moveRabbit(displacementX, displacementY);
    }

// Calcula el desplazamiento en píxeles basado en el valor de movimiento del dispositivo
    function getPixelDisplacement(value) {
      const maxDisplacement = 50;  // Máximo desplazamiento en píxeles
      const maxDeviceValue = 90;   // Máximo valor de movimiento del dispositivo
      
      // Calcula el desplazamiento proporcional al valor de movimiento del dispositivo
      return (value / maxDeviceValue) * maxDisplacement;
    }

// Mueve el conejo dentro de los límites del contenedor del juego
    function moveRabbit(displacementX, displacementY) {
      const rabbit = gameContainer.firstElementChild;

// Obtiene las coordenadas actuales del conejo
      const rabbitRect = rabbit.getBoundingClientRect();

// Calcula las coordenadas deseadas después del movimiento
      const desiredX = rabbitRect.left + displacementX;
      const desiredY = rabbitRect.top + displacementY;
      
      // Obtiene las dimensiones del contenedor del juego
      const containerRect = gameContainer.getBoundingClientRect();

// Asegura que el conejo se mantenga dentro de los límites del contenedor
      const minX = 0;
      const minY = 0;
      const maxX = containerRect.width - rabbitRect.width;
      const maxY = containerRect.height - rabbitRect.height;

// Calcula las coordenadas finales después de aplicar las restricciones
      const finalX = Math.max(minX, Math.min(desiredX, maxX));
      const finalY = Math.max(minY, Math.min(desiredY, maxY));

// Actualiza la posición del conejo
      rabbit.style.left = finalX + 'px';
      rabbit.style.top = finalY + 'px';
    }
    
    // Asocia el evento de movimiento de dispositivo al controlador
    window.addEventListener('deviceorientation', handleDeviceMotion);

// Comienza la ejecución del juego
    (function () {
      // Código para iniciar el juego aquí...
    })();
  </script>
</body>
</html>