1

I created a turn-based javascript game.For moving the players I use jQuery. I'm moving a sprite inside my game board which consists of 100 squares with board-0 ids to board-99. I'm moving my sprite from id to id. Everything works perfectly, but I can not prohibit certain id's to travel. All the boxes with a class "accesOn" are ok all those with the class "accesOff" should not be used. I managed to block the upward movement, if the top position to a "accesOff" class at the start of the game. The problem is that after my sprite never goes up again. Could you help me to make sure not to move on all the divs that have an "accesOff" class? Thanks

      /*********RECUP. ID POS. TOP before move******** */

     var nombreIdPos = maDivId.substr(6);
     var posActuelleNombreId = parseInt(nombreIdPos);
     var posDessusNombreId = posActuelleNombreId -= 10;
     var $posDessusId = 'board-' + posDessusNombreId;


                       //******** MOVE
   function main() {

var $nombreId = maDivId.substr(6);

var $posDiv1 = parseInt($nombreId);
var $currentPosId = maDivId; //TEST voir si besoin plus tard
var $largeur = ($('#contenu').width());
var $hauteur = ($('#contenu').height());

$(window).on('keydown', function (e) {
    var touche = e.which;

    switch (touche) {

        case 38: //TOP

            var $idDivDessus = $('#' + $posDessusId);
            if ($idDivDessus.hasClass('accesOn')) { // this if is not good
                $posX = '0%';
                $posY = '100%';
                var $newPosH = $posDiv1 -= 10;
                var $newPos = $("#board-" + $newPosH);
                $($newPos).css('background', $player1 + $posX + $posY);
                $('.joueur1').css('background', "").removeClass('joueur1');
                $($newPos).addClass('joueur1');



                } //****FIN IF 



            } //FIN if 1er

            break;



}); // FIN Event keydown

} //FIN main function
    $(document).ready(main);

1 Answers1

0

You only care about the tile you are moving to, you don't have to check for access on the tile you are already on (assume you handled this correctly before arriving on the current tile).

Add a check for the tile you want to move to, if it has the class accessOff simply avoid moving, no other actions should be required.

example check for //TOP

$posX = '0%';
$posY = '66%';
$newPos = $posDiv1 -= 10;
$newPos = $("#board-" + $newPos);
if(!$newPos.hasClass('accessOff')){                              //check here for accessOff
  $($newPos).css('background', $player1 + $posX + $posY);
  $('.joueur1').css('background', "").removeClass('joueur1');
  $($newPos).addClass('joueur1');
  console.log('Variable $newPosR = ' + $newPos);
} else {
  $posDiv1 -= change;
}

I would recommend creating a function to move your player to get rid of some code duplication. It will make your life easier in the future.

Something like this:

function MovePlayer(x, y, change) {
  $newPos = $posDiv1 += change;
  $newPos = $("#board-" + $newPos);
  if(!$newPos.hasClass('accessOff')){   
    $($newPos).css('background', $player1 + x + y);
    $('.joueur1').css('background', "").removeClass('joueur1');
    $($newPos).addClass('joueur1');
    console.log('Variable $newPosR = ' + $newPos);
  } else {
    $posDiv1 -= change;
  }
}

Your //TOP would then just be MovePlayer('0%', '66%', -10), and you can reuse that function to move any direction.

IrkenInvader
  • 4,030
  • 1
  • 12
  • 23
  • A big thank you for your answer and your help. I will try to implement what you tell me.I'm back after. Thanks –  Jan 27 '18 at 00:09
  • so that created a little problem . I feel that pressing the top key is kept in memory! it works very well indeed I can not go on class "accesOff" at the first touch. if I press twice on top I jump the box after and if I press right or left immediately after not being able to move I go on the box from the top left or right the first presses top is in memory it looks like !? –  Jan 27 '18 at 00:55
  • 1
    Oh. We aren't changing `$posDiv1` back to where it was if they try to move onto an `accessOff` tile. Add an else to the check and undo the change to `$posDiv1` - I'll add an edit – IrkenInvader Jan 27 '18 at 01:14