Website URL

Twitter

Skype

Location

Interests

Hello,
I have an issue which keeps me stuck and I could not yet figure it out after being stuck for quite some time.
I have a simple game in which obstacles ( spirtes of other cars) drop down from the top of the screen and I am trying to avoid those with my own car not to crash into them.
The issue is that on some mobile devices the cars drop WAY faster than on my own device, I tested this from several different phones, the velocity differs depending on the phone, on some the obstacles drop faster on some they drop really slow.
What oculd cause such an issue?
I can provide code if it helps.
Thanks,

When programming my HTML5 2d game I noticed that using the new operator during game play can be quite expensive sometimes if many objects are created. So I wonder what is good practice here? When you implement your game do you always create the objects that are going to be dynamically used from start (for objects such as particles, ammunation, explosions etc), and then reuse them during game play?

I am trying to make a platformer mod of the first tutorial platformer, and this is my first time working with phaser. I am attempting to have diamonds spawn from the sky on a timer, that the player may collect. Everything except the spawning of diamonds seems to be working correctly, my code is as follows:
<!--The sprites and some of the movement controls for this game come from
this tutorial: https://phaser.io/tutorials/making-your-first-phaser-game -->
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Phaser - Making your first game, part 9</title>
<script type="text/javascript" src="js/phaser.min.js"></script>
<style type="text/css">
body {
margin: 0;
}
</style>
</head>
<body>
<script type="text/javascript">
//sets up a game, setting the area of play and loading it in
var game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create, update: update });
//loads what will be needed for the game before the game starts
function preload() {
game.load.image('sky', 'assets/sky.png');
game.load.image('ground', 'assets/platform.png');
game.load.image('diamond', 'assets/diamond.png');
game.load.spritesheet('dude', 'assets/dude.png', 32, 48);
}
//here I can set variables that can be accesses by create,
//much like putting in variables before calling them in unity
var player;
var platforms;
//directional keys to use for movement
var cursors;
var score = 0;
var scoreString = '';
var scoreText
var scoreText;
var firingTimer = 0;
//uses the preloaded items and other lines of code to make the beef of the game
function create() {
game.add.sprite(0, 0, 'sky');
//enables arcade physics
game.physics.startSystem(Phaser.Physics.ARCADE);
diamonds = game.add.group();
diamonds.enableBody = true;
diamonds.createMultiple(30, 'diamond');
diamonds.setAll('anchor.x', 350);
diamonds.setAll('anchor.y', 350);
diamonds.setAll('outOfBoundsKill', true);
diamonds.setAll('checkWorldBounds', true);
// The score
scoreString = 'Score : ';
scoreText = game.add.text(10, 10, scoreString + score, { font: '34px Arial', fill: '#fff' });
//background
//will contain the ground
platforms = game.add.group();
//any object in the platforms group will have a body
platforms.enableBody = true;
// Here is where the ground is created
var ground = platforms.create(0, game.world.height - 64, 'ground');
// Scale it to fit the width of the game (the original sprite is 400x32 in size)
ground.scale.setTo(2, 2);
// This stops the ground from falling away when you jump on it
ground.body.immovable = true;
// The player and its settings
player = game.add.sprite(350, 400, 'dude');
// We need to enable physics on the player
game.physics.arcade.enable(player);
// Player physics properties.
player.body.bounce.y = 0.2;
player.body.gravity.y = 600;
player.body.collideWorldBounds = true;
//Our two animations, walking left and right.
player.animations.add('left', [0, 1, 2, 3], 10, true);
player.animations.add('right', [5, 6, 7, 8], 10, true);
//controls
cursors = game.input.keyboard.createCursorKeys();
}
function update() {
console.log(firingTimer);
// Collide the player with the ground
game.physics.arcade.collide(player, platforms);
// Reset the players velocity (movement)
//this means that if no keys are pressed, the player will
//remain in place
player.body.velocity.x = 0;
//if the left arrow is pressed, add velocity to the player and play an animation
if (cursors.left.isDown)
{
// Move to the left
player.body.velocity.x = -400;
player.animations.play('left');
}
//if the right arrow is pressed, add velocity to the player and play an animation
else if (cursors.right.isDown)
{
// Move to the right
player.body.velocity.x = 400;
player.animations.play('right');
}
else
//if no keys are pressed. animation is set to one constant frame
//and no velocity is added
{
//Stand still
player.animations.stop();
//sets player's frame to the one facing forward
player.frame = 4;
}
// Allow the player to jump if they are touching the ground.
if (cursors.up.isDown && player.body.touching.down)
{
player.body.velocity.y = -350;
}
if (game.time.now > firingTimer)
{ //enemyfires
generateDiamond();
}
game.physics.arcade.overlap(diamonds , player, aquireDiamond, null, this);
}
function generateDiamond(){
diamond = diamonds.getFirstExists(false);
if(diamond){
diamond.reset(350, 350);
firingTimer = game.time.now + 2000;
diamond.body.gravity.y = 200;
}
}
function aquireDiamond(player,diamond){
diamond.kill ();
score+=100;
scoreText.text = scoreString + score;
Debug.log
//if time = certain amount then spawn diamond in random
//position above screen and let it fall, it will not stay on the ground
}
</script>
</body>
</html>

