Submission: Terry Sun

glsl/copy.frag.glsl

@@ -10,6 +10,17 @@ varying vec3 v_position;
 varying vec3 v_normal;
 varying vec2 v_uv;
 
+vec3 applyNormalMap(vec3 geomnor, vec3 normap) {
+    normap = normap * 2.0 - 1.0;
+    vec3 up = normalize(vec3(0.001, 1, 0.001));
+    vec3 surftan = normalize(cross(geomnor, up));
+    vec3 surfbinor = cross(geomnor, surftan);
+    return normap.y * surftan + normap.x * surfbinor + normap.z * geomnor;
+}
+
 void main() {
-    // TODO: copy values into gl_FragData[0], [1], etc.
+    gl_FragData[0] = vec4(v_position, 0);
+    gl_FragData[1] = vec4(v_normal, 0);
+    gl_FragData[2] = texture2D(u_colmap, v_uv);
+    gl_FragData[3] = texture2D(u_normap, v_uv);
 }

glsl/deferred/ambient.frag.glsl

@@ -7,21 +7,20 @@ precision highp int;
 
 uniform sampler2D u_gbufs[NUM_GBUFFERS];
 uniform sampler2D u_depth;
+uniform float u_ambientTerm;
 
 varying vec2 v_uv;
 
 void main() {
-    vec4 gb0 = texture2D(u_gbufs[0], v_uv);
-    vec4 gb1 = texture2D(u_gbufs[1], v_uv);
     vec4 gb2 = texture2D(u_gbufs[2], v_uv);
-    vec4 gb3 = texture2D(u_gbufs[3], v_uv);
     float depth = texture2D(u_depth, v_uv).x;
-    // TODO: Extract needed properties from the g-buffers into local variables
+
+    vec3 colmap = vec3(gb2);
 
     if (depth == 1.0) {
         gl_FragColor = vec4(0, 0, 0, 0); // set alpha to 0
         return;
     }
 
-    gl_FragColor = vec4(0.1, 0.1, 0.1, 1);  // TODO: replace this
+    gl_FragColor = vec4(u_ambientTerm * colmap, 1);
 }

glsl/deferred/blinnphong-pointlight.frag.glsl

@@ -4,6 +4,9 @@ precision highp int;
 
 #define NUM_GBUFFERS 4
 
+uniform int u_toon;
+
+uniform vec3 u_cameraPos;
 uniform vec3 u_lightCol;
 uniform vec3 u_lightPos;
 uniform float u_lightRad;
@@ -12,6 +15,8 @@ uniform sampler2D u_depth;
 
 varying vec2 v_uv;
 
