Submission: xinyue Zhu

glsl/clear.frag.glsl

@@ -3,7 +3,7 @@
 precision highp float;
 precision highp int;
 
-#define NUM_GBUFFERS 4
+#define NUM_GBUFFERS 3
 
 void main() {
     for (int i = 0; i < NUM_GBUFFERS; i++) {

glsl/copy.frag.glsl

@@ -10,6 +10,25 @@ varying vec3 v_position;
 varying vec3 v_normal;
 varying vec2 v_uv;
 
+uniform vec3 u_spec;
+
+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.
+
+    vec3 normal=applyNormalMap(v_normal.xyz, texture2D(u_normap, v_uv).xyz);
+
+	gl_FragData[0] =  vec4(v_position,u_spec.x);
+
+    vec4 colordata= texture2D(u_colmap, v_uv); 
+	float t=colordata.x*255.0+colordata.y*10000.0;
+	gl_FragData[1] =  vec4(normal.xyz,t);
+    gl_FragData[2] = colordata;
+
 }

glsl/copy.vert.glsl

@@ -9,13 +9,17 @@ attribute vec3 a_position;
 attribute vec3 a_normal;
 attribute vec2 a_uv;
 
+
 varying vec3 v_position;
 varying vec3 v_normal;
 varying vec2 v_uv;
 
 void main() {
     gl_Position = u_cameraMat * vec4(a_position, 1.0);
-    v_position = a_position;
+
+   // v_position = vec3(a_position.xy,temp_pos.z);// a_position;
+	v_position =  a_position;
     v_normal = a_normal;
     v_uv = a_uv;
+
 }

glsl/deferred/ambient.frag.glsl

@@ -3,25 +3,23 @@
 precision highp float;
 precision highp int;
 
-#define NUM_GBUFFERS 4
+#define NUM_GBUFFERS 3
 
 uniform sampler2D u_gbufs[NUM_GBUFFERS];
 uniform sampler2D u_depth;
 
 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);
+
+    vec4 gb2 = texture2D(u_gbufs[2], v_uv);//colormap 
     float depth = texture2D(u_depth, v_uv).x;
-    // TODO: Extract needed properties from the g-buffers into local variables
+
 
     if (depth == 1.0) {
         gl_FragColor = vec4(0, 0, 0, 0); // set alpha to 0
         return;
     }
+    gl_FragColor = vec4(gb2.xyz*0.2, 1.0);  // ambient:0.2,diffuse:0.3,specular:0.6
 
-    gl_FragColor = vec4(0.1, 0.1, 0.1, 1);  // TODO: replace this
-}
+	}

glsl/deferred/blinnphong-pointlight.frag.glsl

@@ -2,38 +2,77 @@
 precision highp float;
 precision highp int;
 
-#define NUM_GBUFFERS 4
+#define NUM_GBUFFERS 3
 
 uniform vec3 u_lightCol;
 uniform vec3 u_lightPos;
 uniform float u_lightRad;
+uniform vec3 u_cameraPos;
 uniform sampler2D u_gbufs[NUM_GBUFFERS];
 uniform sampler2D u_depth;
+uniform int u_toon;
+//uniform int u_bloom;
 
 varying vec2 v_uv;
+const vec3 offset = vec3( 0.0, 2.0, 4.0);
+const float width=800.0;
+const float height=600.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;
+const vec3 offset_g = vec3( 0.0, 1.0, 2.0);//35,21,7,1 :sum:126
+const vec3 weight= vec3(0.48, 0.31, 0.17); //guess weight: 0.2778, 0.1667, 0.0556: to make it brighter it should be bigger than 1
+
+float _clampf(float t)
+{
+if(t>1.0)t=1.0;
+if(t<0.0)t=0.0;
+return t;
 }
 
 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.
+
     if (depth == 1.0) {
         gl_FragColor = vec4(0, 0, 0, 0);
         return;
     }
 
-    gl_FragColor = vec4(0, 0, 1, 1);  // TODO: perform lighting calculations
-}
+    //vec3 std_normal=applyNormalMap(gb1.xyz, gb3.xyz);
+	vec3 std_normal=gb1.xyz;
+
+	vec3 position=gb0.xyz;
+	//vec3 position=vec3(gb0.xy,depth);
+	vec3 lightray = normalize(u_lightPos-position);
+
+	vec3 basec=gb2.xyz;
+	float dis=length(u_lightPos-position);
+	vec3 eyeray =normalize(u_cameraPos-position);
+    vec3 H=normalize(lightray+ eyeray);
+    float attenuation = max(0.0, u_lightRad - dis);
+	vec3 light;
+	float diffuse= _clampf(dot(lightray,std_normal));
+	float specular= _clampf(pow(max(0.0, dot(lightray,H)), gb0.w));
+	//https://en.wikibooks.org/wiki/GLSL_Programming/Unity/Toon_Shading
+    if(u_toon>0)
+	{//ramp
+	float a=0.2;
+	float b=0.5;
+	float c=0.9;
+	float d=1.0;
+
+	if(diffuse<a){diffuse=0.0;specular=0.0;}
+	else if(diffuse<b) {diffuse=a;specular=a;}
+	else if(diffuse<c) {diffuse=b;specular=d;}
+	else {diffuse=d;specular=d;}
+    basec=vec3(1.0,1.0,1.0);
+	}
+	vec3 color;
+    vec3 phong_color= (diffuse+specular)*u_lightCol*attenuation*basec;
+
+	gl_FragColor = vec4(phong_color,1.0);
+	//if(gb2.x>0.5)gl_FragColor=vec4(1.0,0.0,0.0,1.0);
+	//else gl_FragColor=vec4(0.0,1.0,0.0,1.0);
+}