Hi all. I'm trying to return an array of objects loaded by the Mesh Importer for later use. I would like to be able to call a function to load my objects and outside of the function, affect & change each one of them OUTSIDE of the function.
Here is the small demo I made ::
http://www.babylonjs-playground.com/#1QJUDF#3
Thank you! <3
Mythros

I have a two player mini game, with all the main logic happening in this:
function SpriteDoObj(player){ // global function
this.player = player;
this.atk = function(opponent) {
this.opponent = opponent;
if (this.player.overlap(opponent)) {
//call miss sound here
console.log("miss");
return;
} else if (this.isSameAtkPosition(opponent)) {
//call block sound
console.log("block");
return;
} else {
console.log("hit!");
//call damage sound
opponent.health --;
}
};
} //has been simplified
And I make two instances of SpriteDoObj with:
this.blueSpriteDo = new SpriteDoObj(blue_player);
this.redSpriteDo = new SpriteDoObj(red_player);
//.. also the players are made like this:
this.players = this.game.add.physicsGroup();
var red_player = this.players.create(window.innerWidth, this.world.height - 490, 'red_spritesheet');
var blue_player = this.players.create(0, this.world.height - 490, 'blue_spritesheet');
And the atk function is called like this:
if (blue_keyMap.atk.isDown) {
this.blueSpriteDo.atk(this.redSpriteDo);
//the parameter for the atk function
//passes the opposite player, that becomes the opponent
}
The error is phaser.js:47751 Uncaught TypeError: displayObject.getBounds is not a function
And I'm not sure why this is happening, mayhaps something to do with how I'm passing the objects around, but it looks good to me - though I'm a noob.
Any Ideas?

Hello! I am trying to create a grid of bar elements (to form some kind of net) and I was wondering if there is a way to group these bars, so when I want to move the net, all of the children objects would move also. EXAMPLE: var bar1 = new BABYLON.Mesh.CreateBox(name, 1, scene); var bar2 = new BABYLON.Mesh.CreateBox(name, 1, scene); var bar3 = new BABYLON.Mesh.CreateBox(name, 1, scene); <-- how do I group bar1, bar2, bar3 so that I could use : group.position.x = 10;

Hi, my project with BabylonJS is growing day to day. Now, I am going to introduce interaction to my scene. I dont know how can I get this. I would like click to some object and see on screen show information of it. To do this I need to know differents way to interact with objects of scene. Also using a gui, I am interested to hide or show differents elements of my world. Could you show me similar examples?
Thanks.

