Recommended Posts

Hello,

I am trying to make a small basketball free-throw game similar to the emoji basketball game on Facebook. I was following along with an example from Phaser (World Bounds Event) to try to respawn the ball when it hit the edge of the screen. I've tried to implement that below (see code) but the respawn function never fires. Does anyone know what I'm doing wrong?
 

Envirolympics.TestGame = function (game) {
	//Variables
	this.score = null;
	this.scoreText = null;

	this.ball = null;
	this.net = null;
	this.leftMarker = null;
	this.rightMarker = null;

	this.launched = false;
	this.lastPointerPos = null;
	
	//Constants
	this.GRAVITY = 980;
	this.SHOOT_FORCE = 850;
	this.EDGE_CUSHION = 10;
};

Envirolympics.TestGame.prototype = {

	create : function () {
		//Load net sprite
		this.net = this.game.add.sprite(this.game.world.centerX, 100, 'net');
		this.net.anchor.setTo(0.5);

		//Add hoop children markers
		this.leftMarker = this.net.addChild(this.game.make.sprite(-50, 40, 'marker'));
		this.leftMarker.anchor.setTo(0.5);
		this.rightMarker = this.net.addChild(this.game.make.sprite(50, 40, 'marker'));
		this.rightMarker.anchor.setTo(0.5);
		
		//Load ball sprite
		this.ball = this.game.add.sprite(this.game.world.centerX, this.game.world.height - 100, 'ball');
		this.ball.anchor.setTo(0.5);
		
		//Setting up the physics environment
		this.game.physics.startSystem(Phaser.Physics.ARCADE);
		this.game.physics.arcade.gravity.y = this.GRAVITY;
		
		//Setting up the ball physics
		this.game.physics.arcade.enable(this.ball);
		this.ball.body.bounce.setTo(0.35);
		this.ball.body.moves = false;
		this.ball.body.velocity.setTo(0, 0);
		this.ball.body.allowGravity = false;
		this.ball.body.collideWorldBounds = true;
		this.ball.body.onWorldBounds = new Phaser.Signal();
		this.ball.body.onWorldBounds.add(this.respawn, this);
		
		//Enable input
		this.ball.inputEnabled = true;
		this.game.input.onDown.add(this.track, this);
		this.game.input.onUp.add(this.launch, this);

		//Initialize
		this.score = 0;
		this.scoreText = this.game.add.bitmapText(10, 10, 'pixel', this.score, 36);
		this.lastPointerPos = new Phaser.Point(0, 0);

		//For mobile
		Phaser.Canvas.setTouchAction(this.game.canvas, "auto");
    	this.game.input.touch.preventDefault = false;
	},
	
	update : function () {
			
		//TO DO:
		//detect collision with net markers
			//determine if scored
			//respawn
	},
	
	track : function () {
		//Update the last finger position
		this.lastPointerPos.x = this.input.x;
		this.lastPointerPos.y = this.input.y;
		
		//Set the ball physics to be still
		this.launched = true;
		this.ball.body.moves = false;
		this.ball.body.velocity.setTo(0, 0);
		this.ball.body.allowGravity = false;
	},
	
	launch : function () {
		if (this.launched) {
			this.launched = false;
			this.ball.body.moves = true;
			this.ball.body.allowGravity = true;
			
			//Get the direction of finger swipe, normalize it, and apply a scalar to the velocity of the ball
			var direction = new Phaser.Point(this.input.x - this.lastPointerPos.x,
				this.input.y - this.lastPointerPos.y);
			direction.x = this.game.math.snapTo(direction.x, 5);
			direction.y = this.game.math.snapTo(direction.y, 5);
			Phaser.Point.normalize(direction, direction);
			if (direction.y < 0) {
				this.ball.body.velocity.setTo(direction.x * this.SHOOT_FORCE, direction.y * this.SHOOT_FORCE);
			}
		}
	},
	
	respawn : function () {
		console.log("Does this function even run?");
		
		//Set the ball physics to be still again
		this.ball.body.moves = false;
		this.ball.body.velocity.setTo(0, 0);
		this.ball.body.allowGravity = false;
		
		//Spawn the ball in a new, random location
		var ballSpawnX = this.game.rnd.integerInRange(this.ball.width + this.EDGE_CUSHION, this.world.width - this.EDGE_CUSHION);
		ballSpawnX = this.game.math.snapTo(ballSpawnX, 10);
		
		//Make sure the ball is in the boundary we set
		if (ballSpawnX < this.ball.width + this.EDGE_CUSHION) {
			ballSpawnX = this.ball.width + this.EDGE_CUSHION;
		}
		else if (ballSpawnX > this.world.width - this.EDGE_CUSHION) {
			ballSpawnX = this.world.width - this.EDGE_CUSHION;
		}
		this.ball.x = ballSpawnX;
	}
};

 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.