ksenia_mikhailova
/
demo-int-table
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bx-865-apps #1

Merged
ksenia_mikhailova merged 140 commits from bx-865-apps into main 2024-06-27 15:03:27 +03:00
Conversation 0 Commits 140 Files Changed 295 +24 -8
1 changed files with 24 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit b78c09600d - Show all commits

32
front/src/components/Promo/main.vue
View File

@ -5,8 +5,6 @@ import { TresCanvas, useRenderLoop } from '@tresjs/core';
import { vLightHelper } from '@tresjs/core'
import { CameraControls, useGLTF, useProgress } from '@tresjs/cientos'
import sunset from '../../assets/promo/models/sunset.hdr'
const minPan = new Vector3(-10, 1, -5);
const maxPan = new Vector3(5, 1, 5);
const _v = new Vector3();
@ -31,13 +29,30 @@ const controlsState = reactive({
const { hasFinishLoading, progress } = await useProgress()
const { scene: spot_light } = await useGLTF('/Spot_light.glb')
const spot_light_item = spot_light.children[0]
const spot_light_ref = ref()
const spot_light_target = ref()
const target = new Object3D()
target.translateX(2)
target.translateY(-50)
console.log(target)
target.translateX(-10)
target.translateZ(10)
target.translateY(0)
const { onLoop } = useRenderLoop()
let direction = 0.05
onLoop(({ elapsed }) => {
// target.translateY(-0.01)
if (spot_light_target.value) {
const px = spot_light_target.value.position.x
if (px >= 10) {
direction = -0.05
} else if (px <= -10) {
direction = 0.05
}
spot_light_target.value.translateX(direction)
}
})
console.log(spot_light_target.value)
</script>
<template>
<div :class="[{ 'invisible': !!hasFinishLoading }, 'loader']">
@ -52,9 +67,10 @@ console.log(target)
<Suspense>
<Models />
</Suspense>
<TresSpotLight :position="spot_light_item.position" color="pink"
:angle="spot_light_item.angle" :penumbra="spot_light_item.penumbra" :target="target"
:intensity="400" cast-shadow v-light-helper />
<TresObject3D ref="spot_light_target" :position="[10, 1, 10]"></TresObject3D>
<TresSpotLight :position="spot_light_item.position" color="pink" :angle="spot_light_item.angle"
:penumbra="spot_light_item.penumbra" :target="spot_light_target || target" :intensity="500" cast-shadow
ref="spot_light_ref" />
<!-- <TresDirectionalLight :position="lightPosition" :intensity="10" cast-shadow /> -->
<TresAmbientLight :intensity="1" />
</TresCanvas>