Skip to content

Commit

Permalink
fix: issue #72
Browse files Browse the repository at this point in the history
  • Loading branch information
Jacek Pietal committed Mar 25, 2024
1 parent 1bc7170 commit 27490f1
Show file tree
Hide file tree
Showing 118 changed files with 64,288 additions and 7,549 deletions.
2 changes: 0 additions & 2 deletions .circleci/config.yml
Original file line number Diff line number Diff line change
Expand Up @@ -17,5 +17,3 @@ jobs:
- checkout
- run: yarn
- run: yarn build
- run: yarn test
- run: yarn benchmark
2 changes: 1 addition & 1 deletion .github/workflows/benchmark.yml
Original file line number Diff line number Diff line change
Expand Up @@ -34,4 +34,4 @@ jobs:

- run: |
npm install
npm run benchmark
npm run build
1 change: 1 addition & 0 deletions .prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
yarn.lock
109 changes: 54 additions & 55 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -33,8 +33,8 @@ https://prozi.github.io/detect-collisions/
Detect-Collisions extends functionalities from RBush. To begin, establish a unique collision system.

```ts
const { System } = require("detect-collisions")
const system = new System()
const { System } = require("detect-collisions");
const system = new System();
```

### Step 2: Understand Body Attributes
Expand Down Expand Up @@ -64,14 +64,14 @@ Each body type has specific properties, for example, a `Box` has `width` & `heig
Use `BodyOptions` as the last optional parameter during body creation.

```ts
const { deg2rad } = require("detect-collisions")
const { deg2rad } = require("detect-collisions");
const options = {
angle: deg2rad(90),
isStatic: false,
isTrigger: false,
isCentered: false,
padding: 0,
}
};
```

Create body of various types using:
Expand All @@ -84,34 +84,34 @@ const {
Line,
Point,
Polygon,
} = require("detect-collisions")
} = require("detect-collisions");

// create with options, without insert
const box = new Box(position, width, height, options)
const circle = new Circle(position, radius, options)
const ellipse = new Ellipse(position, radiusX, radiusY, step, options)
const line = new Line(start, end, options)
const point = new Point(position, options)
const polygon = new Polygon(position, points, options)
const box = new Box(position, width, height, options);
const circle = new Circle(position, radius, options);
const ellipse = new Ellipse(position, radiusX, radiusY, step, options);
const line = new Line(start, end, options);
const point = new Point(position, options);
const polygon = new Polygon(position, points, options);
```

Insert a body into the system:

```ts
// insert any of the above
system.insert(body)
system.insert(body);
```

Create and insert body in one step:

```ts
// create with options, and insert
const box = system.createBox(position, width, height, options)
const circle = system.createCircle(position, radius, options)
const ellipse = system.createEllipse(position, radiusX, radiusY, step, options)
const line = system.createLine(start, end, options)
const point = system.createPoint(position, options)
const polygon = system.createPolygon(position, points, options)
const box = system.createBox(position, width, height, options);
const circle = system.createCircle(position, radius, options);
const ellipse = system.createEllipse(position, radiusX, radiusY, step, options);
const line = system.createLine(start, end, options);
const point = system.createPoint(position, options);
const polygon = system.createPolygon(position, points, options);
```

### Step 4: Manipulate Bodies
Expand Down Expand Up @@ -155,10 +155,10 @@ Check collisions for all bodies or a single body:

```ts
// check if any body collides, end after first collision and return true
const collided = system.checkAll()
const collided = system.checkAll();

// check if 1 body collides, end after first collision and return true
const collided = system.checkOne(body)
const collided = system.checkOne(body);
```