+const float TOON_STEPS = 3.0;
+
 vec3 applyNormalMap(vec3 geomnor, vec3 normap) {
     normap = normap * 2.0 - 1.0;
     vec3 up = normalize(vec3(0.001, 1, 0.001));
@@ -20,20 +25,77 @@ vec3 applyNormalMap(vec3 geomnor, vec3 normap) {
     return normap.y * surftan + normap.x * surfbinor + normap.z * geomnor;
 }
 
+// vec3(diffuse, specular, falloff)
+vec3 lightTerms(vec3 normal, vec3 pos) {
+    float lightDist = length(pos - u_lightPos);
+    float falloff = max(0.0, u_lightRad - lightDist);
+
+    vec3 camdir   = normalize(u_cameraPos - pos);
+    vec3 lightdir = normalize(u_lightPos  - pos);
+
+    float diffuseTerm = clamp(dot(normal, lightdir), 0.0, 1.0);
+    vec3 H_L = normalize(lightdir + camdir);
+    float specularRV = clamp(dot(normal, H_L), 0.0, 1.0);
+    float specularTerm = pow(specularRV, 10.0);
+
+    return vec3(diffuseTerm, specularTerm, falloff);
+}
+
+float maxDepth(float depth, vec2 v_uv) {
+    float u = v_uv.x;
+    float v = v_uv.y;
+    float d1 = texture2D(u_depth, vec2(u+(2./800.), v)).x;
+    float d2 = texture2D(u_depth, vec2(u-(2./800.), v)).x;
+    float d3 = texture2D(u_depth, vec2(u, (v+2./600.))).x;
+    float d4 = texture2D(u_depth, vec2(u, (v-2./600.))).x;
+    return max(
+                max(
+                    max(
+                        abs(depth-d1), abs(depth-d2)),
+                    abs(depth-d3)),
+                abs(depth-d4)
+            );
+}
+
 void main() {
     vec4 gb0 = texture2D(u_gbufs[0], v_uv);
     vec4 gb1 = texture2D(u_gbufs[1], v_uv);
     vec4 gb2 = texture2D(u_gbufs[2], v_uv);
     vec4 gb3 = texture2D(u_gbufs[3], v_uv);
     float depth = texture2D(u_depth, v_uv).x;
-    // TODO: Extract needed properties from the g-buffers into local variables
 
-    // If nothing was rendered to this pixel, set alpha to 0 so that the
-    // postprocessing step can render the sky color.
+    // worldspace positions
+    vec3 pos = vec3(gb0);
+    // unlit surface color
+    vec3 color = vec3(gb2);
+
+    // geometry normals
+    vec3 geomnor = vec3(gb1);
+    // normal map
+    vec3 normap = vec3(gb3);
+    // final normals
+    vec3 normal = applyNormalMap(geomnor, normap);
+
     if (depth == 1.0) {
-        gl_FragColor = vec4(0, 0, 0, 0);
+        gl_FragColor = vec4(0);
         return;
     }
 
-    gl_FragColor = vec4(0, 0, 1, 1);  // TODO: perform lighting calculations
+    vec3 terms = lightTerms(normal, pos);
+    float diff = terms.x;
+    float spec = terms.y;
+    float fall = terms.z;
+
+    float lightColTotal = diff + spec;
+    if (u_toon == 1) {
+        lightColTotal = float(int(lightColTotal * TOON_STEPS)) / TOON_STEPS;
+        float surroundingDepth = maxDepth(depth, v_uv);
+        if (surroundingDepth > .01) {
+            gl_FragColor = vec4(0, 0, 0, 1);
+            return;
+        }
+    }
+
+    vec3 litColor = 0.4 * fall * color * u_lightCol * lightColTotal;
+    gl_FragColor = vec4(litColor, 1);
 }

glsl/deferred/debug.frag.glsl

@@ -26,13 +26,18 @@ void main() {
     vec4 gb2 = texture2D(u_gbufs[2], v_uv);
     vec4 gb3 = texture2D(u_gbufs[3], v_uv);
     float depth = texture2D(u_depth, v_uv).x;
-    // TODO: Extract needed properties from the g-buffers into local variables
-    // These definitions are suggested for starting out, but you will probably want to change them.
-    vec3 pos;     // World-space position
-    vec3 geomnor;  // Normals of the geometry as defined, without normal mapping
-    vec3 colmap;  // The color map - unlit "albedo" (surface color)
-    vec3 normap;  // The raw normal map (normals relative to the surface they're on)
-    vec3 nor;     // The true normals as we want to light them - with the normal map applied to the geometry normals (applyNormalMap above)
+
+    // worldspace positions
+    vec3 pos = vec3(gb0);
+    // unlit surface color
+    vec3 colmap = vec3(gb2);
+
+    // geometry normals
+    vec3 geomnor = vec3(gb1);
+    // normal map
+    vec3 normap = vec3(gb3);
+    // final normals
+    vec3 normal = applyNormalMap(geomnor, normap);
 
     if (u_debug == 0) {
         gl_FragColor = vec4(vec3(depth), 1.0);
@@ -45,7 +50,7 @@ void main() {
     } else if (u_debug == 4) {
         gl_FragColor = vec4(normap, 1.0);
     } else if (u_debug == 5) {
-        gl_FragColor = vec4(abs(nor), 1.0);
+        gl_FragColor = vec4(abs(normal), 1.0);
     } else {
         gl_FragColor = vec4(1, 0, 1, 1);
     }

glsl/deferred/scissor.frag.glsl

@@ -0,0 +1,9 @@
+#version 100
+precision highp float;
+precision highp int;
+
+uniform vec3 u_lightCol;
+
+void main() {
+    gl_FragColor = vec4(u_lightCol * .05, 1);
+}

glsl/deferred/tile.frag.glsl

@@ -0,0 +1,154 @@
+#version 100
+precision highp float;
+precision highp int;
+
+#define NUM_GBUFFERS 4
+
+uniform int u_toon;
+uniform int u_debug;
+uniform int u_watercolor;
+
+uniform vec3 u_cameraPos;
+uniform sampler2D u_gbufs[NUM_GBUFFERS];
+uniform sampler2D u_depth;
+
+uniform sampler2D u_lightsPR;
+uniform sampler2D u_lightsC;
+
+uniform sampler2D u_lightIndices;
+uniform sampler2D u_tileOffsets;
+
+uniform float u_tileIdx;
+uniform vec2 u_lightStep;
+
+const int c_maxLights = 200;
+
+varying vec2 v_uv;
+
+const float TOON_STEPS = 3.0;
+
+vec3 applyNormalMap(vec3 geomnor, vec3 normap) {
+    normap = normap * 2.0 - 1.0;
+    vec3 up = normalize(vec3(0.001, 1, 0.001));
+    vec3 surftan = normalize(cross(geomnor, up));
+    vec3 surfbinor = cross(geomnor, surftan);
+    return normap.y * surftan + normap.x * surfbinor + normap.z * geomnor;
+}
+
+// vec3(diffuse, specular, falloff)
+vec3 lightTerms(vec3 normal, vec3 pos, vec3 lightPos, float lightRad) {
+    float lightDist = length(pos - lightPos);
+    float falloff = max(0.0, lightRad - lightDist);
+
+    vec3 camdir   = normalize(u_cameraPos - pos);
+    vec3 lightdir = normalize(lightPos  - pos);
+
+    float diffuseTerm = clamp(dot(normal, lightdir), 0.0, 1.0);
+    vec3 H_L = normalize(lightdir + camdir);
+    float specularRV = clamp(dot(normal, H_L), 0.0, 1.0);
+    float specularTerm = pow(specularRV, 10.0);
+
+    return vec3(diffuseTerm, specularTerm, falloff);
+}
+
+float maxDepth(float depth, vec2 v_uv) {
+    float u = v_uv.x;
+    float v = v_uv.y;
+    float toon_width = 2.0;
+    float c_img_height = 600.0;
+    float c_img_width  = 800.0;
+    float d1 = texture2D(u_depth, vec2(u+(toon_width/c_img_width), v)).x;
+    float d2 = texture2D(u_depth, vec2(u-(toon_width/c_img_width), v)).x;
+    float d3 = texture2D(u_depth, vec2(u, (v+toon_width/c_img_height))).x;
+    float d4 = texture2D(u_depth, vec2(u, (v-toon_width/c_img_height))).x;
+    return max(
+                max(
+                    max(
+                        abs(depth-d1), abs(depth-d2)),
+                    abs(depth-d3)),
+                abs(depth-d4)
+            );
+}
+
+float discretize(float f) {
+    return float(int(f * TOON_STEPS)) / TOON_STEPS;
+}
+
+void main() {
+    vec4 gb0 = texture2D(u_gbufs[0], v_uv);
+    vec4 gb1 = texture2D(u_gbufs[1], v_uv);
+    vec4 gb2 = texture2D(u_gbufs[2], v_uv);
+    vec4 gb3 = texture2D(u_gbufs[3], v_uv);
+    float depth = texture2D(u_depth, v_uv).x;
+
+    vec3 pos = vec3(gb0); // worldspace positions
+    vec3 color = vec3(gb2); // unlit surface color
+    vec3 geomnor = vec3(gb1); // geometry normals
+    vec3 normap = vec3(gb3); // normal map
+    vec3 normal = applyNormalMap(geomnor, normap); // final normals
+
+    vec4 tileOffsetPair = texture2D(u_tileOffsets, vec2(u_tileIdx, 0));
+    int lightCount = int(tileOffsetPair.x);  // number of lights to consider
+    vec2 lightOffset = tileOffsetPair.yz; // index to start at
+
+    if (u_debug == 0) {
+        gl_FragColor = vec4(vec3(float(lightCount) / float(c_maxLights)), 1);
+        return;
+    }
+
+    if (depth == 1.0) {
+        gl_FragColor = vec4(0);
+        return;
+    }
+
+    vec3 fullColor = vec3(0);
+    vec2 offsetIdx = lightOffset * u_lightStep;
+
+    float surroundingDepth = maxDepth(depth, v_uv);
+    if (surroundingDepth > .005) {
+        gl_FragColor = vec4(0, 0, 0, 1);
+        return;
+    }
+
+    float lastLightIdx = 0.0;
+    for (int i = 0; i < c_maxLights; i++) {
+        if (i >= lightCount) {
+            break;
+        }
+        float lightIdx = texture2D(u_lightIndices, offsetIdx).x;
+        lastLightIdx = lightIdx;
+
+        vec4 lightPR = texture2D(u_lightsPR, vec2(lightIdx, 0));
+        vec4 lightC  = texture2D(u_lightsC,  vec2(lightIdx, 0));
+
+        vec3 lightCol = vec3(lightC);
+        vec3 lightPos = lightPR.xyz;
+        float lightRad = lightPR.w;
+
+        vec3 terms = lightTerms(normal, pos, lightPos, lightRad);
+        float diff = terms.x;
+        float spec = terms.y;
+        float atten = terms.z;
+        float lightColorTerm = diff + spec;
+
+        if (u_toon == 1) {
+            lightColorTerm = discretize(lightColorTerm);
+        }
+
+        vec3 lightColor = 0.15 * atten * color * lightCol * (diff + spec);
+
+        fullColor += lightColor;
+        offsetIdx.x += u_lightStep.x;
+        if (offsetIdx.x >= 1.0) {
+            offsetIdx.x = 0.0;
+            offsetIdx.y += u_lightStep.y;
+        }
+    }
+
+    if (u_watercolor == 1) {
+        fullColor = vec3(discretize(fullColor.x),
+                            discretize(fullColor.y),
+                            discretize(fullColor.z));
+    }
+    gl_FragColor = vec4(fullColor, 1);
+}

index.html

@@ -96,7 +96,7 @@
         (Disable before measuring performance.)
     </div>
     <div id="dlbutton">
-        <button type="button" action="" onclick="downloadCanvas();">Screenshot</button>
+        <button type="button" action="" title="Debug mode only" disabled onclick="downloadCanvas();">Screenshot</button>
     </div>
     <div id="alertcontainer">
         <div id="alertbox"><pre id="alerttext"></pre></div>