glsl/deferred/bloom_h.frag.glsl

@@ -0,0 +1,37 @@
+#version 100
+precision highp float;
+precision highp int;
+
+uniform sampler2D u_color;
+
+varying vec2 v_uv;
+
+const vec4 SKY_COLOR = vec4(0.01, 0.14, 0.42, 1.0);
+
+const vec3 offset = vec3( 0.0, 1.0, 2.0);//35,21,7,1 :sum:126
+const vec3 weight= vec3(0.48, 0.31, 0.17); //guess weight: 0.2778, 0.1667, 0.0556: to make it brighter it should be bigger than 1
+const float width=800.0;
+const float height=600.0;
+const float sp=0.20;
+void main() {
+    vec4 color = texture2D(u_color, v_uv);//(0,1)
+
+    if (color.a == 0.0) {
+        gl_FragColor = SKY_COLOR;
+        return;
+    }
+	if(color.x>sp||color.y>sp||color.z>sp){
+	vec4 FragmentColor = texture2D( u_color, vec2(v_uv) ) * weight.x;
+
+    FragmentColor += texture2D( u_color,  vec2(v_uv)+ vec2(0.0,offset.y) /height )*weight.y;
+	FragmentColor += texture2D( u_color,  vec2(v_uv)- vec2(0.0,offset.y) /height )*weight.y;
+    FragmentColor += texture2D( u_color,  vec2(v_uv)+ vec2(0.0,offset.z) /height )*weight.z;
+	FragmentColor += texture2D( u_color,  vec2(v_uv)- vec2(0.0,offset.z) /height )*weight.z;
+	 gl_FragColor = FragmentColor;
+	 }
+    else
+	gl_FragColor=vec4(color.xyz,1.0);
+
+
+
+}

glsl/deferred/bloom_w.frag.glsl

@@ -0,0 +1,36 @@
+#version 100
+precision highp float;
+precision highp int;
+
+uniform sampler2D u_color;
+
+varying vec2 v_uv;
+
+const vec4 SKY_COLOR = vec4(0.01, 0.14, 0.42, 1.0);
+
+const vec3 offset = vec3( 0.0, 1.0, 2.0);//35,21,7,1 :sum:126
+const vec3 weight= vec3(0.48, 0.31, 0.17);
+const float width=800.0;
+const float height=600.0;
+const float sp=0.20;
+void main() {
+    vec4 color = texture2D(u_color, v_uv);
+    if (color.a == 0.0) {
+        gl_FragColor = SKY_COLOR;
+        return;
+    }
+	if(color.x>sp||color.y>sp||color.z>sp){
+	vec4 FragmentColor = texture2D( u_color, vec2(v_uv) ) * weight.x;
+	FragmentColor += texture2D( u_color,  vec2(v_uv)+ vec2(offset.y,0.0 )/width )*weight.y;
+	FragmentColor += texture2D( u_color,  vec2(v_uv)- vec2(offset.y,0.0 )/width )*weight.y;
+    FragmentColor += texture2D( u_color,  vec2(v_uv)+ vec2(offset.z,0.0 )/width )*weight.z;
+	FragmentColor += texture2D( u_color,  vec2(v_uv)- vec2(offset.z,0.0 )/width )*weight.z;
+
+
+    gl_FragColor = FragmentColor;
+	}
+	else {
+	gl_FragColor=vec4(color.xyz,1.0);
+	}
+
+}

glsl/deferred/debug.frag.glsl

@@ -2,7 +2,7 @@
 precision highp float;
 precision highp int;
 
-#define NUM_GBUFFERS 4
+#define NUM_GBUFFERS 5
 
 uniform int u_debug;
 uniform sampler2D u_gbufs[NUM_GBUFFERS];
