• Content Count

  • Joined

  • Last visited

About Jazcash

  • Rank

Recent Profile Visitors

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

  1. I'm in the early stages of my project and things are starting to get messy but I have no idea how to separate concerns. I know MVC, but that's more heavily geared towards websites and apps, rather than games. My current structure isn't terrible, but could use some inspiration for how to set things up going forward. This is it currently: - dist/ - src/ - assets/ - fonts/ - images/ - sounds/ - styles/ - client/ - entities/ - board.ts - card.ts - misc/ - supertext.ts - tooltip.ts - scenes/ - boot.ts - lobby.ts - game.ts - ui.ts - debug.ts - common/ - schemas/ - utils.ts - player.ts - server/ - main.ts Now I'm starting to think about client<->server comms, state machines, models, database managers and so on. Any suggestions of how I can structure the folders would be helpful, and if people are cool with sharing their own project structures that'd be awesome. Cheers.
  2. That's cool, and I definitely will be doing that, but I have a lot of big spritesheets so it's not enough for me
  3. Think I've just found a way, but it feels dirty... preload(){ this.load.image("orangeLQ", "assets/images/orangeLQ.png"); this.load.image("orangeHQ", "assets/images/orangeHQ.png"); } create(){ this.cache.getBaseTexture("orangeLQ").width *= 2; this.cache.getBaseTexture("orangeLQ").height *= 2; this.cache.getFrameData("orangeLQ").getFrameByName("assets/images/orangeLQ.png").width *= 2; this.cache.getFrameData("orangeLQ").getFrameByName("assets/images/orangeLQ.png").height *= 2; this.cache.getFrameData("orangeLQ").getFrameByName("assets/images/orangeLQ.png").right *= 2; this.cache.getFrameData("orangeLQ").getFrameByName("assets/images/orangeLQ.png").bottom *= 2; this.cache.getFrameData("orangeLQ").getFrameByName("assets/images/orangeLQ.png").sourceSizeH *= 2; this.cache.getFrameData("orangeLQ").getFrameByName("assets/images/orangeLQ.png").sourceSizeW *= 2; this.cache.getFrameData("orangeLQ").getFrameByName("assets/images/orangeLQ.png").centerX *= 2; this.cache.getFrameData("orangeLQ").getFrameByName("assets/images/orangeLQ.png").centerY *= 2; this.cache.getFrameData("orangeLQ").getFrameByName("assets/images/orangeLQ.png").x *= 2; this.cache.getFrameData("orangeLQ").getFrameByName("assets/images/orangeLQ.png").y *= 2; let orangeLQ = this.add.sprite(0, 0, "orangeLQ"); let orangeHQ = this.add.sprite(0, orangeLQ.bottom, "orangeHQ"); }
  4. I need to speed up the loading of my game on mobile, so I'm loading half-size spritesheets that are half the dimensions and about half the file size. I don't want to have to treat my sprites any differently regardless of if the game is desktop or mobile, however. e.g. if I add a sprite to the world using the small-size spritesheet, I want it to still be the same dimensions as the larger-size one. That way I won't have to worry about positional differences. My high quality image: and my low quality image: At first I thought it'd be simple as just `.setScale(2)`, but then realised I don't want to change any of the actual sprite's properties as scale may be something I wish to play with later (e.g. tweening), and I don't want to have to have conditional code for desktop and mobile here. Ideally, any changes would all be done to the texture/frame before being added to any game object. My attempt was to change the resolution of LQ: preload(){ this.load.image("orangeLQ", "assets/images/orangeLQ.png"); this.load.image("orangeHQ", "assets/images/orangeHQ.png"); } create(){ this.cache.getBaseTexture("orangeLQ").resolution = 0.5; let orangeLQ = this.add.sprite(0, 0, "orangeLQ"); let orangeHQ = this.add.sprite(0, orangeLQ.bottom, "orangeHQ"); } You can see this scaled the LQ up correctly, but the internal dimensions are still the same, as you can see by the HQ sprite's y value causing overlap. Anyone any ideas? Here's the sandbox: phaser.io/sandbox/QTkaLhaF
  5. See this example: https://phaser.io/sandbox/edit/TZeowZWz If you open the console and hold left, right, up, down and press space it logs "SPACE PRESSED". If you hold up + right and press space it logs SPACE PRESSED, but not if you hold combinations of any of the other directions. What gives? Edit: Nevermind, just found this: https://github.com/photonstorm/phaser/issues/949
  6. Fixed my issue by removing game.scale.setUserScale(2, 2); and just scaling all the elements up individually.
  7. Better! But has some weird artifacting compared to the HTML version (left).
  8. I have a retro-style game with pixel art that I'm scaling up with game.scale.setUserScale(2, 2); And I'm adding some text: game.add.text(100, 100, "Hello world!", {font: "retrofont", fontSize:24}); But the scaling makes the font appear distorted, as you'd expect. Is there a way to render the text crisp or alternatively scale only certain elements of the game up? Currently I'm thinking of creating a second canvas overlaying the main canvas with default scale and rendering the text on that instead, but it feels hacky and could impact performance? Open to better suggestions.
  9. I'm trying to work how to display a shine animation on one of my sprites. I have the shine as an image (with transparency in the image), and I just want to drag it over my sprite whilst staying masked inside the sprite shape itself. I can sort of work out how to get the shine to appear masked inside the image, but it includes a copy of the whole sprite in the final BitmapData instance, whereas I just want the shine, but masked by the sprite's shape. I could paste my code, which is using some hacky-feeling processPixelRGB calls, but would appreciate a full explanation of how to do it a more optimal way.