• Content count

  • Joined

  • Last visited

About rblopes

  • Rank

Contact Methods

  • Website URL
  • Twitter

Profile Information

  • Gender

Recent Profile Visitors

693 profile views
  1. rblopes

    Snake Game

    Hi. I think you all will enjoy this little one too. This game project is based on the Snake game tutorial published on issue #85 of the Phaser World newsletter. I've been slowly working on this one, since before the first Phaser 3 alpha releases, improving the code little by little over time, adapting it as development of Phaser 3 progressed and new features appeared. The project is available for everyone to clone, study and modify at GitHub, and can be played online here. Some screenshots: Edit (2018-04-19): updated for Phaser 3.6.0.
  2. rblopes

    loading-screen with custom elements

    If you want to use an image as your progress bar, you could use a camera viewport to simulate a texture crop (until proper support for cropped textures land in Phaser 3). This is similar to the Loader#setPreloadSprite() from Phaser 2. Example. const images = ['arrow', 'atari1200xl', 'blue_ball', 'budbrain_chick', 'chain', 'chunk', 'clown', 'columns-orange', 'columns-red', 'eggplant', 'elephant', 'enemy-bullet', 'exocet_spaceman', 'explosion', 'fuji', 'interference_ball_48x48', 'maggot', 'melon', 'orb-red', 'oz_pov_melting_disk', 'palm-tree-right', 'pepper', 'phaser', 'phaser-dude', 'phaser-ship', 'phaser1', 'phaser2', 'pineapple', 'plane', 'platform', 'player', 'purple_ball', 'ship', 'shmup-baddie', 'shmup-bullet', 'shmup-ship', 'skull', 'sonic', 'spaceman', 'spinObj_02', 'spinObj_04', 'steelbox', 'thrust_ship', 'tinycar', 'treasure_trap', 'wabbit', 'wasp', 'xenon2_ship', 'yellow_ball', 'zelda-hearts']; new Phaser.Game({ width: 400, height: 300, type: Phaser.AUTO, loader: { baseURL: 'https://labs.phaser.io/', path: 'assets/sprites/', crossOrigin: true }, scene: class extends Phaser.Scene { constructor() { super({ key: 'loader', files: [ /* splash screen and progress bar files could go here */ { key: 'healthbar', type: 'image' } ] }) } preload() { // (1) Load main game assets. this.load.image(images); // (2) Add the progress bar image off screen, keep its // coordinates and dimensions for reference. const img = this.add.image(20, -20, 'healthbar').setOrigin(0); const {x, y, width: w, height: h} = img; // (3) Create a camera to fake a texture crop. const camera = this.cameras.add(150, 145, 0, h) .setScroll(x, y); // (4) Bind the 'progress' event, use its value to // stretch the viewport width. this.load.on( 'progress', n => camera.setSize(Math.ceil(n * w), h) ); } create() { /* load game scene ... */ } } });
  3. I've been quiet for too long, time to share some input, I guess... First of all, if it's a community effort, please move the repository into a GitHub org and invite the interested parties later. (I'm not sure I'll be able to be part of it, but I'll make my contributions regardlessly.) phaser-contrib was available last time I checked. If you're gonna go through the nightmares of Lerna and monorepo management, you'll want to study Yarn Workspaces a little too to save you some big headaches... By the way, I tried commander.js once, but ended with Yargs for my command-line thingie. Not sure I was doing something really wrong with Commander, but after trying Yargs, I'm stuck with it anyway. Besides Yeoman, there is another library that caught my attention recently. sao is the one used for create-vue-app. I haven't tested it, though, and I'm unsure of its minimalist approach, but the alternatives it offers over Yeoman may interest you. Good luck in your project, I'm looking forward to it with great interest.
  4. rblopes

    Functions outside update dont work

    What happens if you modify those lines and place handleCollisions() before handleJump() inside your update loop? update () { this.handleCollisions(); // <--- this.handleJump(); this.handleInput(); }
  5. rblopes

    Phaser Lite

    Just browse the "build/custom" folder in Phaser CE repository on GitHub. The "phaser-no-physics.js" might interest you. And if you downloaded Phaser CE from npm, you'll find these files inside the phaser-ce package too.
  6. rblopes

    Losing Scope when passing between functions.

    Oh, sorry. What I meant by 'too many params' is that, in that code snippet you posted, you have 8 parameters in your `Fish` constructor (`pSize` is the last one). Maybe you're omitting it or not passing those parameters in the expected order.
  7. rblopes

    Losing Scope when passing between functions.

    Your code seems to be fine for me... Maybe too many params?
  8. rblopes

    Losing Scope when passing between functions.

    Not sure if you've omitted this part of the code, but you're not assigning `pSize` to your prototype. this.pSize = pSize; // ... this.setSize(this.pSize);
  9. rblopes

    local storage with JSON error

    That way you're trying to save a whole game object to localStorage. Rather than storing the whole sprite object just to retrieve a few properties later, what you really want is to pick just the properties you're interested in restoring later. Example: // To store in `localStorage`: function reveal_param(sprite){ var projectile = { name: sprite.name, number: sprite.number, // ... etc ... }; localStorage.setItem('_projectile', JSON.stringify(projectile)); } // To recover that object later: var projectile = JSON.parse( localStorage.getItem( '_projectile' ) ) ; alert(projectile.name);
  10. rblopes

    gulp or grunt?

    The sole purpose of UglifyJS is to obfuscate and compress code. It works the same for both. For Gulp, use this plugin, and this one for Grunt. So, which task manager do you intend to use?
  11. rblopes

    Manually add spritesheet to cache

    Could it be this: http://phaser.io/examples/v2/animation/dynamic-animation // And now add it to the cache, so any sprite can use it // The parameters can be found in the API docs, but the important parts are to leave the URL blank and pass the bmd.canvas as the data value // The 22x22 is the frame size and 16 the quantity of frames game.cache.addSpriteSheet('dynamic', '', bmd.canvas, 22, 22, 16, 0, 0);
  12. rblopes

    Issues when creating a small FOSS Phaser.io UI library

    HI, @JTronLabs. I sent you a pull request last night with some modifications that may help you solve your problem. Your test project is using the "No Physics" custom build that omits, among Arcade and P2 physics engines, several other features, including: Tiled Tilemaps support; The Weapons Plugin; and The Particles system. I don't know how much these features are related or how they specifically depend on Arcade Physics. At least, for the Weapons plugin it does make sense to omit it, I'm not convinced about the others, though. But this is how Phaser 2 was designed, and I won't discuss it here further. (I bet someone could figure out a way and make Tilemaps or Particles no longer tied to AP.) So, even if you add Phaser as an external dependency to your library, that may not help you much. If your component depends on a class that's not included in a Phaser build (which is causing the "class extends undefined" issue), it'll just fail to load. So your best bet there is to include, at least, some kind of feature detection. Hope that helps.