Ajedrez con personajes de pokemon's game

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

No:29190

←

Prev Next

→

Ajedrez con personajes de pokemon
Developer User14443｜Date and time 23/12/16 16:07:13
Build time 32.448 sec｜Game capacity 3.01KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Ajedrez con personajes de Pokémon</title>
</head>
<body>
    
    <canvas id="chessboard" width="400" height="400"></canvas>
    
    <script>
        // Definición de personajes de Pokémon
        const pokemonCharacters = {
            1: "charmander",
            2: "bulbasaur",
            3: "squirtle",
            4: "pikachu",
            5: "jigglypuff",
            6: "meowth"
        };

// Creación del tablero
        const canvas = document.getElementById("chessboard");
        const ctx = canvas.getContext("2d");

let squareSize = 50; // Tamaño de cada casilla del tablero
        let selectedPiece = null; // Pieza seleccionada por el usuario

const chessboard = [
            [1, 2, 3, 4, 5, 3, 2, 1],
            [6, 6, 6, 6, 6, 6, 6, 6],
            [0, 0, 0, 0, 0, 0, 0, 0],
            [0, 0, 0, 0, 0, 0, 0, 0],
            [0, 0, 0, 0, 0, 0, 0, 0],
            [0, 0, 0, 0, 0, 0, 0, 0],
            [6, 6, 6, 6, 6, 6, 6, 6],
            [1, 2, 3, 4, 5, 3, 2, 1]
        ];

function drawChessboard() {
            for (let row = 0; row < 8; row++) {
                for (let col = 0; col < 8; col++) {
                    let xPos = col * squareSize;
                    let yPos = row * squareSize;

if ((row + col) % 2 === 0) {
                        ctx.fillStyle = "#FFFFFF"; // Color blanco
                    } else {
                        ctx.fillStyle = "#CCCCCC"; // Color gris claro
                    }

ctx.fillRect(xPos, yPos, squareSize, squareSize);

if (chessboard[row][col] !== 0) {
                        let characterImage = new Image();
                        characterImage.src = `images/${pokemonCharacters[chessboard[row][col]]}.png`;
                        characterImage.onload = function () {
                            ctx.drawImage(characterImage, xPos, yPos, squareSize, squareSize);
                        };
                    }
                }
            }
        }

function getCursorPosition(event) {
            let rect = canvas.getBoundingClientRect();
            let x = event.clientX - rect.left;
            let y = event.clientY - rect.top;

let col = Math.floor(x / squareSize);
            let row = Math.floor(y / squareSize);

if (selectedPiece === null) {
                // Seleccionar una pieza
                if (chessboard[row][col] !== 0) {
                    selectedPiece = { row, col };
                }
            } else {
                // Mover la pieza seleccionada
                chessboard[row][col] = chessboard[selectedPiece.row][selectedPiece.col];
                chessboard[selectedPiece.row][selectedPiece.col] = 0;
                selectedPiece = null;
            }

drawChessboard();
        }

canvas.addEventListener("click", getCursorPosition);
        drawChessboard();
    </script>
</body>
</html>