From ca65eb758400df66f90be478208d00cfcbaf0b6a Mon Sep 17 00:00:00 2001 From: James Stanley Date: Mon, 29 Apr 2024 21:17:51 +0100 Subject: [PATCH 1/8] Circle takes position followed by radius --- docs/pages/shape/circle.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/pages/shape/circle.md b/docs/pages/shape/circle.md index b7f00c9e..ca831eda 100644 --- a/docs/pages/shape/circle.md +++ b/docs/pages/shape/circle.md @@ -3,5 +3,5 @@ Circle shapes have a position and radius. Circles are solid. You cannot make a hollow circle using the circle shape. ```js -let circle = new Circle(0.5, new Vec2(2, 3)); +let circle = new Circle(new Vec2(2, 3), 0.5); ``` From 0c37d7eabe1e8016364fa80910a127476f4f0b90 Mon Sep 17 00:00:00 2001 From: James Stanley Date: Mon, 29 Apr 2024 21:20:35 +0100 Subject: [PATCH 2/8] Fix example renderer implementation --- docs/pages/rendering.md | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/docs/pages/rendering.md b/docs/pages/rendering.md index d1f96576..71aca71d 100644 --- a/docs/pages/rendering.md +++ b/docs/pages/rendering.md @@ -18,8 +18,9 @@ class Renderer { this.world = world; // Add listeners - world.on('remove-fixture', this.removeBody); - world.on('remove-body', this.removeFixture); + world.on('remove-body', this.removeBody); + world.on('remove-joint', this.removeJoint); + world.on('remove-fixture', this.removeFixture); // Start frame loop this.started = true; @@ -28,15 +29,16 @@ class Renderer { stop() { // Remove listeners - world.off('remove-fixture', this.removeBody); - world.off('remove-body', this.removeFixture); + world.off('remove-body', this.removeBody); + world.off('remove-joint', this.removeJoint); + world.off('remove-fixture', this.removeFixture); // Stop next frame this.started = false; } // Game loop - loop(dt) { + loop(timeStamp) { if (!this.started) { return; } @@ -44,6 +46,8 @@ class Renderer { // In each frame call world.step with fixed timeStep // This is a simplified implementation, in a more advanced implementation // you need to use elapsed time since last frame and call step more than once if needed. + // When called by requestAnimationFrame() you'll get a timestamp as argument, + // https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame this.world.step(1 / 60); // Iterate over bodies @@ -61,7 +65,7 @@ class Renderer { } // Request a new frame - window.requestAnimationFrame(this.loop); + window.requestAnimationFrame(this.loop.bind(this)); } renderBody(body) { @@ -115,4 +119,3 @@ stability. - [Phaser 3 with Planck.js](https://www.emanueleferonato.com/2019/10/12/use-box2d-physics-in-your-phaser-3-projects-with-planck-js-javascript-physics-engine/) by Emanuele Feronato - [P5.js integration](https://sites.google.com/site/professorcookga/planck-box2d-physics-for-javascript-p5) by Robert Cook - [RealPeha/planck-renderer](https://github.com/RealPeha/planck-renderer) - \ No newline at end of file From 02ad2b57f8730b1c8cff54e3698aadae0e09b165 Mon Sep 17 00:00:00 2001 From: James Stanley Date: Mon, 29 Apr 2024 21:21:34 +0100 Subject: [PATCH 3/8] Fix testbed script tag example --- docs/pages/testbed/install.md | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/docs/pages/testbed/install.md b/docs/pages/testbed/install.md index cb9c68cd..0cc2c6be 100644 --- a/docs/pages/testbed/install.md +++ b/docs/pages/testbed/install.md @@ -24,7 +24,10 @@ To use testbed from CDN, add the following script tag to your HTML file. ```html - From 98e9bc082785fd8a32f9c80516b5412bfc71cd9b Mon Sep 17 00:00:00 2001 From: James Stanley Date: Mon, 29 Apr 2024 21:22:43 +0100 Subject: [PATCH 4/8] Fix script tags in install.md, and unify the testbed example html --- docs/pages/install.md | 8 ++++++-- docs/pages/testbed/install.md | 5 +++++ 2 files changed, 11 insertions(+), 2 deletions(-) diff --git a/docs/pages/install.md b/docs/pages/install.md index 70e56b46..2daf16dc 100644 --- a/docs/pages/install.md +++ b/docs/pages/install.md @@ -17,7 +17,7 @@ const world = new World(); Planck.js is available on [jsDelivr](https://www.jsdelivr.com/package/npm/planck), [cdnjs](https://cdnjs.com/libraries/planck), and [unpkg](https://unpkg.com/planck/). ```html - ``` From 2191710f226232d8f3bad4bade485ae2901c5660 Mon Sep 17 00:00:00 2001 From: James Stanley Date: Mon, 29 Apr 2024 21:23:29 +0100 Subject: [PATCH 5/8] Hyperlink Box2D on index page --- docs/pages/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/pages/index.md b/docs/pages/index.md index 3369e8e8..6fb42451 100644 --- a/docs/pages/index.md +++ b/docs/pages/index.md @@ -1,6 +1,6 @@ #### Planck.js -Planck.js is JavaScript/TypeScript rewrite of Box2D C++ physics engine for cross-platform game development. +Planck.js is JavaScript/TypeScript rewrite of the [Box2D](https://box2d.org/) C++ physics engine for cross-platform game development. #### Box2D From fe9f0cf645f25802790ea4e601bd341552e53928 Mon Sep 17 00:00:00 2001 From: James Stanley Date: Mon, 29 Apr 2024 22:03:11 +0100 Subject: [PATCH 6/8] Fix AABB query coordinates --- docs/pages/world/aabb-query.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/pages/world/aabb-query.md b/docs/pages/world/aabb-query.md index 489a183b..ff5612ff 100644 --- a/docs/pages/world/aabb-query.md +++ b/docs/pages/world/aabb-query.md @@ -11,7 +11,7 @@ all of the associated bodies. ```js const query = new AABB( new Vec2(-1, -1), - new Vec2(-1, -1), + new Vec2(1, 1), ); myWorld.queryAABB(query, function(fixture) { let body = fixture.getBody(); From 5e070f974344963341ee50744da9a99815b0f1be Mon Sep 17 00:00:00 2001 From: James Stanley Date: Mon, 29 Apr 2024 22:12:29 +0100 Subject: [PATCH 7/8] More documentation cleanup --- docs/api/classes/mousejoint.md | 2 +- .../factories-and-definitions.md | 6 +-- .../api-conventions/implicit-destruction.md | 4 +- docs/pages/body.md | 22 +++++------ docs/pages/collision.md | 24 ++++++------ docs/pages/core-concepts.md | 6 +-- docs/pages/fixture.md | 10 ++--- docs/pages/hello-world.md | 20 +++++----- docs/pages/index.md | 2 +- docs/pages/joint.md | 14 +++---- docs/pages/joint/distance-joint.md | 2 +- docs/pages/joint/prismatic-joint.md | 37 ------------------- docs/pages/joint/pulley.md | 6 +-- docs/pages/shape.md | 10 ++--- docs/pages/shape/chain.md | 2 +- docs/pages/shape/edge.md | 2 +- docs/pages/shape/polygon.md | 2 +- docs/pages/testbed.md | 2 +- docs/pages/testbed/api.md | 4 +- docs/pages/world.md | 2 +- docs/pages/world/aabb-query.md | 8 ++-- docs/pages/world/ray-cast.md | 2 +- 22 files changed, 76 insertions(+), 113 deletions(-) diff --git a/docs/api/classes/mousejoint.md b/docs/api/classes/mousejoint.md index e08e91fe..25912d63 100644 --- a/docs/api/classes/mousejoint.md +++ b/docs/api/classes/mousejoint.md @@ -3,7 +3,7 @@ # Class: MouseJoint A mouse joint is used to make a point on a body track a specified world -point. This a soft constraint with a maximum force. This allows the +point. This is a soft constraint with a maximum force. This allows the constraint to stretch and without applying huge forces. You need to call setTarget(target) every time that mouse is diff --git a/docs/pages/api-conventions/factories-and-definitions.md b/docs/pages/api-conventions/factories-and-definitions.md index 3ff4cd45..65a4d584 100644 --- a/docs/pages/api-conventions/factories-and-definitions.md +++ b/docs/pages/api-conventions/factories-and-definitions.md @@ -1,6 +1,6 @@ ### Factories and Definitions -To create a Body or a Joint, you need to call the factory functions on World: +To create a `Body` or a `Joint`, you need to call the factory functions on World: ```js body = world.createBody(bodyDef); @@ -21,14 +21,14 @@ the number of function parameters small, provide sensible defaults, and reduce the number of accessors. Since fixtures must be parented to a body, they are created and -destroyed using a factory method on Body: +destroyed using a factory method on `Body`: ```js let fixture = body.createFixture(fixtureDef); body.destroyFixture(fixture); ``` -There is also shortcut to create a fixture directly from the shape and +There is also a shortcut to create a fixture directly from the shape and density. ```js diff --git a/docs/pages/api-conventions/implicit-destruction.md b/docs/pages/api-conventions/implicit-destruction.md index ab6871a3..8f844d1d 100644 --- a/docs/pages/api-conventions/implicit-destruction.md +++ b/docs/pages/api-conventions/implicit-destruction.md @@ -25,10 +25,10 @@ going to be implicitly destroyed. world.on('remove-joint', function(joint) { // remove all references to joint. }); -world.on('remove-fixture', function(joint) { +world.on('remove-fixture', function(fixture) { // remove all references to fixture. }); -world.on('remove-body', function(joint) { +world.on('remove-body', function(body) { // bodies are not removed implicitly, // but the world publishes this event if a body is removed }) diff --git a/docs/pages/body.md b/docs/pages/body.md index d30b2179..6a8e14c9 100644 --- a/docs/pages/body.md +++ b/docs/pages/body.md @@ -41,7 +41,7 @@ when you are done with them. #### Body Factory Bodies are created and destroyed using a body factory provided by the -world class. This lets the world create the body and add the body to the +`World` class. This lets the world create the body and add the body to the world data structure. ```js @@ -68,7 +68,7 @@ manage shape and joint references. Let's go over some of the key members of the body definition. -####3 Body Type +##### Body Type As discussed at the beginning of this chapter, there are three different body types: static, kinematic, and dynamic. You should specify the body type at creation because changing the body type later is expensive. @@ -94,8 +94,8 @@ A body has two main points of interest. The first point is the body's origin. Fixtures and joints are attached relative to the body's origin. The second point of interest is the center of mass. The center of mass is determined from mass distribution of the attached shapes or is -explicitly set with MassData. Much of Planck.js's internal computations -use the center of mass position. For example Body stores the linear +explicitly set with `MassData`. Much of Planck.js's internal computations +use the center of mass position. For example `Body` stores the linear velocity for the center of mass. When you are building the body definition, you may not know where the @@ -315,7 +315,7 @@ body.isFixedRotation(); // boolean ##### Position and Velocity You can access the position and rotation of a body. This is common when -rendering your associated game actor. You can also set the position, +rendering your associated game actor. You can also set the position and rotation, although this is less common since you will normally use Planck.js to simulate movement. @@ -373,14 +373,14 @@ if (myBody.isAwake()) { The body class has some utility functions to help you transform points and vectors between local and world space. -A localPoint is a coordination relative to body's origin. -A worldPoint is a coordination relative to world's origin. +A `localPoint` is a coordinate relative to the body's origin. +A `worldPoint` is a coordinate relative to the world's origin. -A localVector is a vector between two points relative to body's origin. -A worldVector is a vector between two points relative to world's origin. +A `localVector` is a vector between two points relative to the body's origin. +A `worldVector` is a vector between two points relative to the world's origin. -Here point means a point's 2D coordination, vector means the vector between two points. -In point conversion both position and angel of body are considered, in vector conversion only angle. +Here "point" means a point's 2D coordinate, "vector" means the vector between two points. +In point conversion both position and angle of body are considered, in vector conversion only angle. ```js body.getWorldPoint(localPoint); // Vec2 diff --git a/docs/pages/collision.md b/docs/pages/collision.md index a98eb998..92c7199c 100644 --- a/docs/pages/collision.md +++ b/docs/pages/collision.md @@ -1,5 +1,5 @@ ### Collision -The Collision classes includes shapes and functions that operate on them. +The Collision classes include shapes and functions that operate on them. The module also contains a dynamic tree and broad-phase to acceleration collision processing of large systems. @@ -25,15 +25,15 @@ improve stacking stability. Normally you don't need to compute contact manifolds directly, however you will likely use the results produced in the simulation. -The Manifold structure holds a normal vector and up to two contact +The `Manifold` structure holds a normal vector and up to two contact points. The normal and points are held in local coordinates. As a convenience for the contact solver, each point stores the normal and tangential (friction) impulses. -The data stored in Manifold is optimized for internal use. If you need -this data, it is usually best to use the WorldManifold structure to +The data stored in `Manifold` is optimized for internal use. If you need +this data, it is usually best to use the `WorldManifold` structure to generate the world coordinates of the contact normal and points. You -need to provide a Manifold and the shape transforms and radii. +need to provide a `Manifold` and the shape transforms and radii. ```js let worldManifold = manifold.getWorldManifold(null, transformA, shapeA.m_radius, transformB, shapeB.m_radius) @@ -48,7 +48,7 @@ Notice that the world manifold uses the point count from the original manifold. During simulation shapes may move and the manifolds may change. Points -may be added or removed. You can detect this using GetPointStates. +may be added or removed. You can detect this using `GetPointStates()`. ```js let state1 = []; // [PointState] @@ -63,7 +63,7 @@ if (state1[0] == PointState.removeState) { #### Distance The `Distance` function can be used to compute the distance between two shapes. The distance function needs both shapes to be converted into a -DistanceProxy. There is also some caching used to warm start the +`DistanceProxy`. There is also some caching used to warm start the distance function for repeated calls. ![Distance Function](./images/distance.svg) @@ -99,15 +99,15 @@ may be cases where collisions are missed for small rotations. Normally, these missed rotational collisions should not harm game play. They tend to be glancing collisions. -The function requires two shapes (converted to DistanceProxy) and two -Sweep structures. The sweep structure defines the initial and final +The function requires two shapes (converted to `DistanceProxy`) and two +`Sweep` structures. The sweep structure defines the initial and final transforms of the shapes. You can use fixed rotations to perform a *shape cast*. In this case, the time of impact function will not miss any collisions. ### Dynamic Tree -The DynamicTree class is used by Planck.js to organize large numbers of +The `DynamicTree` class is used by Planck.js to organize large numbers of shapes efficiently. The class does not know about shapes. Instead it operates on axis-aligned bounding boxes (AABBs) with user data pointers. @@ -133,7 +133,7 @@ be skipped. ![Overlap Test](./images/overlap_test.svg) Normally you will not use the dynamic tree directly. Rather you will go -through the World class for ray casts and region queries. If you plan +through the `World` class for ray casts and region queries. If you plan to instantiate your own dynamic tree, you can learn how to use it by looking at how Planck.js uses it. @@ -143,7 +143,7 @@ and broad-phase. In the narrow-phase we compute contact points between pairs of shapes. Imagine we have N shapes. Using brute force, we would need to perform the narrow-phase for N*N/2 pairs. -The BroadPhase class reduces this load by using a dynamic tree for +The `BroadPhase` class reduces this load by using a dynamic tree for pair management. This greatly reduces the number of narrow-phase calls. Normally you do not interact with the broad-phase directly. Instead, diff --git a/docs/pages/core-concepts.md b/docs/pages/core-concepts.md index 6a867633..29d5b6b6 100644 --- a/docs/pages/core-concepts.md +++ b/docs/pages/core-concepts.md @@ -5,10 +5,10 @@ document. #### World A physics world is a collection of bodies, fixtures, and constraints that interact together. -World also manages running simulation. +`World` also manages running simulation. #### Shape -A shape is 2D geometrical object, such as a circle or polygon. +A shape is a 2D geometrical object, such as a circle or polygon. #### Rigid Body A chunk of matter that is so strong that the distance between any two bits of matter on the chunk is constant. @@ -27,7 +27,7 @@ At this point the body can only rotate about the pin, so the constraint has remo #### Contact Constraint A special constraint designed to prevent penetration of rigid bodies and to simulate friction and restitution. -You do not create contact constraints; they are created automatically by when two objects might collide. +You do not create contact constraints; they are created automatically when two objects might collide. #### Joint This is a constraint used to hold two or more bodies together. There are several joint types implemented in the library: revolute, prismatic, distance, and more. diff --git a/docs/pages/fixture.md b/docs/pages/fixture.md index 5a2b1669..c54a2fd2 100644 --- a/docs/pages/fixture.md +++ b/docs/pages/fixture.md @@ -1,6 +1,6 @@ ### Fixture -Shapes are only have geometrical coordination, they don't have physical properties and don't know about body's transformation, so may be used independently of the physics simulation. -Fixture class is used to attach shapes to bodies. A body may have zero or more fixtures. A +Shapes only have geometrical coordinates, they don't have physical properties and don't know about the body's transformation, so may be used independently of the physics simulation. +The `Fixture` class is used to attach shapes to bodies. A body may have zero or more fixtures. A body with multiple fixtures is sometimes called a *compound body.* Fixtures hold the following: @@ -145,8 +145,8 @@ Collision groups let you specify an integral group index. You can have all fixtures with the same group index always collide (positive index) or never collide (negative index). Group indices are usually used for things that are somehow related, like the parts of a bicycle. In the -following example, fixture1 and fixture2 always collide, but fixture3 -and fixture4 never collide. +following example, `fixture1` and `fixture2` always collide, but `fixture3` +and `fixture4` never collide. ```js fixture1Def.filterGroupIndex = 2; @@ -156,7 +156,7 @@ fixture4Def.filterGroupIndex = -8; ``` Collisions between fixtures of different group indices are filtered -according the category and mask bits. In other words, group filtering +according to the category and mask bits. In other words, group filtering has higher precedence than category filtering. Note that additional collision filtering occurs in Planck.js. Here is a diff --git a/docs/pages/hello-world.md b/docs/pages/hello-world.md index 73074e71..e37768d8 100644 --- a/docs/pages/hello-world.md +++ b/docs/pages/hello-world.md @@ -1,12 +1,12 @@ ### Getting Started -In this section we will walk through a simple example to sets up the physics world, and creates a platform and a small box. +In this section we will walk through a simple example to set up the physics world, and create a platform and a small box. #### Creating a World Every Planck.js program begins with the creation of a World object. World is the physics hub that manages objects, their physical interactions, and runs simulation. -To create a world we simply create an object from World class, and optionally pass gravity. +To create a world we simply create an object from the `World` class, and optionally pass gravity. ```js let world = new World({ @@ -21,9 +21,9 @@ Now that we have our physics world set up, let's start adding some stuff to it. We will create a platform using the following steps: 1. Use the world object to create the body with position. -1. Create a fixtures on the body with a shape. +1. Create a fixture on the body with a shape. -For the step 1, we pass body properties to the world object to create the platform body. +For step 1, we pass body properties to the world object to create the platform body. With the body properties we specify the type and initial position of the platform: ```js @@ -36,7 +36,7 @@ let platform = world.createBody({ Bodies are "static" by default. Static bodies don't collide with other static bodies and are immovable. -For the step 2, we need to create a Shape and add it to body as Fixture. +For step 2, we need to create a `Shape` and add it to body as `Fixture`. ```js platform.createFixture({ @@ -45,10 +45,10 @@ platform.createFixture({ ``` Shapes only have geometrical properties (such as vertices or radius), and do not have physical properties. -A fixture is used to add a shape to a body, and adds physical properties (such as density, friction, etc) to a body. +A fixture is used to add a shape to a body, and adds physical properties (such as density, friction, etc.) to a body. A body can have any number of shapes fixed together. -Shape's geometrical coordinates are local to the body. A fixture does not have location and angle. So when a body moves, all fixtures/shapes in the body move with the body. However we don't move a shape around on the body. +`Shape`'s geometrical coordinates are local to the body. A fixture does not have location and angle. So when a body moves, all fixtures/shapes in the body move with the body. However we don't move a shape around on the body. Planck.js is a rigid body engine and many of the assumptions made in Planck.js are based on the rigid body model. A body with morphing shapes is not a rigid body, and if this is violated many things will break. @@ -58,12 +58,12 @@ Every fixture must have a parent body, even fixtures that are static. However, you can attach all static fixtures to a single static body. A static body has zero mass by definition, so we don't need to specify density in this case. -Later we will see how to use a fixture properties to customize its physical behavior. +Later we will see how to use a fixture's properties to customize its physical behavior. #### Creating a dynamic box Creating a dynamic box is similar to the platform. The main difference, besides dimensions, is that for a dynamic body we need to specify mass properties. -First we create the body using createBody. By default bodies are static, so we should set the body's `type` at construction time to make the body dynamic. +First we create the body using `createBody`. By default bodies are static, so we should set the body's `type` at construction time to make the body dynamic. ```js let body = world.createBody({ @@ -99,5 +99,5 @@ So in this case the ground box is 2 units wide (x-axis) and 2 units tall (y-axis Planck.js by default is tuned for meters, kilograms, and seconds. So you can consider the dimensions to be in meters. Planck.js generally works best when objects are the size of typical real world objects. For example, a barrel is about 1 meter tall. Due to the limitations of floating point arithmetic, using Planck.js to model the movement of glaciers or dust particles is not a good idea. -If you use a different units for your objects, you can change value of `Settings.lengthUnitsPerMeter`. +If you use a different units for your objects, you can change the value of `Settings.lengthUnitsPerMeter`. For example if you use pixels and a barrel height is 80 pixels set the `lengthUnitsPerMeter` to 80. diff --git a/docs/pages/index.md b/docs/pages/index.md index 6fb42451..12e63a84 100644 --- a/docs/pages/index.md +++ b/docs/pages/index.md @@ -7,7 +7,7 @@ Planck.js is JavaScript/TypeScript rewrite of the [Box2D](https://box2d.org/) C+ Box2D is a 2D rigid-body physics simulation library for games. You can use it in your games to make objects move in realistic ways and make the game world more interactive. From the game engine's point of view, a physics engine is just a system for procedural animation. -Planck.js documentation is based on Box2D manual with adjustments and addition for JavaScript. Both projects names are used interchangeably in the documentation. +Planck.js documentation is based on the Box2D manual with adjustments and additions for JavaScript. Both projects' names are used interchangeably in the documentation. #### Before You Start diff --git a/docs/pages/joint.md b/docs/pages/joint.md index afb08ba9..22d1a04b 100644 --- a/docs/pages/joint.md +++ b/docs/pages/joint.md @@ -4,7 +4,7 @@ Typical examples in games include ragdolls, teeters, and pulleys. Joints can be combined in many different ways to create interesting motions. Some joints provide limits so you can control the range of motion. Some -joint provide motors which can be used to drive the joint at a +joints provide motors which can be used to drive the joint at a prescribed speed until a prescribed force/torque is exceeded. Joint motors can be used in many ways. You can use motors to control @@ -17,14 +17,14 @@ too strong. ### Joint Definition Each joint type has a definition that derives from JointDef. All -joints are connected between two different bodies. One body may static. +joints are connected between two different bodies. One body may be static. Joints between static and/or kinematic bodies are allowed, but have no effect and use some processing time. You can specify user data for any joint type and you can provide a flag to prevent the attached bodies from colliding with each other. This is -actually the default behavior and you must set the collideConnected -to `true` to allow collision between to connected bodies. +actually the default behavior and you must set `collideConnected` +to `true` to allow collision between two connected bodies. Many joint definitions require that you provide some geometric data. Often a joint will be defined by anchor points. These are points fixed @@ -35,8 +35,8 @@ occurrence when a game is saved and reloaded. Additionally, some joint definitions need to know the default relative angle between the bodies. This is necessary to constrain rotation correctly. -[Initializing the geometric data can be tedious, so many joints have -constructor that use the current body transforms to remove +Initializing the geometric data can be tedious, so many joints have a +constructor that uses the current body transforms to remove much of the work. However, these initialization functions should usually only be used for prototyping. Production code should define the geometry directly. This will make joint behavior more robust. @@ -66,7 +66,7 @@ myWorld.destroyJoint(joint); joint = null; ``` -It is always good to nullify your variable after they are destroyed. This +It is always good to nullify your variables after they are destroyed. This will make the program crash in a controlled manner if you try to reuse the variable. diff --git a/docs/pages/joint/distance-joint.md b/docs/pages/joint/distance-joint.md index 9cec5250..c6ba5c9b 100644 --- a/docs/pages/joint/distance-joint.md +++ b/docs/pages/joint/distance-joint.md @@ -1,6 +1,6 @@ ### Distance Joint -One of the simplest joint is a distance joint which says that the +One of the simplest joints is a distance joint which says that the distance between two points on two bodies must be constant. When you specify a distance joint the two bodies should already be in place. Then you specify the two anchor points in world coordinates. The first anchor diff --git a/docs/pages/joint/prismatic-joint.md b/docs/pages/joint/prismatic-joint.md index c6a1b262..7dbdfb5d 100644 --- a/docs/pages/joint/prismatic-joint.md +++ b/docs/pages/joint/prismatic-joint.md @@ -40,40 +40,3 @@ prismaticJoint.getMotorForce(); // number prismaticJoint.setMotorSpeed(speed /*number*/); prismaticJoint.setMotorForce(force /*number*/); ``` - - - -### Mouse Joint -The mouse joint is used in the testbed to manipulate bodies with the -mouse. It attempts to drive a point on a body towards the current -position of the cursor. There is no restriction on rotation. - -The mouse joint definition has a target point, maximum force, frequency, -and damping ratio. The target point initially coincides with the body's -anchor point. The maximum force is used to prevent violent reactions -when multiple dynamic bodies interact. You can make this as large as you -like. The frequency and damping ratio are used to create a spring/damper -effect similar to the distance joint. - -Many users have tried to adapt the mouse joint for game play. Users -often want to achieve precise positioning and instantaneous response. -The mouse joint doesn't work very well in that context. You may wish to -consider using kinematic bodies instead. - - - - - - -### Friction Joint -The friction joint is used for top-down friction. The joint provides 2D -translational friction and angular friction. See FrictionJoint.js and -ApplyForce.js for details. - -### Motor Joint -A motor joint lets you control the motion of a body by specifying target -position and rotation offsets. You can set the maximum motor force and -torque that will be applied to reach the target position and rotation. -If the body is blocked, it will stop and the contact forces will be -proportional the maximum motor force and torque. See MotorJoint and -MotorJoint.h for details. diff --git a/docs/pages/joint/pulley.md b/docs/pages/joint/pulley.md index 80c14392..8c0d4a6d 100644 --- a/docs/pages/joint/pulley.md +++ b/docs/pages/joint/pulley.md @@ -18,9 +18,9 @@ this to create mechanical leverage. length1 + ratio * length2 == constant ``` -For example, if the ratio is 2, then length1 will vary at twice the rate -of length2. Also the force in the rope attached to body1 will have half -the constraint force as the rope attached to body2. +For example, if the ratio is 2, then `length1` will vary at twice the rate +of `length2`. Also the force in the rope attached to `body1` will have half +the constraint force as the rope attached to `body2`. ![Pulley Joint](../images/pulley_joint.gif) diff --git a/docs/pages/shape.md b/docs/pages/shape.md index fc5cb546..ea846476 100644 --- a/docs/pages/shape.md +++ b/docs/pages/shape.md @@ -17,8 +17,8 @@ Keep in mind that a shape does not know about bodies and stand apart from the dynamics system. In Planck.js shapes are considered immutable. When a shape is attached to a body using a fixture, the shapes move rigidly with the host body. In summary: -- When a shape is **not** attached to a body, you can view it's vertices as being expressed in world-space. -- When a shape is attached to a body, you can view it's vertices as being expressed in local coordinates. +- When a shape is **not** attached to a body, you can view its vertices as being expressed in world-space. +- When a shape is attached to a body, you can view its vertices as being expressed in local coordinates. #### Geometric Queries You can perform a couple geometric queries on a single shape. @@ -28,7 +28,7 @@ You can test a point for overlap with a shape. You provide a transform for the shape and a world point. ```js -let transform = Transfrom.identity(); +let transform = Transform.identity(); let point = Vec2(5, 2); let hit = shape.testPoint(transform, point); @@ -47,7 +47,7 @@ only check a single edge at a time. > ```js -let transform = Transfrom.identity(); +let transform = Transform.identity(); let input = {}; // RayCastInput input.p1 = Vec2(0, 0); @@ -81,4 +81,4 @@ Transform xfA = ..., xfB = ...; bool overlap = TestOverlap(shapeA, indexA, shapeB, indexB, xfA, xfB); ``` -Again you must provide child indices to for the case of chain shapes. +Again you must provide child indices for the case of chain shapes. diff --git a/docs/pages/shape/chain.md b/docs/pages/shape/chain.md index 786982d1..ae191d2c 100644 --- a/docs/pages/shape/chain.md +++ b/docs/pages/shape/chain.md @@ -7,7 +7,7 @@ eliminate ghost collisions and provide two-sided collision. ![Chain Shape](../images/chain_shape.svg) ```js -// This a chain shape with isolated vertices +// This is a chain shape with isolated vertices let vs = [ Vec2(1.7, 0), Vec2(1, 0.25), diff --git a/docs/pages/shape/edge.md b/docs/pages/shape/edge.md index f10b766c..5752392d 100644 --- a/docs/pages/shape/edge.md +++ b/docs/pages/shape/edge.md @@ -7,7 +7,7 @@ one of two colliding shapes have volume. Edge shapes have no volume, so edge-edge collision is not possible. ```js -// This an edge shape. +// This is an edge shape. let edge = new Edge(new Vec2(0, 0), new Vec2(1, 0)); ``` diff --git a/docs/pages/shape/polygon.md b/docs/pages/shape/polygon.md index 7ac86cce..7f53669f 100644 --- a/docs/pages/shape/polygon.md +++ b/docs/pages/shape/polygon.md @@ -6,7 +6,7 @@ have 3 or more vertices. ![Convex and Concave Polygons](../images/convex_concave.gif) -Polygons vertices are stored with a counter clockwise winding (CCW). We +Polygon vertices are stored with a counter-clockwise winding (CCW). We must be careful because the notion of CCW is with respect to a right-handed coordinate system with the z-axis pointing out of the plane. This might turn out to be clockwise on your screen, depending on diff --git a/docs/pages/testbed.md b/docs/pages/testbed.md index fb7283dc..30e4fab3 100644 --- a/docs/pages/testbed.md +++ b/docs/pages/testbed.md @@ -3,4 +3,4 @@ Testbed is a debugging tool that is provided with the library. It is useful to g You can run testbed online at [piqnt.com](https://piqnt.com/planck.js/), run it locally, or install it from NPM or a CDN. -Testbed is not required to use Planck.js physics. You can run and render physics world directly, with any rendering library or framework (see Rendering section for more details). +Testbed is not required to use Planck.js physics. You can run and render physics world directly, with any rendering library or framework (see the Rendering section for more details). diff --git a/docs/pages/testbed/api.md b/docs/pages/testbed/api.md index 93e83639..5d8e6d44 100644 --- a/docs/pages/testbed/api.md +++ b/docs/pages/testbed/api.md @@ -10,7 +10,7 @@ const world = new World(); const testbed = Testbed.start(world); ``` -If you need to access testbed instance before starting simulation you can mount testbed first, and later start simulation. +If you need to access the testbed instance before starting simulation you can mount the testbed first, and later start simulation. ```js // Mount testbed @@ -61,4 +61,4 @@ testbed.step = function() { testbed.status('score', score); testbed.status('time', time); }; -``` \ No newline at end of file +``` diff --git a/docs/pages/world.md b/docs/pages/world.md index cebcefb7..c5316e4e 100644 --- a/docs/pages/world.md +++ b/docs/pages/world.md @@ -83,5 +83,5 @@ while (node) { } ``` -Obviously to make this work, gameCrazyBodyDestroyer must be honest about +Obviously to make this work, `gameCrazyBodyDestroyer()` must be honest about what it has destroyed. diff --git a/docs/pages/world/aabb-query.md b/docs/pages/world/aabb-query.md index ff5612ff..227626cb 100644 --- a/docs/pages/world/aabb-query.md +++ b/docs/pages/world/aabb-query.md @@ -1,10 +1,10 @@ ### AABB Queries Sometimes you want to determine all the shapes in a region. The World -class has a fast log(N) method for this using the broad-phase data +class has a fast O(log N) method for this using the broad-phase data structure. You provide an AABB in world coordinates and an -implementation of QueryCallback. The world calls your class with each -fixture whose AABB overlaps the query AABB. Return true to continue the -query, otherwise return false. For example, the following code finds all +implementation of `QueryCallback`. The world calls your class with each +fixture whose AABB overlaps the query AABB. Return `true` to continue the +query, otherwise return `false`. For example, the following code finds all the fixtures that potentially intersect a specified AABB and wakes up all of the associated bodies. diff --git a/docs/pages/world/ray-cast.md b/docs/pages/world/ray-cast.md index 437401da..f64652cd 100644 --- a/docs/pages/world/ray-cast.md +++ b/docs/pages/world/ray-cast.md @@ -42,4 +42,4 @@ myWorld.rayCast(Vec2(-1, 0), Vec2(3, 1), function(fixture, point, normal, fracti > **Caution**: > Due to round-off errors, ray casts can sneak through small cracks > between polygons in your static environment. If this is not acceptable -> in your application, trying slightly overlapping your polygons. +> in your application, try slightly overlapping your polygons. From 2a32abc48a084113fa32604a0dc260b6fd706b22 Mon Sep 17 00:00:00 2001 From: James Stanley Date: Tue, 30 Apr 2024 19:31:12 +0100 Subject: [PATCH 8/8] Use closure for renderer loop function --- docs/pages/rendering.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/pages/rendering.md b/docs/pages/rendering.md index 71aca71d..e190bf33 100644 --- a/docs/pages/rendering.md +++ b/docs/pages/rendering.md @@ -38,7 +38,7 @@ class Renderer { } // Game loop - loop(timeStamp) { + loop = (timeStamp) => { if (!this.started) { return; } @@ -65,7 +65,7 @@ class Renderer { } // Request a new frame - window.requestAnimationFrame(this.loop.bind(this)); + window.requestAnimationFrame(this.loop); } renderBody(body) {