smoothy refactoring
This commit is contained in:
parent
516860506b
commit
ffb7e702c7
|
|
@ -35,7 +35,7 @@ const targetDistance = reactive({ max: 10, min: 0 })
|
|||
let sidebar_clickable = [] as PromoScene[]
|
||||
let sidebar_visible = [] as PromoScene[]
|
||||
|
||||
const COUNT = 100
|
||||
const COUNT = 50
|
||||
type smooth = {
|
||||
value: Vector3 | Quaternion | undefined,
|
||||
count: number
|
||||
|
|
@ -47,8 +47,6 @@ const temp_smooth_target = reactive({}) as smooth
|
|||
const temp_smooth_move = reactive({}) as smooth
|
||||
const temp_smooth_rotate = reactive({}) as smooth
|
||||
|
||||
const vis_target = ref()
|
||||
|
||||
const sidebar = usePromoSidebar();
|
||||
const sidebar_scene = usePromoScene();
|
||||
const clickable = useClickable()
|
||||
|
|
@ -272,9 +270,7 @@ watch(() => sidebar.is_open && sidebar.id_clickable, () => {
|
|||
const target_vector = new Vector3();
|
||||
|
||||
el.getWorldPosition(target_vector);
|
||||
target_vector.y = raw_dataStore.data.min_distance > 50 ? raw_dataStore.data.min_distance / 10 : 1;
|
||||
const target_vector_1 = target_vector.clone().multiplyScalar(3)
|
||||
console.log(target_vector, target_vector_1)
|
||||
// target_vector.y = raw_dataStore.data.min_distance > 50 ? raw_dataStore.data.min_distance / 10 : 1;
|
||||
|
||||
const quaternion = new Quaternion();
|
||||
quaternion.setFromEuler(new Euler(
|
||||
|
|
@ -286,18 +282,16 @@ watch(() => sidebar.is_open && sidebar.id_clickable, () => {
|
|||
set_moveto(smooth_rotate, quaternion)
|
||||
|
||||
const d = raw_dataStore.data.max_distance * 0.5
|
||||
if(camera.value?.position && camera.value?.position.distanceTo(new Vector3(d,d,d)) > 20) {
|
||||
if (camera.value?.position && camera.value?.position.distanceTo(new Vector3(d, d, d)) > 20) {
|
||||
set_moveto(temp_smooth_target, target_vector)
|
||||
set_moveto(temp_smooth_move, target_vector)
|
||||
|
||||
|
||||
set_moveto(smooth_target, new Vector3(0, 0, 0))
|
||||
set_moveto(smooth_move, new Vector3(d, d, d))
|
||||
} else {
|
||||
set_moveto(smooth_target, target_vector)
|
||||
set_moveto(smooth_move, target_vector)
|
||||
}
|
||||
|
||||
vis_target.value = target_vector;
|
||||
}
|
||||
}
|
||||
}, { deep: true })
|
||||
|
|
@ -316,45 +310,41 @@ onAfterRender(() => {
|
|||
}
|
||||
}
|
||||
})
|
||||
const koef = 1 / COUNT
|
||||
if (smooth_target.value) {
|
||||
timer.stopTimer();
|
||||
(controls.value as any).target.lerp(smooth_target.value, koef);
|
||||
smooth_target.count -= 1
|
||||
if (smooth_target.count == 0) {
|
||||
set_moveto(smooth_target, undefined)
|
||||
|
||||
if (temp_smooth_target) {
|
||||
set_moveto(smooth_target, temp_smooth_target.value)
|
||||
set_moveto(temp_smooth_target, undefined)
|
||||
const koef = (1 / COUNT) * 3
|
||||
const smoothy = [
|
||||
{
|
||||
el: smooth_target,
|
||||
temp_el: temp_smooth_target,
|
||||
f: () => (controls.value as any).target.lerp(smooth_target.value as Vector3, smooth_target.count < COUNT * 0.5 ? 0.15 : koef),
|
||||
},
|
||||
{
|
||||
el: smooth_move,
|
||||
temp_el: temp_smooth_move,
|
||||
f: () => camera.value?.position.lerp(smooth_move.value as Vector3, smooth_move.count < COUNT * 0.5 ? 0.15 : koef),
|
||||
},
|
||||
{
|
||||
el: smooth_rotate,
|
||||
f: () => {
|
||||
camera.value?.quaternion.slerp(smooth_rotate.value as Quaternion, koef);
|
||||
camera.value?.quaternion.normalize()
|
||||
}
|
||||
}
|
||||
}
|
||||
if (smooth_move.value) {
|
||||
timer.stopTimer();
|
||||
camera.value?.position.lerp(smooth_move.value, koef);
|
||||
smooth_move.count -= 1
|
||||
if (smooth_move.count == 0) {
|
||||
// camera.value?.lookAt(camera_moveto.value)
|
||||
set_moveto(smooth_move, undefined)
|
||||
]
|
||||
smoothy.forEach(element => {
|
||||
if (element.el.value) {
|
||||
timer.stopTimer();
|
||||
element.f()
|
||||
element.el.count -= 1
|
||||
if (element.el.count == 0) {
|
||||
set_moveto(element.el, undefined)
|
||||
|
||||
if (temp_smooth_move) {
|
||||
set_moveto(smooth_move, temp_smooth_move.value)
|
||||
set_moveto(temp_smooth_move, undefined)
|
||||
if (element.temp_el && element.temp_el.value) {
|
||||
set_moveto(element.el, element.temp_el.value)
|
||||
set_moveto(element.temp_el, undefined)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
if (smooth_rotate.value) {
|
||||
timer.stopTimer();
|
||||
camera.value?.quaternion.slerp(smooth_rotate.value as Quaternion, koef);
|
||||
camera.value?.quaternion.normalize()
|
||||
smooth_rotate.count -= 1;
|
||||
if (smooth_rotate.count == 0) {
|
||||
set_moveto(smooth_rotate, undefined)
|
||||
}
|
||||
camera.value?.updateMatrixWorld()
|
||||
}
|
||||
(controls.value as any).update()
|
||||
});
|
||||
})
|
||||
|
||||
const timer = useTimer()
|
||||
|
|
@ -433,10 +423,6 @@ onUnmounted(() => {
|
|||
<TresObject3D v-bind="item.modelFile.clone()" />
|
||||
</TresGroup>
|
||||
</template>
|
||||
<TresMesh :position="vis_target || new Vector3(0, 0, 0)" name="test">
|
||||
<TresBoxGeometry :args="[1, 1, 1]" />
|
||||
<TresMeshStandardMaterial color="red" />
|
||||
</TresMesh>
|
||||
<template v-for="(item, i) in clickable_items">
|
||||
<TresObject3D v-bind="item.clone()" :ref="clickable_refs[i]" />
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -25,20 +25,6 @@ watch(() => sidebar.id_clickable, () => {
|
|||
<template v-else>
|
||||
<div class="sidebar-content">
|
||||
<h2>{{ sidebar_scene.name }}</h2>
|
||||
<div class="sidebar-accordion" :class="[{ 'open': sidebar.isAccOpen('obj') }]">
|
||||
<div class="sidebar-accordion-title" @click="sidebar.toggleAccordion('obj')">
|
||||
<i-mdi-minus-circle v-if="sidebar.isAccOpen('obj')" />
|
||||
<i-mdi-plus-circle v-else />
|
||||
<h3>Объекты</h3>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-accordion-content" v-if="sidebar.isAccOpen('obj')">
|
||||
<div class="sidebar-list-item" v-for="item in sidebar_scene.visible">
|
||||
<input type="checkbox" v-model=item.is_enabled :value="item.id" :id="item.id.toString()" />
|
||||
<label :for="item.id.toString()">{{ item.name }}</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sidebar-accordion" :class="[{ 'open': sidebar.isAccOpen('clickable') }]">
|
||||
<div class="sidebar-accordion-title" @click="sidebar.toggleAccordion('clickable')">
|
||||
<i-mdi-minus-circle v-if="sidebar.isAccOpen('clickable')" />
|
||||
|
|
@ -54,6 +40,21 @@ watch(() => sidebar.id_clickable, () => {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sidebar-accordion" :class="[{ 'open': sidebar.isAccOpen('obj') }]">
|
||||
<div class="sidebar-accordion-title" @click="sidebar.toggleAccordion('obj')">
|
||||
<i-mdi-minus-circle v-if="sidebar.isAccOpen('obj')" />
|
||||
<i-mdi-plus-circle v-else />
|
||||
<h3>Объекты</h3>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-accordion-content" v-if="sidebar.isAccOpen('obj')">
|
||||
<div class="sidebar-list-item" v-for="item in sidebar_scene.visible">
|
||||
<input type="checkbox" v-model=item.is_enabled :value="item.id" :id="item.id.toString()" />
|
||||
<label :for="item.id.toString()">{{ item.name }}</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-accordion" :class="[{ 'open': sidebar.isAccOpen('desc') }]">
|
||||
<div class="sidebar-accordion-title" @click="sidebar.toggleAccordion('desc')">
|
||||
<i-mdi-minus-circle v-if="sidebar.isAccOpen('desc')" />
|
||||
|
|
|
|||
Loading…
Reference in New Issue