// @ts-nocheck

import * as THREE from 'three'
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'
import { RGBELoader } from 'three/examples/jsm/loaders/RGBELoader.js'
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'
import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js'

const scence = new THREE.Scene()

const camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 1000)
camera.position.set(5, 2, 2)
// camera.lookAt(0, 0, 0)

const renderer = new THREE.WebGLRenderer()
renderer.setSize(window.innerWidth / 2, window.innerHeight / 2)
document.body.appendChild(renderer.domElement)

// -----------------------------------------------------------------
// -----------------------------------------------------------------

	// 实例化gltf加载器
	const gltfLoader = new GLTFLoader()
	gltfLoader.load(
		// 模型路径
		'../public/assets/model/Duck.glb', // （这个模型是没有经过压缩的，所以不需要使用解码器）
		// 加载完成的回调
		gltf => {
			console.log('gltf-Duck=', gltf)
			scence.add(gltf.scene)
		}
	)
	
	// 实例化解码器draco
	const dracoLoader = new DRACOLoader()
	// 设置draco路径
	dracoLoader.setDecoderPath('../public/draco/') `这里的路径必须进入draco文件夹中【../public/draco/】，否则报错`
	// 设置gltf加载器的解码器
	gltfLoader.setDRACOLoader(dracoLoader)
	gltfLoader.load(
		/*
		因为`city.glb`是压缩过的，不使用解码器的话就会报错：
		Error: THREE.GLTFLoader: No DRACOLoader instance provided.
		所以，就需要解压缩咯
		*/
		'../public/assets/model/city.glb',
		gltf => {
			console.log('gltf-city=', gltf)
			scence.add(gltf.scene)
		}
	)



const rgbeLoader = new RGBELoader()
rgbeLoader.load('../public/assets/texture/Alex_Hart-Nature_Lab_Bones_2k.hdr', (envMap) => {
  envMap.mapping = THREE.EquirectangularReflectionMapping
  scence.environment = envMap
})


scence.fog = new THREE.Fog(0x999999, 0.1, 50)
// scence.fog = new THREE.FogExp2(0x999999, 0.1)
scence.background = new THREE.Color(0x999999)

// -----------------------------------------------------------------
// -----------------------------------------------------------------

const axesHelper = new THREE.AxesHelper(5)
scence.add(axesHelper)

const controls = new OrbitControls(camera, renderer.domElement)
controls.enableDamping = true
controls.dampingFactor = 0.05

function render() {
  controls.update()
  requestAnimationFrame(render)
  renderer.render(scence, camera)
}
render()