<script setup lang="ts">
import {
    PCFSoftShadowMap,
    CineonToneMapping,
    PMREMGenerator,
} from 'three';

import { GainMapLoader, } from '@monogrid/gainmap-js'

const { scene, renderer, camera } = useTresContext()

renderer.value.toneMapping = CineonToneMapping
renderer.value.toneMappingExposure = 1

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

const pmremGenerator = new PMREMGenerator(renderer.value);
pmremGenerator.compileEquirectangularShader();

onMounted(async () => {
    const loader = new GainMapLoader(renderer.value)
    const result = await loader.loadAsync([
        'hdrmaps/hdr.webp',
        'hdrmaps/hdr-gainmap.webp',
        'hdrmaps/hdr.json',
    ])
    if (renderer.value && camera.value) {
        renderer.value.render(scene.value, camera.value)
    }
    const exrCubeRenderTarget = pmremGenerator.fromEquirectangular(result.renderTarget.texture);
    const newEnvMap = exrCubeRenderTarget ? exrCubeRenderTarget.texture : null;

    scene.value.environment = newEnvMap
    scene.value.environmentIntensity = 1.25
    scene.value.environmentRotation.z = 0.25
    result.renderTarget.texture.dispose();
})
</script>
<template></template>