topmotion Posted June 24, 2014 Share Posted June 24, 2014 So I'm following the Map Collide and Star Struck examples and no matter what I do I can not get my player to collide with the map. I suspect its something simple, but I just can not pin it down! So far:- Map draws fine.- With debug on the map layer seems to be properly outlined in green.- Player moves around.- Player will not collide with layer. Any help or even a point in the right direction would be greatly appreciated! My JS: var game = new Phaser.Game(1280,768,Phaser.AUTO,'game',{preload:preload, create:create, update:update}); function preload(){ //load json map game.load.tilemap('map','assets/level1.json',null,Phaser.Tilemap.TILED_JSON); game.load.image('tiles','assets/tiles2.png'); game.load.image('hero','assets/hero.png'); } var map; var layer; var player; var cursors; function create(){ game.physics.startSystem(Phaser.Physics.ARCADE); map = game.add.tilemap('map'); map.addTilesetImage('tiles','tiles'); map.setCollision(1); layer = map.createLayer('Tile Layer 1'); layer.resizeWorld(); layer.debug = true; player = game.add.sprite(128,128,'hero'); game.physics.enable(player); cursors = game.input.keyboard.createCursorKeys(); } function update(){ game.physics.arcade.collide(player,layer); //test for directionals if(cursors.left.isDown){ player.body.x -= speed; } if(cursors.right.isDown){ player.body.x += speed; } if(cursors.up.isDown){ player.body.y -= speed; } if(cursors.down.isDown){ player.body.y += speed; } }MY JSON:{ "height":12, "layers":[ { "data":[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 2, 2, 1, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 2, 2, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 2, 2, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 2, 2, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 1, 2, 2, 1, 1, 2, 2, 0, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 0, 1, 2, 2, 2, 2, 2, 1, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 2, 1, 2, 2, 1, 2, 1, 1, 2, 2, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 2, 1, 1, 2, 2, 1, 1, 2, 2, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 1, 2, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1], "height":12, "name":"Tile Layer 1", "opacity":1, "type":"tilelayer", "visible":true, "width":20, "x":0, "y":0 }], "orientation":"orthogonal", "properties": { }, "tileheight":64, "tilesets":[ { "firstgid":1, "image":"tiles2.png", "imageheight":64, "imagewidth":128, "margin":0, "name":"tiles", "properties": { }, "spacing":0, "tileheight":64, "tilewidth":64 }], "tilewidth":64, "version":1, "width":20} Link to comment Share on other sites More sharing options...
j0hnskot Posted June 24, 2014 Share Posted June 24, 2014 What the value of speed is?Also which version of phaser you use? Link to comment Share on other sites More sharing options...
topmotion Posted June 24, 2014 Author Share Posted June 24, 2014 var speed; is defined outside the functions with the other vars. I guess it didn't get pasted in, but it does have a value. My Phaser is the minified 2.0.5. Any ideas? Link to comment Share on other sites More sharing options...
ragnarok Posted June 24, 2014 Share Posted June 24, 2014 The player is enabled in the physics engine, but not the layer(at least it doesn't look like it). I don't know if that's coded in the map-data, but perhaps something like "game.physics.enable(layer);" is needed!? Link to comment Share on other sites More sharing options...
topmotion Posted June 24, 2014 Author Share Posted June 24, 2014 The player is enabled in the physics engine, but not the layer(at least it doesn't look like it). I don't know if that's coded in the map-data, but perhaps something like "game.physics.enable(layer);" is needed!? I thought the same thing, that perhaps the layer didn't have a 'body'. So when I added: game.physics.enable(layer);right after the player, nothing different happens. Player still glides through the layer even when the layer has that green debug outline...It's strange. I've rewritten this thing multiple times, wracked my brain and stepped through it line-by-line, but can't put a finger on why it doesn't collide. I'm no JavaScript pro, but I'm starting to feel stupid because its probably something simple! In case it helps, here's my html. <!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href=""> <script type="text/javascript" src="phaser.min.js"></script> <style> </style></head><body> <div id="game"></div> <script type="text/javascript" src="game1.js"></script></body></html> Link to comment Share on other sites More sharing options...
j0hnskot Posted June 24, 2014 Share Posted June 24, 2014 Is the value of speed high? I can't see any other problem myself . The only i can thing is that you set the speed really high for the physics to calculate the collision. Link to comment Share on other sites More sharing options...
ragnarok Posted June 24, 2014 Share Posted June 24, 2014 The example-Game uses "map.setCollision...": http://examples.phaser.io/_site/view_full.html?d=games&f=starstruck.js&t=starstruck http://docs.phaser.io/Phaser.Tilemap.html#setCollision...http://docs.phaser.io/Phaser.Tilemap.html#setCollisionByExclusion Link to comment Share on other sites More sharing options...
topmotion Posted June 24, 2014 Author Share Posted June 24, 2014 yup star struck uses setCollisionByExclusion, but since I have but one tile, I used map.setCollision(1); The 1 being the id# of the tileset as listed in the .json. I tried it using ByExclusion, it has the same effect. Link to comment Share on other sites More sharing options...
j0hnskot Posted June 24, 2014 Share Posted June 24, 2014 Change every player.body.x to player.body.velocity.x in the update method.Also, keep in mind that the way you do it there, even if change it to body.velocity you will end up with a huge speed. This will result to the player going through the walls because the collision check won't be fast enough to check if they collided or not. If you just wanted to use negative or positive speed , you need to use it like this: player.body.velocity.x = -speed; Link to comment Share on other sites More sharing options...
topmotion Posted June 24, 2014 Author Share Posted June 24, 2014 Change every player.body.x to player.body.velocity.x Thanks j0hnskot, that change enabled collisions. I guess just moving the sprite's x,y causes it to 'hop' over the edge of the colliding wall. Makes sense in retrospect. I suppose adding a keyUp handler to stop the velocity from continuously moving the sprite would make the movement closer to what I'm looking for. Thanks for your input! Link to comment Share on other sites More sharing options...
lewster32 Posted June 24, 2014 Share Posted June 24, 2014 Rather than rely on a keyUp handler to stop the sprite you may instead either want to use the body.drag property to bring your sprite to a halt over time, or have it so every frame whenever a key is not being held, the body.velocity x and y values are reduced - preferably multiplied by a value between 0 and 0.99, the lower of which will cause the sprite to come to a halt sooner. Link to comment Share on other sites More sharing options...
topmotion Posted June 24, 2014 Author Share Posted June 24, 2014 have it so every frame whenever a key is not being held, the body.velocity x and y values are reduced - preferably multiplied by a value between 0 and 0.99, the lower of which will cause the sprite to come to a halt sooner. great idea lewster. I'll implement this. Then its on to creating enemies! Link to comment Share on other sites More sharing options...
Recommended Posts