Arcanorum Posted December 27, 2016 Share Posted December 27, 2016 So here's the deal. I'm making an online multiplayer action game, currently using Phaser for the client (mainly for rendering and input), and I've hacked Phaser onto my Node.js server as well (http://www.html5gamedevs.com/topic/7393-running-phaser-on-nodejs-how-i-did-it-and-why-you-shouldnt-do-it/), so I can use the Arcade physics system to manage the interactions of player's entities with other entities in the game world. I get that some people puke at this idea, but it works, mostly. The server entities use sprites with no texture, just so I can give them a physics body to use for collision/intersection checking, but I'm having some alignment issues related to how bodies relate to the scales and anchors of their respective sprites, and have been thinking that I probably should be using a proper system where physics bodies aren't tied to sprites (display objects). What good alternative, standalone JS physics engines are there that offer similar features to Arcade that I can use on my server? Arcade seems ideal for what I'm doing, but lugging around the rest of Phaser with it without using it is just silly. The game only requires simple rectangle AND circle body support. No complex polygons or shape rotating, and needs to be fast, as there may be many entities that could interact with each other at any time. I've thought about doing this myself, but want to save some time if I can. Link to comment Share on other sites More sharing options...
endel Posted December 27, 2016 Share Posted December 27, 2016 Hi @Arcanorum, There are two 2d physics libraries I can think of. You can include both of them on Node.js, and also run in the client, if necessary: P2: https://github.com/schteppe/p2.js MatterJS: https://github.com/liabru/matter-js I believe you can simulate only the physics in the server (movements, collisions, etc), not including the whole engine (Phaser) in it. Cheers! Link to comment Share on other sites More sharing options...
Arcanorum Posted December 27, 2016 Author Share Posted December 27, 2016 Yea, I've looked into those. The three big players that I see are Box2D, P2 and Matter, but they are all fairly feature packed and in-depth, and overkill for what I need. I suppose all I can do is try some, see how easy they are to use and how well they perform. Link to comment Share on other sites More sharing options...
PixelPicoSean Posted December 27, 2016 Share Posted December 27, 2016 I'd suggest try make your own, reasons below: AABB collision is pretty simple with just a few lines. Regarding the physics simulation you just need to create a class with only the properties your entities need, which is just another few lines of code. For box-vs-box collision detection: // a vs b aIsOverlapB = !( a.bottom <= b.top || a.top >= b.bottom || a.left >= b.right || a.right <= b.left ); For circle-vs-circle collision detection: // AABB overlap first aIsOverlapWithB = false; if (!( a.bottom <= b.top || a.top >= b.bottom || a.left >= b.right || a.right <= b.left) ) { // Now let's check the distance between center of the circles with radius sum // Squared distance is enough, so you can skip the expensive `sqrt` calculation aIsOverlapWithB = Vec2.squaredDistance(a.position, b.position) < (a.radius + b.radius) * (a.radius + b.radius); } For complete AABB based physics implementation, you can take a look at the physics module of LesserPanda, and use it as a reference for your own physics engine. drhayes, endel and samme 3 Link to comment Share on other sites More sharing options...
Arcanorum Posted February 3, 2017 Author Share Posted February 3, 2017 Rect-rect and circle-circle collision is easy, but rect-circle collision and handling is a much bigger problem. I've also looked into PhysicsJS, but that has been inactive for a few years. I'm already able to work out which other bodies a given moving body should check for collisions with, by giving each body a 'detection radius', and checking if the distance between the two bodies is less than their sum, which I believe is the fastest way of finding potential colliding bodies. Bodies are also given a 'category', which is a way for a given body to tell if another body is something it is interested in. For example, player bodies are interested in other bodies that have a category of 'wall' and 'triggerZone', but bullets might only care about 'wall'. Using these two properties, any bodies that are in range of a given body, and are of a category that the first body is interested in, are then checked if they are colliding, and if so, do some gameplay stuff, then separate them if needed. No need to do collision checks against everything in the world all the time. I've looked more into P2, but I couldn't find a simple "check if a particular body is colliding with this one, and return true or false" function like Arcade has. That and the documentation is lacking. I just hope that Arcade 2 isn't going to be hardwired into Phaser 3, so it can be used for other purposes. Link to comment Share on other sites More sharing options...
drhayes Posted February 6, 2017 Share Posted February 6, 2017 I think P2 is overkill for arcade physics-type uses, for sure -- much more of a "real physics" simulator. You might want to investigate using a "spatial hash" as well (googleable term). It's a spatial partitioning algorithm where you say "I'm gonna make my entire world a series of 200x200 buckets." Each object can occupy, at most, four buckets. You only check each object against other objects in its bucket. WAY more efficient vs. "every object checks against every other object" type things. Phaser's approach here is pretty standard. For the most part you want things that are colliding to separate. How far each things moves can be based on whatever, their mass, whether they are supposed to move at all, etc. Phaser even gives you an out and lets you provide custom collision handlers. It's probably worth it to write your own or grab one of the ones already existant: https://www.ibm.com/developerworks/library/wa-build2dphysicsengine/ Link to comment Share on other sites More sharing options...
ClusterAtlas Posted February 6, 2017 Share Posted February 6, 2017 I'd hella agree that most physics engines out there are tad bit bloated & overkill. The route I went was to actually analyse implementations done by existing libraries and write my own implementations in a fitting manner towards my code. Ie: In a platformer game I only need to check collision on floors and floating tiles whenever the unit's downward velocity is greater that its upward velocity. Another example is checking only between a predefined set of objects, instead of checking against **ALL** objects - big performance boost right there so to speak. Check these couple repo's anyways, these got great insights on collision handlings: https://github.com/TuurDutoit/crash https://github.com/jriecken/sat-js edit: This event emitter is handy too in any 'handling' part. https://github.com/TuurDutoit/EventEmitter mwissink and quiphop 1 1 Link to comment Share on other sites More sharing options...
ldd Posted February 6, 2017 Share Posted February 6, 2017 To complement what other have said, all you need is to look at https://github.com/photonstorm/phaser-ce/tree/master/src/physics/arcade which shows you how arcade physics are implemented in Phaser. The only other classes used are Phaser.Point, Phaser.Line, and Phaser.Signal. I would personally: 1) In the server, shim those classes and other stuff that arcade physics calculations use. 2) use mapper and reducers to filter what to send and receive to the server. Make sure it's parsable by JSON.parse. Just for the lulz I found out a way to get all the children (recursively) that have bodies. So you would call findBodies(game.world), get an array of bodies and send that to the server XD const findBodies = (child) => (child.children.length > 0)? child.children .reduce( (prev, next) => prev // add the results of findBodies on the next child .concat(findBodies(next)) // filter out those that are undefined or null .filter(t=>t) ,[]) : // no children, so we return the child's body child.body hexus 1 Link to comment Share on other sites More sharing options...
mwissink Posted February 6, 2017 Share Posted February 6, 2017 @Arcanorum I agree with @ServerCharlie that SAT.js is really good. I used it for one of my mobile games that I worked on. It's light weight and is simple to implement Link to comment Share on other sites More sharing options...
Recommended Posts