Hola buenas no se como hacer para ver que mi 'x' que es el rover del juego se mueva por el grid, no solo actualizar las coordenadas sino quiero que despues de algunos movimientos, la 'x' cambie de posicion. he hecho rover.pin++ cuando estando en direccion norte, baje el rover, funciona PERO solo en lugar de posicionarse en [0,1] se mueve en diagonal [1,1] , [2,2] etc y no se porque, probad solo usando 'B' PARA BACKWARDS ya que forward aun no va pero solo me interesa por ahora saber porque se mueve en diagonal, muchas gracias
//UPDATE INFO
$(document).ready(function(){
message2();
update();
});
function message2(){
let mensajeDireccion = document.getElementById('direction').textContent = 'rover is facing ' + rover.direction;
let mensajePosicion = document.getElementById('direction2').textContent = rover.position[0] + ',' + rover.position[1];
}
//ROVER GRID
let grid = [
[0,1,2,3,4,5,6,7,8,9],
[0,1,2,3,4,5,6,7,8,9],
[0,1,2,3,4,5,6,7,8,9],
[0,1,2,3,4,5,6,7,8,9],
[0,1,2,3,4,5,6,7,8,9],
[0,1,2,3,4,5,6,7,8,9],
[0,1,2,3,4,5,6,7,8,9],
[0,1,2,3,4,5,6,7,8,9],
[0,1,2,3,4,5,6,7,8,9],
[0,1,2,3,4,5,6,7,8,9]
];
//RANDOM OBSTACLES
// for (var i = 0; i < 8; i++) {
// let row = randomObstacle();
// let column = randomObstacle();
// let obstacles = grid[row][column] = 'o';
// }
//
// function randomObstacle(){
// return Math.floor(Math.random() * 10);
// }
//ROVER OBJECT
let rover = {
direction: 'N',
position: [0,0],
pin: [0,0]
};
//ROVER PLACEMENT ON GRID
function update(){
grid[rover.position[0]].splice(rover.position[0],1, 'x');
}
//LOGIC DECISSIONS
document.getElementById("decision").onkeyup = function(e){
let texto = e.target.value;
let textoSanedo = texto.replace(" ", "").toUpperCase();
e.target.value = textoSanedo;
let commands;
for (var i = 0; i < textoSanedo.length; i++) {
commands = textoSanedo[i];
}
switch (commands) {
case 'L':
forward(rover);
break;
case 'R':
turnRight(rover);
break;
case 'F':
moveForward(rover);
break;
case 'B':
moveBackwards(rover);
break;
}
if (rover.position[0] < 0 || rover.position[0] > 9 || rover.position[1] < 0 || rover.position[1] > 9 ) {
alert('out');
}
return;
};
//TURN LEFT
function turnLeft(rover){
switch (rover.direction) {
case 'N':
rover.direction = 'W';
break;
case 'W':
rover.direction = 'S';
break;
case 'S':
rover.direction = 'E';
break;
case 'E':
rover.direction = 'N';
break;
}
message2();
update();
}
//TURN RIGHT
function turnRight(rover){
switch (rover.direction) {
case 'N':
rover.direction = 'E';
break;
case 'E':
rover.direction = 'S';
break;
case 'S':
rover.direction = 'W';
break;
case 'W':
rover.direction = 'N';
break;
}
message2();
update();
}
//MOVE FORWARD
function moveForward(rover){
switch (rover.direction) {
case 'N':
rover.position[0]--;
rover.pin[0]--;
break;
case 'W':
rover.position[0]--;
rover.pin[0]--;
break;
case 'S':
rover.position[0]++;
rover.pin[0]++;
break;
case 'E':
rover.position[0]++;
rover.pin[0]++;
break;
}
message2();
update();
}
//MOVE BACKWARDS
function moveBackwards(rover){
switch (rover.direction) {
case 'N':
rover.position[0]++;
rover.pin[0]++;
console.log(rover.pin);
console.log(rover.position);
break;
case 'W':
rover.position[0]++;
rover.pin[0]++;
break;
case 'S':
rover.position[0]--;
rover.pin[0]--;
break;
case 'E':
rover.position[0]--;
rover.pin[0]--;
break;
}
message2();
update();
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>rover</title>
</head>
<body>
<input id="decision" type="text" name="" value="" placeholder="l: Left, r: Right, f: Forward, b: Backwards">
<p id="direction"></p>
<p id="direction2"></p>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="js/app.js" charset="utf-8"></script>
</body>
</html>