1
1
<script setup lang="ts">
2
- import { shallowRef } from ' vue'
2
+ import { shallowRef , watch } from ' vue'
3
3
import { TresCanvas , useRenderLoop } from ' @tresjs/core'
4
4
import { Levioso , Lensflare , Dodecahedron } from ' @tresjs/cientos' ;
5
5
import { Color , MeshPhongMaterial } from ' three' ;
@@ -32,7 +32,7 @@ const { onLoop } = useRenderLoop();
32
32
onLoop (() => {
33
33
if (! lightRef .value ) return
34
34
35
- if (Math .random () > 0.99 ) {
35
+ if (Math .random () > 0.99 ) {
36
36
lightRef .value .color = new Color (randomColor ());
37
37
flarePropsRef .value = getFlareProps ()
38
38
}
@@ -213,13 +213,15 @@ const rockMaterial = new MeshPhongMaterial({ color: 0x123141, specular: 0xffffff
213
213
214
214
watch (() => [
215
215
seedRef .value ,
216
- oversizeSizeMin .value , oversizeSizeMax .value , oversizeLengthMin .value , oversizeLengthMax .value ,
216
+ oversizeSizeMin .value , oversizeSizeMax .value , oversizeLengthMin .value , oversizeLengthMax .value ,
217
217
oversizeColorA .value , oversizeColorB .value , oversizeColorC .value , oversizeSeed .value ,
218
- bodySizeMin .value , bodySizeMax .value , bodyLengthMin .value , bodyLengthMax .value ,
218
+ bodySizeMin .value , bodySizeMax .value , bodyLengthMin .value , bodyLengthMax .value ,
219
219
bodyColorA .value , bodyColorB .value , bodyColorC .value , bodySeed .value ,
220
- frontSizeMin .value , frontSizeMax .value , frontLengthMin .value , frontLengthMax .value , frontOffset .value , frontDistance .value ,
220
+ frontSizeMin .value , frontSizeMax .value , frontLengthMin .value , frontLengthMax .value ,
221
+ frontOffset .value , frontDistance .value ,
221
222
frontColorA .value , frontColorB .value , frontColorC .value , frontSeed .value ,
222
- backSizeMin .value , backSizeMax .value , backLengthMin .value , backLengthMax .value , backDistance .value , backOffset .value ,
223
+ backSizeMin .value , backSizeMax .value , backLengthMin .value , backLengthMax .value ,
224
+ backDistance .value , backOffset .value ,
223
225
backColorA .value , backColorB .value , backColorC .value , backSeed .value ,
224
226
], updateSeedProps );
225
227
@@ -240,7 +242,7 @@ const rockMaterial = new MeshPhongMaterial({ color: 0x123141, specular: 0xffffff
240
242
</TresPointLight >
241
243
</Levioso >
242
244
<TresPointLight :color =" new Color(1, 1, 1)" :intensity =" 2000" :position =" [10, 5, 0]" >
243
- <Lensflare :seed =" seedRef" :seedProps =" seedPropsRef" />
245
+ <Lensflare :seed =" seedRef" :seed-props =" seedPropsRef" />
244
246
</TresPointLight >
245
247
<Dodecahedron v-for =" { key, position, rotation, scale } in rocks" :key =" key" :material =" rockMaterial"
246
248
:position =" position" :rotation =" rotation" :scale =" scale" />
0 commit comments