JavaScrupt Posted May 26, 2014 Share Posted May 26, 2014 Essentially, my problem is pretty simple. I just need the ball to move to each square, from right to left, continually. However, when I use moveToObject, it moves the ball to the right square, then it just nearly gets to the left square, and proceeds to the top where it just moves left and right for some reason. My code is under this text, please help me fix it. It would be nice if you could use moveToObject to get it working. <!doctype html><html><head><title>Test Game</title><script type="text/javascript" src="phaser.min.js"></script></head><body><script type="text/javascript"> var game = new Phaser.Game(400, 490, Phaser.AUTO, '', { preload: preload, create: create, update: update });var side; function preload() { game.load.image('ball', 'assets/ball.png'); game.load.image('square', 'assets/square.png');} function create() { squares = game.add.group(); squares.createMultiple(20, 'square'); ball = game.add.sprite(365, 470, 'ball'); timer = this.game.time.events.loop(500, add_squares); side = "right"; game.stage.backgroundColor = '#ffffff';} function update() {} function add_one_square(x, y) { var square = squares.getFirstDead(); square.reset(x, y); square.body.velocity.y = 300; square.outOfBoundsKill = true; // Cant figure out where to put this or how to make it work game.physics.moveToObject(ball, square, 300); } function add_squares() { if (side == "right") { add_one_square(350, -15); side = "left"; } else { add_one_square(20, -15); side = "right"; } } </script></body></html> Link to comment Share on other sites More sharing options...
Zaidar Posted May 27, 2014 Share Posted May 27, 2014 Hi, I think I got your problem, you need to enable the physics arcade system in order to use the velocity. Also, Game.physics.moveToObject, doesn't work, you need to explicitely say game.physics.arcade.moveToObject() Here is the code I have working :function create() { squares = game.add.group(); squares.createMultiple(20, 'square'); ball = game.add.sprite(365, 470, 'ball'); // ADDED PHYSICS HERE TO THE SPRITE game.physics.arcade.enable(ball, Phaser.Physics.ARCADE); timer = this.game.time.events.loop(500, add_squares); side = "right"; game.stage.backgroundColor = '#ffffff';} function update() {} function add_one_square(x, y) { var square = squares.getFirstDead(); square.reset(x, y); // ADDED PHYSICS HERE TO THE SPRITE game.physics.arcade.enable(square, Phaser.Physics.ARCADE); square.body.velocity.y = 300; square.outOfBoundsKill = true; // CHANGED TO PHYSICS.ARCADE game.physics.arcade.moveToObject(ball, square, 300); } Basically I saw that the console said velocity was a property of undefined. So the body didn't exist. That's why I thought the body was missing. I hope it fix your problem Link to comment Share on other sites More sharing options...
JavaScrupt Posted May 27, 2014 Author Share Posted May 27, 2014 Hi, this didn't resolve my issue. Maybe I didn't specify my problem well enough. My issue is that I need the ball to move to each square in a zig-zag pattern, overlapping with each square before moving on to the next one. Link to comment Share on other sites More sharing options...
JavaScrupt Posted May 27, 2014 Author Share Posted May 27, 2014 Also, after 20 squares, the program crashes with the error "Cannot read property 'reset' of null" on line 42 [ square.reset(x, y); ] Link to comment Share on other sites More sharing options...
Zaidar Posted May 28, 2014 Share Posted May 28, 2014 After 20 squares that's normal that you get an error because you use the creatMultiple() function which create a limited number of square.Phaser only create 20 squares, and you're using only these. I recommand you to just create this square one by one. It won't kill the perfs as you're destroying them when they get out of the world.function create() { squares = game.add.group();// NO MORE CREATEMULTIPLE WE CREATE IN THE ADD_ONE_SQUARE FUNCTION ball = game.add.sprite(365, 470, 'ball'); game.physics.arcade.enable(ball, Phaser.Physics.ARCADE); timer = this.game.time.events.loop(1000, add_squares); side = "right"; game.stage.backgroundColor = '#ffffff';} function update() {} function add_one_square(x, y) { // var square = squares.getFirstDead(); // HERE WE CREATE ONE SQUARE EVERY 500s AT THE X AND Y COORDINATES var square = squares.create(x, y, 'square'); game.physics.arcade.enable(square, Phaser.Physics.ARCADE); square.body.velocity.y = 300; square.outOfBoundsKill = true; // Cant figure out where to put this or how to make it work game.physics.arcade.moveToObject(ball, square, 300); }After, the ohter problem of your code, is that the ball goes to the square position but at its creation's position. What I mean is that game.physics.arcade.moveToObject(ball, square, 300); is telling to the ball to move to the point where the square was at his creation. Given that the square is falling down, it looks like the ball doesn't go to the square position. If you really want the ball to go to the current square position, you need to update the ball position given the current position of the square. So in the update function you need to tell the ball to move to the current position of the lowest square. (if that's the result you want I suppose) ? Link to comment Share on other sites More sharing options...
JavaScrupt Posted May 31, 2014 Author Share Posted May 31, 2014 Sorry for the late response, I was away from my computer for a bit. But you just helped solve my issue, which was indeed that the ball was moving to the squares spawn position, and not it's current position. I fixed it by making it follow the squares current position in the update function. Thanks for your help! Link to comment Share on other sites More sharing options...
Recommended Posts