Unable to Access Sprite Coordinates of Group Children?

[Nebulocity]

I've come to the point in my game where I must start having my enemies move around the map.  I've looked at the Group class in the documentation, and there are no examples that cover this (the only one I found that was relevant was for changing alpha settings), and so I have a few questions that I hope can be addressed (or at least point me in the right direction).

 

First, this is how I created my group (this works perfectly):

        /***************************        ****   CREATE ENEMIES  *****        ***************************/        enemies = game.add.group();        for (var i = 1; i <= 3; i++)        {            if (i == 1) {                var enemy = enemies.create(745, 80, 'enemy');                    enemy.body.allowGravity = true;                enemy.body.collideWorldBounds = true;            }            else if (i == 2) {                var enemy = enemies.create(745, 240, 'enemy');                    enemy.body.allowGravity = true;                enemy.body.collideWorldBounds = true;               } else if (i == 3) {                var enemy = enemies.create(745, 440, 'enemy');                    enemy.body.allowGravity = true;                enemy.body.collideWorldBounds = true;               };        }

What I want to do is to create a system of coordinate checks in order to move my enemies along towards their goal (the player's base).  So, in order to navigate the level (like a maze), I wanted to iterate through all of the enemies in my "enemies" group, and check their sprite x,y coordinates.  Then, based on those coordinates, set their velocity so that they change their course and continue through the maze.

 

The way that I thought to do it would be like this, but this is giving me errors. 

        /***************************        ****   UPDATE ENEMIES  *****        ***************************/        // Iterate through each enemy in the Enemies group, and check its x,y coords.          // For example, to have all 3 enemies on the right side of the screen move left, and then either up/down/left again to continue the maze,        // 	the coordinates must be checked.  Below will ensure that the top and bottom enemies hit their         //	first left junction (and middle enemy just continues on his merry way left)        // IF x > 445, move enemy left.        // IF x = 445 && y < 285, move enemy down.  (top enemy)        // IF x = 445 && y > 285, move enemy up. (bottom enemy)        // IF x = 445 && y = 285, move enemy left. (all enemies continue left once they hit this point)        // ...and so on.        //Example, if x > 445, it can move left, otherwise if x = 445 && y < 285, .  But if it's x = 445 && y = 285, it needs to move left again.        for (var i = 1; i <= enemies.length; i++) {        	if (enemies[i].x > 445) {   // <--- this breaks        		enemies[i].body.velocity.x = -100;        	}        	else {        		enemies[i].body.velocity.x = 0;	        	};        };

I get the error

1. Uncaught TypeError: Cannot read property 'x' of undefined index.html:275
   1. updateindex.html:275
   2. d.StateManager.updatephaser.min.js:4
   3. d.Game.updatephaser.min.js:5
   4. d.RequestAnimationFrame.updateRAFphaser.min.js:8
   5. window.requestAnimationFrame._onLoopphaser.min.js:8

 

When using the above code.  Now, I know that I can access the 'body.velocity' property of each child within the group, so that works fine (if I put just that, all of my enemies move left), and "enemies" is obviously defined (because it has no trouble changing the velocity a few lines down).  But, for some reason, I cannot check their positions.  Correct me if I'm wrong, please, but each enemy in the enemies group has both a 'sprite' and a 'body', yes?  Because when I called enemy.animations.add() after creating them, it worked, and that is a function associated with the Sprite class.  Yet, I cannot access the sprite's coordinates?  Why is this?

All told, I could be doing this incorrectly and just causing myself headaches.  This is my first "major" project in Javascript, beyond managing a few elements on a page with jQuery, and it's my first game that wasn't in QBASIC back in the 90s, so I am definitely no expert.  But I want to get better, and have spent hours poking through the documentation and haven't come up with a solution.

This would be much easier if there was some way to set out a path and say "every 'turn', progress to the next point, which would be kind of cool to create on my own, but I still can't do that without finding out what I'm doing wrong with accessing the sprite coordinates.  And to show what I'm talking about with the maze, and checking coordinates, the 445,1 coordinate is in the middle of the intersection right there near the center of the image.  Then, I'm checking the Y coordinate to see whether the sprite belongs to the top, bottom, or middle enemy, and move them on from there.

Thanks in advance. 

 

[Heppell08]

In update have this: var I; for(i=0;enemies.length;i++) { console.log(enemies.getAt(I).body.x); } that will log the x pos of an enemy. Also remove the capital I from the code so its lower case. I'm replying via my phone lol

[Heppell08]

Also here's a wiki I wrote on Phasers groups that has information on that code. Maybe worth a read. Very well documented. https://github.com/photonstorm/phaser/wiki/Phaser-General-Documentation-:-Groups

[Nebulocity]

Oh cool deal. I'm on my phone too ;-)

I couldn't get that for loop too work for me at first because it was throwing "undefined" errors at me, but i think i fixed it. Going to check here in 30 mins or so to see if i can get my pathing logic to work.

For collisions, I'm assuming you are using

physics.collision (player, enemies.getAll(i), collisionHandler, null, this);

In a loop? It seems to be the only way to get it to pass an object out of a group for collision processing, because i couldn't find a way to find all colliding enemies without it. Thoughts?

[Nebulocity]

Also, i cleaned up the code on your github entry do that the code is displayed in block format. I did that because it was running off of the page and not displaying correctly. Hoe you don't mind!

[Heppell08]

For it to work in the update you need the var I; then for(i=0; etc etc in update. It throws undefined because you need the vat I; declared in the loop and its also got to be:

Enemies.getAt(I).body.x

Also thanks for cleaning it up. I'm not fully learnt on github writing styles lol

[Nebulocity]

Haha, neither am I.  I've never used Github until I found phaser...last week!  I had an account so that I could back something up, and said "screw it" because it was too complicated for what I needed it for.

 

Yea, I got the log working (although it's crazy since it spams the log so often, I may just try to read up on how to print it to the screen in render() and let it auto update there, with something like this so that the numbers are rounded and not down to the 8th decimal, lol.

console.log('Enemy #' + i + ' (' + math.ceil(enemies.getAt(i).x) + ',' + math.ceil(enemies.getAt(i).y) + ')');