• Content Count

  • Joined

  • Last visited

About johncintron

  • Rank

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Fair point. I didn't make it clear that I was referring to the fact that you can control the game through the web console. Surely the developer didn't intend for someone to be able to do this. I'm personally working on a client-server game and it would be crazy if a client could control their character through the console. Use an IIFE to protect your objects.
  2. Looks good. I'd suggest you look into security/obfuscation though. For example, if I go into the console and do this: FlappyBoard = null; it will destroy the game.
  3. I figured out the issue. Phaser.Line.intersectsRectangle works only when the `line` argument is diagonal. Definitely a bug in the phaser source code. @samme Observe what happens when you do this instead: line = new Phaser.Line(200, 500, 600, 500);
  4. @drhayes That doesn't work either. If i create both the line and rectangle such that they overlap in the `create` function, ` Phaser.Line.intersectsRectangle(line, rect)` is still false. I'm using Phaser 2.6.2 by the way. For example function startGame() { this.create = function() { line = new Phaser.Line(200, 500, 600, 500); rect = new Phaser.Rectangle(375, 475, 50, 50); }; this.update = function() { console.log(Phaser.Line.intersectsRectangle(line, rect)); }; this.render = function() { game.debug.geom(line); game.debug.geom(rect); }; }
  5. It doesn't work. Phaser.Line.intersectsRectangle(line, rect) is always false. function startGame() { this.create = function() { line = new Phaser.Line(200, 500, 600, 500); rect = new Phaser.Rectangle(0, 0, 50, 50); }; this.update = function() { console.log(Phaser.Line.intersectsRectangle(line, rect)); // NEVER TRUE!? if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) { rect.x -= 10; } else if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) { rect.x += 10; } else if (game.input.keyboard.isDown(Phaser.Keyboard.UP)) { rect.y -= 10; } else if (game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) { rect.y += 10; } }; this.render = function() { game.debug.geom(line); game.debug.geom(rect); }; }
  6. I'm trying to implement a game where it's possible for a sprite to collide with a line object. For example: game.physics.startSystem(Phaser.Physics.ARCADE); sprite = game.add.sprite(0, 0, "mySprite"); sprite.body.gravity.y = 420; foothold = new Phaser.Line(0, 600, 200, 400); // a diagonal line /** * update = function() { * collide sprite and foothold... HOW!? * }; */ I want the sprite to collide with the diagonal line when the sprite falls onto it. Is this a possibility in arcade physics? There's an example of diagonal platforms here: but I do not want to use ninja physics.
  7. Phaser buttons don't have a built-in double-click handler so I created one because all of the other solutions I've seen are long and convoluted and hackily target the Input class rather than Button instances. var delay = 300; var button = game.add.button(x, y, key, function() { // code for first click let now =; now - this.lastClick <= delay && this.onDoubleClick(); this.lastClick = now; }); button.lastClick = 0; button.onDoubleClick = function() { // code for double click } Thoughts?
  8. You're getting a null reference because this.levelButtonWidth is undefined. Also, you should use this syntax for your for loop: for (let i = 1; i < 6; i++) { // loop body } because it creates a new closure for each value of i in the loop.
  9. That seems to do the trick, thanks. I was about to comment that I'd exhaustively tried every option here until I changed my code to not use CSS transforms. Here's how the code looks now: //before document.getElementById("game-border").style.transform = "scale(" + USER_DEFINED_WIDTH/DEFAULT_WIDTH + ", " + USER_DEFINED_HEIGHT/DEFAULT_HEIGHT + ")"; //after game.scale.scaleMode = Phaser.ScaleManager.EXACT_FIT; var g = document.getElementById("game-border"); = USER_DEFINED_WIDTH + "px"; = USER_DEFINED_HEIGHT + "px"; I completely overlooked this alternative and should not have used CSS scaling. Thanks again; your help saved me a lot of frustration.
  10. That doesn't do it for me. I forgot to mention that aspect ratio intentionally should not be preserved. For example, if the user goes from 800x600 to 1600x600, then it should be twice as wide and retain its original height, while still "being" a 800x600 game. game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; This snippet maintains the aspect ratio, e.g. updating the width to 1600 also updates the height to 1200.
  11. I've tried this, but it doesn't work. if (!!game) { game.renderer.resize(DEFAULT_WIDTH, DEFAULT_HEIGHT); game.width = DEFAULT_WIDTH; game.height = DEFAULT_HEIGHT; game.stage.width = DEFAULT_WIDTH; game.stage.height = DEFAULT_HEIGHT; = DEFAULT_WIDTH; = DEFAULT_HEIGHT; game.input.scale.set(DEFAULT_WIDTH/USER_DEFINED_WIDTH, DEFAULT_HEIGHT/USER_DEFINED_HEIGHT); } Maybe I should have been clear about my objective in the first place: I want the game to always be of 800x600 resolution, but make it possible via CSS transitions (or whatever else) to scale the game up or down without affecting the 800x600. The Phaser API makes it possible to scale/resize the game, but this will affect every call that draws something on the canvas. For example, if I want to draw something in the center, I'd do game.add.image(400, 300), but if I resize the game, I would have to do game.add.image(USER_DEFINED_WIDTH / 2, USER_DEFINED_HEIGHT / 2). Basically, I want Phaser to always believe my game is 800x600 regardless of how wide or tall the game actually appears to the user. So that, for example, the user stretches the game to appear as 1440x900 but the game itself is still 800x600.
  12. Hey folks, I have a webpage with a game and a form where a user can enter a height and width to scale the game via CSS transforms. When the entire game is scaled, this causes some problems with mouse input, so there is some code to remedy this. Here's a snippet: const DEFAULT_WIDTH = 800; const DEFAULT_HEIGHT = 600; var USER_DEFINED_WIDTH = 800; var USER_DEFINED_HEIGHT = 600; function adjustDimensions() { var f = document.getElementById("dimension-adjust"); USER_DEFINED_WIDTH = parseInt(f.children[0].value); USER_DEFINED_HEIGHT = parseInt(f.children[1].value); document.getElementById("game-border").style.transform = "scale(" + USER_DEFINED_WIDTH/DEFAULT_WIDTH + ", " + USER_DEFINED_HEIGHT/DEFAULT_HEIGHT + ")"; game.input.scale.set(USER_DEFINED_WIDTH/DEFAULT_WIDTH, USER_DEFINED_HEIGHT,DEFAULT_HEIGHT); } game.state.add("screen1", screen1); game.state.start("screen1"); function screen1() { this["render"] = function() { game.debug.inputInfo(30, 30); }; } I can see from the render that this scales the game, but only for a second or so before it reverts back to (1, 1) scaling, i.e. the scaling doesn't persist. However, if I include an update loop repeatedly scales the game, there's no problem. For example: function screen1() { this["update"] = function() { game.input.scale.set(USER_DEFINED_WIDTH/DEFAULT_WIDTH, USER_DEFINED_HEIGHT,DEFAULT_HEIGHT); }; this["render"] = function() { game.debug.inputInfo(30, 30); }; } this seems to solve the problem. Why is it not the case that the scaling is set once and preserved indefinitely in the adjustDimensions function? Why do I have to update it every time? I'm using Phaser 2.6.2 by the way.
  13. I would suggest explicitly including the indexes when the animation is added to the sprite. Try something like this and see if it works: game.load.spritesheet("explosion", x, y, how_many); sprite.animations.add("explosion_animation", "explosion", [0, 1, 2, 3, ...]); Essentially what you do is include the explicit array argument so Phaser knows where to parse the spritesheet.
  14. There might be a problem in the last line of your code. You should add a fifth argument that specifies how many sprites are in the spritesheet. I'd assume in your case this is the x*y of the spritesheet divided by 128*128.
  15. I appreciate the quick responses. I worded my question rather poorly, but I think I have a better understanding of it now. So a a child of a group can load from atlas_x, while another child of the same group can load from atlas_y, but the latter child cannot use frames from atlas_x in its animation. Let me restate what I'm trying to accomplish more specifically. Suppose I have a humanoid sprite. In its idle state, his sprites are loaded in this order: body = group.create(0, 0, "body_atlas", "torso_idle"); sword = group.create(0, 0, "weapons", "sword_idle"); arms = group.create(0, 0, "body_atlas", "arm_idle"); head = group.create(0, 0, "body_atlas", "head_front"); so his head is the topmost element. Now I want to add animations to each child like so: on the first frame, the ordering is preserved, i.e. the head will be at the top. On the third frame, the sword will appear on top of the head, and on the sixth frame, the sword will move back down. It's trivial to move his head down alone, i.e. I could do group.moveDown(head), but there's no way to call moveDown() in the middle of an animation. Is there a quick workaround for this?