Error in moving Intel in a Javascript array

Asked

Viewed 25 times

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.

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.