Juego de construcción's game

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

No:16422

←

Prev Next

→

Juego de construcción
Developer User7287｜Date and time 23/9/18 3:07:18
Build time 26.982 sec｜Game capacity 3.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 de Construcción</title>
</head>
<body>
    <canvas id="canvas" width="500" height="500"></canvas>

// Función principal
        function main() {
            canvas = document.getElementById('canvas');
            context = canvas.getContext('2d');
            canvas.addEventListener('mousedown', iniciarConstruccion);
            canvas.addEventListener('mousemove', actualizarPosicionRaton);

// Crear construcciones disponibles
            let casa = {
                id: 1,
                nombre: 'Casa',
                imgSrc: 'casa.png',
                ancho: 100,
                alto: 100
            };

let torre = {
                id: 2,
                nombre: 'Torre',
                imgSrc: 'torre.png',
                ancho: 150,
                alto: 200
            };

construcciones.push(casa);
            construcciones.push(torre);

setInterval(actualizar, 1000 / 60); // Actualizar el juego 60 veces por segundo
        }

// Actualizar el juego
        function actualizar() {
            limpiarCanvas();

// Dibujar todas las construcciones en el canvas
            for (let i = 0; i < construcciones.length; i++) {
                let construccion = construcciones[i];
                dibujarConstruccion(construccion.imgSrc, construccion.ancho, construccion.alto, i * 120, 10);
            }

// Si hay una construcción actual, dibujarla siguiendo el ratón
            if (construccionActual) {
                dibujarConstruccion(construccionActual.imgSrc, construccionActual.ancho, construccionActual.alto, mouse.x, mouse.y);
            }
        }

// Iniciar construcción al hacer clic en una construcción disponible
        function iniciarConstruccion(evento) {
            let clicX = evento.pageX - canvas.offsetLeft;
            let clicY = evento.pageY - canvas.offsetTop;

for (let i = 0; i < construcciones.length; i++) {
                let construccion = construcciones[i];

if (clicX > i * 120 && clicX < i * 120 + construccion.ancho && clicY > 10 && clicY < 10 + construccion.alto) {
                    construccionActual = construccion;
                    return;
                }
            }
        }

// Actualizar la posición del ratón
        function actualizarPosicionRaton(evento) {
            mouse.x = evento.pageX - canvas.offsetLeft;
            mouse.y = evento.pageY - canvas.offsetTop;
        }

// Dibujar una construcción en el canvas
        function dibujarConstruccion(imgSrc, ancho, alto, x, y) {
            let img = new Image();
            img.src = imgSrc;
            context.drawImage(img, x, y, ancho, alto);
        }

// Limpiar el canvas
        function limpiarCanvas() {
            context.clearRect(0, 0, canvas.width, canvas.height);
        }

main(); // Iniciar el juego al cargar el archivo HTML
    </script>
</body>
</html>