Need help with physics and animations

[mrSully]

Okay, so my problem is that I get two errors when trying to perform a simple physics action on an animating sprite:

 

Uncaught TypeError: Cannot set property 'allowRotation' of null game.js:23

Uncaught TypeError: Cannot read property 'x' of undefined phaser.js:49465

 

What do? and thank you!

 

code is:

 

//this is the javascript file

var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update });

 

function preload() {

    game.load.image('background', 'bg.png');

    game.load.atlasJSONHash('glow', 'Reaper Sprites/glow/glowSheet.png', 'Reaper Sprites/glow/glowSheet.json');

}

 

var glow;

 

function create() {

 

    game.physics.startSystem(Phaser.Physics.ARCADE);

 

    game.stage.backgroundColor = '#0072bc';

 

    // Enable Arcade Physics for the sprite

    

    //  This sprite is using a texture atlas for all of its animation data

    //game.add.sprite(0, 0, 'background');

    var glow = game.add.sprite(380, 500, 'glow');

    // Tell it we don't want physics to manage the rotation

    //glow.body.allowRotation = false;

 

    //  Here we add a new animation called 'run'

    //  We haven't specified any frames because it's using every frame in the texture atlas

    glow.animations.add('run');

 

    //  And this starts the animation playing by using its key ("run")

    //  15 is the frame rate (15fps)

    //  true means it will loop when it finishes

    glow.animations.play('run', 15, true);

 

}

 

function update() {

 

    glow.rotation = game.physics.arcade.moveToPointer(glow, 60, game.input.activePointer, 500);

    

}

[mrSully]

UPDATE

 

new error

 

Uncaught TypeError: Cannot read property 'velocity' of null 

 

previous was overwriting my variable locally because I was silly

 

//this is the javascript file

var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update });

 

function preload() {

    game.load.image('background', 'bg.png');

    game.load.atlasJSONHash('glow', 'Reaper Sprites/glow/glowSheet.png', 'Reaper Sprites/glow/glowSheet.json');

}

 

var glow;

 

function create() {

 

    game.physics.startSystem(Phaser.Physics.ARCADE);

 

    game.stage.backgroundColor = '#0072bc';

 

    // Enable Arcade Physics for the sprite

    

    //  This sprite is using a texture atlas for all of its animation data

    //game.add.sprite(0, 0, 'background');

    glow = game.add.sprite(380, 500, 'glow');

    // Tell it we don't want physics to manage the rotation

    //glow.body.allowRotation = false;

 

    //  Here we add a new animation called 'run'

    //  We haven't specified any frames because it's using every frame in the texture atlas

    glow.animations.add('run');

 

    //  And this starts the animation playing by using its key ("run")

    //  15 is the frame rate (15fps)

    //  true means it will loop when it finishes

    glow.animations.play('run', 15, true);

 

}

 

function move() {

    game.physics.arcade.moveToPointer(glow, 300);

}

 

function update() {

 

    glow.rotation = game.physics.arcade.moveToPointer(glow, 60, game.input.activePointer, 500);

    

    /*if (game.input.activePointer.isDown)

    {

        move();

    }*/

    

}

[lewster32]

In this part:

    // Enable Arcade Physics for the sprite

You seem to be missing the code that actually enables the body? It should be this:

    glow = game.add.sprite(380, 500, 'glow');    // Enable Arcade Physics for the sprite    game.physics.arcade.enable(glow);

[mrSully]

Always the simple things!  Thank you very much.

 

One more for you now:

 

When the mouse is clicked, the object moves towards it with a constant speed, if the mouse is let up, it will arrive there while decelerating.  The problem arises when the player holds down the mouse in one spot and the sprite bounces back and forth rapidly.

 

function move() {

    game.physics.arcade.moveToPointer(glow, 250);

}

 

function update() {

 

    

    

    //game.physics.arcade.moveToPointer(glow, 60, game.input.activePointer, 500);

    

    if (game.input.activePointer.isDown)

    {

        if(!clicked)

            clicked = true;

        move();

    }

    else if(clicked) {

        game.physics.arcade.moveToXY(glow, game.input.activePointer.positionUp.x, game.input.activePointer.positionUp.y, 250, 1500);

    }

    

}

[lewster32]

The bouncing issue is a problem evident in the examples too, and is likely due to the fact that the object is moving at more than 1 pixel per second, and it will in the majority of cases overshoot its target constantly as a result, then have to keep changing direction to try and reach it. The maxTime parameter usually helps fix this - see this fiddle which is similar to your functionality: http://jsfiddle.net/lewster32/LL6w2whf/

[mrSully]

I took a look.  My plan is to have it move towards the point at a constant speed, and then have it decelerate once it enters the "problem area"  in order to do that I need to know which property of game.input.mouse would be the same as an <object>.position.x or y.  I looked at position but it appears to be position on the screen, not within the game area.

 

I know its a simple solution, it is just eluding me.  Thank you again by the way, you are always incredibly helpful!

[mrSully]

So I got it to work the way I intended, ill paste the code.  Very simple.  I was just using the wrong position variable lol

 

var xStore;

var yStore;

var slowing = false;

 

function move() {

    xStore = game.input.activePointer.position.x;

    yStore = game.input.activePointer.position.y;

    

    var tempX = glow.position.x;

    var tempY = glow.position.y;

    

    if((Math.abs(tempX - xStore) + Math.abs(tempY - yStore)) > 20)

        game.physics.arcade.moveToPointer(glow, 250);

    else {

        if(!slowing) {

            game.physics.arcade.moveToXY(glow, xStore, yStore, 250, 100);

            slowing = true;

        }

    }

}

 

function update() {

 

    

    

    //game.physics.arcade.moveToPointer(glow, 60, game.input.activePointer, 500);

    

    if (game.input.activePointer.isDown)

    {

        slowing = false;

        if(!clicked)

            clicked = true;

        move();

    }

    else if(clicked) {

        game.physics.arcade.moveToXY(glow, game.input.activePointer.positionUp.x, game.input.activePointer.positionUp.y, 250, 1500);

    }

    

}