For a direct collision check without broad-phase search, use `system.checkCollision(body1, body2)`. However, this isn't recommended due to efficiency loss.
Expand All @@ -175,27 +175,27 @@ Here's a simple example:
system.checkAll(({ a: body, b: collider }: Response) => {
if (body.isPlayer && collider.isWall) {
// Player can't move through walls
system.separateBody(body)
system.separateBody(body);
} else if (body.isBullet && collider.isEnemy) {
// Bullet hits enemy
system.remove(body) // Remove bullet
collider.takeDamage() // Damage enemy
system.remove(body); // Remove bullet
collider.takeDamage(); // Damage enemy
}
})
});
```

### Step 7: Body Separation

There is an easy way to handle overlap and separation of bodies during collisions. Use system.separate() after updating the system. This function takes into account `isTrigger` and `isStatic` flags on bodies.

```ts
system.separate()
system.separate();
```

This function provides a simple way to handle collisions of whole system, without needing to manually calculate and negate overlap.

```ts
system.separateBody(body)
system.separateBody(body);
```

This function provides a simple way to handle collisions of one body, without needing to manually calculate and negate overlap.
Expand All @@ -205,7 +205,7 @@ This function provides a simple way to handle collisions of one body, without ne
When you're done with a body, you should remove it from the system to free up memory and keep the collision checks efficient. You can do this with the remove method:

```ts
system.remove(body)
system.remove(body);
```

This will remove the body from the system's internal data structures, preventing it from being included in future collision checks. If you keep a reference to the body, you can insert it again later with `system.insert(body)`.
Expand All @@ -220,15 +220,15 @@ And that's it! You're now ready to use the Detect-Collisions library in your pro
// create self-destructing collider
const testCollision = ({ x, y }, radius = 10) => {
// create and add to tree
const circle = system.createCircle({ x, y }, radius)
const circle = system.createCircle({ x, y }, radius);
// init as false
const collided = system.checkOne(circle)
const collided = system.checkOne(circle);

// remove from tree
system.remove(circle)
system.remove(circle);

return collided ? system.response : null
}
return collided ? system.response : null;
};
```

## Handling Concave Polygons
Expand All @@ -240,52 +240,52 @@ As of version 6.8.0, Detect-Collisions fully supports non-convex or hollow polyg
To facilitate debugging, Detect-Collisions allows you to visually represent the collision bodies. By invoking the `draw()` method and supplying a 2D context of a `<canvas>` element, you can draw all the bodies within a collision system.

```ts
const canvas = document.createElement("canvas")
const context = canvas.getContext("2d")
const canvas = document.createElement("canvas");
const context = canvas.getContext("2d");

context.strokeStyle = "#FFFFFF"
context.beginPath()
system.draw(context)
context.stroke()
context.strokeStyle = "#FFFFFF";
context.beginPath();
system.draw(context);
context.stroke();
```

You can also opt to draw individual bodies.

```ts
context.strokeStyle = "#FFFFFF"
context.beginPath()
context.strokeStyle = "#FFFFFF";
context.beginPath();
// draw specific body
body.draw(context)
body.draw(context);
// draw whole system
system.draw(context)
context.stroke()
system.draw(context);
context.stroke();
```

