create-playcanvas 0.10.0 → 0.10.1

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "create-playcanvas",
-    "version": "0.10.0",
+    "version": "0.10.1",
     "description": "Scaffold a PlayCanvas project",
     "keywords": [
         "playcanvas",

package/templates/_shared/third-person-controller/src/controller.ts

@@ -1,7 +1,10 @@
 import type { Entity, RigidBodyComponentSystem } from 'playcanvas';
-import { Script } from 'playcanvas';
+import { Script, Vec3 } from 'playcanvas';
 import { ThirdPersonController } from 'playcanvas/scripts/esm/third-person-controller.mjs';
 
+/** Ground probes under the player's box collider (half width 0.4): centre, edges and corners */
+const FEET = [-0.38, 0, 0.38].flatMap((x) => [-0.38, 0, 0.38].map((z) => [x, z]));
+
 class RobotAnimation extends Script {
     static scriptName = 'robotAnimation';
 
@@ -28,9 +31,10 @@ class RobotAnimation extends Script {
 }
 
 export const addThirdPersonController = (player: Entity, camera: Entity, model: Entity) => {
-    (player.rigidbody!.system as RigidBodyComponentSystem).gravity.set(0, -18, 0);
+    const sys = player.rigidbody!.system as RigidBodyComponentSystem;
+    sys.gravity.set(0, -18, 0);
     if (!player.script) player.addComponent('script');
-    player.script!.create(ThirdPersonController, {
+    const controller = player.script!.create(ThirdPersonController, {
         properties: {
             camera,
             characterModel: model,
@@ -41,6 +45,24 @@ export const addThirdPersonController = (player: Entity, camera: Entity, model:
             jumpForce: 520,
             speedGround: 60
         }
+    })!;
+
+    // The stock ground check is one ray from the centre, so a player standing on a ledge reads as
+    // airborne and can't jump. Count it grounded when any probe under the collider finds a solid
+    // surface; triggers (colliders without a rigid body) only stop the camera
+    const [from, to] = [new Vec3(), new Vec3()];
+    const solid = { filterCallback: (e: Entity) => !!e.rigidbody };
+    let grounded = false;
+    Object.defineProperty(controller, '_grounded', {
+        get: () => grounded,
+        set: () => {
+            const p = player.getPosition();
+            grounded = FEET.some(([x, z]) => {
+                from.set(p.x + x, p.y, p.z + z);
+                to.set(from.x, p.y - 1.1, from.z);
+                return !!sys.raycastFirst(from, to, solid);
+            });
+        }
     });
 
     if (!model.script) model.addComponent('script');

package/templates/engine/base/package.json

@@ -15,7 +15,7 @@
         "typecheck": "tsc --noEmit"
     },
     "dependencies": {
-        "playcanvas": "^2.23.0"
+        "playcanvas": "^2.23.1"
     },
     "devDependencies": {
         "@playcanvas/eslint-config": "3.0.0-beta.8",
@@ -23,7 +23,7 @@
         "eslint": "^9.39.5",
         "prettier": "^3.9.9",
         "typescript": "~6.0.3",
-        "vite": "^8.3.2"
+        "vite": "^8.3.4"
     },
     "engines": {
         "node": ">=22.23.2"

package/templates/engine/third-person-controller/src/main.ts

@@ -134,6 +134,9 @@ for (const [i, [x, z, size]] of TREES.entries()) {
         crown.setPosition(x, size * y, z);
         crown.setLocalScale(size * width, size * height, size * width);
         crown.addComponent('render', { type: 'cone', material: j === 1 ? tips : leaves });
+
+        // A trigger: it stops the camera's line of sight but the player walks through it
+        crown.addComponent('collision', { type: 'cone', radius: (size * width) / 2, height: size * height });
         app.root.addChild(crown);
     }
 }
@@ -142,11 +145,13 @@ prop('stump', [-1.8, 0.4, -2.2], [0.9, 0.8, 0.9], wood);
 
 const player = new Entity('player');
 player.setPosition(0, 1.1, 0);
+
+// A box rather than a capsule, so the player stands on ledges instead of sliding off them. Its
+// bottom sits 1 m below the body, inside the controller's 1.1 m ground probes
 player.addComponent('collision', {
-    type: 'capsule',
-    radius: 0.5,
-    height: 2.4,
-    linearOffset: new Vec3(0, 0.1, 0)
+    type: 'box',
+    halfExtents: new Vec3(0.4, 1.2, 0.4),
+    linearOffset: new Vec3(0, 0.2, 0)
 });
 player.addComponent('rigidbody', { type: 'dynamic', mass: 70, angularFactor: Vec3.ZERO });
 app.root.addChild(player);
@@ -162,7 +167,7 @@ pants.diffuse = new Color(0.18, 0.29, 0.52);
 pants.update();
 
 const model = new Entity('character');
-model.setLocalPosition(0, 0.2, 0);
+model.setLocalPosition(0, 0.3, 0);
 const part = (
     parent: Entity,
     name: string,

package/templates/react/base/package.json

@@ -16,7 +16,7 @@
     },
     "dependencies": {
         "@playcanvas/react": "^0.11.7",
-        "playcanvas": "^2.23.0",
+        "playcanvas": "^2.23.1",
         "react": "^19.3.0",
         "react-dom": "^19.3.0"
     },
@@ -25,11 +25,11 @@
         "@playcanvas/inspector": "^0.2.0",
         "@types/react": "^19.3.0",
         "@types/react-dom": "^19.3.0",
-        "@vitejs/plugin-react": "^6.1.1",
+        "@vitejs/plugin-react": "^6.1.2",
         "eslint": "^9.39.5",
         "prettier": "^3.9.9",
         "typescript": "~6.0.3",
-        "vite": "^8.3.2"
+        "vite": "^8.3.4"
     },
     "engines": {
         "node": ">=22.23.2"

package/templates/react/third-person-controller/src/App.tsx

@@ -79,6 +79,8 @@ function Pine({
                     scale={[size * width, size * height, size * width]}
                 >
                     <Render type="cone" material={i === 1 ? tips : leaves} />
+                    {/* A trigger: it stops the camera's line of sight but the player walks through it */}
+                    <Collision type="cone" radius={(size * width) / 2} height={size * height} />
                 </Entity>
             ))}
         </>
@@ -139,9 +141,10 @@ function Scene() {
             <Block name="fallen-log" position={[0, 0.35, 6]} scale={[3.8, 0.7, 0.7]} material={wood} />
             <Block name="stump" position={[-1.8, 0.4, -2.2]} scale={[0.9, 0.8, 0.9]} material={wood} />
             <Entity name="player" ref={player} position={[0, 1.1, 0]}>
-                <Collision type="capsule" radius={0.5} height={2.4} linearOffset={[0, 0.1, 0]} />
+                {/* A box rather than a capsule, so the player stands on ledges instead of sliding off them */}
+                <Collision type="box" halfExtents={[0.4, 1.2, 0.4]} linearOffset={[0, 0.2, 0]} />
                 <RigidBody type="dynamic" mass={70} angularFactor={[0, 0, 0]} />
-                <Entity name="character" ref={model} position={[0, 0.2, 0]}>
+                <Entity name="character" ref={model} position={[0, 0.3, 0]}>
                     <Entity name="body" scale={[0.56, 0.88, 0.38]}>
                         <Render type="box" material={shirt} />
                     </Entity>

package/templates/web-components/base/package.json

@@ -16,7 +16,7 @@
     },
     "dependencies": {
         "@playcanvas/web-components": "^0.28.0",
-        "playcanvas": "^2.23.0"
+        "playcanvas": "^2.23.1"
     },
     "devDependencies": {
         "@playcanvas/eslint-config": "3.0.0-beta.8",
@@ -24,7 +24,7 @@
         "eslint": "^9.39.5",
         "prettier": "^3.9.9",
         "typescript": "~6.0.3",
-        "vite": "^8.3.2"
+        "vite": "^8.3.4"
     },
     "engines": {
         "node": ">=22.23.2"

package/templates/web-components/third-person-controller/index.html

@@ -65,12 +65,15 @@
                 ></pc-entity>
                 <pc-entity name="tree-0-crown-0" position="-7 2.09 -6" scale="2.31 1.98 2.31"
                     ><pc-render type="cone" material="leaves-material"></pc-render
+                    ><pc-collision type="cone" radius="1.155" height="1.98"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-0-crown-1" position="-7 2.915 -6" scale="1.76 1.705 1.76"
                     ><pc-render type="cone" material="tips-material"></pc-render
+                    ><pc-collision type="cone" radius="0.88" height="1.705"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-0-crown-2" position="-7 3.63 -6" scale="1.21 1.54 1.21"
                     ><pc-render type="cone" material="leaves-material"></pc-render
+                    ><pc-collision type="cone" radius="0.605" height="1.54"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-1-trunk" position="6.5 1.125 -6.5" scale="0.475 2.25 0.475"
                     ><pc-render type="box" material="wood-material"></pc-render
@@ -79,12 +82,15 @@
                 ></pc-entity>
                 <pc-entity name="tree-1-crown-0" position="6.5 2.375 -6.5" scale="2.625 2.25 2.625"
                     ><pc-render type="cone" material="leaves-material"></pc-render
+                    ><pc-collision type="cone" radius="1.3125" height="2.25"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-1-crown-1" position="6.5 3.3125 -6.5" scale="2 1.9375 2"
                     ><pc-render type="cone" material="tips-material"></pc-render
+                    ><pc-collision type="cone" radius="1" height="1.9375"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-1-crown-2" position="6.5 4.125 -6.5" scale="1.375 1.75 1.375"
                     ><pc-render type="cone" material="leaves-material"></pc-render
+                    ><pc-collision type="cone" radius="0.6875" height="1.75"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-2-trunk" position="-7.5 0.81 5" scale="0.342 1.62 0.342"
                     ><pc-render type="box" material="wood-material"></pc-render
@@ -93,12 +99,15 @@
                 ></pc-entity>
                 <pc-entity name="tree-2-crown-0" position="-7.5 1.71 5" scale="1.89 1.62 1.89"
                     ><pc-render type="cone" material="leaves-material"></pc-render
+                    ><pc-collision type="cone" radius="0.945" height="1.62"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-2-crown-1" position="-7.5 2.385 5" scale="1.44 1.395 1.44"
                     ><pc-render type="cone" material="tips-material"></pc-render
+                    ><pc-collision type="cone" radius="0.72" height="1.395"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-2-crown-2" position="-7.5 2.97 5" scale="0.99 1.26 0.99"
                     ><pc-render type="cone" material="leaves-material"></pc-render
+                    ><pc-collision type="cone" radius="0.495" height="1.26"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-3-trunk" position="7 1.035 5.5" scale="0.437 2.07 0.437"
                     ><pc-render type="box" material="wood-material"></pc-render
@@ -107,12 +116,15 @@
                 ></pc-entity>
                 <pc-entity name="tree-3-crown-0" position="7 2.185 5.5" scale="2.415 2.07 2.415"
                     ><pc-render type="cone" material="leaves-material"></pc-render
+                    ><pc-collision type="cone" radius="1.2075" height="2.07"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-3-crown-1" position="7 3.0475 5.5" scale="1.84 1.7825 1.84"
                     ><pc-render type="cone" material="tips-material"></pc-render
+                    ><pc-collision type="cone" radius="0.92" height="1.7825"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-3-crown-2" position="7 3.795 5.5" scale="1.265 1.61 1.265"
                     ><pc-render type="cone" material="leaves-material"></pc-render
+                    ><pc-collision type="cone" radius="0.6325" height="1.61"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-4-trunk" position="-2.2 0.765 -8" scale="0.323 1.53 0.323"
                     ><pc-render type="box" material="wood-material"></pc-render
@@ -121,12 +133,15 @@
                 ></pc-entity>
                 <pc-entity name="tree-4-crown-0" position="-2.2 1.615 -8" scale="1.785 1.53 1.785"
                     ><pc-render type="cone" material="leaves-material"></pc-render
+                    ><pc-collision type="cone" radius="0.8925" height="1.53"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-4-crown-1" position="-2.2 2.2525 -8" scale="1.36 1.3175 1.36"
                     ><pc-render type="cone" material="tips-material"></pc-render
+                    ><pc-collision type="cone" radius="0.68" height="1.3175"></pc-collision
                 ></pc-entity>
                 <pc-entity name="tree-4-crown-2" position="-2.2 2.805 -8" scale="0.935 1.19 0.935"
                     ><pc-render type="cone" material="leaves-material"></pc-render
+                    ><pc-collision type="cone" radius="0.4675" height="1.19"></pc-collision
                 ></pc-entity>
                 <pc-entity name="fallen-log" position="0 0.35 6" scale="3.8 0.7 0.7"
                     ><pc-render type="box" material="wood-material"></pc-render
@@ -139,9 +154,9 @@
                     ><pc-rigid-body type="static"></pc-rigid-body
                 ></pc-entity>
                 <pc-entity name="player" position="0 1.1 0">
-                    <pc-collision type="capsule" radius="0.5" height="2.4" linear-offset="0 0.1 0"></pc-collision>
+                    <pc-collision type="box" half-extents="0.4 1.2 0.4" linear-offset="0 0.2 0"></pc-collision>
                     <pc-rigid-body type="dynamic" mass="70" angular-factor="0 0 0"></pc-rigid-body>
-                    <pc-entity name="character" position="0 0.2 0">
+                    <pc-entity name="character" position="0 0.3 0">
                         <pc-entity name="body" scale="0.56 0.88 0.38"
                             ><pc-render type="box" material="shirt-material"></pc-render
                         ></pc-entity>