create-playcanvas 0.6.1 → 0.6.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/skills/assemble-scene/references/web-components.md +2 -2
- package/skills/build-app/references/web-components.md +4 -4
- package/skills/find-examples/references/web-components.md +1 -1
- package/skills/reuse-scripts/references/web-components.md +3 -3
- package/templates/web-components/base/README.md +3 -3
- package/templates/web-components/base/package.json +1 -1
- package/templates/web-components/first-person-controller/index.html +26 -26
- package/templates/web-components/first-person-controller/src/main.ts +1 -1
- package/templates/web-components/interactive-sphere/src/main.ts +1 -1
- package/templates/web-components/model-viewer/src/main.ts +1 -1
- package/templates/web-components/physics-playground/index.html +3 -3
- package/templates/web-components/physics-playground/src/main.ts +1 -1
- package/templates/web-components/product-configurator/src/main.ts +3 -1
- package/templates/web-components/spinning-cube/src/main.ts +1 -1
- package/templates/web-components/splat-viewer/src/main.ts +1 -1
- package/templates/web-components/third-person-controller/index.html +15 -15
- package/templates/web-components/third-person-controller/src/main.ts +1 -1
package/package.json
CHANGED
|
@@ -4,7 +4,7 @@ Represent the whole gameplay object below one semantic root:
|
|
|
4
4
|
|
|
5
5
|
```html
|
|
6
6
|
<pc-entity name="Enemy_1" position="4 0 -3" rotation="0 90 0">
|
|
7
|
-
<pc-
|
|
7
|
+
<pc-rigid-body type="dynamic" mass="1"></pc-rigid-body>
|
|
8
8
|
<pc-collision type="capsule"></pc-collision>
|
|
9
9
|
<pc-entity position="0 0.8 0" rotation="0 180 0" scale="0.01 0.01 0.01">
|
|
10
10
|
<pc-model asset="enemy"></pc-model>
|
|
@@ -14,6 +14,6 @@ Represent the whole gameplay object below one semantic root:
|
|
|
14
14
|
|
|
15
15
|
Keep component tags as direct children of the owning `<pc-entity>`. Register the model with a
|
|
16
16
|
direct-child `<pc-asset>` under `<pc-app>`. Before using rigid bodies, load Ammo with a direct-child
|
|
17
|
-
`<pc-
|
|
17
|
+
`<pc-wasm name="Ammo">` carrying its `glue`, `wasm`, and `fallback` attributes; `<pc-app>` awaits
|
|
18
18
|
its direct-child modules before creating the graphics device, so every body in the document depends
|
|
19
19
|
on that one element. Add and remove the semantic root as one DOM subtree.
|
|
@@ -35,10 +35,10 @@ Build supported application structure declaratively:
|
|
|
35
35
|
- Treat a present boolean attribute as true unless its value is `false`; remove it to restore the
|
|
36
36
|
Engine default.
|
|
37
37
|
|
|
38
|
-
Load Engine `Script` modules with `<pc-asset>`, then attach them through `<pc-
|
|
39
|
-
`<pc-script>`. Match the element's `name` to the class's static `scriptName`.
|
|
40
|
-
attributes map to camelCase properties; use the `attributes` JSON attribute for
|
|
41
|
-
values.
|
|
38
|
+
Load Engine `Script` modules with `<pc-asset>`, then attach them through `<pc-script>` and
|
|
39
|
+
`<pc-script-instance>`. Match the instance element's `name` to the class's static `scriptName`.
|
|
40
|
+
Extra kebab-case attributes map to camelCase properties; use the `attributes` JSON attribute for
|
|
41
|
+
nested or reserved values.
|
|
42
42
|
|
|
43
43
|
Use `whenReady` for occasional page-level Engine access:
|
|
44
44
|
|
|
@@ -9,7 +9,7 @@ update logic. Drop its graphics device and application bootstrap because `<pc-ap
|
|
|
9
9
|
- Express supported entities and components with `pc-*` elements.
|
|
10
10
|
- Register assets as direct children of `<pc-app>` with `<pc-asset>`.
|
|
11
11
|
- Put per-entity behavior in an Engine `Script` loaded through `<pc-asset>` and attached with
|
|
12
|
-
`<pc-
|
|
12
|
+
`<pc-script>` and `<pc-script-instance>`.
|
|
13
13
|
- Use `whenReady` for page-level glue or Engine APIs with no declarative element.
|
|
14
14
|
- Fetch example assets from the same Engine tag as the source example.
|
|
15
15
|
|
|
@@ -8,9 +8,9 @@ Expose an Engine script as an ES module and register it as an asset:
|
|
|
8
8
|
<pc-scene>
|
|
9
9
|
<pc-entity name="Camera">
|
|
10
10
|
<pc-camera></pc-camera>
|
|
11
|
-
<pc-
|
|
12
|
-
<pc-script name="cameraControls" move-speed="4"></pc-script>
|
|
13
|
-
</pc-
|
|
11
|
+
<pc-script>
|
|
12
|
+
<pc-script-instance name="cameraControls" move-speed="4"></pc-script-instance>
|
|
13
|
+
</pc-script>
|
|
14
14
|
</pc-entity>
|
|
15
15
|
</pc-scene>
|
|
16
16
|
</pc-app>
|
|
@@ -39,9 +39,9 @@ so `document.querySelector` reaches them and `setAttribute` changes them.
|
|
|
39
39
|
|
|
40
40
|
`src/main.ts` covers the two things HTML alone cannot do:
|
|
41
41
|
|
|
42
|
-
- **Attaching engine scripts.** `<pc-script name="...">` resolves scripts that `<pc-asset>`
|
|
43
|
-
runtime. Scripts imported through the bundler — like `CameraControls` and `Grid` here — are
|
|
44
|
-
through the entity instead, reached via `whenReady()` and the element's `.entity` property.
|
|
42
|
+
- **Attaching engine scripts.** `<pc-script-instance name="...">` resolves scripts that `<pc-asset>`
|
|
43
|
+
fetched at runtime. Scripts imported through the bundler — like `CameraControls` and `Grid` here — are
|
|
44
|
+
attached through the entity instead, reached via `whenReady()` and the element's `.entity` property.
|
|
45
45
|
- **Responding to pointer input.** `<pc-app>` picks whatever is under the pointer and dispatches an
|
|
46
46
|
ordinary `PointerEvent` on the `<pc-entity>` it hit, so `addEventListener('pointerup', ...)` works on a
|
|
47
47
|
3D entity exactly as it would on a `<button>`. Events are only generated for entities that have a
|
|
@@ -14,12 +14,12 @@
|
|
|
14
14
|
<pc-material id="green-material" diffuse="#2e6638" emissive="#09140b" gloss="0.2"></pc-material>
|
|
15
15
|
<pc-material id="wood-material" diffuse="#7a451a" emissive="#180e05" gloss="0.2"></pc-material>
|
|
16
16
|
<pc-material id="metal-material" diffuse="#475461" emissive="#0e1113" gloss="0.5"></pc-material>
|
|
17
|
-
<pc-
|
|
17
|
+
<pc-wasm
|
|
18
18
|
name="Ammo"
|
|
19
19
|
glue="/ammo/ammo.wasm.js"
|
|
20
20
|
wasm="/ammo/ammo.wasm.wasm"
|
|
21
21
|
fallback="/ammo/ammo.js"
|
|
22
|
-
></pc-
|
|
22
|
+
></pc-wasm>
|
|
23
23
|
<pc-scene>
|
|
24
24
|
<pc-entity name="light" rotation="50 30 0"
|
|
25
25
|
><pc-light
|
|
@@ -36,121 +36,121 @@
|
|
|
36
36
|
<pc-entity name="floor" position="0 -0.1 0" scale="18 0.2 18"
|
|
37
37
|
><pc-render type="box" material="floor-material"></pc-render
|
|
38
38
|
><pc-collision type="box" half-extents="9 0.1 9"></pc-collision
|
|
39
|
-
><pc-
|
|
39
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
40
40
|
></pc-entity>
|
|
41
41
|
<pc-entity name="back-wall" position="0 1.5 -9" scale="18 3 0.3"
|
|
42
42
|
><pc-render type="box" material="wall-material"></pc-render
|
|
43
43
|
><pc-collision type="box" half-extents="9 1.5 0.15"></pc-collision
|
|
44
|
-
><pc-
|
|
44
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
45
45
|
></pc-entity>
|
|
46
46
|
<pc-entity name="front-wall" position="0 1.5 9" scale="18 3 0.3"
|
|
47
47
|
><pc-render type="box" material="wall-material"></pc-render
|
|
48
48
|
><pc-collision type="box" half-extents="9 1.5 0.15"></pc-collision
|
|
49
|
-
><pc-
|
|
49
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
50
50
|
></pc-entity>
|
|
51
51
|
<pc-entity name="left-wall" position="-9 1.5 0" scale="0.3 3 18"
|
|
52
52
|
><pc-render type="box" material="wall-material"></pc-render
|
|
53
53
|
><pc-collision type="box" half-extents="0.15 1.5 9"></pc-collision
|
|
54
|
-
><pc-
|
|
54
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
55
55
|
></pc-entity>
|
|
56
56
|
<pc-entity name="right-wall" position="9 1.5 0" scale="0.3 3 18"
|
|
57
57
|
><pc-render type="box" material="wall-material"></pc-render
|
|
58
58
|
><pc-collision type="box" half-extents="0.15 1.5 9"></pc-collision
|
|
59
|
-
><pc-
|
|
59
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
60
60
|
></pc-entity>
|
|
61
61
|
<pc-entity name="blue-crate" position="-2 0.75 -3" scale="1.5 1.5 1.5"
|
|
62
62
|
><pc-render type="box" material="blue-material"></pc-render
|
|
63
63
|
><pc-collision type="box" half-extents="0.75 0.75 0.75"></pc-collision
|
|
64
|
-
><pc-
|
|
64
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
65
65
|
></pc-entity>
|
|
66
66
|
<pc-entity name="green-crate" position="3 0.5 1" scale="2.5 1 1"
|
|
67
67
|
><pc-render type="box" material="green-material"></pc-render
|
|
68
68
|
><pc-collision type="box" half-extents="1.25 0.5 0.5"></pc-collision
|
|
69
|
-
><pc-
|
|
69
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
70
70
|
></pc-entity>
|
|
71
71
|
<pc-entity name="cargo-left-0" position="-5.5 0.75 -5.5" scale="2 1.5 2"
|
|
72
72
|
><pc-render type="box" material="wood-material"></pc-render
|
|
73
73
|
><pc-collision type="box" half-extents="1 0.75 1"></pc-collision
|
|
74
|
-
><pc-
|
|
74
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
75
75
|
></pc-entity>
|
|
76
76
|
<pc-entity name="cargo-left-1" position="-5.5 2 -5.5" scale="1.5 1 1.5"
|
|
77
77
|
><pc-render type="box" material="blue-material"></pc-render
|
|
78
78
|
><pc-collision type="box" half-extents="0.75 0.5 0.75"></pc-collision
|
|
79
|
-
><pc-
|
|
79
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
80
80
|
></pc-entity>
|
|
81
81
|
<pc-entity name="cargo-right-0" position="5.3 0.6 -4.8" scale="2.4 1.2 2"
|
|
82
82
|
><pc-render type="box" material="green-material"></pc-render
|
|
83
83
|
><pc-collision type="box" half-extents="1.2 0.6 1"></pc-collision
|
|
84
|
-
><pc-
|
|
84
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
85
85
|
></pc-entity>
|
|
86
86
|
<pc-entity name="cargo-right-1" position="5.3 1.7 -4.8" scale="1.5 1 1.5"
|
|
87
87
|
><pc-render type="box" material="wood-material"></pc-render
|
|
88
88
|
><pc-collision type="box" half-extents="0.75 0.5 0.75"></pc-collision
|
|
89
|
-
><pc-
|
|
89
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
90
90
|
></pc-entity>
|
|
91
91
|
<pc-entity name="cargo-center" position="0 0.6 -6.5" scale="2.2 1.2 1.8"
|
|
92
92
|
><pc-render type="box" material="blue-material"></pc-render
|
|
93
93
|
><pc-collision type="box" half-extents="1.1 0.6 0.9"></pc-collision
|
|
94
|
-
><pc-
|
|
94
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
95
95
|
></pc-entity>
|
|
96
96
|
<pc-entity name="shelf-left-post-0" position="-6.8 1.4 -3.5" scale="0.25 2.8 0.25"
|
|
97
97
|
><pc-render type="box" material="metal-material"></pc-render
|
|
98
98
|
><pc-collision type="box" half-extents="0.125 1.4 0.125"></pc-collision
|
|
99
|
-
><pc-
|
|
99
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
100
100
|
></pc-entity>
|
|
101
101
|
<pc-entity name="shelf-left-post-1" position="-6.8 1.4 0" scale="0.25 2.8 0.25"
|
|
102
102
|
><pc-render type="box" material="metal-material"></pc-render
|
|
103
103
|
><pc-collision type="box" half-extents="0.125 1.4 0.125"></pc-collision
|
|
104
|
-
><pc-
|
|
104
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
105
105
|
></pc-entity>
|
|
106
106
|
<pc-entity name="shelf-left-post-2" position="-6.8 1.4 3.5" scale="0.25 2.8 0.25"
|
|
107
107
|
><pc-render type="box" material="metal-material"></pc-render
|
|
108
108
|
><pc-collision type="box" half-extents="0.125 1.4 0.125"></pc-collision
|
|
109
|
-
><pc-
|
|
109
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
110
110
|
></pc-entity>
|
|
111
111
|
<pc-entity name="shelf-right-post-0" position="6.8 1.4 -3.5" scale="0.25 2.8 0.25"
|
|
112
112
|
><pc-render type="box" material="metal-material"></pc-render
|
|
113
113
|
><pc-collision type="box" half-extents="0.125 1.4 0.125"></pc-collision
|
|
114
|
-
><pc-
|
|
114
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
115
115
|
></pc-entity>
|
|
116
116
|
<pc-entity name="shelf-right-post-1" position="6.8 1.4 0" scale="0.25 2.8 0.25"
|
|
117
117
|
><pc-render type="box" material="metal-material"></pc-render
|
|
118
118
|
><pc-collision type="box" half-extents="0.125 1.4 0.125"></pc-collision
|
|
119
|
-
><pc-
|
|
119
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
120
120
|
></pc-entity>
|
|
121
121
|
<pc-entity name="shelf-right-post-2" position="6.8 1.4 3.5" scale="0.25 2.8 0.25"
|
|
122
122
|
><pc-render type="box" material="metal-material"></pc-render
|
|
123
123
|
><pc-collision type="box" half-extents="0.125 1.4 0.125"></pc-collision
|
|
124
|
-
><pc-
|
|
124
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
125
125
|
></pc-entity>
|
|
126
126
|
<pc-entity name="shelf-left-low" position="-6.8 0.65 0" scale="1.1 0.18 7.5"
|
|
127
127
|
><pc-render type="box" material="metal-material"></pc-render
|
|
128
128
|
><pc-collision type="box" half-extents="0.55 0.09 3.75"></pc-collision
|
|
129
|
-
><pc-
|
|
129
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
130
130
|
></pc-entity>
|
|
131
131
|
<pc-entity name="shelf-left-high" position="-6.8 2.1 0" scale="1.1 0.18 7.5"
|
|
132
132
|
><pc-render type="box" material="metal-material"></pc-render
|
|
133
133
|
><pc-collision type="box" half-extents="0.55 0.09 3.75"></pc-collision
|
|
134
|
-
><pc-
|
|
134
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
135
135
|
></pc-entity>
|
|
136
136
|
<pc-entity name="shelf-right-low" position="6.8 0.65 0" scale="1.1 0.18 7.5"
|
|
137
137
|
><pc-render type="box" material="metal-material"></pc-render
|
|
138
138
|
><pc-collision type="box" half-extents="0.55 0.09 3.75"></pc-collision
|
|
139
|
-
><pc-
|
|
139
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
140
140
|
></pc-entity>
|
|
141
141
|
<pc-entity name="shelf-right-high" position="6.8 2.1 0" scale="1.1 0.18 7.5"
|
|
142
142
|
><pc-render type="box" material="metal-material"></pc-render
|
|
143
143
|
><pc-collision type="box" half-extents="0.55 0.09 3.75"></pc-collision
|
|
144
|
-
><pc-
|
|
144
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
145
145
|
></pc-entity>
|
|
146
146
|
<pc-entity name="pallet" position="-2.5 0.15 2.5" scale="3 0.3 2"
|
|
147
147
|
><pc-render type="box" material="wood-material"></pc-render
|
|
148
148
|
><pc-collision type="box" half-extents="1.5 0.15 1"></pc-collision
|
|
149
|
-
><pc-
|
|
149
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
150
150
|
></pc-entity>
|
|
151
151
|
<pc-entity name="player" position="0 1 5">
|
|
152
152
|
<pc-collision type="capsule" radius="0.45" height="1.8"></pc-collision>
|
|
153
|
-
<pc-
|
|
153
|
+
<pc-rigid-body type="dynamic" mass="80" angular-factor="0 0 0"></pc-rigid-body>
|
|
154
154
|
<pc-entity name="camera" position="0 0.65 0"
|
|
155
155
|
><pc-camera clear-color="#61a3db" fov="80"></pc-camera
|
|
156
156
|
></pc-entity>
|
|
@@ -6,7 +6,7 @@ import './starter.css';
|
|
|
6
6
|
|
|
7
7
|
await Promise.all([
|
|
8
8
|
whenReady('pc-entity[name="player"] > pc-collision'),
|
|
9
|
-
whenReady('pc-entity[name="player"] > pc-
|
|
9
|
+
whenReady('pc-entity[name="player"] > pc-rigid-body')
|
|
10
10
|
]);
|
|
11
11
|
const [player, camera] = await Promise.all([
|
|
12
12
|
whenReady<EntityElement>('pc-entity[name="player"]'),
|
|
@@ -47,7 +47,7 @@ if (skyboxLayer) {
|
|
|
47
47
|
}
|
|
48
48
|
|
|
49
49
|
// Engine scripts are resolved by the bundler, so they are attached through the entity rather than
|
|
50
|
-
// with <pc-script name="...">, which only resolves scripts fetched at runtime by <pc-asset>
|
|
50
|
+
// with <pc-script-instance name="...">, which only resolves scripts fetched at runtime by <pc-asset>
|
|
51
51
|
const camera = cameraComponent.closestEntity;
|
|
52
52
|
camera?.entity?.addComponent('script');
|
|
53
53
|
camera?.entity?.script?.create(CameraControls, { properties: { sceneSize: 3 } });
|
|
@@ -14,7 +14,7 @@ const [cameraComponent, sky] = await Promise.all([
|
|
|
14
14
|
]);
|
|
15
15
|
|
|
16
16
|
// Engine scripts are resolved by the bundler, so they are attached through the entity rather than
|
|
17
|
-
// with <pc-script name="...">, which only resolves scripts fetched at runtime by <pc-asset>
|
|
17
|
+
// with <pc-script-instance name="...">, which only resolves scripts fetched at runtime by <pc-asset>
|
|
18
18
|
const camera = cameraComponent.closestEntity;
|
|
19
19
|
camera?.entity?.addComponent('script');
|
|
20
20
|
camera?.entity?.script?.create(CameraControls, { properties: { sceneSize: 2.5 } });
|
|
@@ -8,12 +8,12 @@
|
|
|
8
8
|
</head>
|
|
9
9
|
<body>
|
|
10
10
|
<pc-app>
|
|
11
|
-
<pc-
|
|
11
|
+
<pc-wasm
|
|
12
12
|
name="Ammo"
|
|
13
13
|
glue="/ammo/ammo.wasm.js"
|
|
14
14
|
wasm="/ammo/ammo.wasm.wasm"
|
|
15
15
|
fallback="/ammo/ammo.js"
|
|
16
|
-
></pc-
|
|
16
|
+
></pc-wasm>
|
|
17
17
|
<pc-material id="floor-material" diffuse="#2e333d" gloss="0.2"></pc-material>
|
|
18
18
|
<pc-material id="cyan-material" diffuse="#29ade6" gloss="0.45"></pc-material>
|
|
19
19
|
<pc-material id="coral-material" diffuse="#f25738" gloss="0.45"></pc-material>
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
<pc-entity name="floor" position="0 -0.1 0" scale="10 0.2 10"
|
|
35
35
|
><pc-render type="box" material="floor-material"></pc-render
|
|
36
36
|
><pc-collision type="box" half-extents="5 0.1 5"></pc-collision
|
|
37
|
-
><pc-
|
|
37
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
38
38
|
></pc-entity>
|
|
39
39
|
<pc-entity id="bodies"></pc-entity>
|
|
40
40
|
</pc-scene>
|
|
@@ -18,7 +18,7 @@ const spawn = () => {
|
|
|
18
18
|
const type = TYPES[i % TYPES.length];
|
|
19
19
|
bodies.insertAdjacentHTML(
|
|
20
20
|
'beforeend',
|
|
21
|
-
`<pc-entity data-body position="${((i % 4) - 1.5) * 1.1} ${0.7 + Math.floor(i / 4) * 1.1} ${(Math.floor(i / 4) - 1) * 1.4}" rotation="${i * 13} ${i * 29} 0" scale="${SCALES[i % SCALES.length]}"><pc-render type="${type}" material="${MATERIALS[i % MATERIALS.length]}"></pc-render><pc-collision type="${type}"></pc-collision><pc-
|
|
21
|
+
`<pc-entity data-body position="${((i % 4) - 1.5) * 1.1} ${0.7 + Math.floor(i / 4) * 1.1} ${(Math.floor(i / 4) - 1) * 1.4}" rotation="${i * 13} ${i * 29} 0" scale="${SCALES[i % SCALES.length]}"><pc-render type="${type}" material="${MATERIALS[i % MATERIALS.length]}"></pc-render><pc-collision type="${type}"></pc-collision><pc-rigid-body type="dynamic" mass="1" restitution="0.35"></pc-rigid-body></pc-entity>`
|
|
22
22
|
);
|
|
23
23
|
};
|
|
24
24
|
const reset = () => {
|
|
@@ -58,8 +58,10 @@ ground.addComponent('render', {
|
|
|
58
58
|
receiveShadows: true
|
|
59
59
|
});
|
|
60
60
|
|
|
61
|
+
// The element's entity is a host whose transform composes with the GLB's authored root rotation
|
|
62
|
+
// (a -90° X up-axis fix), so only the yaw is set here
|
|
61
63
|
const entity = model.entity!;
|
|
62
|
-
entity.setLocalEulerAngles(
|
|
64
|
+
entity.setLocalEulerAngles(0, -25, 0);
|
|
63
65
|
entity.root.syncHierarchy();
|
|
64
66
|
const meshes = (entity.findComponents('render') as RenderComponent[]).flatMap((render) => render.meshInstances);
|
|
65
67
|
const bounds = meshes[0].aabb.clone();
|
|
@@ -14,7 +14,7 @@ class Rotate extends Script {
|
|
|
14
14
|
}
|
|
15
15
|
|
|
16
16
|
// Engine scripts are resolved by the bundler, so they are attached through the entity rather than
|
|
17
|
-
// with <pc-script name="...">, which only resolves scripts fetched at runtime by <pc-asset>
|
|
17
|
+
// with <pc-script-instance name="...">, which only resolves scripts fetched at runtime by <pc-asset>
|
|
18
18
|
const cube = await whenReady<EntityElement>('pc-entity[name="cube"]');
|
|
19
19
|
|
|
20
20
|
cube.entity?.addComponent('script');
|
|
@@ -9,7 +9,7 @@ import './style.css';
|
|
|
9
9
|
const cameraComponent = await whenReady('pc-camera');
|
|
10
10
|
|
|
11
11
|
// Engine scripts are resolved by the bundler, so they are attached through the entity rather than
|
|
12
|
-
// with <pc-script name="...">, which only resolves scripts fetched at runtime by <pc-asset>
|
|
12
|
+
// with <pc-script-instance name="...">, which only resolves scripts fetched at runtime by <pc-asset>
|
|
13
13
|
const camera = cameraComponent.closestEntity;
|
|
14
14
|
camera?.entity?.addComponent('script');
|
|
15
15
|
camera?.entity?.script?.create(CameraControls, { properties: { sceneSize: 2 } });
|
|
@@ -16,12 +16,12 @@
|
|
|
16
16
|
<pc-material id="shirt-material" diffuse="#268bd2"></pc-material>
|
|
17
17
|
<pc-material id="skin-material" diffuse="#c78759"></pc-material>
|
|
18
18
|
<pc-material id="pants-material" diffuse="#2e4a85"></pc-material>
|
|
19
|
-
<pc-
|
|
19
|
+
<pc-wasm
|
|
20
20
|
name="Ammo"
|
|
21
21
|
glue="/ammo/ammo.wasm.js"
|
|
22
22
|
wasm="/ammo/ammo.wasm.wasm"
|
|
23
23
|
fallback="/ammo/ammo.js"
|
|
24
|
-
></pc-
|
|
24
|
+
></pc-wasm>
|
|
25
25
|
<pc-scene>
|
|
26
26
|
<pc-entity name="camera" position="0 3 6"><pc-camera clear-color="#7ab8e6"></pc-camera></pc-entity>
|
|
27
27
|
<pc-entity name="light" rotation="45 30 0"
|
|
@@ -36,32 +36,32 @@
|
|
|
36
36
|
<pc-entity name="ground" position="0 -0.1 0" scale="20 0.2 20"
|
|
37
37
|
><pc-render type="box" material="ground-material"></pc-render
|
|
38
38
|
><pc-collision type="box" half-extents="10 0.1 10"></pc-collision
|
|
39
|
-
><pc-
|
|
39
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
40
40
|
></pc-entity>
|
|
41
41
|
<pc-entity name="block-0" position="-4.5 0.5 -3.5" scale="2.4 1 2.4"
|
|
42
42
|
><pc-render type="box" material="block-material"></pc-render
|
|
43
43
|
><pc-collision type="box" half-extents="1.2 0.5 1.2"></pc-collision
|
|
44
|
-
><pc-
|
|
44
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
45
45
|
></pc-entity>
|
|
46
46
|
<pc-entity name="block-1" position="4.2 0.5 -2.8" rotation="0 25 0" scale="2.4 1 2.4"
|
|
47
47
|
><pc-render type="box" material="block-material"></pc-render
|
|
48
48
|
><pc-collision type="box" half-extents="1.2 0.5 1.2"></pc-collision
|
|
49
|
-
><pc-
|
|
49
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
50
50
|
></pc-entity>
|
|
51
51
|
<pc-entity name="block-2" position="-3.7 0.5 3.2" rotation="0 50 0" scale="2.4 1 2.4"
|
|
52
52
|
><pc-render type="box" material="block-material"></pc-render
|
|
53
53
|
><pc-collision type="box" half-extents="1.2 0.5 1.2"></pc-collision
|
|
54
|
-
><pc-
|
|
54
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
55
55
|
></pc-entity>
|
|
56
56
|
<pc-entity name="block-3" position="3.8 0.5 3.6" rotation="0 75 0" scale="2.4 1 2.4"
|
|
57
57
|
><pc-render type="box" material="block-material"></pc-render
|
|
58
58
|
><pc-collision type="box" half-extents="1.2 0.5 1.2"></pc-collision
|
|
59
|
-
><pc-
|
|
59
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
60
60
|
></pc-entity>
|
|
61
61
|
<pc-entity name="tree-0-trunk" position="-7 0.99 -6" scale="0.418 1.98 0.418"
|
|
62
62
|
><pc-render type="box" material="wood-material"></pc-render
|
|
63
63
|
><pc-collision type="box" half-extents="0.209 0.99 0.209"></pc-collision
|
|
64
|
-
><pc-
|
|
64
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
65
65
|
></pc-entity>
|
|
66
66
|
<pc-entity name="tree-0-crown-0" position="-7 2.09 -6" scale="2.31 1.98 2.31"
|
|
67
67
|
><pc-render type="cone" material="leaves-material"></pc-render
|
|
@@ -75,7 +75,7 @@
|
|
|
75
75
|
<pc-entity name="tree-1-trunk" position="6.5 1.125 -6.5" scale="0.475 2.25 0.475"
|
|
76
76
|
><pc-render type="box" material="wood-material"></pc-render
|
|
77
77
|
><pc-collision type="box" half-extents="0.2375 1.125 0.2375"></pc-collision
|
|
78
|
-
><pc-
|
|
78
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
79
79
|
></pc-entity>
|
|
80
80
|
<pc-entity name="tree-1-crown-0" position="6.5 2.375 -6.5" scale="2.625 2.25 2.625"
|
|
81
81
|
><pc-render type="cone" material="leaves-material"></pc-render
|
|
@@ -89,7 +89,7 @@
|
|
|
89
89
|
<pc-entity name="tree-2-trunk" position="-7.5 0.81 5" scale="0.342 1.62 0.342"
|
|
90
90
|
><pc-render type="box" material="wood-material"></pc-render
|
|
91
91
|
><pc-collision type="box" half-extents="0.171 0.81 0.171"></pc-collision
|
|
92
|
-
><pc-
|
|
92
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
93
93
|
></pc-entity>
|
|
94
94
|
<pc-entity name="tree-2-crown-0" position="-7.5 1.71 5" scale="1.89 1.62 1.89"
|
|
95
95
|
><pc-render type="cone" material="leaves-material"></pc-render
|
|
@@ -103,7 +103,7 @@
|
|
|
103
103
|
<pc-entity name="tree-3-trunk" position="7 1.035 5.5" scale="0.437 2.07 0.437"
|
|
104
104
|
><pc-render type="box" material="wood-material"></pc-render
|
|
105
105
|
><pc-collision type="box" half-extents="0.2185 1.035 0.2185"></pc-collision
|
|
106
|
-
><pc-
|
|
106
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
107
107
|
></pc-entity>
|
|
108
108
|
<pc-entity name="tree-3-crown-0" position="7 2.185 5.5" scale="2.415 2.07 2.415"
|
|
109
109
|
><pc-render type="cone" material="leaves-material"></pc-render
|
|
@@ -117,7 +117,7 @@
|
|
|
117
117
|
<pc-entity name="tree-4-trunk" position="-2.2 0.765 -8" scale="0.323 1.53 0.323"
|
|
118
118
|
><pc-render type="box" material="wood-material"></pc-render
|
|
119
119
|
><pc-collision type="box" half-extents="0.1615 0.765 0.1615"></pc-collision
|
|
120
|
-
><pc-
|
|
120
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
121
121
|
></pc-entity>
|
|
122
122
|
<pc-entity name="tree-4-crown-0" position="-2.2 1.615 -8" scale="1.785 1.53 1.785"
|
|
123
123
|
><pc-render type="cone" material="leaves-material"></pc-render
|
|
@@ -131,16 +131,16 @@
|
|
|
131
131
|
<pc-entity name="fallen-log" position="0 0.35 6" scale="3.8 0.7 0.7"
|
|
132
132
|
><pc-render type="box" material="wood-material"></pc-render
|
|
133
133
|
><pc-collision type="box" half-extents="1.9 0.35 0.35"></pc-collision
|
|
134
|
-
><pc-
|
|
134
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
135
135
|
></pc-entity>
|
|
136
136
|
<pc-entity name="stump" position="-1.8 0.4 -2.2" scale="0.9 0.8 0.9"
|
|
137
137
|
><pc-render type="box" material="wood-material"></pc-render
|
|
138
138
|
><pc-collision type="box" half-extents="0.45 0.4 0.45"></pc-collision
|
|
139
|
-
><pc-
|
|
139
|
+
><pc-rigid-body type="static"></pc-rigid-body
|
|
140
140
|
></pc-entity>
|
|
141
141
|
<pc-entity name="player" position="0 1.1 0">
|
|
142
142
|
<pc-collision type="capsule" radius="0.5" height="2.4" linear-offset="0 0.1 0"></pc-collision>
|
|
143
|
-
<pc-
|
|
143
|
+
<pc-rigid-body type="dynamic" mass="70" angular-factor="0 0 0"></pc-rigid-body>
|
|
144
144
|
<pc-entity name="character" position="0 0.2 0">
|
|
145
145
|
<pc-entity name="body" scale="0.56 0.88 0.38"
|
|
146
146
|
><pc-render type="box" material="shirt-material"></pc-render
|
|
@@ -6,7 +6,7 @@ import './starter.css';
|
|
|
6
6
|
|
|
7
7
|
await Promise.all([
|
|
8
8
|
whenReady('pc-entity[name="player"] > pc-collision'),
|
|
9
|
-
whenReady('pc-entity[name="player"] > pc-
|
|
9
|
+
whenReady('pc-entity[name="player"] > pc-rigid-body')
|
|
10
10
|
]);
|
|
11
11
|
const [player, camera, model] = await Promise.all([
|
|
12
12
|
whenReady<EntityElement>('pc-entity[name="player"]'),
|