import * as THREE from './../node_modules/three/src/Three.js';

import { OrbitControls } from './../node_modules/three/examples/jsm/controls/OrbitControls.js';
import { Reflector } from './../node_modules/three/examples/jsm/objects/Reflector.js';
import { FBXLoader } from './../node_modules/three/examples/jsm/loaders/FBXLoader.js';

//scene
var scene = new THREE.Scene();

//raycaster
var raycaster = new THREE.Raycaster();
var mouse = new THREE.Vector2();
var rayCastable = [];

var HDR = new THREE.CubeTextureLoader().setPath('textures/HDR/').load(
    [
        'posx.jpg', 'negx.jpg', 'posy.jpg', 'negy.jpg', 'posz.jpg', 'negz.jpg'
    ]
);
HDR.format = THREE.RGBFormat;

//materials
var textureLoader = new THREE.TextureLoader();
var wrapping = function (texture) {
    texture.wrapS = THREE.RepeatWrapping;
    texture.wrapT = THREE.RepeatWrapping;
    texture.repeat = new THREE.Vector2(1, 1);
}

var wood = new THREE.MeshPhysicalMaterial(
    {
        map: textureLoader.load("./textures/wood/albedo.png", wrapping),
        normalMap: textureLoader.load('textures/wood/normal.png', wrapping),
        metalnessMap: textureLoader.load('textures/wood/metallic.png', wrapping),
        //roughnessMap: textureLoader.load('textures/wood/roughness.png'),
        roughness: 0.6,
        envMap: HDR,
    }
)

var concrete = new THREE.MeshPhysicalMaterial(
    {
        map: textureLoader.load("./textures/concrete/albedo.png", wrapping),
        normalMap: textureLoader.load('textures/concrete/normal.png', wrapping),
        //metalnessMap: textureLoader.load('textures/concrete/metallic.png'),
        roughnessMap: textureLoader.load('textures/wood/roughness.png', wrapping),
        metalness: 0,
        envMap: HDR,
    }
)

var wrappingGrass = function (texture) {
    texture.wrapS = THREE.RepeatWrapping;
    texture.wrapT = THREE.RepeatWrapping;
    texture.repeat = new THREE.Vector2(10, 10);
}

var grass = new THREE.MeshPhysicalMaterial(
    {
        map: textureLoader.load("./textures/grass/albedo.png", wrappingGrass),
        normalMap: textureLoader.load('textures/grass/normal.png', wrappingGrass),
        //metalnessMap: textureLoader.load('textures/grass/metallic.png'),
        //roughnessMap: textureLoader.load('textures/grass/roughness.png', wrapping),
        roughness: 1,
        metalness: 0,
        envMap: HDR,
    }
)

var aluminium = new THREE.MeshPhysicalMaterial(
    {
        map: textureLoader.load('textures/aluminium/albedo.png', wrappingGrass),
        normalMap: textureLoader.load('textures/aluminium/normal.png', wrappingGrass),
        metalnessMap: textureLoader.load('textures/aluminium/metallic.png', wrappingGrass),
        roughnessMap: textureLoader.load('textures/aluminium/roughness.png', wrappingGrass),
        envMap: HDR
    }
);

var tiles = new THREE.MeshPhysicalMaterial(
    {
        map: textureLoader.load('textures/tiles/albedo.png', wrapping),
        normalMap: textureLoader.load('textures/tiles/normal.png', wrapping),
        //metalnessMap: textureLoader.load('textures/tiles/metallic.png', wrapping),
        metalness: 0,
        roughnessMap: textureLoader.load('textures/tiles/roughness.png', wrapping),
        envMap: HDR
    }
);

var materials = [wood, aluminium, concrete, tiles];
var index = 0;

//lights
var keyLight = new THREE.SpotLight(0x404040, 1);
keyLight.position.set(-100, 200, -250);
keyLight.castShadow = true;
scene.add(keyLight);
keyLight.shadow.mapSize.width = keyLight.shadow.mapSize.height = 2048;
keyLight.shadow.bias = 0.05;

var secondLight = new THREE.SpotLight(0x404040);
secondLight.position.set(100, 200, -250);
secondLight.intensity = 0.5;
secondLight.castShadow = true;
scene.add(secondLight);

var thirdLight = new THREE.SpotLight(0x404040);
thirdLight.position.set(-100, -50, 250);
thirdLight.castShadow = true;
scene.add(thirdLight);

var overallLight = new THREE.AmbientLight(0x404040);
overallLight.intensity = 1;
scene.add(overallLight);

//camera
let perspectiveCamera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 1000);
perspectiveCamera.position.set(0, 200, -200);
scene.add(perspectiveCamera);

//renderer creation
var renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setClearColor("#777777");
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.PCFSoftShadowMap;

document.body.appendChild(renderer.domElement);



//objects
var loader = new FBXLoader();
loader.load('meshes/Camargue_aluminium.fbx', function (object) {
    // object.traverse(function (child) {
    //     if (child.isMesh) {
    //         child.material = aluminium;
    //         child.castShadow = true;
    //     }
    // });

    scene.add(object);
    rayCastable.push(object);
});

var loader2 = new FBXLoader();
    loader2.load('meshes/Camargue_wood.fbx', function (object) {
        // object.traverse(function (child) {
        //     if (child.isMesh) {
        //         child.material = wood;
        //         child.castShadow = true;
        //     }
        // });

        scene.add(object);
        rayCastable.push(object);
    });

var geometryPlane = new THREE.PlaneBufferGeometry(1000, 1000, 1);
// var material = chrome;
var plane = new THREE.Mesh(geometryPlane, grass);
// var cubeCamera = new THREE.CubeCamera(plane);
// cubeCamera.position.set(0, 0, 0);
//material.envMap = cubeCamera.texture;

//var plane = new Reflector( geometryPlane, { clipBias: 0.003, textureWidth: 2048, textureHeight: 2048 } );
plane.rotateX(-Math.PI / 2);

plane.receiveShadow = true;
scene.add(plane);

// var helper = new THREE.CameraHelper(keyLight.shadow.camera);
// var helper2 = new THREE.CameraHelper(secondLight.shadow.camera);
// var helper3 = new THREE.CameraHelper(thirdLight.shadow.camera);
// scene.add(helper);
//scene.add(helper2);
//scene.add(helper3);

//orbit controls
let controls = new OrbitControls(perspectiveCamera, renderer.domElement);
controls.target.set(0, 0, -1);
controls.update();

//Resize event
window.addEventListener('resize', () => {
    renderer.setSize(window.innerWidth, window.innerHeight);
    perspectiveCamera.aspect = window.innerWidth / window.innerHeight;
    perspectiveCamera.updateProjectionMatrix();
});

window.addEventListener('mousemove', function (event) {
    mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
    mouse.y = - (event.clientY / window.innerHeight) * 2 + 1;

    perspectiveCamera.updateMatrixWorld();
    raycaster.setFromCamera(mouse, perspectiveCamera);
}, false);

window.addEventListener('mousedown', () => {
    var intersects = raycaster.intersectObjects(rayCastable, true);

    if (intersects.length > 0) {
        index++;
        if (index >= materials.length) {
            index = 0;
        }

        intersects[0].object.material = materials[index];
    }
});

// //render updated viewport
var update = function () {
    requestAnimationFrame(update);
    renderer.render(scene, perspectiveCamera);

    //if(cubeCamera) cubeCamera.update(renderer, scene);
};
update();