Search the Community

When using Android 4 and the Chrome browser, the index.html page for the Phaser 2 examples will not scroll past the 2 section heading/title lines of text for the animation examples. The farthest I can view is the title lines 'Animation' and '15 examples'. On the device native browser I can scroll the full list of 436 examples but examples like 'Click on an Image' in the 'Basics' section require several browser refreshes/reloads before they will work. Chrome runs 'Click an Image' immediately with no browser refresh required but I can't scroll down to see more examples other than Basics and Games. What fixes or work arounds can I use to handle these two browser problems with Phaser 2 example code?

Hi All I couldn't find a method to restart / reset a scene. Anyone know if there is one please? Or if there is a better way to do this. Thanks!

Hello everyone! I just recently got into PIXI.js and started with a tutorial from kittykatattack on GitHub which can be found here: https://github.com/kittykatattack/learningPixi#introduction I finished the tutorial and everything works great! After that I wanted to expand the game and add a "Try again" or "Play again" button to the end scene and I got that to work aswell. But each time the game restarts it gets quicker and quicker. It seems like the speed is doubling on each restart. I added this code to the end state function: tryAgainMessage.click; playAgainMessage.click; tryAgainMessage.click = function (e) { for (var i = stage.children.length - 1; i >= 0; i--) { stage.removeChild(stage.children[i]);}; gameScene.visible = true; gameOverScene.visible = false; state = setup; } playAgainMessage.click = function (e) { for (var i = stage.children.length - 1; i >= 0; i--) { stage.removeChild(stage.children[i]);}; gameScene.visible = true; gameOverScene.visible = false; state = setup; } Does anyone know how I can properly restart the game once the message is clicked?

When i reload the web page (Most times) when there has been a good amount of stuff in the scene like particles and lensFlares etc... When i reload the web page to reshow or start the scene... Or even i go to another page and come back to my page with the scene... First split second it show what was on the previous screen or sometime it show some 'garbled' collage of squares and what looks like old tv snow. What is that about... It there some kind of 'clear' or 'reset' that needs to be called in not to 'flash' what was left of the previous scene when showing the loader for the new scene. Any info is really kool

