squilibob

Members
  • Content count

    102
  • Joined

  • Last visited

About squilibob

  • Rank
    Advanced Member

Recent Profile Visitors

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

  1. squilibob

    Scene not defined.

    <script type="module" src="js/testmain.js"></script> Is this the name of your file? You said it was main.js not testmain.js?
  2. squilibob

    Mask following player

    You can add all your layers to a container and set the Mask on the container
  3. squilibob

    Rounded Rectangle

    Not that I can find? I thought it would be a simple approach like passing in an array of points to make a polygon but it seems that it's up to the coder to use lineTo and arc to make their own rounded rect? You can make a helper function to do it manually. Starting from the middle of one of the sides you can construct it by either defining each of the corners in order all the way around or making an array that can programmatically do that work for you if you like the functional approach. The below demos the latter but it's computationally more expensive just for the sake of being functional programming: this.rounded = function(x, y, width, height, radius, color) { if (+width < radius * 2 || +height < radius * 2) return this.add.graphics({ fillStyle: { color: color}, x: +x, y: +y}) let options = Array.from({length: 4}, (_, index) => ({ radians: (index * Math.PI / 2 + Math.PI) % (2 * Math.PI), x: +x + (((index + 1) & 2) >> 1) * +width, y: +y + ~~(index > 1) * +height, lx: radius * ~~((index-2) * ((index-2) & 1)), ly: radius * ~~-((index + 1) & 1), ax: radius * (~((index + 1) & 2) + 2), ay: radius * (~~(index < 2) || -1) })) let shape = this.add.graphics({ fillStyle: { color: color}, x: +x, y: +y}) .beginPath() .moveTo(+x, +y + height >> 1) options.forEach((current, index, arr) => { shape .lineTo(current.x + current.lx, current.y + current.ly) .arc(current.x + current.ax, current.y + current.ay, +radius, current.radians, arr[index < arr.length - 1 ? index + 1 : 0].radians) }) return shape .closePath() .fillPath() } let myRect = this.rounded(50, 50, 400, 200, 20, 0xff8000)
  4. squilibob

    Jump animation while the character is jumping

    If you change your walking animation to include a check to see if the sprite is on the floor then it should work this.mario.body.onFloor() && this.mario.play('walk', true);
  5. squilibob

    Help with accessing a containers children

    Did you call .setInteractive() on the sprites or on the container?
  6. squilibob

    Mask following player

    let mask = this.make.graphics({ fillStyle: { color: 0x000000 }, add: false}) .fillCircleShape(new Phaser.Geom.Circle( 100, 100, 100 )
  7. squilibob

    Mask following player

    you should set the mask like so: fondo.setMask(new Phaser.Display.Masks.BitmapMask(this, mask))
  8. squilibob

    Playing GIFs in Phaser 3

    I have investigated converting gifs to spritesheets at runtime and it seems every solution that I've come across involves using imagemagic. If you're not getting the gif from an external source then you should use a spritesheet.
  9. Can a spritesheet be loaded in the scene config or does it need to be in preload? I have a spritesheet that I have set up in my preload function preload: function() { this.load.spritesheet({ key: 'defaultavatars', url: '/img/avatars.png', frameConfig: { frameWidth: 256, frameHeight: 256, endFrame: 49 } }) } Is there a way I can add it in the scene config using the new pack declaration? pack: { files: [ { type: 'image', key: 'defaultavatars', url: 'img/avatars.png', frameConfig: { frameWidth: 256, frameHeight: 256, endFrame: 49 }} ] }
  10. squilibob

    How does setCORS work

    It works fine opening directly. https://cdn.betterttv.net/emote/55b49352120a3d66411fafd6/1x For now I'm just using a CORS proxy but I was under the assumption that the .setCORS() function would allow me to use it in webgl/canvas. I just don't know what to set it to. I've tried: this.load.setCORS('anonymous') this.load.setCORS('Anonymous') this.load.setCORS(true)
  11. squilibob

    How does setCORS work

    I am trying to use an image hosted on a CDN that requires CORS . This works in Phaser 2 by setting game.load.crossOrigin = 'anonymous'; but in Phaser 3 I cannot get this to work. I can set crossOrigin by using .setCORS in my scene config or on the image being loaded itself but I must be using it incorrectly because I still get the (CORS header 'Access-Control-Allow-Origin' missing) error.
  12. squilibob

    Really Basic Setup question

    You most likely just want the phaser.js file and don't need the zip. You can download it from https://github.com/photonstorm/phaser/releases/download/v3.3.0/phaser.js Once you've done that you can just put the phaser.js file in the directory that you are putting your tutorial files.
  13. squilibob

    Alpha Tween not working as expected

    By itself this code is working. The problem must be somewhere else in your code
  14. squilibob

    Confusion with multipler Timers

    If you are performing things one after another then you are essentially making a queue. Instead of making individual timers for each object you can use the update method and Date.now along with a variable to keep track of when an action was last performed. Here is your code refactored to have a text queue and an emitter queue. There is no defined timers for you to worry about keeping track of since everything is working on phaser's update method. var text, emitter, current, textqueue = [], emitterqueue = [], texteventdelay = 4000, emittereventdelay = 6000, lasttextevent = Date.now() - texteventdelay, lastemitterevent = Date.now() function create() { // Translation can be done here textqueue.push({x:32, y:10, text:'This.', fill: 'white' }) textqueue.push({x:32, y:22, text:'Is.', fill: 'white' }) textqueue.push({x:32, y:32, text:'An.', fill: 'white' }) textqueue.push({x:32, y:42, text:'Epic.', fill: 'white' }) textqueue.push({x:32, y:52, text:'Intro...', fill: 'white' }) // Light: Particle effects game.stage.backgroundColor = '#000000'; emitter = game.add.emitter(game.world.centerX, game.world.centerY, 200); emitter.makeParticles('corona'); emitter.setRotation(0, 0); emitter.setAlpha(0.3, 1); emitter.setScale(0.1, 1); emitter.gravity = 0; } function update() { if (textqueue && textqueue.length && lasttextevent + texteventdelay < Date.now()) dequeue(textqueue.shift()) if (emitterqueue && emitterqueue.length && lastemitterevent + emittereventdelay < Date.now()) destroyLight(emitterqueue.shift()) // TODO } function dequeue(nextevent) { current && current.destroy() current = game.add.text(nextevent.x, nextevent.y,nextevent.text, { fill: nextevent.fill }) current.scale.setTo(0.5) emitterqueue.push(emitLight()) lasttextevent = Date.now() } function emitLight() { var back = game.add.image(0, -300, 'waves'); back.scale.set(2); back.smoothed = false; back.alpha = 0.2; // Dozens of these appear, drains system resources!!! emitter.start(false, 6000, 100); return back } function destroyLight(toDestroy) { toDestroy.destroy() emitter.on = false lastemitterevent = Date.now() }
  15. squilibob

    [Solved]How is it possible to call this function?

    in your create function you never call this.init() so this.play never gets set to true before this.enemy is instantiated