var game = new Phaser.Game(400, 600, Phaser.AUTO, '', { preload: preload, create: create, update: update });
//creating score value and onscreen text
var score = 0;
var scoreText;
function preload() {
// preload assets
game.load.image('sky', 'assets/img/sky.png');
game.load.image('ground', 'assets/img/platform.png');
game.load.image('star','assets/img/star.png');
game.load.spritesheet('baddie', 'assets/img/baddie.png', 32, 48);
}
function create() {
// place your assets
//enabling Arcade Physics system
game.physics.startSystem(Phaser.Physics.ARCADE);
//adding a background
game.add.sprite(0, 0, 'sky');
//a group containing the ground and platforms to jump on
platforms = game.add.group();
//enabling physics for any object in this group
platforms.enableBody = true;
//creating the ground
var ground = platforms.create(0, game.world.height - 64, 'ground');
//scaling to fit the width of the game
ground.scale.setTo(2, 2);
//stops ground from falling once player jumps on it
ground.body.immovable = true;
//create five ledges
var ledge = platforms.create(-300, 400, 'ground');
ledge.body.immovable = true;
ledge = platforms.create(200, 400, 'ground');
ledge.body.immovable = true;
ledge = platforms.create(100, 300, 'ground');
ledge.body.immovable = true;
ledge = platforms.create(-200, 200, 'ground');
ledge.body.immovable = true;
ledge = platforms.create(300, 100, 'ground');
ledge.body.immovable = true;
//create the player and its settings
player = game.add.sprite(32, game.world.height - 150, 'baddie');
//enabling physics on player
game.physics.arcade.enable(player);
//giving player a slight bounce
player.body.bounce.y = 0.2;
player.body.gravity.y = 300;
player.body.collideWorldBounds = true;
//walking left and right animations
player.animations.add('left', [0, 1], 10, true);
player.animations.add('right', [2, 3], 10, true);
//create group for stars
stars = game.add.group();
stars.enableBody = true;
//creating 12 stars evenly spaced apart
for (var i = 0; i < 12; i++) {
//create a star inside of the 'stars' group each 33 px apart
var star = stars.create(i * 33, 0, 'star');
//giving it gravity
star.body.gravity.y = 6;
//giving each star a random bounce value
star.body.bounce.y = 0.7 + Math.random() * 0.2;
}
scoreText = game.add.text(16, 16, 'Score: 0', {fontSize: '32px', fill: '#000'});
}
function update() {
// run game loop
//collide player and stars with platforms
var hitPlatform = game.physics.arcade.collide(player, platforms);
//built in keyboard manager
cursors = game.input.keyboard.createCursorKeys();
//reset players velocity (movement)
player.body.velocity.x = 0;
//moving with arrow keys
if (cursors.left.isDown) {
//move to left
player.body.velocity.x = -150;
player.animations.play('left');
}
else if (cursors.right.isDown) {
//move right
player.body.velocity.x = 150;
player.animations.play('right');
}
else {
//stand still
player.animations.stop();
player.frame = 2;
}
//allow player to jump if touching ground
if (cursors.up.isDown && player.body.touching.down && hitPlatform) {
player.body.velocity.y = -350;
}
//checking for collision with stars and platforms
game.physics.arcade.collide(stars, platforms);
//checking if player overlaps with star
game.physics.arcade.overlap(player, stars, collectStar, null, this);
}
function collectStar (player,star) {
//removes star from screen
star.kill();
//add and update score
score += 10;
scoreText.text = 'Score: ' + score;
}
I can't seem to figure out why, but once I changed the sprite (which has fewer animation frames than the original), some strange errors popped up. The two error messages say:
Uncaught TypeError: Cannot read property 'getFrameIndexes' of null
Uncaught ReferenceError: stars is not defined
The animation frame ranges don't seem to go out of bounds and I've already defined my 'stars' variable in the create function. Any ideas on why I'm getting these weird error messages? (the spirtesheet of the player is attached below)