Hello! I am making a waste sorting game and when the player loses all their lives, I wish to restart the game. I click the 'RETRY' text and the state reloads, but it seems that my life and garbage sprites never reload. I am wondering if it is because they are in an array (see this.garbage = []; and this.lifeSprites = [];). I have never used game.state.start to reload a state multiple times, I have only ever used it to call a state once. If I cannot get game.state.start to reload my game, I will create a restart() method with some re-positioning code and whatnot. BUT it would be way awesome if I could figure out why this doesn't work!! Below is my code and here is a link to my game so far (my code is still mucho messy). Arrow keys to rotate on desktop. BasicGame.Game = function (game) { this.firstDrop = true; this.garbage = []; this.MAX_TRASH = 5; this.lowestTrash = null; this.lastLowestTrash = null; this.lowestTrashType = null; this.lives = 3; this.lifeSprites = []; this.gap = 500; this.MIN_GAP = 250; this.fallSpeed = 3; this.MAX_FALL_SPEED = 5.5; this.sorter = null; this.rotationSpeed = 10; this.targetRotation = null; this.isRotating = false; this.clockwise = true; this.orientation = null; this.Orientation = { NORTH: 0, EAST: -90, SOUTH: -180, WEST: 90 }; this.TrashType = { BLUE: 0, COMPOST: 1, GREY: 2, YELLOW: 3 }; this.leftKey = null; this.rightKey = null; this.gameover = false; this.score = 0; this.scoreText = null; this.highScoreText = null; this.msgText = null; this.continuePrompt = null; }; BasicGame.Game.prototype = { create: function () { this.lowestTrash = 0; this.lastLowestTrash = this.MAX_TRASH - 1; var trash; for (i = 0; i < this.MAX_TRASH; i++) { trash = this.game.add.sprite(this.game.world.centerX, -this.gap * (i + 1), 'trash'); trash.loadTexture('trash', this.rnd.integerInRange(0, this.MAX_TRASH)); trash.anchor.setTo(0.5); this.garbage.push(trash); if (i == 0) { this.lowestTrashType = trash.frame; } } var life; for (i = 0; i < this.lives; i++) { life = this.game.add.sprite(0, 0, 'life'); life.anchor.setTo(0.5); life.x = (this.game.width - (life.width / 2 + 10)) - (i * life.width); life.y = life.height - 10; this.lifeSprites.push(life); } this.sorter = this.game.add.sprite(this.game.world.centerX, this.game.height, 'sorter'); this.sorter.anchor.setTo(0.5); this.orientation = this.Orientation.NORTH; this.targetRotation = this.orientation; this.scoreText = this.add.bitmapText(25, 25, 'arialPixelated', '0', 16); this.scoreText.align = 'left'; this.highScoreText = this.add.bitmapText(25, 50, 'arialPixelated', 'BEST: ' + BasicGame.highScore, 16); this.highScoreText.align = 'left'; this.continuePrompt = new SuperBitmapText(this.game, this.game.world.centerX, this.game.world.centerY + 100, 'arialPixelated', 'RETRY', 16, 25); this.continuePrompt.anchor.setTo(0.5); this.continuePrompt.align = 'left'; this.continuePrompt.alpha = 0; this.continuePrompt.inputEnabled = false; this.msgText = this.add.bitmapText(this.game.world.centerX, this.game.world.centerY, 'arialPixelated', '', 16); this.msgText.anchor.setTo(0.5); this.msgText.align = 'center'; this.game.input.onDown.add(this.rotateSorter, this); this.game.input.onDown.add(function() {if (this.continuePrompt.isDown){this.game.state.start('Game', true, false);}}, this); this.leftKey = this.game.input.keyboard.addKey(Phaser.Keyboard.LEFT); this.rightKey = this.game.input.keyboard.addKey(Phaser.Keyboard.RIGHT); this.game.input.keyboard.addCallbacks(this, this.rotateSorter); //For mobile. Phaser.Canvas.setTouchAction(this.game.canvas, 'auto'); this.game.input.touch.preventDefault = true; }, update : function () { if (!this.gameover) { this.garbage.forEach(function(trash) { trash.y += this.fallSpeed; trash.angle += 0.25; }, this); if (this.garbage[this.lowestTrash].y > this.game.height - (this.sorter.height / 2.5)) { this.checkIfScored(); } } this.sorter.angle = Phaser.Math.snapTo(this.sorter.angle, this.rotationSpeed); if (this.sorter.angle != this.targetRotation) { this.isRotating = true; } else { this.isRotating = false; } if (this.isRotating) { if (this.clockwise) { this.sorter.angle += this.rotationSpeed; } else { this.sorter.angle -= this.rotationSpeed; } } }, resetTrash : function () { this.garbage[this.lowestTrash].y += -this.gap * (this.MAX_TRASH); this.garbage[this.lowestTrash].loadTexture('trash', this.rnd.integerInRange(0, this.MAX_TRASH)); this.lowestTrash++; if (this.lowestTrash > this.garbage.length - 1) { this.lowestTrash = 0; } this.lowestTrashType = this.garbage[this.lowestTrash].frame; }, checkIfScored : function () { if (this.lowestTrashType == this.TrashType.BLUE && this.orientation == this.Orientation.NORTH) { this.score++; if (this.gap > this.MIN_GAP) { this.gap -= 5; } else { this.gap = this.MIN_GAP; } if (this.fallSpeed < this.MAX_FALL_SPEED) { this.fallSpeed += 0.05; } else { this.fallSpeed = this.MAX_FALL_SPEED; } } else if (this.lowestTrashType == this.TrashType.COMPOST && this.orientation == this.Orientation.EAST) { this.score++; if (this.gap > this.MIN_GAP) { this.gap -= 5; } else { this.gap = this.MIN_GAP; } if (this.fallSpeed < this.MAX_FALL_SPEED) { this.fallSpeed += 0.05; } else { this.fallSpeed = this.MAX_FALL_SPEED; } } else if (this.lowestTrashType == this.TrashType.GREY && this.orientation == this.Orientation.SOUTH) { this.score++; if (this.gap > this.MIN_GAP) { this.gap -= 5; } else { this.gap = this.MIN_GAP; } if (this.fallSpeed < this.MAX_FALL_SPEED) { this.fallSpeed += 0.05; } else { this.fallSpeed = this.MAX_FALL_SPEED; } } else if (this.lowestTrashType == this.TrashType.YELLOW && this.orientation == this.Orientation.WEST) { this.score++; if (this.gap > this.MIN_GAP) { this.gap -= 5; } else { this.gap = this.MIN_GAP; } if (this.fallSpeed < this.MAX_FALL_SPEED) { this.fallSpeed += 0.05; } else { this.fallSpeed = this.MAX_FALL_SPEED; } } else { this.fallSpeed = 3; this.updateLives(); } this.resetTrash(); this.scoreText.setText(this.score); }, updateLives : function () { this.lifeSprites[this.lives - 1].loadTexture('lifeFull'); this.lives--; if (this.lives == 0) { this.gameover = true; this.msgText.setText('GAME OVER!\n' + this.score + ' responsibly disposed trashes!'); this.continuePrompt.alpha = 1; this.continuePrompt.inputEnabled = true; this.continuePrompt.input.useHandCursor = true; if (this.score > BasicGame.highScore) { BasicGame.highScore = this.score; this.highScoreText.setText('BEST: ' + BasicGame.highScore); } this.garbage.forEach(function(trash) { trash.kill(); }, this); this.game.input.onDown.remove(this.rotateSorter, this); } }, rotateSorter : function () { if (this.game.device.desktop && !this.gameover) { if (this.leftKey.isDown) { this.rotateLeft(); } else if (this.rightKey.isDown) { this.rotateRight(); } } else { if (this.input.y >= this.sorter.y - this.sorter.height) { if (this.input.x >= this.game.world.centerX) { this.rotateRight(); } else if (this.input.x < this.game.world.centerX) { this.rotateLeft(); } } } }, rotateLeft : function () { this.clockwise = true; switch (this.orientation) { case this.Orientation.NORTH: this.orientation = this.Orientation.WEST; break; case this.Orientation.EAST: this.orientation = this.Orientation.NORTH; break; case this.Orientation.SOUTH: this.orientation = this.Orientation.EAST; break; case this.Orientation.WEST: this.orientation = this.Orientation.SOUTH; break; } this.targetRotation = this.orientation; }, rotateRight : function () { this.clockwise = false; switch (this.orientation) { case this.Orientation.NORTH: this.orientation = this.Orientation.EAST; break; case this.Orientation.EAST: this.orientation = this.Orientation.SOUTH; break; case this.Orientation.SOUTH: this.orientation = this.Orientation.WEST; break; case this.Orientation.WEST: this.orientation = this.Orientation.NORTH; break; } this.targetRotation = this.orientation; } }; EDIT: My input listeners also get jacked up. I separate mobile and desktop but when the state restarts, my mobile listeners are firing when they shouldn't be because I am using desktop, not mobile.

