import * as THREE from "three";
import { Water } from "three/examples/jsm/objects/Water.js";

// 基本场景
const scene = new THREE.Scene();
scene.background = new THREE.Color("#171717");

const camera = new THREE.PerspectiveCamera(
  60,
  window.innerWidth / window.innerHeight,
  0.1,
  2000
);
camera.position.set(60, 60, 100);
camera.lookAt(0, 0, 0);

const renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.outputColorSpace = THREE.SRGBColorSpace;
document.body.style.margin = "0";
document.body.appendChild(renderer.domElement);

// 水面（仅依赖一张法线贴图）
const waterNormals = new THREE.TextureLoader().load("/textures/water.png");
waterNormals.wrapS = waterNormals.wrapT = THREE.RepeatWrapping;

const water = new Water(new THREE.PlaneGeometry(100, 100), {
  textureWidth: 1024,
  textureHeight: 1024,
  waterNormals,
  sunDirection: new THREE.Vector3(1, 1, 1).normalize(),
  sunColor: 0xffffff,
  waterColor: 0x1e90ff,
  distortionScale: 2.5,
});
water.rotation.x = -Math.PI / 2;
scene.add(water);

// 动画
const clock = new THREE.Clock();
(function animate() {
  requestAnimationFrame(animate);
  water.material.uniforms.time.value += clock.getDelta();
  renderer.render(scene, camera);
})();
