moving only one time

[nazimboudeffa]

Hi, i have made a fork of pyramid of ra from the last phaser issue and i want to move the player just one time http://asciimulation.link/codeinmass/mod

here is the code

var game;

// main game options
var gameOptions = {
	gameWidth: 800,
	gameHeight: 600,
	tileSize: 64,
	fieldSize: {
          rows: 8,
          cols: 10
     }
}

// game levels
var levels = [
     {
          level:[
               [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
               [0, 0, 2, 1, 1, 1, 1, 2, 0, 0],
               [0, 0, 1, 0, 0, 0, 0, 1, 0, 0],
               [0, 0, 1, 0, 0, 0, 0, 1, 0, 0],
               [0, 0, 1, 0, 0, 0, 0, 1, 0, 0],
               [0, 0, 1, 0, 0, 0, 0, 1, 0, 0],
               [0, 0, 2, 1, 1, 1, 1, 2, 0, 0],
               [0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
               ],
          playerPos: new Phaser.Point(5, 2)
     }
];

// when the window finishes loading...
window.onload = function() {
     game = new Phaser.Game(gameOptions.gameWidth, gameOptions.gameHeight);
     game.state.add("TheGame", TheGame);
     game.state.start("TheGame");
}

var TheGame = function(){};

TheGame.prototype = {

     // preloading assets
     preload: function(){
          game.load.spritesheet("tiles", "assets/sprites/connector.png", gameOptions.tileSize, gameOptions.tileSize);
	  game.load.spritesheet("tiles90", "assets/sprites/connector90.png", gameOptions.tileSize, gameOptions.tileSize);
          game.load.image("player", "assets/sprites/p.png");
     },

     // when the game starts
  	create: function(){
          game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
	  game.scale.pageAlignHorizontally = true;
	  game.scale.pageAlignVertically = true;
          this.levelNumber = 0;
  	  this.createLevel();
	  game.stage.backgroundColor = "#fff";

  	},

    // function to create a level
		createLevel: function(){
          //this.tilesArray = [];
					this.tileGroup = game.add.group();
          this.tileGroup.x = (game.width - gameOptions.tileSize * gameOptions.fieldSize.cols) / 2;
          this.tileGroup.y = (game.height -  gameOptions.tileSize * gameOptions.fieldSize.rows) / 2;
  				for(var i = 0; i < gameOptions.fieldSize.rows; i++){
               //this.tilesArray[i] = [];
							 for(var j = 0; j < gameOptions.fieldSize.cols; j++){
                    if(levels[this.levelNumber].level[i][j]==1){
                         this.addTile(i, j, levels[this.levelNumber].level[i][j], "tiles");
                    }
										if(levels[this.levelNumber].level[i][j]==2){
												 this.addTile(i, j, levels[this.levelNumber].level[i][j], "tiles90");
										}
								}
					}
          this.playerPosition = new Phaser.Point(0, 0);
          levels[this.levelNumber].playerPos.clone(this.playerPosition);
          this.player = game.add.sprite(levels[this.levelNumber].playerPos.x * gameOptions.tileSize + gameOptions.tileSize / 2, this.playerPosition.y * gameOptions.tileSize + gameOptions.tileSize / 2, "player");
          this.player.anchor.set(0.5);
          this.tileGroup.add(this.player);
	},

  // function add a tile at "row" row, "col" column with "val" value
	addTile: function(row, col, val, tile){
					var tileXPos = col * gameOptions.tileSize + gameOptions.tileSize / 2;
					var tileYPos = row * gameOptions.tileSize + gameOptions.tileSize / 2;
					var theTile = game.add.sprite(tileXPos, tileYPos, tile);
					theTile.anchor.set(0.5);
          theTile.tilePosition = new Phaser.Point(col, row);
	     		this.tileGroup.add(theTile);
	},

	update: function(){
					tileSize = gameOptions.tileSize;
					if (game.input.keyboard.isDown(Phaser.Keyboard.UP)) {
							this.move(new Phaser.Point(0, -1));
					}
					if (game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) {
							this.move(new Phaser.Point(0, 1))
					}
					if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) {
							this.move(new Phaser.Point(-1, 0))
					}
					if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) {
							this.move(new Phaser.Point(1, 0))
					}
					if (game.input.keyboard.isDown(Phaser.Keyboard.SPACEBAR)){
							console.log(this.levels[this.player.x][this.player.y]);
					}
	},

	move: function(p){
				this.playerPosition.add(p.x, p.y);
				var playerTween = game.add.tween(this.player).to({
					x: this.playerPosition.x * gameOptions.tileSize + gameOptions.tileSize / 2,
					y: this.playerPosition.y * gameOptions.tileSize + gameOptions.tileSize / 2
			 	}, 64, Phaser.Easing.Linear.None, true);
				playerTween.onComplete.add(function(target){
					console.log(this.player.x);
					target.x = this.playerPosition.x * gameOptions.tileSize + gameOptions.tileSize / 2;
					target.y = this.playerPosition.y * gameOptions.tileSize + gameOptions.tileSize / 2;
				}, this)
	}

}

 

