diff --git a/front/src/components/Promo/load_models.vue b/front/src/components/Promo/load_models.vue index 882318e..45c7084 100644 --- a/front/src/components/Promo/load_models.vue +++ b/front/src/components/Promo/load_models.vue @@ -42,7 +42,7 @@ const groundTexture = await useTexture({ const timer = ref(10) -renderer.value.capabilities.maxTextures = 4 +// renderer.value.capabilities.maxTextures = 4 renderer.value.capabilities.maxTextureSize = 512 renderer.value.capabilities.precision = 'lowp' @@ -188,44 +188,28 @@ const loadModels = async () => { setInterval(() => { if (timer.value > 0) { timer.value -= 1 + } else if (timer.value == 0 && !controls.value.autoRotate) { + camera.value?.position.set( + controls.value.minDistance * 0.5, + controls.value.minDistance * 0.5, + controls.value.minDistance + ); + (controls.value as any).autoRotate = true; + (controls.value as any).autoRotateSpeed = 1; } }, 1000) } -const { onLoop } = useRenderLoop() -onLoop(() => { +const { onAfterRender } = useLoop() +onAfterRender(() => { clickable_refs.value.map(el => { if (el.value[0] && typeof el.value[0].lookAt == 'function') { el.value[0].lookAt(camera.value?.position); } }) -}) -const { onBeforeRender, pause, resume } = useLoop() -let direction = 'plus' -onBeforeRender(() => { - if (camera.value?.rotation) { + if (controls.value) { if (timer.value == 0) { - pause() - const v = Math.PI * 0.001 - if (camera.value.rotation.x > Math.PI * 0.5 && direction == 'plus') { - direction = 'minus' - } else if (camera.value.rotation.x < Math.PI * -0.5 && direction == 'minus') { - direction = 'plus' - } - if (direction == 'plus') { - camera.value.rotation.x += v - camera.value.rotation.y += v - camera.value.rotation.z += v - } else { - camera.value.rotation.x -= v - camera.value.rotation.y -= v - camera.value.rotation.z -= v - } - setTimeout(() => { - resume() - }, 5) - } else { - resume() + (controls.value as any).update(); } } }) @@ -257,14 +241,25 @@ watch(() => props.source, () => { onMounted(() => { document.addEventListener('click', clickEvent) + document.addEventListener('click', stopTimer) + document.addEventListener('touchstart', stopTimer) if (sidebar.is_open) { sidebar.close() } }) -onUnmounted(() => { document.removeEventListener('click', clickEvent) }) +onUnmounted(() => { + document.removeEventListener('click', clickEvent) + document.removeEventListener('click', stopTimer) + document.removeEventListener('touchstart', stopTimer) +}) const pointer = reactive({ x: 0, y: 0 }) +const stopTimer = () => { + timer.value = 10; + if (controls.value.autoRotate) { + controls.value.autoRotate = false; + } +} const clickEvent = (event: MouseEvent) => { - timer.value = 10 const x = (event.clientX / window.innerWidth) * 2 - 1 const y = - (event.clientY / window.innerHeight) * 2 + 1 if (x == pointer.x && y == pointer.y) return