1
Good Afternoon, In my code, a curious detail is happening. I have a game board and when I move my piece past the cell below any other element, this one stops. I’d like to pass it on, just giving the warning, if I were against the other piece.
"use strict"
var player = 'P1';
var playerList = ['P1', 'P2', 'P3', 'P4']
function main() {
var sGame = startGame(8, 4, 7)
$("#changePlayer").click(function () {
if (player === 'P1') {
player = 'P2';
alert('Entrou')
} else if (player === 'P2') {
player = 'P3';
} else if (player === 'P3') {
player = 'P4';
} else (player = 'P1')
})
createGrid(sGame)
//document.getElementById("game").innerHTML = tableOfGame; //passar para o html
/*----Movimento dos jogadores-----*/
var UP1 = document.getElementById("UP1");
UP1.onclick = function () {
sGame = moveUp(sGame, player);
createGrid(sGame)
}
var Down1 = document.getElementById("Down1");
Down1.onclick = function () {
sGame = moveDown(sGame, player);
createGrid(sGame)
}
var Left1 = document.getElementById("Left1");
Left1.onclick = function () {
sGame = moveLeft(sGame, player);
createGrid(sGame)
}
var Right1 = document.getElementById("Right1");
Right1.onclick = function () {
sGame = moveRight(sGame, player);
createGrid(sGame)
}
}
/*-------Tabuleiro de Jogo------*/
function createTurtleBoard(boardSize) {
let tabuleiro = [boardSize];
for (let row = 0; row < boardSize; row++) {
tabuleiro[row] = [boardSize];
for (let column = 0; column < boardSize; column++) {
tabuleiro[row][column] = 0;
//playerPosition.addEventListener('click', movePlayer, false)
}
}
return tabuleiro;
}
function jewelsInsert(tableOfGame) {
let rowA = (tableOfGame.length) / 2;
let rowB = (tableOfGame.length) / 2 - 1;
let columnA = (tableOfGame.length) / 2;
let columnB = (tableOfGame.length) / 2 - 1;
tableOfGame[rowA][columnA] = 'J';
tableOfGame[rowB][columnB] = 'J';
tableOfGame[rowA][columnB] = 'J';
tableOfGame[rowB][columnA] = 'J';
return tableOfGame
}
/*
*
*
*
*/
function addPlayers(tableOfGame, numPlayers) {
let position = tableOfGame.length - 1;
switch (numPlayers) {
case 1:
tableOfGame[0][0] = 'P1';
break;
case 2:
tableOfGame[0][0] = 'P1';
tableOfGame[position][0] = 'P2';
break;
case 3:
tableOfGame[0][0] = 'P1';
tableOfGame[position][0] = 'P2';
tableOfGame[position][position] = 'P3';
break;
default:
tableOfGame[0][0] = 'P1';
tableOfGame[position][0] = 'P2';
tableOfGame[position][position] = 'P3';
tableOfGame[0][position] = 'P4';
break;
}
return tableOfGame
}
function wallInsert(tableOfGame, numWall) {
let size = tableOfGame.length - 1;
let count = 0;
while (count < numWall) {
let column = Math.floor((Math.random() * size))
let row = Math.floor((Math.random() * size))
if (tableOfGame[row][column] === 0) {
tableOfGame[row][column] = 'W'
count++
}
}
return tableOfGame
}
function startGame(boardSize, numPlayers, numWall) {
let board = createTurtleBoard(boardSize);
board = jewelsInsert(board);
board = addPlayers(board, numPlayers);
board = wallInsert(board, numWall);
return board;
}
/*--------Fim do tabuleiro-------*/
/*--------Posição do Jogador-------- */
function playerFinder(tableOfGame, player) {
let len = tableOfGame.length;
for (let row = 0; row <= len; row++) {
for (let column = 0; column <= len; column++) {
if (tableOfGame[row][column] == player) {
return [row, column];
}
}
}
}
function isItAllowed(tableOfGame, player, tag) {
let pl = playerFinder(tableOfGame, player)
let row = pl[0];
let column = pl[1];
if (tag = "mUp") {
if (row == 0) {
alert("You can't make that move!")
return false }
else if (tableOfGame[row - 1][column] !== 0) {
return false;
}
else { return true }
}
else if (tag = "mDw") {
if (row == tableOfGame.length - 1) {
alert("You can't make that move!")
return false }
else if (tableOfGame[row + 1][column] !== 0) {
return false;
}
else { return true }
}
else if (tag = "mLf") {
if (column == 0) {
alert("You can't make that move!")
return false }
else if (tableOfGame[row][column - 1] !== 0) {
return false;
}
else { return true }
}
else if (tag = "mRt") {
if (column == tableOfGame.length - 1) {
alert("You can't make that move!")
return false }
else if (tableOfGame[row][column + 1] !== 0) {
return false;
}
else { return true }
}
return tableOfGame
}
/*--------Movimento do Jogador--------*/
function moveUp(tableOfGame, player) {
var table = tableOfGame;
let pl = playerFinder(table, player)
let row = pl[0];
let column = pl[1];
console.log("pos" + table[row][column])
let control = isItAllowed(table, player, "mUp")
console.log("control" + control)
if (control == true) {
table[row][column] = 0;
table[row - 1][column] = player;
}
return table
}
function moveDown(tableOfGame, player) {
var table = tableOfGame;
let pl = playerFinder(table, player)
let row = pl[0];
let column = pl[1];
console.log("pos" + table[row][column])
let control = isItAllowed(table, player, "mDw")
console.log("control" + control)
if (control == true) {
table[row][column] = 0;
table[row + 1][column] = player;
}
return table
}
function moveLeft(tableOfGame, player) {
var table = tableOfGame;
let pl = playerFinder(table, player)
let row = pl[0];
let column = pl[1];
console.log("pos" + table[row][column])
let control = isItAllowed(table, player, "mLf")
console.log("control" + control)
if (control == true) {
table[row][column] = 0;
table[row][column - 1] = player;
}
return table
}
function moveRight(tableOfGame, player) {
var table = tableOfGame;
let pl = playerFinder(table, player)
let row = pl[0];
let column = pl[1];
console.log("pos" + table[row][column])
let control = isItAllowed(table, player, "mRt")
console.log("control" + control)
if (control == true) {
table[row][column] = 0;
table[row][column + 1] = player;
}
return table
}
/*--------Fim do movimento----------*/
function createGrid(tableOfGame) {
var table = document.getElementById("gridOfGame");
table.innerHTML = '';
var n = tableOfGame.length;
for (let i = 0; i < n; i++) {
var tablerow = document.createElement("tr");
var tableData;
table.appendChild(tablerow)
for (let j = 0; j < n; j++) {
tableData = document.createElement("td");
tableData.innerHTML = (tableOfGame[i][j]);
tableData.innerHTML = '';
tablerow.appendChild(tableData);
if (tableOfGame[i][j] === 'P1') {
var gridImage = document.createElement('img');
gridImage.src = "./p1.png"
tableData.appendChild(gridImage)
}
else if (tableOfGame[i][j] === 'P2') {
gridImage = document.createElement('img');
gridImage.src = "./p2.png"
tableData.appendChild(gridImage)
}
else if (tableOfGame[i][j] === 'P3') {
gridImage = document.createElement('img');
gridImage.src = "./p3.png"
tableData.appendChild(gridImage)
}
else if (tableOfGame[i][j] === 'P4') {
gridImage = document.createElement('img');
gridImage.src = "./p4.png"
tableData.appendChild(gridImage)
}
else if (tableOfGame[i][j] === 'W') {
gridImage = document.createElement('img');
gridImage.src = "./wall1.png"
tableData.appendChild(gridImage)
}
else if (tableOfGame[i][j] === 'J') {
gridImage = document.createElement('img');
gridImage.src = "./joia_1.png"
tableData.appendChild(gridImage)
}
tablerow.appendChild(tableData)
}
//y.appendChild(tablerow);
}
return tableData;
}
document.addEventListener("DOMContentLoaded", function (event) { main() });<!DOCTYPE html>
<html lang="pt">
<head>
<meta charset="utf-8">
<!--<link rel="stylesheet" type="text/CSS" href="style.css">-->
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.0.min.js"></script>
<link href="style.css" rel="stylesheet">
<link href="position.css" rel="stylesheet">
<title>Play</title>
</head>
<body>
<img class="Home" src="RT-Banner-Cópia.jpg" width="100%" height="100%">
<audio autoplay>
<source src="music.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<h2 class="Home1 Login"><a href="Login.html">Login</a></h2>
<h2 class="Home2"><a href="Regras.html">Como Jogar</a></h2>
<h2 class="Home3"><a href="Pontuações.html">Classificação</a></h2>
<h2 class="Home4"><a href="Historia.html">História</a></h2>
<h2 class="Home5 Login"><a href="Registo.html">Registar</a></h2>
<header>
<h1>Game</h1>
<select name="sPlayer">
<option value="P1" selected>P1</option>
<option value="P2">P2</option>
<option value="P3">P3</option>
<option value="P4">P4</option>
</select>
<table id="gridOfGame">
</table>
<p id="game"></p>
<button id='UP1'>Up</button>
<button id='Left1'>Left</button>
<button id='Right1'>Right</button>
<button id="Down1">Down</button>
</header>
<button id="changePlayer">Change Turn</button>
<h5><a href="Home.html">Início</a></h5>
<!-- <script id ="js" src="game.js"></script>-->
<script src="test.js"></script>
</body>
</html>The functions of: isItAllowed(tableOfGame, player, tag) moveUp() moveDown() moveLeft() moveRight() are responsible for checking whether it is possible to move the part in a particular direction, and for moving it.
I appreciate the help.