To assess the [Bounding Volume Hierarchy](https://en.wikipedia.org/wiki/Bounding_volume_hierarchy), you can draw the BVH.

```ts
context.strokeStyle = "#FFFFFF"
context.beginPath()
context.strokeStyle = "#FFFFFF";
context.beginPath();
// draw specific body bounding box
body.drawBVH(context)
body.drawBVH(context);
// draw bounding volume hierarchy of the system
system.drawBVH(context)
context.stroke()
system.drawBVH(context);
context.stroke();
```

## Raycasting

Detect-Collisions provides the functionality to gather raycast data. Here's how:

```ts
const start = { x: 0, y: 0 }
const end = { x: 0, y: -10 }
const hit = system.raycast(start, end)
const start = { x: 0, y: 0 };
const end = { x: 0, y: -10 };
const hit = system.raycast(start, end);

if (hit) {
const { point, body } = hit
const { point, body } = hit;

console.log({ point, body })
console.log({ point, body });
}
```

Expand All @@ -310,8 +310,7 @@ While physics engines like [Matter-js](https://github.com/liabru/matter-js) or [
```bash
$ git clone https://github.com/Prozi/detect-collisions.git
$ cd detect-collisions
$ yarn
$ yarn benchmark
$ npm i && npm run build
```

- will show you the results of insertion test, and
Expand Down
12 changes: 6 additions & 6 deletions dist/benchmarks/insertion.bench.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,24 +22,24 @@ const insertionBenchmark = () => {
nonoverlappingTriangles.push(new polygon_1.Polygon(new model_1.SATVector(ndx * 2, 0), [
new model_1.SATVector(0, 0),
new model_1.SATVector(0, 1),
new model_1.SATVector(1, 0),
new model_1.SATVector(1, 0)
]));
overlappingTriangles.push(new polygon_1.Polygon(new model_1.SATVector(0, 0), [
new model_1.SATVector(0, 0),
new model_1.SATVector(0, 1),
new model_1.SATVector(1, 0),
new model_1.SATVector(1, 0)
]));
nonoverlappingRectangles.push(new polygon_1.Polygon(new model_1.SATVector(0, 0), [
new model_1.SATVector(0, 0),
new model_1.SATVector(0, 1),
new model_1.SATVector(1, 1),
new model_1.SATVector(1, 0),
new model_1.SATVector(1, 0)
]));
overlappingRectangles.push(new polygon_1.Polygon(new model_1.SATVector(0, 0), [
new model_1.SATVector(0, 0),
new model_1.SATVector(0, 1),
new model_1.SATVector(1, 1),
new model_1.SATVector(1, 0),
new model_1.SATVector(1, 0)
]));
}
benchmark
Expand Down Expand Up @@ -90,11 +90,11 @@ const insertionBenchmark = () => {
"Standard Deviation (s)": parseFloat(((_b = result === null || result === void 0 ? void 0 : result.sd) !== null && _b !== void 0 ? _b : 0).toFixed(3)),
hz: parseFloat(((_c = result === null || result === void 0 ? void 0 : result.hz) !== null && _c !== void 0 ? _c : 0).toFixed(3)),
"p99 (s)": parseFloat(((_d = result === null || result === void 0 ? void 0 : result.p99) !== null && _d !== void 0 ? _d : 0).toFixed(3)),
"p995 (s)": parseFloat(((_e = result === null || result === void 0 ? void 0 : result.p995) !== null && _e !== void 0 ? _e : 0).toFixed(3)),
"p995 (s)": parseFloat(((_e = result === null || result === void 0 ? void 0 : result.p995) !== null && _e !== void 0 ? _e : 0).toFixed(3))
});
}));
})
.catch((err) => {
.catch(err => {
console.warn(err.message || err);
});
};
Expand Down
2 changes: 1 addition & 1 deletion dist/benchmarks/stress.bench.js
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ const stressBenchmark = () => __awaiter(void 0, void 0, void 0, function* () {
},
teardown: () => {
stressTest.physics.clear();
},
}
});
const recursiveAddTest = (items) => {
benchmark.add(`stress test, items=${items}`, () => {
Expand Down
2 changes: 1 addition & 1 deletion dist/bodies/box.d.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { BodyOptions, PotentialVector, BodyType } from "../model";
import { BodyOptions, BodyType, PotentialVector } from "../model";
import { Polygon } from "./polygon";
/**
* collider - box
Expand Down
2 changes: 1 addition & 1 deletion dist/bodies/circle.d.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { BBox } from "rbush";
import { Circle as SATCircle } from "sat";
import { BodyOptions, BodyProps, PotentialVector, SATVector, BodyType, Vector } from "../model";
import { BaseSystem } from "../base-system";
import { BodyOptions, BodyProps, BodyType, PotentialVector, SATVector, Vector } from "../model";
/**
* collider - circle
*/
Expand Down
2 changes: 1 addition & 1 deletion dist/bodies/circle.js
Original file line number Diff line number Diff line change
Expand Up @@ -136,7 +136,7 @@ class Circle extends sat_1.Circle {
minX: x - this.r,
maxX: x + this.r,
minY: y - this.r,
maxY: y + this.r,
maxY: y + this.r
};
}
/**
Expand Down
6 changes: 3 additions & 3 deletions dist/bodies/line.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ class Line extends polygon_1.Polygon {
constructor(start, end, options) {
super(start, [
{ x: 0, y: 0 },
{ x: end.x - start.x, y: end.y - start.y },
{ x: end.x - start.x, y: end.y - start.y }
], options);
/**
* line type
Expand All @@ -32,7 +32,7 @@ class Line extends polygon_1.Polygon {
get start() {
return {
x: this.x + this.calcPoints[0].x,
y: this.y + this.calcPoints[0].y,
y: this.y + this.calcPoints[0].y
};
}
set start({ x, y }) {
Expand All @@ -42,7 +42,7 @@ class Line extends polygon_1.Polygon {
get end() {
return {
x: this.x + this.calcPoints[1].x,
y: this.y + this.calcPoints[1].y,
y: this.y + this.calcPoints[1].y
};
}
set end({ x, y }) {
Expand Down
2 changes: 1 addition & 1 deletion dist/bodies/point.d.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { BodyOptions, PotentialVector, BodyType } from "../model";
import { BodyOptions, BodyType, PotentialVector } from "../model";
import { Box } from "./box";
/**
* collider - point (very tiny box)
Expand Down
4 changes: 2 additions & 2 deletions dist/bodies/polygon.d.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { isSimple } from "poly-decomp";
import { isSimple } from "poly-decomp-es";
import { BBox } from "rbush";
import { Polygon as SATPolygon } from "sat";
import { BodyOptions, BodyProps, DecompPolygon, PotentialVector, SATVector, BodyType, Vector } from "../model";
import { BodyOptions, BodyProps, BodyType, DecompPolygon, PotentialVector, SATVector, Vector } from "../model";
import { System } from "../system";
export { isSimple };
/**
Expand Down
Loading

0 comments on commit 27490f1

Please sign in to comment.