Hi there,
Just a short intro, big fan of BabylonJS library! It got me excited to work on a new project of mine which is my first game. Bear with me now please, as I am fairly new to it, although I'd say I have done my studies on your API and documentation, which looks very attractive.
The issue I am having is that when I scale objects bigger, collision goes wrong; Moving objects collide when they have already overlapped. What I expect is that the collision happens as soon as any face of a bounding box touches any face of the other bounding box
The more I scale my objects, the worse things look.
Please take a look at this playground which is hopefully self explanatory:
http://www.babylonjs-playground.com/#10IKS#1
Further worse, uncomment line 29 which scales the ball bigger and see the obvious overlap with the wall.
I messed with the methods and properties in the BoundingInfo but nothing helped. It does not look to me that the BoundingInfo is missing something anyway; as you can see, showBoundingBox = true (i.e. the wireframe) reveals nothing unexpected to my eyes. It's the whatever shape/thing that is used to calculate collision is what seems wrong and does not seem to update with the scaled ball. Shouldn't it?

Hi,
Can someone explain the advantage of creating an object (veggies) and then attaching the game object to veggies ?
In many examples, the game object is attached isn't attached to another object.
Example 1
var Veggies = Veggies || {};
Veggies.game = new Phaser.Game(480, 320, Phaser.AUTO);
Example 2
game = new Phaser.Game(window.innerWidth, window.innerHeight, Phaser.AUTO, "ph_game");

I have been playing around with Phaser for a couple of days now, but I have been stuck for like the past 3 days on just trying to set up collision with an object layer I set up in Tiled. I am using Arcade Physics here in the main branch. I tried creating the object layer, like you would with any normal tile layer, but the id is always null and errors out. I then did some research and found out that Phaser doesn't support object layers like that. Some objects (treasure chests) I have created in the object layer show up, however. The problem I am having is making the polylines convert to rigid bodies in order to collide with the player.
Update: Right now I am using various hacks to simulate something similar, but the original problem still stands.
You can see my code here: https://github.com/damianlajara/interactive-portfolio
I also tried using P2 Physics in order to use the method `convertCollisionObjects` to convert the polylines into objects, but that did not work either. You can find the code for that in the P2 branch I have set up.
Any help would be greatly appreciated!

I built a simple game using phaser, but didn't use multiple game states. The game had only one screen and no states! It was all poorly done. So now I'm learning game states.
In this code snippet, taken from a phaser game https://github.com/alexdantas/ludum-dare-29/blob/master/js/states/play.js, we have, for example, a line consisting of this.game.camera.setBoundsToWorld().
I know how this works, but i'm having trouble knowing who is this here. I know this in OOP refers to the "owner" of the function, but in this case, who is it?
Another doubt I'm struggling with is, where does the .game.camera.setBoundsToWorld() comes from? Is it from when Phaser initializes a new state? When it start a new state, does it create a new "main state", which in this case is what the "this" refers to, and add attributes/methods to it? Like this game.camera.setBoundsToWorld() method?
function Play() {}
Play.prototype = {
create: function() {
this.game.physics.startSystem(Phaser.Physics.ARCADE);
this.game.stage.backgroundColor = '#000';
// initialize game variables
this.cash = 0;
this.chunkGroup = this.game.add.group();
this.nextChunkY = 0;
this.game.world.bounds.x = 0;
this.game.world.bounds.height = 1024;
this.game.camera.setBoundsToWorld();
this.lastChunkIndex = 0;
this.tephra = this.game.add.group();
this.rocks = this.game.add.group();
this.gems = this.game.add.group();
this.carrots = this.game.add.group();
this.lastChunk = null;
this.chunkIndex = 0;
this.generateChunk();
this.generateChunk();
},
}