Hi guys, I need your help. This small page is producing a code in Firefox, Firefox ESR, Chrome on OSX each with its latest release. But it's not working as expected in Safari 9. Here is the very very reduced example: http://www.2vc.org/audio-bug/ Surprisingly it is working on jsfiddle which doesn't make it any more logical http://jsfiddle.net/pg072s2r/ I don't get any sound output in safari 9 (still under yosemite) on the first page load. But if I reload it works as expected for any successive reload. There are no external files involved. So what the heck is happening here? This currently happens in my larger project with large files I am decoding and also in this small example. Can someone confirm this? I'm looking into this for some days now and I just don't get it? What do I miss? It feels like a bug that can't be a real bug but rather is some stupid error on my site. Thanks for looking into this. Btw this is the code- easy isn't it? var AudioContext = window.AudioContext || window.webkitAudioContext;var ac = new AudioContext();var oscillator = ac.createOscillator();oscillator.frequency.value = 200;oscillator.connect(ac.destination);oscillator.start();Thanks for taking your time. Regards George

How do I create Start, Stop and Restart buttons? I'm learning babylonjs to teaching it for my physics stutents. My plan is to teaching to create physics simulations like phet colorado sims but in 3d. First, I need a standard GUI with Play, Stop and Restart buttons that works with physics engines. I made a playground for sample it: http://www.babylonjs-playground.com/#1ADV28#67 click two time run for wok after castor error. I want to stop the sphere free fall and restart the scene. Which functions or commands do I need to use for it? Thanks, Rafael J.

hi.. i'm developing 2dmmorpg with html5.+ webgl how can i reload js or index.html when code changed? mobile is always using caching. so i can't reload. couple a minute i can.... do you have tips for this?