[Mattia]

Hi,
you could try using "keyboard hotkeys" as shown in this example:
https://phaser.io/examples/v2/input/keyboard-hotkeys

Here's a quick fiddle example using your code: 
https://jsfiddle.net/jf2h89dm/9/

[nazimboudeffa]

thank you @Mattia your solution is very interesting and i am going to use it

here's what i ve done btw

 

update: function(){

					if (game.input.keyboard.isDown(Phaser.Keyboard.UP)) {
							this.move(0, -1);
					}
					if (game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) {
							this.move(0, 1)
					}
					if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) {
							this.move(-1, 0)
					}
					if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) {
							this.move(1, 0)
					}
					if (game.input.keyboard.isDown(Phaser.Keyboard.SPACEBAR)){
							this.turn90();
					}
	},

	move: function(u, v){
				var a = Math.floor(this.player.x / gameOptions.tileSize);
				var b = Math.floor(this.player.y / gameOptions.tileSize);
				console.log(a, b);
				var playerTween = game.add.tween(this.player).to({
						x: (a + u) * gameOptions.tileSize + gameOptions.tileSize / 2,
						y: (b + v) * gameOptions.tileSize + gameOptions.tileSize / 2
			 	}, 200, Phaser.Easing.Linear.None, true);
	},

 

[Mattia]

Great!  Nice to hear that!  

[nazimboudeffa]

thx i think the problem is fixed so i am going on with the game now i rotate every tile like this when you tape SPACEBAR in the same solution "keyboard hotkeys"

	turn90: function(){
			var a = Math.floor(this.player.x / gameOptions.tileSize);
			var b = Math.floor(this.player.y / gameOptions.tileSize);
			console.log(a, b);

			game.add.tween(this.tilesArray[b][a]).to( { angle: 90 }, 200, Phaser.Easing.Linear.None, true);
	}

 

 

 

[Mattia]

@thefailtheory Yes, it will work for that, too.
Simply you are rotating the tiles to absolute 90 degrees instead of adding 90 each time.

Quick fix:

turn90: function(){
	var a = Math.floor(this.player.x / gameOptions.tileSize);
	var b = Math.floor(this.player.y / gameOptions.tileSize);

	if (this.tilesArray[b][a].angle % 90 == 0){
          game.add.tween(this.tilesArray[b][a]).to( { angle: this.tilesArray[b][a].angle+90 }, 200, Phaser.Easing.Linear.None, true);
        }
			
}

As you can see I've also added a modulus operator to check if it's possible to rotate the tile (to avoid rotating it when it's not a multiple of 90).

Oh, I've tested everything on jsFiddle, this time, too, here's the link:
https://jsfiddle.net/vtaq37vs/2/