finished

src/main.ts

@@ -20,6 +20,7 @@ let icosphere: Icosphere;
 let square: Square;
 let cube: Cube;
 let prevTesselations: number = 5;
+let time: number = 0;
 
 function loadScene() {
   icosphere = new Icosphere(vec3.fromValues(0, 0, 0), 1, controls.tesselations);
@@ -44,7 +45,7 @@ function main() {
   gui.add(controls, 'tesselations', 0, 8).step(1);
   gui.add(controls, 'Load Scene');
   var color = {
-    color: [ 0, 128, 255 ], // RGB array
+    color: [255, 128, 128], // RGB array
   };
   gui.addColor(color, 'color');
 
@@ -64,7 +65,7 @@ function main() {
   const camera = new Camera(vec3.fromValues(0, 0, 5), vec3.fromValues(0, 0, 0));
 
   const renderer = new OpenGLRenderer(canvas);
-  renderer.setClearColor(0.2, 0.2, 0.2, 1);
+  renderer.setClearColor(177.0 / 255.0, 204.0 / 255.0, 193.0 / 255.0, 1);
   gl.enable(gl.DEPTH_TEST);
 
   const lambert = new ShaderProgram([
@@ -78,6 +79,7 @@ function main() {
 
   // This function will be called every frame
   function tick() {
+    time++;
     camera.update();
     stats.begin();
     gl.viewport(0, 0, window.innerWidth, window.innerHeight);
@@ -92,7 +94,7 @@ function main() {
       //icosphere,
       //square,
       cube
-    ], color.color);
+    ], color.color, time);
     stats.end();
 
     // Tell the browser to call `tick` again whenever it renders a new frame

src/rendering/gl/OpenGLRenderer.ts

@@ -22,7 +22,7 @@ class OpenGLRenderer {
     gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
   }
 
-  render(camera: Camera, prog: ShaderProgram, drawables: Array<Drawable>, color: Array<number>) {
+  render(camera: Camera, prog: ShaderProgram, drawables: Array<Drawable>, color: Array<number>, time: number) {
     let model = mat4.create();
     let viewProj = mat4.create();
     //let color = vec4.fromValues(1, 0, 0, 1);
@@ -32,6 +32,7 @@ class OpenGLRenderer {
     prog.setModelMatrix(model);
     prog.setViewProjMatrix(viewProj);
     prog.setGeometryColor(vec4.fromValues(color[0]/255, color[1]/255, color[2]/255, 1));
+    prog.setTime(time);
 
     for (let drawable of drawables) {
       prog.draw(drawable);

src/rendering/gl/ShaderProgram.ts

@@ -29,6 +29,7 @@ class ShaderProgram {
   unifModelInvTr: WebGLUniformLocation;
   unifViewProj: WebGLUniformLocation;
   unifColor: WebGLUniformLocation;
+  unifTime: WebGLUniformLocation;
 
   constructor(shaders: Array<Shader>) {
     this.prog = gl.createProgram();
@@ -48,6 +49,7 @@ class ShaderProgram {
     this.unifModelInvTr = gl.getUniformLocation(this.prog, "u_ModelInvTr");
     this.unifViewProj   = gl.getUniformLocation(this.prog, "u_ViewProj");
     this.unifColor      = gl.getUniformLocation(this.prog, "u_Color");
+    this.unifTime = gl.getUniformLocation(this.prog, "u_Time");
   }
 
   use() {
@@ -85,6 +87,13 @@ class ShaderProgram {
     }
   }
 
+  setTime(time: number) {
+    this.use();
+    if (this.unifTime !== -1) {
+      gl.uniform1i(this.unifTime, time);
+    }
+  }
+
   draw(d: Drawable) {
     this.use();
 

src/shaders/noise-frag.glsl

@@ -2,7 +2,8 @@
 
 precision highp float;
 
-uniform vec4 u_Color; 
+uniform vec4 u_Color;
+uniform highp int u_Time;
 
 in vec4 fs_Pos;
 in vec4 fs_Nor;
@@ -25,13 +26,14 @@ float surflet(vec3 p, vec3 corner) {
   vec3 falloff = vec3(1.f) - 6.f * vec3(pow(t.x, 5.f),pow(t.y, 5.f), pow(t.z, 5.f)) 
                         + 15.f * vec3(pow(t.x, 4.f), pow(t.y, 4.f),pow(t.z, 4.f)) 
                         - 10.f * vec3(pow(t.x, 3.f), pow(t.y, 3.f),pow(t.z, 3.f));
-  vec3 gradient = random3(corner) * 2.f - vec3(1.f);
+  vec3 gradient = random3(corner) * 2.f - vec3(sin(0.02 * float(u_Time)) + 1.f);
   vec3 dist = p - corner;
   float dotProd = dot(dist, gradient);
   return dotProd * falloff.x * falloff.y * falloff.z;
 }
 
 float perlin(vec3 p) {
+  p = p * 1.5;
   float surfletSum = 0.f;
   for (int dx = 0; dx <= 1; dx++) {
     for (int dy = 0; dy <= 1; dy++) {
@@ -43,6 +45,26 @@ float perlin(vec3 p) {
   return surfletSum;
 }
 
+float worley(vec3 p) {
+  p *= 1.5;
+  vec3 pInt = floor(p);
+  vec3 pFract = fract(p);
+  float minDist = 1.0;
+  for (int x = -1; x <= 1; x++) {
+    for (int y = -1; y <= 1; y++) {
+      for (int z = -1; z <= 1; z++) {
+        vec3 neighbor = vec3(float(x), float(y), float(z));
+        vec3 voronoi = random3(pInt + neighbor);
+        voronoi = 0.5 + 0.5 * sin(0.1 * float(u_Time) + 13.2831 * voronoi);
+        vec3 diff = neighbor + voronoi - pFract;
+        float dist = length(diff);
+        minDist = min(minDist, dist);
+      }
+    }
+  }
+  return minDist;
+}
+
 void main()
 {
   vec4 diffuseColor = u_Color;
@@ -57,14 +79,13 @@ void main()
   float lightIntensity = diffuseTerm + ambientTerm;   //Add a small float value to the color multiplier
                                                       //to simulate ambient lighting. This ensures that faces that are not
                                                       //lit by our point light are not completely black.
-  float perlinNoise = perlin(vec3(fs_Pos.x, fs_Pos.y, fs_Pos.z));
-  vec3 a = vec3(1.000, 0.500, 0.500);
-	vec3 b = vec3(0.5);
-	vec3 d = vec3(0.750, 1.000, 0.667);
-	vec3 c = vec3(0.800, 1.000, 0.333);
-  vec3 perlinColor = a + b * cos(6.28 * (perlinNoise * 2. * c * diffuseTerm + d));
+  float perlinNoise = perlin(vec3(fs_Pos));
+  vec3 a = vec3(u_Color);
+	vec3 b = vec3(0.688, 0.558, 0.500);
+	vec3 c = vec3(255.0 / 255.0, 244.0 / 255.0, 224.0 / 255.0);
+	vec3 d = vec3(0.588, -0.342, 0.048);
+  vec3 perlinColor = a + b * cos(6.28 * worley(vec3(fs_Pos)) * perlinNoise * 4. * c + d);
 
   // Compute final shaded color
-  // out_Col = vec4(diffuseColor.rgb * lightIntensity, diffuseColor.a);
-  out_Col = vec4(perlinColor.rgb * lightIntensity, diffuseColor.a);;
+  out_Col = vec4(perlinColor.rgb * lightIntensity, diffuseColor.a);
 }

src/shaders/noise-vert.glsl

@@ -1,35 +1,58 @@
 #version 300 es
 
-uniform mat4 u_Model;      
-uniform mat4 u_ModelInvTr;  
-uniform mat4 u_ViewProj;    
-in vec4 vs_Pos;             
-in vec4 vs_Nor;             
-in vec4 vs_Col;  
-out vec4 fs_Pos;           
-out vec4 fs_Nor;            
-out vec4 fs_LightVec;      
-out vec4 fs_Col;         
-
-const vec4 lightPos = vec4(5, 5, 3, 1); 
+//This is a vertex shader. While it is called a "shader" due to outdated conventions, this file
+//is used to apply matrix transformations to the arrays of vertex data passed to it.
+//Since this code is run on your GPU, each vertex is transformed simultaneously.
+//If it were run on your CPU, each vertex would have to be processed in a FOR loop, one at a time.
+//This simultaneous transformation allows your program to run much faster, especially when rendering
+//geometry with millions of vertices.
+
+uniform mat4 u_Model;       // The matrix that defines the transformation of the
+                            // object we're rendering. In this assignment,
+                            // this will be the result of traversing your scene graph.
+
+uniform mat4 u_ModelInvTr;  // The inverse transpose of the model matrix.
+                            // This allows us to transform the object's normals properly
+                            // if the object has been non-uniformly scaled.
+
+uniform mat4 u_ViewProj;    // The matrix that defines the camera's transformation.
+                            // We've written a static matrix for you to use for HW2,
+                            // but in HW3 you'll have to generate one yourself
+uniform highp int u_Time;
+in vec4 vs_Pos;             // The array of vertex positions passed to the shader
+
+in vec4 vs_Nor;             // The array of vertex normals passed to the shader
+
+in vec4 vs_Col;             // The array of vertex colors passed to the shader.
+
+out vec4 fs_Pos;
+out vec4 fs_Nor;            // The array of normals that has been transformed by u_ModelInvTr. This is implicitly passed to the fragment shader.
+out vec4 fs_LightVec;       // The direction in which our virtual light lies, relative to each vertex. This is implicitly passed to the fragment shader.
+out vec4 fs_Col;            // The color of each vertex. This is implicitly passed to the fragment shader.
+
+const vec4 lightPos = vec4(5, 5, 5, 1); //The position of our virtual light, which is used to compute the shading of
+                                        //the geometry in the fragment shader.
 
 void main()
 {
-  fs_Pos = vs_Pos;
-  fs_Col = vs_Col;                         // Pass the vertex colors to the fragment shader for interpolation
+    fs_Col = vs_Col;                         // Pass the vertex colors to the fragment shader for interpolation
 
-  mat3 invTranspose = mat3(u_ModelInvTr);
-  fs_Nor = vec4(invTranspose * vec3(vs_Nor), 0);          // Pass the vertex normals to the fragment shader for interpolation.
-                                                          // Transform the geometry's normals by the inverse transpose of the
-                                                          // model matrix. This is necessary to ensure the normals remain
-                                                          // perpendicular to the surface after the surface is transformed by
-                                                          // the model matrix.
+    mat3 invTranspose = mat3(u_ModelInvTr);
+    fs_Nor = vec4(invTranspose * vec3(vs_Nor), 0);          // Pass the vertex normals to the fragment shader for interpolation.
+                                                            // Transform the geometry's normals by the inverse transpose of the
+                                                            // model matrix. This is necessary to ensure the normals remain
+                                                            // perpendicular to the surface after the surface is transformed by
+                                                            // the model matrix.
 
 
-  vec4 modelposition = u_Model * vs_Pos;   // Temporarily store the transformed vertex positions for use below
+    vec4 modelposition = u_Model * vs_Pos;   // Temporarily store the transformed vertex positions for use below
+    fs_Pos = modelposition;
+
+    modelposition.x += pow(sin((modelposition.y * 20.f + float(u_Time) * 0.05)), 2.0);
+    modelposition.y += sin((modelposition.y * 10.f + float(u_Time) * 0.05));
 
-  fs_LightVec = lightPos - modelposition;  // Compute the direction in which the light source lies
+    fs_LightVec = lightPos - modelposition;  // Compute the direction in which the light source lies
 
-  gl_Position = u_ViewProj * modelposition;// gl_Position is a built-in variable of OpenGL which is
-                                            // used to render the final positions of the geometry's vertices
+    gl_Position = u_ViewProj * modelposition;// gl_Position is a built-in variable of OpenGL which is
+                                             // used to render the final positions of the geometry's vertices
 }