Search the Community

I've started using the Coding with Chrome extension to code Phaser on my Chromebook. I've added gravity and I'm trying to detect when things collide using physics.arcade.overlap(), but the function I provide for when it collides is never called. What I do is I make a matrix of objects and then detect collisions between each of them and the player. I think there's a better way to do this with groups but I'll look into that later. Here's my code: var player, map, mapObjs; map = [['b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b'], ['b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b'], ['b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b'], ['b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b'], ['b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b'], ['b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b'], ['b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b'], ['b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b', 'b']]; mapObjs = new Array(map[0].length); var game = new Phaser.Game(768, 768, Phaser.AUTO, 'Unnamed Game'); game.state.add('main', { preload: function(e) { game.load.image('background', '{{ file:background.png }}'); game.load.image('player', '{{ file:download.jpeg }}'); game.load.image('block', '{{ file:Brick_Block.png }}'); }, create: function(e) { if (navigator.userAgent == 'CwC sandbox') {game.time.desiredFps = 30;} var backgroundImage = game.add.image(0, 0, 'background'); backgroundImage.width = 768; backgroundImage.height = 768; player = game.add.sprite(50, 100, 'player'); game.physics.startSystem(Phaser.Physics.ARCADE); game.physics.arcade.enable(player); player.body.gravity.y = 9; player.body.bounce.y = 0.1; player.width = 100; player.height = 100; player.body.collideWorldBounds = true; for(var i = 0; i < map[0].length; i++) { mapObjs[i] = []; for(var j = 0; j < map.length; j++) { mapObjs[i][j] = game.add.sprite(32*i, 300+32*j, 'block'); mapObjs[i][j].width = 32; mapObjs[i][j].height = 32; } } }, input_: function(e) { }, update: function(e) { this.input_(e); for(var i = 0; i < mapObjs.length; i++) { for(var j = 0; j < mapObjs[i].length; j++) { game.physics.arcade.overlap(player, mapObjs[i][j], function(object1, object2) { console.log('hi'); // This never happens for some reason even thought the objects are visibly overlapping player.body.gravity.y = 0; player.body.accelerationY = 20; }, null, this); } } }, render: function(e) { }, }, true); game.state.start('main'); The '{{ file:background.png }}' is just the way that the editor references images so you can ignore it.