Jump to content

Sprite keeps spawning in same place


Recommended Posts

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;

//creating random spawning place for diamond
var diamondX = game.world.randomX();
var diamondY = game.world.randomY();

function preload() {
	// preload assets
	game.load.image('sky', 'assets/img/sky.png');
	game.load.image('ground', 'assets/img/platform.png');
	game.load.image('diamond', 'assets/img/diamond.png');
	game.load.spritesheet('baddie', 'assets/img/dude.png', 32, 48);

function create() {
	// place your assets
	//enabling Arcade Physics system

	//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

	//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, 2, 3], 10, true);
	player.animations.add('right', [5, 6, 7, 8], 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 = 20;

		//giving each star a random bounce value
		star.body.bounce.y = 0.7 + Math.random() * 0.2;

	//create diamond and apply physics
	diamond = game.add.sprite(diamondX, diamondY, 'diamond');
	game.physics.enable(diamond, Phaser.Physics.ARCADE);
	diamond.body.gravity.y = 25;	
	diamond.body.bounce.y = 0.7 + Math.random() * 0.2;

	//displays score text on screen
	scoreText = game.add.text(16, 16, 'Score: 0', {fontSize: '32px', fill: '#000'});

function update() {
	// run game loop
	//collide player and 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;
	else if (cursors.right.isDown) {
		//move right
		player.body.velocity.x = 150;
	else {
		//stand still
		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);

	//checking for collision with diamond and platforms
	game.physics.arcade.collide(diamond, platforms);	

	//checking if player overlaps with diamond
	game.physics.arcade.overlap(player, diamond, collectDiamond, null, this);


function collectStar (player,star) {
	//function for updating score for collecting stars
	//removes star from screen

	//add and update score for stars
	score += 10;
	scoreText.text = 'Score: ' + score;

function collectDiamond (player, diamond) {
	//function for updating score for collecting diamond
	//remove diamond from screen

	//add and update score for diamond
	score += 25;
	scoreText.text = 'Score: ' + score;

It's my first time trying out Phaser and what I want to do is have the 'diamond' spawn at random locations on the screen. I've managed to get the diamond to spawn on screen, but it doesn't seem to be spawning in different locations when I reload the game each time. I'm assuming that I'd need to put something in the update function, but I need a little help with that part!

Link to comment
Share on other sites

There are two explanations:

In Phaser CE v2.10.3 (which I use) game.world.randomX is not a function, so you don't call it like

var diamondX = game.world.randomX();

you assign it like this:

var diamondX = game.world.randomX;


Second explanation: you need salt (or seed)

Basically if you call a random number generator of anykind at first cycle of a program it will always generate the same, seemingly random number. So, a truly random number is needed to generate a random number (if that makes sense) which is usualy called "seed" or "salt" for hashes. Easiest way to do that would be to use a timestamp function, which shows an ammount of seconds passed since 1st of january 1970 and mix it with random number generator function one would use. In your case it would require 'hacking" a method "randomX' (which is not even a method as far as I understand)



Link to comment
Share on other sites

@Mickety Ahh I see, sorry, I'm very new to Phaser, but would there be a better or simpler way to generate the diamond randomly on screen? (without messing with a timestamp function and all that fun stuff; hopefully something easy for a beginner to understand) Thanks for your help again!

Link to comment
Share on other sites


It looks like it gives you a 0,0 coordinates.

This might be because when you call game.world outside "create" function - "WORLD" doesn't exist yet. Try putting it last (and remember to move diamond creation code after that as well

Like this:

var diamondX = game.world.randomX;
var diamondY = game.world.randomY;
diamond = game.add.sprite(diamondX, diamondY, 'diamond');
game.physics.enable(diamond, Phaser.Physics.ARCADE);
diamond.body.gravity.y = 25;
diamond.body.bounce.y = 0.7 + Math.random() * 0.2;



scoreText = game.add.text(16, 16, 'Score: 0', {fontSize: '32px', fill: '#000'});

But in the scope of "create"

Link to comment
Share on other sites


My pleasure. I haven't felt so happy in a while.

If you'll find this interesting - this is not a Phaser issue strictly saying. Most languages execute from top to bottom, yes, that's programming 101, but scopes and fields of visibility can become dizzying.

In this instance, for example, one would have to just ASSUME that "world" doesn't exist untill "create" function has been called, since it is where programmer would set up level, even though intuitively we already created a game instance outside of it. Well that, or just read a lot of docs without assuming anything :) Hope that makes sense

Link to comment
Share on other sites


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...