Hi, I've come from an OOP style background with AS3, etc. I'm struggling to work out how to groups things together (kind of like a movieclip in flash). So basically i want to create an object, which will have certain values i can access, but also have created several sprites, and bitmaptext associated with it. Example of how i want to create my object: createNewUpgradeItem:function(myNumber){ var upgradeItem = new UpgradeItem(this, 25, 200+i*55, GAME_NAME.UpgradesAvailable.name, GAME_NAME.UpgradesAvailable.description, GAME_NAME.UpgradesAvailable.upgradePrice, GAME_NAME.UpgradesAvailable.priceMultiplier, GAME_NAME.UpgradesAvailable.sMultiplier, GAME_NAME.UpgradesAvailable.cMultiplier, i%4); GAME_NAME.upgradeMenu.add(upgradeItem); // Doesn't Work upgradeItem._background.events.onInputDown.add(function(){UpgradeItemUpdate(this,upgradeItem);console.log(upgradeItem._name)},this); }, // Where 'i' would be a count (in a for loop) to create several objects. And UpgradesAvailable[] is an array of information to be passed. This works fine i believe and it creates the objects fine and puts them on screen,etc. What i want to do is have this upgradeItem added to a Group (say MenuGroup), so I would have thought something like the following would have worked: GAME_NAME.upgradeMenu.add(upgradeItem); But it doesn't seem to like it. My UpgradeItem code consists of some things, for example: var UpgradeItem = function(game, x, y, upgradeItemName, upgradeDescription, upgradePrice, price, speed, cSpeed, bNumber){ this._name = upgradeItemName; this._description = upgradeDescription; this._upgradePrice = upgradePrice; this._pMultiplier = price | 1; this._sMultiplier = speed | 1; this._cMultiplier = cSpeed | 1; this._active = false; this._backgroundNumber = bNumber | 1; this._upgradeItemGroup = game.add.group(); GAME_NAME.upgradeMenu.add(this._upgradeItemGroup); switch(bNumber){ case 0: this._background = game.add.image(x+10, y+36, 'uBackground1'); break; case 1: this._background = game.add.image(x+10, y+36, 'uBackground2'); break; default : this._background = game.add.image(x+10, y+36, 'uBackground1'); break; } this._background.inputEnabled = true; this._background.input.useHandCursor = true; this._background.anchor.setTo(0); this._upgradeItemGroup.add(this._background); this.UpgradeItemName = game.add.bitmapText(x+30, y+48, 'Lobster',this._name,26,this._upgradeItemGroup); this.UpgradeItemName.anchor.setTo(0); this.UpgradeItemDescription = game.add.bitmapText(x+180, y+48, 'Lobster',this._description,26,this._upgradeItemGroup); this.UpgradeItemDescription.anchor.setTo(0); } You can also see from my code here that i'm trying to group the 'assets' (the text and sprites) into a seperate group. Am I missing something really simple here? Thanks for looking

I have a game with a MainMenu state and a Play state. I want to keep my animated background without reloading it (the animation should loop without interruptions) when I change from MainMenu state to Play state. How can I do this?

Hey, I was wondering if it's possible to use either CSS, Canvas, HTML or JavaScript to draw elements for a game (like blocks, characters, etc..) or would I have to use a pre-made image. If this has already been answered, please direct me to the proper thread/website. I'm self-taught so a lot of examples and "dumbing down" is greatly appreciated! Thanks again in advance.

Hi everyone, Here's my 'attempt' in puzzle games - a Construct 2 game called 'Hidden Objects: Pirate Treasure' Try it here: http://www.m.flashfooty.com/games/hidden-objects-pirate-treasure/ This is a free, kids friendly, 'hidden Objects' game in which your seek and find items within the given time. Do not worry - this game doesn't punish mistakes: time is only important to get better result, that is - more 'stars' on each level. The game play is simple: Find a series of hidden objects in a scene! Seek only objects that are shown in the bottom of the screen - with every mistake you'll lose some time. The complete 'Construct 2' project is also for sale, so you can make your own 'hidden objects' game based on it: https://www.scirra.com/store/games-with-source/hidden-objects-pirate-treasure-848

Hello
Im doing the game like arkanoid. The problem is when I try to move the bar with physics. When the bar has collided with the wall it lose the path and don't move straight to left to right. When I also try with moveWithCollisions() it works bad when the bar collide with the ball. How can I resolve this?

When creating States I've seen both people using Objects and Functions. I've noticed that in the Phaser Coding Tips all the examples are using Functions. Is there any advantage in using Functions over Objects in this case? I understand that using Functions + prototype is good for when you are creating classes and then instances of those classes, but in this case there is only 1 of each State in a game.

Hi all. How to scale all(tiles, sprites ect...) except canvas, for game with the width and height of 100% on all devices? game.scale.scaleMode = Phaser.ScaleManager.USER_SCALE;if(game.width < 667){game.scale.setUserScale(0.5,0.5) }