⚡ Added an eyeball

app/js/components/Eyeball.js

@@ -0,0 +1,48 @@
+import props from 'js/core/props';
+
+class Eyeball extends THREE.Object3D {
+  constructor() {
+    super();
+
+    var loader = new THREE.GLTFLoader();
+
+    // Load a glTF resource
+    loader.load(
+      // resource URL
+      'blue_eyeball/scene.gltf',
+      // called when the resource is loaded
+      ( gltf ) => {
+
+        this.add( gltf.scene );
+
+        // gltf.animations; // Array<THREE.AnimationClip>
+        // gltf.scene; // THREE.Scene
+        // gltf.scenes; // Array<THREE.Scene>
+        // gltf.cameras; // Array<THREE.Camera>
+        // gltf.asset; // Object
+
+      },
+      // called while loading is progressing
+      ( xhr ) => {
+
+        console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
+
+      },
+      // called when loading has errors
+      ( error ) => {
+
+        console.log( { error } );
+
+      }
+    );
+
+    this.onUpdate = this.onUpdate.bind(this);
+  }
+
+  onUpdate() {
+    this.rotation.x += props.rotation;
+    this.rotation.y += props.rotation;
+  }
+}
+
+module.exports = Eyeball;

app/js/components/Light.js

@@ -0,0 +1,26 @@
+export function createLight() {
+
+  var lightGeometry = new THREE.SphereGeometry(0.1);
+
+  var lightMaterial = new THREE.MeshStandardMaterial({
+      emissive: 0xffffee,
+      emissiveIntensity: 1,
+      color: 0x000000
+  });
+
+  var light = new THREE.PointLight(0xffffff, 1, 20, 2);
+  light.power = 50;
+  light.castShadow = true;
+  light.shadow.mapSize.width = 512;
+  light.shadow.mapSize.heigth = 512;
+  light.shadow.radius = 1.5;
+
+  light.add(new THREE.Mesh(lightGeometry, lightMaterial));
+  light.position.set(0, 5, 3);
+
+  return light;
+}
+
+export function createHemisphereLight() {
+  return new THREE.HemisphereLight(0x303F9F, 0x111111, 3);
+}

app/js/core/Webgl.js

@@ -2,14 +2,20 @@ export default class Webgl {
   constructor(w, h) {
     this.scene = new THREE.Scene();
 
-    this.camera = new THREE.PerspectiveCamera(50, w / h, 1, 1000);
+    this.camera = new THREE.PerspectiveCamera(50, w / h, 0.1, 1000);
     this.camera.position.z = 10;
 
     this._renderer = new THREE.WebGLRenderer({
       antialias: true,
+      alpha: false,
     });
     this._renderer.setPixelRatio(window.devicePixelRatio);
     this._renderer.setClearColor(0x0c171a);
+    this._renderer.gammaInput = true;
+    this._renderer.gammaOutput = true;
+    this._renderer.shadowMap.enabled = true;
+    this._renderer.shadowMap.bias = 0.0001;
+    this._renderer.shadowMap.type = THREE.PCFSoftShadowMap;
     this.dom = this._renderer.domElement;
 
     this.usePostprocessing = false;

app/js/core/props.js

@@ -1,5 +1,5 @@
 const props = {
-  rotation: 0.05,
+  rotation: 0.01,
 };
 
 module.exports = props;