<script setup lang="ts">
import { useTexture } from '@tresjs/core'
import { useGLTF } from '@tresjs/cientos'
import { ReinhardToneMapping, PCFShadowMap } from 'three';

const lamelles_count = useState<number>('lamelles_count')
const fence_section = useState<number>('fence_section')
const pillar_color = useState('pillar_color')
const lamelle_color = useState('lamelle_color')

const lSize = 0.115
const bSize = 0.0235
const pillar_size = 80 * 0.001

const { renderer } = useTresContext()
renderer.value.toneMapping = ReinhardToneMapping

renderer.value.shadowMap.enabled = true
renderer.value.shadowMap.type = PCFShadowMap

const pbrTexture = await useTexture({
    map: '/texture/Rock035_2K_Displacement.jpg',
    displacementMap: '/texture/Rock035_2K_Displacement.jpg',
    roughnessMap: '/texture/Rock035_2K_Roughness.jpg',
    normalMap: '/texture/Rock035_2K_NormalGL.jpg',
    ambientOcclusion: '/texture/Rock035_2K_AmbientOcclusion.jpg',
})
const { scene: top } = await useGLTF('/models_one/verh_100.glb')
const { scene: fence } = await useGLTF('/models_one/fence.glb')
const { scene: fastening } = await useGLTF('/models_one/krepleniye_planok (1).glb')
const { scene: lamelle } = await useGLTF('/models_one/lamel_100.glb')

const pillar_one_pos = fence_section.value * -0.5
const pillar_two_pos = fence_section.value * 0.5 + pillar_size + bSize
</script>
<template>
    <TresGroup :scale="3" :rotate-y="-Math.PI * -0.5" :translate-y="-3.25">
        <TresMesh receive-shadow cast-shadow :translate-y="-0.25" v-if="false">
            <TresCircleGeometry :args="[8, 8, 8]" :rotate-x="-Math.PI * 0.5" />
            <TresMeshStandardMaterial v-bind="pbrTexture" color="violet" />
        </TresMesh>

        <TresGroup :position="[pillar_one_pos, (lSize * -0.5), 0]" :scale="[1, 0.5, 1]">
            <ModelItem :model="fence" :remove-pos="true" :color="pillar_color" />
        </TresGroup>
        <template v-for="(n, i) in lamelles_count">
            <TresGroup :position="[pillar_one_pos, (lSize * i), 0]">
                <ModelItem :model="fence" :remove-pos="true" :color="pillar_color" />
            </TresGroup>
        </template>
        <TresGroup :position="[pillar_one_pos, (lSize * lamelles_count), 0]" :scale="[1, 0.5, 1]">
            <ModelItem :model="fence" :remove-pos="true" :color="pillar_color" />
        </TresGroup>

        <TresGroup :position="[pillar_two_pos, (lSize * -0.5), 0]" :scale="[-1, 0.5, 1]">
            <ModelItem :model="fence" :remove-pos="true" :color="pillar_color" />
        </TresGroup>
        <template v-for="(n, i) in lamelles_count">
            <TresGroup :position="[pillar_two_pos, (lSize * i), 0]" :scale="[-1, 1, 1]">
                <ModelItem :model="fence" :remove-pos="true" :color="pillar_color" />
            </TresGroup>
        </template>
        <TresGroup :position="[pillar_two_pos, (lSize * lamelles_count), 0]"
            :scale="[-1, 0.5, 1]">
            <ModelItem :model="fence" :remove-pos="true" :color="pillar_color" />
        </TresGroup>

        <template v-for="(n, i) in lamelles_count">
            <TresGroup :scale-x="fence_section * 10" :position="[pillar_size * 0.5, (lSize * i), 0.02]">
                <ModelItem :model="lamelle" :remove-pos="true" :color="lamelle_color" />
            </TresGroup>
        </template>

        <template v-for="(n, i) in lamelles_count">
            <TresGroup :position="[pillar_one_pos, (lSize * i), 0]">
                <ModelItem :model="fastening" :remove-pos="true" :color="pillar_color" />
            </TresGroup>
        </template>

        <template v-for="(n, i) in lamelles_count">
            <TresGroup :position="[pillar_two_pos, (lSize * i), 0]" :scale="[-1, 1, 1]">
                <ModelItem :model="fastening" :remove-pos="true" :color="pillar_color" />
            </TresGroup>
        </template>

        <TresGroup :scale-x="fence_section * 10" :position="[pillar_size - bSize, lamelles_count * lSize, 0]" v-if=false>
            <ModelItem :model="top" :remove-pos="true" :color="pillar_color" />
        </TresGroup>
    </TresGroup>
</template>