fixing floor shininess, adjusting sunlight and hemisphere light

js/main.js

@@ -81,6 +81,8 @@ function fillScene() {
     let lawnTex = textureLoader.load("textures/lawn.jpg");
     var planeGeo = new THREE.PlaneBufferGeometry(1000, 1000, 32, 32);
     let floorMat = new THREE.MeshPhongMaterial({ map: lawnTex });
+    floorMat.flatShading = true;
+    floorMat.shininess = 0;
     lawnTex.wrapS = lawnTex.wrapT = THREE.RepeatWrapping;
     lawnTex.repeat.set(5, 5);
     ground = new THREE.Mesh(planeGeo, floorMat);
@@ -90,14 +92,15 @@ function fillScene() {
 
     // lights
 
-    var spotlight = new THREE.PointLight(0xffffff, 1, 500);
-    spotlight.position.x = 0;
-    spotlight.position.y = 150;
-    spotlight.position.z = 0;
-    spotlight.castShadow = true;
-    scene.add(spotlight);
+    var sunlight = new THREE.PointLight(0xffffff, 0.8, 0, 2);
+    sunlight.position.x = 400;
+    sunlight.position.y = 400;
+    sunlight.position.z = 100;
+    sunlight.castShadow = true;
+    sunlight.shadow.camera.far = 1600;
+    scene.add(sunlight);
 
-    var mainLight = new THREE.HemisphereLight(0xB1E1FF, 0xB97A20, 1);
+    var mainLight = new THREE.HemisphereLight(0xB1E1FF, 0xB97A20, 0.6);
     mainLight.position.x = 1;
     mainLight.position.y = 1;
     mainLight.position.z = 1;