several bounces

src/components/Raytracer/Renderer.wgsl

@@ -46,13 +46,29 @@ struct RayHit { position: vec3f, normal: vec3f, distance: f32, index: i32 }
  */
 fn color(camera_ray: Ray) -> ColorRGB
 {
-  let hit = trace_ray(camera_ray);
-  if (hit.distance < 0.0 || hit.index < 0) { return color_background(); }
+  var ray = camera_ray;
+  var color = ColorRGB(0.0);
+  var multiplier = 1.0;
 
-  let sphere = spheres[hit.index];
-  let light_direction = normalize(light.position - hit.position);
-  let color = materials[u32(sphere.material_index)].color;
-  return color * max(dot(light_direction, hit.normal), 0.0);
+  let bounces: u32 = 4;
+  for (var i: u32 = 0; i < bounces; i++) {
+    let hit = trace_ray(ray);
+    if (hit.distance < 0.0 || hit.index < 0) {
+      color += multiplier * color_background();
+      break;
+    }
+
+    let light_direction = normalize(light.position - hit.position);
+    let light_intensity = max(dot(light_direction, hit.normal), 0.0);
+    let sphere = spheres[hit.index];
+    let sphere_color = materials[u32(sphere.material_index)].color;
+    color += sphere_color * light_intensity * multiplier;
+    multiplier *= 0.7;
+    ray.direction = reflect(ray.direction, hit.normal);
+    ray.origin = hit.position + ray.direction * 0.001;
+  }
+
+  return color;
 }
 
 fn color_background() -> ColorRGB

src/components/Raytracer/useVariables.ts

@@ -40,17 +40,17 @@ export const useVariables = (): {
       'Sphere 0': folder({
         sphere0MaterialIndex: {...materialIndexCommonProps, value: 0},
         sphere0Radius: {...radiusCommonProps, value: 0.8},
-        sphere0Position: {...positionCommonProps, value: [-0.2, 0.0, -4.1]},
+        sphere0Position: {...positionCommonProps, value: [-1.6, 0.7, -8.1]},
       }),
       'Sphere 1': folder({
         sphere1MaterialIndex: {...materialIndexCommonProps, value: 1},
-        sphere1Radius: {...radiusCommonProps, value: 1.1},
-        sphere1Position: {...positionCommonProps, value: [1.9, 0.1, -8.0]},
+        sphere1Radius: {...radiusCommonProps, value: 1.5},
+        sphere1Position: {...positionCommonProps, value: [2.9, 1.1, -10.0]},
       }),
       'Sphere 2': folder({
         sphere2MaterialIndex: {...materialIndexCommonProps, value: 2},
         sphere2Radius: {...radiusCommonProps, value: 1.0},
-        sphere2Position: {...positionCommonProps, value: [0.7, -0.4, -6.1]},
+        sphere2Position: {...positionCommonProps, value: [0.7, -0.4, -12.1]},
       }),
     }),
   });