Nodragem

Members
  • Content count

    10
  • Joined

  • Last visited

  1. That's an interesting question. In phaser 2, I needed something similar recently. I wanted to have a slime that has 1) a tween animation in y scale, 2) a scale fixed physics body, and 3) UI elements attached to it (action points bar, health bar). What I finally did is to create an empty Sprite (no texture) as a root. This root has a body for the physics. Then I added a Sprite as a child to display the slime texture with a y-scale tween, and I added a group as a child for the UI elements. Please post your updates. I am also curious about what are the best practices and/or on how to do it with phaser 3.
  2. Ok, thank you for the tip, I will remove the call to clearCurrentState(). No I am not clearing the game cache and I don't think I destroy anything. Should I? I thought the restart function would do the cleaning, that's why I didn't. Concerning creating texture, I do create sprites in the create method of the game state, but not anywhere else. I will add the breakpoint you suggested and see if I can bring more information. Thank you for the help
  3. Hello, @casey, the restart() function is part of Phaser.StateManager. To call 'this.game.state.start("name_of_current_state") does essentially the same thing, I think. At least, it leads to the same error. I would say that the error is related to that code, as the error does not happen if I do not try to restart/start the current state. @samme: I already tried to remove 'clearCurrentState()'. That's what I tried first, and it leads to the same error. My naive guess is that there is an image/texture that does not load properly when I restart... But I have no idea why and how.
  4. Hello, I would like to simply restart my game after the player killed all the "wasps" on the screen. What I do for now is simply: public onWaspDeath () { console.log("Dead Wasps: " + this._wasps.countDead()); if(this._wasps.countLiving() <= 1){ // the currently killed wasp is not dead yet console.log("You killed all the Wasps!") this.game.sound.play("congrats"); this.game.state.clearCurrentState(); this.game.state.restart(); } } However, I get this error in Firefox: TypeError: Argument 1 of CanvasRenderingContext2D.drawImage could not be converted to any of: HTMLImageElement, SVGImageElement, HTMLCanvasElement, HTMLVideoElement, ImageBitmap. [Learn More] phaser.js:15696:8 s.Sprite.prototype._renderCanvas phaser.js:15696:8 s.Sprite.prototype._renderCanvas phaser.js:15701:8 s.DisplayObjectContainer.prototype._renderCanvas phaser.js:15072:8 s.DisplayObjectContainer.prototype._renderCanvas phaser.js:15072:8 s.DisplayObjectContainer.prototype._renderCanvas phaser.js:15072:8 s.CanvasRenderer.prototype.renderDisplayObject phaser.js:20563:4 s.CanvasRenderer.prototype.render phaser.js:20488:4 updateRender phaser.js:36186:12 update phaser.js:36102:16 updateRAF phaser.js:64166:12 start/this._onLoop and this error in Chrome: Uncaught TypeError: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The provided value is not of type '(CSSImageValue or HTMLImageElement or SVGImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap or OffscreenCanvas)' at i.Image.s.Sprite._renderCanvas (phaser.js:15696) at a.s.Sprite._renderCanvas (phaser.js:15701) at i.Group.s.DisplayObjectContainer._renderCanvas (phaser.js:15072) at i.World.s.DisplayObjectContainer._renderCanvas (phaser.js:15072) at i.Stage.s.DisplayObjectContainer._renderCanvas (phaser.js:15072) at s.CanvasRenderer.renderDisplayObject (phaser.js:20563) at s.CanvasRenderer.render (phaser.js:20488) at Game.updateRender (phaser.js:36186) at Game.update (phaser.js:36102) at i.RequestAnimationFrame.updateRAF (phaser.js:64166) I don't really understand :/ at all what is this error about. Any ideas? NOTE: I tried commenting `this.game.state.clearCurrentState()` and I also tried `this.game.state.start("name_of_the_current_state")` instead of `this.game.state.restart()`. That leads to the same error.
  5. Thank you for your reply I am not sure if this is what you meant, but to replace: if(this._cannon_tween !== undefined){ this._cannon_tween.stop(); this.scale.x = 1; } with: this.game.tweens.removeFrom(this.scale); Does not work. The input parameters is accepted (object, array of objects or group), but the scale.x is not resetted to 1, so that `scale.x` converges to 0.98 after few quick shots.
  6. I found a solution, but I don't know if this is the best (I post it in case that can help others). I basically keep a reference to the current tween (this._cannon_tween) applied on scale.x, if this reference is not empty at the time I shot, I stop the tween and reset scale.x: public launch(ball:Phaser.Sprite) { ball.reset(this.x + this.cannonTip.x, this.y + this.cannonTip.y); ball.body.rotation = this.rotation; ball.lifespan = 1500; // FIXME: why? ball.body.velocity.x = this.cannonTip.x * State.MISSILE_SPEED; ball.body.velocity.y = this.cannonTip.y * State.MISSILE_SPEED; if(this._cannon_tween !== undefined){ this._cannon_tween.stop(); this.scale.x = 1; } this._cannon_tween = this.game.add.tween(this.scale).to( {x:0.98}, 20, Phaser.Easing.Elastic.In, true, 0, 1, true ); }
  7. Hello, I have a cannon that shoots bullets when I press space. I use the following code to add some recoil animation to my cannon when shooting (note, by default this.scale.x = 1): public launch(ball:Phaser.Sprite) { ball.reset(this.x + this.cannonTip.x, this.y + this.cannonTip.y); ball.body.rotation = this.rotation; ball.lifespan = 1500; // FIXME: why? ball.body.velocity.x = this.cannonTip.x * State.MISSILE_SPEED; ball.body.velocity.y = this.cannonTip.y * State.MISSILE_SPEED; this.game.add.tween(this.scale).to( {x:0.98}, 20, Phaser.Easing.Elastic.In, true, 0, 1, true ); } When I run it in the browser, it works perfectly fine if I don't shoot like crazy. However, if I shoot several times very quickly, the cannon will stop to animate. I can try to shoot slowly, it will not animate anymore. My guess is that if you shot at intervals <20ms, you are starting a new tween on top of the one that is running. The previous tween is stopped but does not reset the scale.x, so that the next tween starts with a scale.x smaller than 1. Apply this several times and the new tweens end up starting at scale.x = 0.98, with the target scale.x = 0.98. In other words, you can't see any recoil anymore. So my question would be, how to cleanly add a new tween on a property while the previous tween on that property is not complete yet?
  8. Socket.io and Oriented Object Paradigm

    Thank you for your answer Arcanorum. If I understand well, with your solution, in `onNewPlayer(data)`, `this` will refer to `socket` while `_this` will refer to `GameServer`? The main problem I see with this solution is that you get `_this` in the global scope, so that if you define several classes, you would need to use `_this1`, `_this2`, etc... I will definitely keep your suggestion in mind, but I am happy to wait for other suggestions if there are ??
  9. Hello everybody, I am struggling with integrating socket.io in a oriented-object paradigm. One common problem with javascript and OOP are the callbacks and `this`. For instance, if you try to do something like: GameServer.prototype = { constructor : GameServer, onConnection : function(socket){ socket.on('new_player', this.onNewPlayer); }, onNewPlayer : function (data) { ... } } The bad news is that: in `onNewPlayer(data)` , `this` will NOT refer to `GameServer`. Instead, `this` will be referring to `socket`. One solution is: GameServer.prototype = { constructor : GameServer, onConnection : function(socket){ socket.on('new_player', (data) => this.onNewPlayer(data)); }, onNewPlayer : function (data) { ... } } The good news is that: in `onNewPlayer(data)` , `this` will refer to `GameServer`. The bad news is that: in `onNewPlayer(data)`, `this` does not refer to `socket` anymore. That facilitates OOP, but that prevents an easy use of `socket.emit()` for instance. Thus, what would be the easiest/prettiest way to get a reference to `socket` in `onNewPlayer(data)` and keep `this` referring to `GameServer`? Any suggestion is welcome
  10. Hello, I started to use socket.io, express and phaser to make multiplayer games. I followed this tutorial: https://phaser.io/news/2017/03/socketio-multiplayer-tutorial and I used Heroku to host and serve my game. However, I was thinking that, in the case I want to make a coop game, I would not need the server to be always running on Heroku. Instead, I could use one of the client machine as the server? Do you think that this is possible? Thanks, Nodregam