import {
  PerspectiveCamera,
  WebGLRenderer,
  CineonToneMapping,
  Scene
} from "./js/three_modules";

import getUrlParams from "./js/getUrlParams.js";
import archVizControls from "./js/controls.js";
import cLoader from "./js/loader.js";
import Lights from "./js/lights.js";
import UserInterface from "./js/interface.js";

const params = getUrlParams();

var controls, scene, camera, renderer, ui, lights;

function init3D() {

  "use strict";

  //Setup the renderer
  renderer = new WebGLRenderer({
    physicallyCorrectLights: false,
    alpha: false,
    precision: "highp",
    antialias: true,
    toneMapping: CineonToneMapping
  });
  renderer.setSize(window.innerWidth, window.innerHeight);
  renderer.setPixelRatio(window.devicePixelRatio || 1);
  document.getElementById("viewport").appendChild(renderer.domElement);

  //Setup the Scene
  scene = new Scene();

  //Setup the camera
  camera = new PerspectiveCamera(70, window.innerWidth / window.innerHeight, 0.01, 1000);

  //Load the scene
  new cLoader(scene).load("./data/" + params.scene + "/" + params.scene + ".json", function () {

    scene.matrixAutoUpdate = false;

    controls = new archVizControls(scene, camera, renderer);

    lights = new Lights(scene);

    ui = new UserInterface(lights, renderer, controls);

    render();

  });

  //RESIZE THE CANVAS AUTOMATICALLY
  window.addEventListener("resize", function () {

    camera.aspect = window.innerWidth / window.innerHeight;
    camera.updateProjectionMatrix();

    renderer.setSize(window.innerWidth, window.innerHeight);

  }, false);


}

//Render function runs every frame, but thanks to requestAnimationFrame only when the Tab is active
function render() {
  "use strict";
  //Only runs if the Tab is active
  requestAnimationFrame(render);
  if (ui.rendering === true) {
    controls.update();
    renderer.render(scene, camera);
  }

}

init3D();