@@ -27,12 +27,18 @@ void main() {
     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 pos;
-    vec3 geomnor;
-    vec3 colmap;
-    vec3 normap;
-    vec3 nor;
+    vec3 pos = gb0.xyz;  // World-space position
+	//
+    vec3 geomnor=gb1.xyz; // Normals of the geometry as defined, without normal mapping 
 
+    vec3 colmap=gb2.xyz;  // The color map - unlit "albedo" (surface color) 
+
+    vec3 normap=gb3.xyz;  // The raw normal map (normals relative to the surface they're on) 
+
+	//vec4 temp= vec4(applyNormalMap(geomnor, normap),1.0);
+	// The true normals as we want to light them - with the normal map applied to the geometry normals (applyNormalMap )
+    vec3 nor = applyNormalMap(geomnor, normap); 
+
     if (u_debug == 0) {
         gl_FragColor = vec4(vec3(depth), 1.0);
     } else if (u_debug == 1) {
@@ -46,6 +52,6 @@ void main() {
     } else if (u_debug == 5) {
         gl_FragColor = vec4(abs(nor), 1.0);
     } else {
-        gl_FragColor = vec4(1, 0, 1, 1);
+        gl_FragColor = SKY_COLOR;
     }
 }

glsl/deferred/singleBloom.frag.glsl

@@ -0,0 +1,39 @@
+#version 100
+precision highp float;
+precision highp int;
+
+uniform sampler2D u_color;
+
+varying vec2 v_uv;
+
+const vec4 SKY_COLOR = vec4(0.01, 0.14, 0.42, 1.0);
+
+const vec3 offset = vec3( 0.0, 1.0, 2.0);//35,21,7,1 :sum:126
+const vec3 weight= vec3(0.48, 0.31, 0.17);
+const float width=800.0;
+const float height=600.0;
+const float sp=0.20;
+void main() {
+    vec4 color = texture2D(u_color, v_uv);
+    if (color.a == 0.0) {
+        gl_FragColor = SKY_COLOR;
+        return;
+    }
+	if(color.x>sp||color.y>sp||color.z>sp){
+	vec4 FragmentColor = texture2D( u_color, vec2(v_uv)) * weight.x;
+	FragmentColor += texture2D( u_color,  vec2(v_uv)+ vec2(offset.y,0.0 )/width )*weight.y;
+	FragmentColor += texture2D( u_color,  vec2(v_uv)- vec2(offset.y,0.0 )/width )*weight.y;
+    FragmentColor += texture2D( u_color,  vec2(v_uv)+ vec2(offset.z,0.0 )/width )*weight.z;
+	FragmentColor += texture2D( u_color,  vec2(v_uv)- vec2(offset.z,0.0 )/width )*weight.z;
+
+	FragmentColor += texture2D( u_color,  vec2(v_uv)+ vec2(0.0, offset.y )/height)*weight.y;
+	FragmentColor += texture2D( u_color,  vec2(v_uv)- vec2(0.0, offset.y )/height)*weight.y;
+    FragmentColor += texture2D( u_color,  vec2(v_uv)+ vec2(0.0, offset.z )/height)*weight.z;
+	FragmentColor += texture2D( u_color,  vec2(v_uv)- vec2(0.0, offset.z )/height)*weight.z;
+    gl_FragColor = FragmentColor;
+	}
+	else {
+	gl_FragColor=vec4(color.xyz,1.0);
+	}
+
+}

glsl/deferred/toon.frag.glsl

@@ -0,0 +1,30 @@
+#version 100
+precision highp float;
+precision highp int;
+
+#define NUM_GBUFFERS 4
+
+uniform sampler2D u_depth;
+uniform sampler2D u_color;
+varying vec2 v_uv;
+
+const vec3 offset = vec3( 0.0, 2.0, 4.0);
+const float width=800.0;
+const float height=600.0;
+
+void main() {
+
+    float depth = texture2D(u_depth, v_uv).x;
+	vec4 color=texture2D(u_color, vec2(v_uv));
+   //https://www.shadertoy.com/view/4slSWf
+    float Fc= texture2D( u_depth,  vec2(v_uv)+ vec2(0.0,offset.x) /height ).x; 
+	float Fc1 = texture2D( u_depth,  vec2(v_uv)+ vec2(0.0,offset.z) /height ).x;
+	float Fc2 = texture2D( u_depth,  vec2(v_uv)+ vec2(offset.z,0.0) /width ).x;
+
+	float e=max(abs(Fc-Fc1),abs(Fc-Fc2));
+
+
+	if(e>0.05)gl_FragColor=vec4(0.1,0.1,0.1,1.0);//draw outline
+	else gl_FragColor = vec4(0.1,0.1,0.1,0.3);
+	//gl_FragColor=vec4(0.0,0.0,0.0,1.0);
+}

glsl/red.frag.glsl

@@ -3,5 +3,5 @@ precision highp float;
 precision highp int;
 
 void main() {
-    gl_FragColor = vec4(1, 0, 0, 1);
+    gl_FragColor = vec4(1, 0, 0, 0.1);
 }

index.html

@@ -78,10 +78,19 @@
             width: 100%;
             height: 100%;
         }
+        #msgbox {
+            font-family: sans-serif;
+            color: white;
+            height: 1.4em;
+            position: fixed;
+            bottom: 2em;
+            left: 0;
+        }
     </style>
 </head>
 <body>
     <canvas id="canvas" width="800px" height="600px"></canvas>
+    <div id="msgbox"></div>
     <div id="debugmodewarning">
         <strong style="font-size: 150%">DEBUG MODE!</strong>
         (Disable before measuring performance.)