Leaderboard


Popular Content

Showing content with the highest reputation on 07/27/19 in all areas

  1. 1 point
    First try ... Double check Chrome is really using WebGL. Spine mesh deformation can be quite intensive for Canvas and could easily account for these FPS variations (if WebGL isn't working).
  2. 1 point
    This is a really tricky question for a generic answer as there are so many variables which _could_ dictate whether your project structure works well or not so well. Personally, I'd take any answers with a pinch of salt i.e. there is no single 'best' structure, like, not at all. Have a think about what the problems you are trying to solve are and how the processes and concepts you employ for organisation are going to solve that problem? To the above question, the answer is usually 'I do not know'. This is fine. With the above in mind it is usually better to follow this sort of process: Start the project. Put stuff anywhere, it does not matter at this stage. Get something working. Keep going. Now you have a working product and you can start to identify what organisational problems you have and think about how to solve them. Until this point you are largely guessing. If you have created several similar projects before your guesses are probably good, if not, then they might not be. It is relatively easy to apply some structure and organisation to a project that doesn't really have one, it can be pretty tricky to change organisational structure (can be, depends on many things again, you certainly should not be afraid to change later on if your current system turns out to be not very efficient). There are some rules of thumb that might help you though: Small files and folders are easier to manage than larger ones i.e. small in scope, not necessarily small in lines of code. Decouple things as much as possible, this makes them easier to work with, and makes organisation easier to change. Tight coupling is a nightmare, avoid at all costs. Uber objects (and, similarly, uber-projects) are hard to manage, this is really the above concern worded differently. Divide and conquer. UI and logic (rendering and smarts) are good things to separate. Avoid logic duplication, if you end up writing similar logic in multiple places, consider generalising and abstracting it. Utility functions can form a huge part of your codebase and is _usually_ a sign of good organisation. MVC is fine for games. As are other methodologies. Go with what you think makes most sense for you (and your team) and the project.
  3. 1 point
    nkholski

    Exploding sprites

    I just finished an effect to make enemies in my game explode into pieces when getting killed. What it does is to create an emitter at the coordinates of the enemy bursting subparts extracted from the sprite. I think the result was kind of cool so I spent some extra time cleaning up the code a bit so I can contribute with something (after being given so much from Phaser and the forums). Edit: Basic online demo "Before and after" After the preloader finishes it allows you to define explosions (entityExplode.setup) based on sprites in a SpriteAtlas (I'm using TexturePacker). The entityExplode.setup will add references to subparts of a selected subsprite but not add or alter any of the imagedata. When defining a new state you need to call entityExplode.init in Create. If the setup was correctly done you will be able to explode a sprite with entityExplode.play (you need to remove the sprite yourself after calling play if you don't want both the sprite and the explosion to show). If you call entityExplode.bounceAndFade in your state's update function the pieces will bounce on a tilemap layer and fade away before being removed. Any suggestion on how to improve this is appreciated. You are free to use and modify the code any way you want. Notes: * A lot of hard coded values fits my game well, but is probably not the best fit for everyone (such as size of the parts, speed of the emitter or number of parts to send out). * I haven't checked out the Atlas object-stuff enough to know what everything does, I'm just cloning the original frame and changes the things that makes this work (including duplicating UUID). * There is for sure things that could improve the emitter. I would love to find a way to get the pieces to stop sliding on the ground and I would prefer that the stopped their rotation once on ground. entityExplode = { init: function (that) { // Called from Create for any state that will use entityExplode that.explosionEmitters = game.add.group(); }, setUp: function (explodeName, frameName, atlasName, fragmentSize) { // Can be called anytime after Preloader finishes (at least after the atlas json is loaded) // Prepare a possible explosion so that can be called by the play method later. // explodeName = name of the explosion to create // frameName = frame name in atlas to build from (I only define one explosion per entity since the sprite get distorted and it doesn't matter much if the entity was jumping or walking or something else when exploding.) // atlasName = name of atlas to use // fragmentSize = size of fragment in pixels (default = 8) var sourceFrame = false; var xcount, ycount, temp; var frameNames = []; if (!("explosionFrames" in this)) { this.explosionFrames = []; } if (explodeName in this.explosionFrames) { return; // No double-trouble } if (frameName in game.cache._images[atlasName].frameData._frameNames) { sourceFrame = game.cache._images[atlasName].frameData._frames[game.cache._images[atlasName].frameData._frameNames[frameName]]; } else { console.log("ERROR! FrameName not found"); return } if (typeof (fragmentSize) === "undefined") { fragmentSize = 8; } xcount = Math.floor(sourceFrame.width / fragmentSize); ycount = Math.floor(sourceFrame.height / fragmentSize); temp = JSON.parse(JSON.stringify(sourceFrame)); // Kind of a hacky way to copy an object for (var x = 0; x < xcount; x++) { for (var y = 0; y < ycount; y++) { temp.name = explodeName + "_explode" + (x * ycount + y); temp.x = sourceFrame.x + x * fragmentSize; temp.y = sourceFrame.y + y * fragmentSize; temp.width = ((temp.x + fragmentSize) > (sourceFrame.x + sourceFrame.width)) ? (sourceFrame.x + sourceFrame.width - temp.x) : fragmentSize; // stay within the sprite-size temp.height = ((temp.y + fragmentSize) > (sourceFrame.y + sourceFrame.height)) ? (sourceFrame.y + sourceFrame.height - temp.y) : fragmentSize; // Add the fragment to the atlas data (this works, but it also just duplicates a lot of values I don't know what they do) game.cache._images[atlasName].frameData._frameNames[temp.name] = game.cache._images[atlasName].frameData._frames.length; game.cache._images[atlasName].frameData._frames.push(JSON.parse(JSON.stringify(temp))); frameNames.push(temp.name); } } this.explosionFrames[explodeName] = { atlas: atlasName, frames: frameNames // A list of framenames to select from when doing an explosion! } game.explosionFrames = this.explosionFrames; }, play: function (entity, explodeName, that, hitFrom) { // Called to initate explosion of entity // entity is the object to explode, typically sprite // explodeName is a explosion previously defined in setUp // hitFrom is optional, from right or left (could be replaced by sprite object and then calculate the direction of explosion from velocity of impacting bullet using trigometry but I don't need that) var explode = game.add.emitter(entity.x, entity.y, 100); // Add the explosion at the entity coordinates if (!(explodeName in this.explosionFrames)) { console.log("Error: Nothing to explode!"); return; } explode.bounce.setTo(0.5, 0.5); if (hitFrom === "right") { explode.setXSpeed(-100, -10); } else if (hitFrom === "left") { explode.setXSpeed(10, 100); } else { explode.setXSpeed(-50, 50); } explode.setYSpeed(-100, -200); explode.makeParticles(game.explosionFrames[explodeName].atlas, game.explosionFrames[explodeName].frames, 100, 250, 100, true); explode.particleFriction = 10; // Makes no difference! explode.start(true, 2000, 1, 20, 20) game.time.events.add(Phaser.Timer.SECOND * 3, function () { explode.destroy(); }); that.explosionEmitters.add(explode); }, bounceAndFade: function (that, tilemapLayer) { // Called from update for (var i in that.explosionEmitters.children) { that.physics.arcade.collide(that.explosionEmitters.children[i], tilemapLayer); that.explosionEmitters.children[i].forEachAlive(function (p) { p.alpha = p.lifespan / that.explosionEmitters.children[i].lifespan; }); } }}
  4. 1 point
    nkholski

    Exploding sprites

    Thanks. I uploaded the latest version I could find on my hard disk to Git. It's the unmodified version from that one I used in "Robotic Conflict" (http://dev.niklasberg.se/roboticConflict/). It will contain bugs for sure and probably some ugly hacks just to get it to work. This version can blow up both sprites and tiles on a tilemap, and requires Phaser 2.4.x (The code I posted in the first post will not work in Phaser 2.4+ because of changes on how cache works). If there is a demand I might update it and make a proper repository. Gist: https://gist.github.com/nkholski/533cfbf0272a3c41273c
  5. 1 point
    nkholski

    Exploding sprites

    Just uploaded a basic demo: http://niklasberg.se/entityExplode/index.html