• Content count

  • Joined

  • Last visited

  1. Thank you for your answers. @mattstyles my code looks more like this: function preload() {...} function create() { ... fun1.bind(this)() } function update() { ... fun2.bind(this)(); fun3.bind(this)() } // Yeah I could use call() instead, but I find this easier to understand the function parameters function fun1() {...} function fun2() {...} function fun3() {...} module.exports = { // Calling this file as state object later preload, create, update } In short, I want to use the state functions, and I also define some other functions they'll keep using throughout the state.
  2. Two threads in less than 30 minutes. I hope I'm not tiring you guys! This is more a Javascript-related question than anything. In short, I'm utilizing this.game in my state functions. However, when invoking functions inside these functions, their scope isn't the Phaser state anymore, so this becomes undefined. Sure enough, I can simply use functionName.bind(this)(parameters), or functionName.call(this, parameters), and that's what I'm doing right now, but when I do that for every function internally called, it starts becoming an anti-pattern, doesn't it? Anyone has an idea on how can I make sure this refers to Phaser state without having to assign bind() to every function my state funcions call? Thanks!
  3. "Force" a state on a button

    Buttons have four states, relative to pointer events (over, out, down, up), and Phaser has some handy features for that, for example defining a frame on a spritesheet for each one of these events. This leads me to this situation: I want buttons to be interacted with using either pointer or keyboard/gamepad input. Can I "force" the button to be in a certain state depending on non-pointer input? On a related note, are there "state booleans" like "isUp" or "isDown" for states? That'd be immensely helpful for some things, such as implementing a workaround for the above in case that isn't a feature.
  4. But aren't sprite dimensions defined by the atlas software itself? I've been creating the spritesheets directly in my paint software and use the atlas tool only to generate the atlas, so maybe that's the problem?
  5. Hmm.. The idea of making each frame as large as needed is good and I even thought of it at some point, but if the atlas trims empty space anyway, won't that render these efforts useless?
  6. Whenever we animate a sprite or image from an atlas, our reference is a (x,y) coordinate that would correspond to the top left of each frame. However, that has some issues when a frame has different dimensions from the previous. Suppose these two frames (i misspelled there, it should be "frame 1" and "frame 2" instead) represent, respectively, the object standing still and the object in movement (that's supposed to be motion blur). Frame 2 has a bigger length than Frame 1, so, relative to its coordinates, the face is more to the right. I want it to look something like this when in movement (let's suppose linear velocity): (in dislocation) For each passing frame, the face is equally distant. The dark red lines represent the spacing between the face in each frame. The red lines represent the (x,y) coordinates in each frame. It's equally spaced. But, since the sprites in movement are larger, between the first and second frames the face is more distant, whereas between the last and second-to-last frames the face looks closer (as shown by the dark red line). The linear movement doesn't look so linear now because of the motion blur. I tried using pictures to be more clear, but I'm not sure if you follow. Having said that, I bet this is a very common problem, so I'm fairly sure this is a known situation. What's the best solution in Phaser?
  7. Turns out anchor is all I needed! I missed that pretty easily, went for pivot instead, which was causing me problems. Now it looks just fine. Thanks for your help! (I could use syncBounds to make it more accurate but for my purposes that's already fine)
  8. Hi Rich. I don't actually want the body to rotate with the sprite, I'm aware that Arcade Physics locks its rectangle to the axis. What I need is the sprite image to rotate in place, relative to the collision box, which isn't happening right now.
  9. What the title suggests. When I change a sprite's angle (via its angle property, rotation yields the same results), the sprite image rotates about its origin point, while the collision box stays in place. I tried changing the `pivot` property, but while that indeed fixes the sprite image movement, now the collision box itself moves to "correct" that, and their relative distance is the same (but now with the collision misplaced, which is even worse). Is there a way to change sprite pivot without it affecting the collision box?
  10. How to create Custom Classes/Objects

    You can use call() as well, depends on the situation really. Arrow functions also set this with different context as well, so it's worth checking it out.
  11. How to create Custom Classes/Objects

    I apologize in advance in case I miss something, I'm bad at reading code made by someone other than myself. If you're having problems with what this refers to, I strongly suggest reading these two chapters. About not being able to get global variables... Well, you should be able to get these variables as long as they're in the main window object, and every global variable is put there. Did you check the order they're defined? Remember hoisting only happens with functions, and only inside their own scripts.
  12. I'm trying to wrap my head around timers, and how would I do to chain sequential events. There's a number of options I could think of Starting them all at the same time and have their durations to be incrementally bigger (so they're not actually chained per se, but timed in such a way that it achieves the same effect); Adding each event as a callback of the previous one (maybe using something like promises to avoid callback hell); Using a tween instead, which already has chaining built in with Tween.to(). Perhaps there's a simpler solution? Is there a built-in form of chaining events or I have to use one of the methods outlined above?
  13. If anyone's reading... I found out how. First, in the new Phaser.Game() call, there's an optional parameter antialias, that you can turn off. When I did, the resize wasn't blurry anymore. However, programming happened, and before I changed a single line of code, it stopped working again (it did slightly improve the look of a few objects comparing to before the antialias though). Yeah, I can't explain that either. Fortunately, there's another safeguard in the form of Phaser.Canvas.setImageRenderingCrisp(), that finally did the trick for me, for good this time.
  14. How to create Custom Classes/Objects

    You should, since Phaser is just Javascript. Are you, by chance, working with modules and didn't import or require() the object you need? Alternatively, you may assign your structure to the Phaser.Game itself (as long as you choose the name wisely).
  15. ClickToMove

    moveToPointer doesn't appear to have any acceleration, it changes velocity instantaneously.