add tireNormalMap and call render every tick

src/script.js

@@ -6,7 +6,7 @@ import { Material, RGBA_ASTC_10x10_Format } from 'three'
 
 // Loading
 const textureLoader = new THREE.TextureLoader()
-// TODO: load some texture
+const tireTexture = textureLoader.load('/textures/tireNormalMap.jpg')
 
 // Debug
 const gui = new dat.GUI()
@@ -26,17 +26,20 @@ const tireGeometry = new THREE.TorusGeometry(.7, .2, 16, 100)
 const tireMaterial = new THREE.MeshStandardMaterial()
 tireMaterial.metalness = 0.7
 tireMaterial.roughness = 0.2
-tireMaterial.color = new THREE.Color(0x888888)
+tireMaterial.normalMap = tireTexture
+tireMaterial.color = new THREE.Color(0xffffff)
 
 // Mesh
 
 const tireMesh = new THREE.Mesh(tireGeometry, tireMaterial)
 scene.add(tireMesh)
 
+
 // Lights
 
 const pointLight = new THREE.PointLight(0xffffff, 0.1)
-pointLight.position.set(2,3,4);
+pointLight.position.set(2,3,4)
+pointLight.intensity = 0.3
 scene.add(pointLight)
 
 /**
@@ -87,5 +90,19 @@ renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2))
 /**
  * Render
  */
+const clock = new THREE.Clock()
+
+const tick = () => {
+    const elapsedTime = clock.getElapsedTime()
+
+    // Update objects
+    tireMesh.rotation.y = .5 * elapsedTime
 
+     // Render
     renderer.render(scene, camera)
+
+    // Call tick again on the next frame
+     window.requestAnimationFrame(tick)
+}
+
+tick()