From 398b7ca54e08fd2552f89faaee4cc9bfa08f7700 Mon Sep 17 00:00:00 2001 From: aarizona Date: Sat, 31 Aug 2024 12:28:35 +0300 Subject: [PATCH] move test --- front/src/components/Promo/load_models.vue | 68 ++++++++++------------ front/src/components/sidebar.vue | 5 ++ front/src/stores/promo_sidebar.ts | 10 +++- 3 files changed, 44 insertions(+), 39 deletions(-) diff --git a/front/src/components/Promo/load_models.vue b/front/src/components/Promo/load_models.vue index ce0351d..1526a64 100644 --- a/front/src/components/Promo/load_models.vue +++ b/front/src/components/Promo/load_models.vue @@ -22,27 +22,26 @@ import { useLoading } from '../../stores/loading'; import { mobileAndTabletCheck } from '../../helpers'; import { useTimer } from '../../stores/timer'; import { useRawData } from '../../stores/raw_data'; -import { OrbitControlsProps } from '@tresjs/cientos/dist/core/controls/OrbitControls.vue.js'; const props = defineProps(['source', 'loaded_pan']) -const CON_MOVETO_COUNT = 150; -const CAM_MOVETO_COUNT = 10; const models = ref([]) const clickable_items = ref([]) const clickable_refs = ref([]) const envVars = reactive({}) as EnvVars const process_loading = ref(null) +const targetDistance = reactive({ max: 10, min: 0 }) let sidebar_clickable = [] as PromoScene[] let sidebar_visible = [] as PromoScene[] let addTexture: any +const COUNT = 100 const controls_targetto = ref() as Ref; -const controls_targetto_count = ref(CON_MOVETO_COUNT) +const controls_targetto_count = ref(COUNT) const camera_moveto = ref() as Ref; -const camera_moveto_count = ref(CON_MOVETO_COUNT) +const camera_moveto_count = ref(COUNT) const camera_rotatetoto = ref() as Ref; -const camera_rotatetoto_count = ref(CAM_MOVETO_COUNT) +const camera_rotatetoto_count = ref(COUNT) const sidebar = usePromoSidebar(); const sidebar_scene = usePromoScene(); @@ -90,14 +89,13 @@ const setEnv = async () => { const setControls = () => { if (!controls.value) return; controls.value.enabled = false; - (controls.value as any).minDistance = mobileAndTabletCheck() ? raw_dataStore.data.min_distance * 0.5 : raw_dataStore.data.min_distance; + targetDistance.max = raw_dataStore.data.max_distance; + targetDistance.min = mobileAndTabletCheck() ? raw_dataStore.data.min_distance * 0.5 : raw_dataStore.data.min_distance; + // (controls.value as any).minDistance = mobileAndTabletCheck() ? raw_dataStore.data.min_distance * 0.5 : raw_dataStore.data.min_distance; (controls.value as any).maxDistance = raw_dataStore.data.max_distance; - camera.value?.position.set( - (controls.value as any).maxDistance * 0.5, - (controls.value as any).maxDistance * 0.5, - (controls.value as any).maxDistance * 0.5 - ); + const d = targetDistance.max * 0.5 + camera.value?.position.set(d, d, d); (controls.value as any).target = new Vector3(0, 0, 0); (controls.value as any).autoRotate = false; @@ -268,8 +266,8 @@ const loadModels = async () => { } const gotoCenterAndDistance = () => { - (controls.value as any).minDistance = mobileAndTabletCheck() ? raw_dataStore.data.min_distance * 0.5 : raw_dataStore.data.min_distance; - (controls.value as any).maxDistance = raw_dataStore.data.max_distance; + targetDistance.min = mobileAndTabletCheck() ? raw_dataStore.data.min_distance * 0.5 : raw_dataStore.data.min_distance; + targetDistance.max = raw_dataStore.data.max_distance; controls_targetto.value = new Vector3(0, 0, 0); camera_moveto.value = new Vector3( raw_dataStore.data.max_distance * 0.5, @@ -305,20 +303,19 @@ watch(() => sidebar.is_open && sidebar.id_clickable, () => { if (!target) return const el = seekByName(scene.value, `${sidebar.id_clickable}_clickable`); if (el) { - (controls.value as any).maxDistance = 10; - (controls.value as any).minDistance = 1; + targetDistance.max = 10 + targetDistance.min = 1 const target_vector = new Vector3(); el.getWorldPosition(target_vector); + target_vector.y = 10; controls_targetto.value = target_vector; - const distance = (controls.value as any).target.distanceTo(target_vector) - controls_targetto_count.value = parseInt(distance) * 10 - const quaternion = new Quaternion(); quaternion.setFromAxisAngle(new Vector3(1, 0, 0), -45 * 4 * (Math.PI / 180)); - // camera.value?.applyQuaternion(quaternion) camera_rotatetoto.value = quaternion + camera.value.rotation.z += Math.PI/2 + camera_moveto.value = target_vector; } } }, { deep: true }) @@ -331,47 +328,45 @@ onAfterRender(() => { const dis_to_cam = camera.value?.position.distanceTo(el.value[0].position); if (dis_to_cam) { - // console.log(dis_to_cam) const scaling = (1 * dis_to_cam) / 100 el.value[0].children[0].scale.set(scaling, scaling, scaling); el.value[0].updateMatrixWorld() } } }) - if (controls.value) { - if (timer.seconds_left == 0) { - (controls.value as any).update(); - } - } + const koef = 0.02 if (controls_targetto.value) { timer.stopTimer(); - (controls.value as any).target.lerp(controls_targetto.value, 0.01); + (controls.value as any).target.lerp(controls_targetto.value, koef); controls_targetto_count.value -= 1 if (controls_targetto_count.value == 0) { - controls_targetto_count.value = CON_MOVETO_COUNT - controls_targetto.value = undefined + controls_targetto_count.value = COUNT; + controls_targetto.value = undefined; } - (controls.value as any).update() } if (camera_moveto.value) { timer.stopTimer(); - camera.value?.position.lerp(camera_moveto.value, 0.01); + camera.value?.position.lerp(camera_moveto.value, koef); camera_moveto_count.value -= 1 if (camera_moveto_count.value == 0) { - camera_moveto_count.value = CON_MOVETO_COUNT - camera_moveto.value = undefined + camera_moveto.value = undefined; + camera_moveto_count.value = COUNT; + + // (controls.value as any).maxDistance = targetDistance.max; + // (controls.value as any).minDistance = targetDistance.min; } } - if (camera_rotatetoto.value && !controls_targetto.value) { + if (!camera_moveto.value && !controls_targetto.value && camera_rotatetoto.value) { timer.stopTimer(); - camera.value?.quaternion.slerp(camera_rotatetoto.value, 0.01); + camera.value?.quaternion.slerp(camera_rotatetoto.value, koef); // camera.value?.quaternion.normalize(); camera_rotatetoto_count.value -= 1; if (camera_rotatetoto_count.value == 0) { - camera_rotatetoto_count.value = CAM_MOVETO_COUNT + camera_rotatetoto_count.value = COUNT; camera_rotatetoto.value = undefined } } + (controls.value as any).update() }) const timer = useTimer() @@ -411,6 +406,7 @@ const clickEvent = (event: MouseEvent) => { .filter(Boolean) if (names.length) { sidebar.open(parseInt(names[0].replace('_clickable', ''))) + sidebar.toggleAccordion('clickable') } } const timerEvent = ['click', 'contextmenu', 'mousedown', 'mouseup', 'touchstart', 'touchend', 'touchmove'] diff --git a/front/src/components/sidebar.vue b/front/src/components/sidebar.vue index 040d137..19cd1c4 100644 --- a/front/src/components/sidebar.vue +++ b/front/src/components/sidebar.vue @@ -13,6 +13,11 @@ const clickable_obj = ref() watch(clickable_obj, () => { sidebar.open(clickable_obj.value); }) +watch(() => sidebar.id_clickable, () => { + if (sidebar.is_open) { + clickable_obj.value = sidebar.id_clickable + } +})