feat: improve readme about position

README.md

@@ -41,7 +41,7 @@ const system = new System();
 
 Bodies possess various properties:
 
-- **Position**: `pos: Vector`, `x: number`, `y: number`.
+- **Position**: Use `setPosition(x: number, y: number)` for teleport and `move(speed: number)` for moving forward in direction of its angle.
 - **Scale**: Use `setScale(x: number, y: number)` for setting and `scale: Vector` for getting scale
 - **Rotation**: Use `setAngle(radians: number)` for setting and `angle: number` for getting and `deg2rad(degrees: number)` to convert to radians.
 - **Offset**: Use `setOffset(offset: Vector)` for setting and `offset: Vector` for getting offset from the body center.
@@ -79,12 +79,14 @@ Manipulate body attributes and update the collision system:
 ```ts
 // if omitted updateNow is true
 const updateNow = false;
+// this should be time scaled, 1 for example
+const speed = 1;
 
 // teleport
 box.setPosition(x, y, updateNow);
 box.setScale(scaleX, scaleY, updateNow);
 box.setAngle(angle, updateNow);
-box.move(1, updateNow);
+box.move(speed, updateNow);
 box.setOffset({ x, y }, updateNow);
 console.log(box.dirty); // true
 

docs/index.html

@@ -18,7 +18,7 @@
 
 <a id="md:step-2-understand-body-attributes" class="tsd-anchor"></a><h3 class="tsd-anchor-link">Step 2: Understand Body Attributes<a href="#md:step-2-understand-body-attributes" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>Bodies possess various properties:</p>
 <ul>
-<li><strong>Position</strong>: <code>pos: Vector</code>, <code>x: number</code>, <code>y: number</code>.</li>
+<li><strong>Position</strong>: Use <code>setPosition(x: number, y: number)</code> for teleport and <code>move(speed: number)</code> for moving forward in direction of its angle.</li>
 <li><strong>Scale</strong>: Use <code>setScale(x: number, y: number)</code> for setting and <code>scale: Vector</code> for getting scale</li>
 <li><strong>Rotation</strong>: Use <code>setAngle(radians: number)</code> for setting and <code>angle: number</code> for getting and <code>deg2rad(degrees: number)</code> to convert to radians.</li>
 <li><strong>Offset</strong>: Use <code>setOffset(offset: Vector)</code> for setting and <code>offset: Vector</code> for getting offset from the body center.</li>
@@ -32,7 +32,7 @@
 </code><button type="button">Copy</button></pre>
 
 <a id="md:step-4-manipulate-bodies" class="tsd-anchor"></a><h3 class="tsd-anchor-link">Step 4: Manipulate Bodies<a href="#md:step-4-manipulate-bodies" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>Manipulate body attributes and update the collision system:</p>
-<pre><code class="ts"><span class="hl-5">// if omitted updateNow is true</span><br/><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-4">updateNow</span><span class="hl-1"> = </span><span class="hl-3">false</span><span class="hl-1">;</span><br/><br/><span class="hl-5">// teleport</span><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-0">setPosition</span><span class="hl-1">(</span><span class="hl-6">x</span><span class="hl-1">, </span><span class="hl-6">y</span><span class="hl-1">, </span><span class="hl-6">updateNow</span><span class="hl-1">);</span><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-0">setScale</span><span class="hl-1">(</span><span class="hl-6">scaleX</span><span class="hl-1">, </span><span class="hl-6">scaleY</span><span class="hl-1">, </span><span class="hl-6">updateNow</span><span class="hl-1">);</span><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-0">setAngle</span><span class="hl-1">(</span><span class="hl-6">angle</span><span class="hl-1">, </span><span class="hl-6">updateNow</span><span class="hl-1">);</span><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-0">move</span><span class="hl-1">(</span><span class="hl-7">1</span><span class="hl-1">, </span><span class="hl-6">updateNow</span><span class="hl-1">);</span><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-0">setOffset</span><span class="hl-1">({ </span><span class="hl-6">x</span><span class="hl-1">, </span><span class="hl-6">y</span><span class="hl-1"> }, </span><span class="hl-6">updateNow</span><span class="hl-1">);</span><br/><span class="hl-6">console</span><span class="hl-1">.</span><span class="hl-0">log</span><span class="hl-1">(</span><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-6">dirty</span><span class="hl-1">); </span><span class="hl-5">// true</span><br/><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-0">updateBody</span><span class="hl-1">(); </span><span class="hl-5">// Update the body once, when all manipulations are done</span><br/><span class="hl-6">console</span><span class="hl-1">.</span><span class="hl-0">log</span><span class="hl-1">(</span><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-6">dirty</span><span class="hl-1">); </span><span class="hl-5">// false</span><br/><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-6">group</span><span class="hl-1"> = </span><span class="hl-6">group</span><span class="hl-1">; </span><span class="hl-5">// Immediate effect, no body/system update needed</span><br/><span class="hl-6">console</span><span class="hl-1">.</span><span class="hl-0">log</span><span class="hl-1">(</span><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-6">dirty</span><span class="hl-1">); </span><span class="hl-5">// false</span>
+<pre><code class="ts"><span class="hl-5">// if omitted updateNow is true</span><br/><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-4">updateNow</span><span class="hl-1"> = </span><span class="hl-3">false</span><span class="hl-1">;</span><br/><span class="hl-5">// this should be time scaled, 1 for example</span><br/><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-4">speed</span><span class="hl-1"> = </span><span class="hl-7">1</span><span class="hl-1">;</span><br/><br/><span class="hl-5">// teleport</span><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-0">setPosition</span><span class="hl-1">(</span><span class="hl-6">x</span><span class="hl-1">, </span><span class="hl-6">y</span><span class="hl-1">, </span><span class="hl-6">updateNow</span><span class="hl-1">);</span><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-0">setScale</span><span class="hl-1">(</span><span class="hl-6">scaleX</span><span class="hl-1">, </span><span class="hl-6">scaleY</span><span class="hl-1">, </span><span class="hl-6">updateNow</span><span class="hl-1">);</span><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-0">setAngle</span><span class="hl-1">(</span><span class="hl-6">angle</span><span class="hl-1">, </span><span class="hl-6">updateNow</span><span class="hl-1">);</span><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-0">move</span><span class="hl-1">(</span><span class="hl-6">speed</span><span class="hl-1">, </span><span class="hl-6">updateNow</span><span class="hl-1">);</span><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-0">setOffset</span><span class="hl-1">({ </span><span class="hl-6">x</span><span class="hl-1">, </span><span class="hl-6">y</span><span class="hl-1"> }, </span><span class="hl-6">updateNow</span><span class="hl-1">);</span><br/><span class="hl-6">console</span><span class="hl-1">.</span><span class="hl-0">log</span><span class="hl-1">(</span><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-6">dirty</span><span class="hl-1">); </span><span class="hl-5">// true</span><br/><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-0">updateBody</span><span class="hl-1">(); </span><span class="hl-5">// Update the body once, when all manipulations are done</span><br/><span class="hl-6">console</span><span class="hl-1">.</span><span class="hl-0">log</span><span class="hl-1">(</span><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-6">dirty</span><span class="hl-1">); </span><span class="hl-5">// false</span><br/><br/><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-6">group</span><span class="hl-1"> = </span><span class="hl-6">group</span><span class="hl-1">; </span><span class="hl-5">// Immediate effect, no body/system update needed</span><br/><span class="hl-6">console</span><span class="hl-1">.</span><span class="hl-0">log</span><span class="hl-1">(</span><span class="hl-6">box</span><span class="hl-1">.</span><span class="hl-6">dirty</span><span class="hl-1">); </span><span class="hl-5">// false</span>
 </code><button type="button">Copy</button></pre>
 
 <a id="md:step-5-collision-detection-and-resolution" class="tsd-anchor"></a><h3 class="tsd-anchor-link">Step 5: Collision Detection and Resolution<a href="#md:step-5-collision-detection-and-resolution" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>Detect collisions and respond accordingly:</p>

package.json

@@ -1,13 +1,13 @@
 {
   "name": "detect-collisions",
-  "version": "9.9.3",
-  "description": "detecting collisions between bodies: Points, Lines, Boxes, Polygons, Ellipses, Circles. RayCasting. Bodies have offset, rotation, scale, bbox padding, be static (non moving), be trigger bodies (non colliding).",
+  "version": "9.9.4",
+  "description": "Detect collisions between different shapes such as Points, Lines, Boxes, Polygons (including concave), Ellipses, and Circles. Features include RayCasting and support for offsets, rotation, scaling, bounding box padding, with options for static and trigger bodies (non-colliding).",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "scripts": {
     "start": "chef-express dist/demo --debug",
     "test": "jest --silent --verbose --forceExit",
-    "dev": "webpack serve --port 4200",
+    "dev": "webpack serve --port 3000",
     "amend": "npm run precommit;git commit -a --am --no-edit",
     "use-latest-quickselect-macos": "sed -i '' -e \"s_'quickselect'_'./quickselect'_g\" src/external/rbush.js",
     "use-latest-quickselect-linux": "sed -i -r \"s_'quickselect'_'./quickselect'_g\" src/external/rbush.js",