<script setup lang="ts">
//@ts-ignore
import { useGLTF } from '@tresjs/cientos'
import { useTresContext } from '@tresjs/core'
import { Vector3 } from 'three'
import { ref, onMounted } from 'vue'

const { camera, controls } = useTresContext()

const { scene: obj } = await useGLTF('/models/bench2_export-v1.glb')
const scale = ref(1) // Масштаб объекта

onMounted(() => {
  if (obj && camera.value && controls.value) {
    const distance = 10
    const cameraOffset = { x: 1, y: 0.75, z: -1.25 } // Смещение камеры

    // Вычисляем масштаб и позицию камеры
    const { scale: objectScale } = calculateScaleToFit(
      obj,
      camera.value as any,
      controls.value as any,
      distance,
      cameraOffset
    )

    scale.value = objectScale
  }
})
</script>

<template>
  <Suspense>
    <TresGroup :position-y="0" :scale="new Vector3(scale, scale, scale)">
      <ModelItem :model="obj" :target="[0, 0, 0]" />
    </TresGroup>
  </Suspense>
</template>