group and child sprite interactions

[evan312]

I started off with controlling my player through strictly a player sprite, however I learned from this forum that to give the player a weapon that stays in the player's hand while he rotates, it would be best to make it a group.

 

So i created a player group and added torso and pistol to the player group, but I am having lots of troubles with the interactions like what properties should go under what and how should i move the player and handle collisions.

 

My result after a lot of tinkering is that the player can move and rotate beautifully but if i use things like torso.collideWorldBounds i get a lot of odd behavior, possibly as a result of x and y coordinates becoming different from group to child. I also am having trouble with getting the camera to follow the player (something that was working before). Another problem is that I did a few checks to see if collision was working, and from what I saw, I don't think it is.

 

I would like to use the physics module as it makes collision and stuff a lot easier, but right now i can't seem to get it to work with the group/sprite combo. 

 

 

 below is my full main.js and the project file, because I cannot seem to figure out where the problem lies. Sorry for the long post and thanks a ton for all the help!

 

TDS.zip

var game = new Phaser.Game(800, 600, Phaser.CANVAS, '', { preload: preload,                                                          create: create,                                                          update: update,                                                          render: render });// Variablesvar player;var torso;var pistol;// Functionsfunction keyDown(KEY) { // Shorten isDown inputs    return eval('game.input.keyboard.isDown(Phaser.Keyboard.' + KEY +')');};function preload () {    game.load.image('BG', 'assets/bg.png');    game.load.spritesheet('player', 'assets/playerSS.png', 64, 64);    game.load.spritesheet('robot1', 'assets/raw/robot1.svg', 128, 128);    game.load.image('pistol', 'assets/pistol.png');    };function create () {    // Background    game.world.setBounds(0, 0, 1600, 1200);    game.add.sprite(0, 0,'BG');    // Player    player = game.add.group();    torso = player.create(0, 0, 'player');    // Next lines freaks it out     //torso.body.collideWorldBounds = true;     //player.body.collideWorldBounds = true;    torso.animations.add('walk', [0,1], 5, true);    torso.speed = 5;    torso.walkingX = false;    torso.walkingY = false;      torso.body.offset.x = 32;    torso.body.offset.y = 32;    torso.anchor.setTo(0.5, 0.5)    game.camera.follow(torso, Phaser.Camera.FOLLOW_TOPDOWN);    player.x = 100    player.y = 100        // Pistol    pistol = player.create(27, 21, 'pistol');    pistol.anchor.setTo(.15 , .5);            // Robot    robot1 = game.add.sprite(200, 200, 'robot1');    robot1.scale.setTo(.5, .5);    robot1.animations.add('move', [0,1,2], 7, true)    robot1.body.immovable = true;};function update () {    if (keyDown('A') || keyDown('LEFT')){        player.x -= torso.speed;        //torso.body.velocity.x = -torso.speed;        torso.walkingX = true;    }    else if (keyDown('D') || keyDown('RIGHT')){        player.x += torso.speed;        //torso.body.velocity.x = torso.speed;        torso.walkingX = true;    }    else{        //torso.body.velocity.x = 0;        torso.walkingX = false;    }       if (keyDown('S') || keyDown('DOWN')){        player.y += torso.speed;        //torso.body.velocity.y = torso.speed;        torso.walkingY = true;    }    else if (keyDown('W') || keyDown('UP')){        player.y -= torso.speed;        //torso.body.velocity.y = -torso.speed;        torso.walkingY = true;    }    else{        //torso.body.velocity.y = 0;        torso.walkingY = false;    }        if (!torso.walkingX && !torso.walkingY){        torso.animations.stop();        torso.frame = 0;    }    else        torso.animations.play('walk');        // collide world bounds without using the physics module    if (player.x <= 32)        player.x = 32;    else if (player.x >= 1600 -32 )        player.x = 1600 -32;    if (player.y <= 32)        player.y = 32;    else if (player.y >= 1200 - 32)        player.y = 1200 - 32;        player.rotation = game.physics.angleToPointer(torso.center);            // Doesn't seem to be operational    game.physics.collide(torso, robot1);    //game.physics.overlap(torso, robot1, console.log('derp'), null, this);            // uncommenting below lines = freak out    //player.x = torso.body.x;    //player.y = torso.body.y ;     //torso.body.x = torso.body.x;    //torso.body.y = torso.body.y;       //not relevant    robot1.animations.play('move');};function render (){    //game.debug.renderText('template', 20,20);    game.debug.renderText(player.x + ' ' + player.y, 20, 40);    game.debug.renderText(Math.round(torso.body.x) + ' ' + Math.round(torso.body.y), 20, 60);};

[BitlasLT]

EDIT : Looked at full source.Doesnt seems to effect yours project
EDITNR2:I am not really sure why collide doesnt work in yours project ,but overlap can be used isntead. Just yours file needed to be fixed  .I added function to use than  touching ,also showing bounding box.Why did you set body offsets ?

Link to edited game.js 
https://www.dropbox.com/s/7l0aoha3ofeo01h/main.js
 

EDITNR3:Totally forgot,if you want to use collide you need  to use phycis  on torso .So no x, or y modification ,but velocity.So overlap is best for you.

 

[evan312]

EDIT : Looked at full source.Doesnt seems to effect yours project

EDITNR2:I am not really sure why collide doesnt work in yours project ,but overlap can be used isntead. Just yours file needed to be fixed  .I added function to use than  touching ,also showing bounding box.Why did you set body offsets ?

Link to edited game.js 

https://www.dropbox.com/s/7l0aoha3ofeo01h/main.js

 

EDITNR3:Totally forgot,if you want to use collide you need  to use phycis  on torso .So no x, or y modification ,but velocity.So overlap is best for you.

 

edit #2: I used body offsets because the player x and y were different from the torso x and y and i thought that might have caused complications, but I see now that changing offset messed up the bounding box (really cool debug feature, will definitely use that in the future! thanks!).

 

edit #3: ok, so should I make the switch to use velocity then strictly work off the sprite w/ physics? how would that work with the group? if I should keep it how it is, can you help me get a baseline of what code should be for the group and which should be for the sprite for the rest of  my project?

 

right now i think it looks like:

 

player (group)

   - movement / rotation

   - boundary collision

   - holding weapons

   - spawn point

 

torso (sprite)

   - health and other stats

   - collision w/ other sprites

   - animations

 

does that sound about right? 

 

Thank you so much!

 

 

edit: Oh! and what should I do about getting the camera to work?

[BitlasLT]

To be honest iam into phaser only 2 weaks myself.
SO i know what i already used.And my approach might be no best way to do things.

You already have basic overlapping cheeked and boundaries so it would work for bullets too.I guess stick with yours current code.
As i checked yours code ,that would need some reworking  to be able to use velocity instead X and Y .As rotation  ,and arts goes nuts ,if changed for testing

For camera:
basic folowing 
 

game.camera.follow(player);

For some unknown reason methods from tutorial doesn't work.
I guess iam missing something abvious

[evan312]

Ok awesome, thanks for the help!