Handling collisions with tiles using arcade physics

[eithz]

Hi there.

I am very new in gamedev.

Now playing with Phaser.js

I have tilemap with two tile types - ground and wall.

Player - yet another sprite - must collide with walls (234 in json).

"Games" uses ARCADE physics.

I have the following code (coffescript):

player = nullwalls = nullcontrols = nullplayerSpeed = 400layer = nullstate =     preload:        ->            game.load.atlasJSONHash 'sprites', 'assets/sprites.png', 'assets/sprites.json'            game.load.tilemap 'level1', 'assets/map1.json', null, Phaser.Tilemap.TILED_JSON            game.load.image 'tiles', 'assets/tileset.jpg'    create:        ->            game.stage.backgroundColor = '#ffffff';            game.physics.startSystem Phaser.Physics.ARCADE            map = game.add.tilemap 'level1'            map.addTilesetImage 'tileset', 'tiles'            map.setCollision 234            layer = map.createLayer 'ground'            layer.resizeWorld()            player = game.add.sprite 100, 100, 'sprites', 'player01.png'            game.physics.enable player            player.body.collideWorldBounds = true            player.body.bounce.setTo 1, 1            player.anchor.setTo 0.5, 0.5            player.animations.add 'blink', ['player01.png', 'player02.png']            game.camera.follow(player);            game.camera.deadzone = new Phaser.Rectangle 150, 150, 100, 100            game.camera.focusOnXY 0, 0            controls =                 top: game.input.keyboard.addKey 87 # w                bottom: game.input.keyboard.addKey 83 # s                left: game.input.keyboard.addKey 65 # a                 right: game.input.keyboard.addKey 68 # d    update:        ->            console.log game.physics.arcade.collide(player, walls);            player.animations.play 'blink'            player.body.velocity.setTo 0, 0            if controls.top.isDown                player.body.velocity.y = -playerSpeed            if controls.bottom.isDown                player.body.velocity.y = playerSpeed            if controls.left.isDown                player.body.velocity.x = -playerSpeed            if  controls.right.isDown                player.body.velocity.x = playerSpeedgame = new Phaser.Game 320, 320, Phaser.AUTO, 'phaser-example', state

(Also on https://bitbucket.org/eithz/phaserbegin/src/28ba8a6ad47422a2c02cc3cdd32f9db1ad128a14/coffee/main.coffee and builded into js on https://bitbucket.org/eithz/phaserbegin/src/28ba8a6ad47422a2c02cc3cdd32f9db1ad128a14/js/main.js

)

The line number 40 always prints false.

Where am I going wrong?

The whole source avaiable at https://bitbucket.org/eithz/phaserbegin (there are prebuild javascript also) and online on http://eithz.bitbucket.org/

UPD: Fixed links

[Alchewie]

Because `walls` is always `null`

What you want to collide is `player` with `layer` not `walls`

 

So line 40 must be

```

console.log game.physics.arcade.collide player, layer

```

 

And that works !

 

PS : Coffeescript doesn't need semicolon after instruction, so you can remove them line 16, 29, 40 !

[eithz]

Because `walls` is always `null`

What you want to collide is `player` with `layer` not `walls`

 

So line 40 must be

```

console.log game.physics.arcade.collide player, layer

```

 

And that works !

 

PS : Coffeescript doesn't need semicolon after instruction, so you can remove them line 16, 29, 40 !

Oh, this code is from previous try, when I was keeping walls in another layer... I muddle.

 

I know about semicolons, but currenlty I am doing copy-paste-driven development, based on examples.phaser.io, so I forgot to clean code from not necessary  in cs elements. Thanks a lot!

[Anny]

I'm having problems using tilemaps created with TIled and colliding with it with the Arcade System, sometimes it detects the collision but other it just does'nt, it's random. Is there a way to fix this? I'm using the same code there's on most examples in this forum

 

this.game.physics.startSystem(Phaser.Physics.ARCADE);
      

 

map = this.game.add.tilemap('map');
        map.addTilesetImage('level1');
        layer = map.createLayer('Capa de Patrones 1');
        layer.resizeWorld();
        map.setCollisionBetween(425, 450);
        
        // El judador principal.
        player = game.add.sprite(200, 400, 'player');
        this.game.physics.enable(player, Phaser.Physics.ARCADE);

 

 

And then in the update function

this.game.physics.arcade.collide(player, layer);

[miguelfeliciano]

I've gone through the Phaser book, excellent by the way; but, when building my first game for my son using the Kenney.nl assets, I've run into a problem where the player doesn't collide with the ground layer of the Tiled json file.  The game will be a simple coin collector with a key(s) on each level to unlock certain items or power-ups.

 

I've gone through the spritesheet where all of the images are used for Tiled and counted from the top left, zero-based, to the right and wrapping down to start the new row on the left.  I counted to the tiles that are used for the ground and used those numbers to set the collision for the map and had set the collision between the ground and the player and the player falls through and never collides with the ground.

 

Here's a dropbox link to a zip file containing the source.  I got rid of the Grunt and Bower folders to keep the zip file small (node modules folder and a vendor folder that was used for Bower).  Just run Grunt install and Bower install to get those files and folders.

 

https://dl.dropboxusercontent.com/u/7534840/AlienAdventures.zip

 

What am I missing?  Trying to develop this game now, I'm discovering some things I wish would have been in the book... like a multi-layer Tiled map to interact with.

 

**** There is still code for Require.js that I thought of using, but will be removing it since it wouldn't make a big difference in performance - Just ignore that code ****

[miguelfeliciano]

I found the problem with my player falling through the world in a multi-layer Tiled map.  I had to specify the layer in the setCollision.

 

After fixing that problem, I found a great tutorial via the GameDev Weekly email that showed how to load up a collectables layer for the player to interact with.  This was exactly what I was looking for.

 

Tutorial: http://www.gamedevacademy.org/html5-phaser-tutorial-top-down-games-with-tiled