CIS565-Fall-2014 · chiwsy · Nov 15, 2014 · Nov 15, 2014 · Nov 15, 2014 · Nov 15, 2014
diff --git a/Image/AllEffects.gif b/Image/AllEffects.gif
diff --git a/Image/BlinnPhong.png b/Image/BlinnPhong.png
diff --git a/Image/BlinnPhongVsUnsharp.gif b/Image/BlinnPhongVsUnsharp.gif
diff --git a/Image/Blinn_Phong.gif b/Image/Blinn_Phong.gif
diff --git a/Image/Bloom.png b/Image/Bloom.png
diff --git a/Image/Compare.png b/Image/Compare.png
diff --git a/Image/DebugView.gif b/Image/DebugView.gif
diff --git a/Image/Performance.png b/Image/Performance.png
diff --git a/Image/SSAO.png b/Image/SSAO.png
diff --git a/Image/Toon.png b/Image/Toon.png
diff --git a/Image/Unsharp.png b/Image/Unsharp.png
diff --git a/Image/VisualEffects.gif b/Image/VisualEffects.gif
diff --git a/README.md b/README.md
@@ -21,36 +21,36 @@ have issues with Chrome on windows, but Firefox seems to run it fine.
 INTRODUCTION:
 -------------------------------------------------------------------------------
 
-In this project, you will get introduced to the basics of deferred shading. You will write GLSL and OpenGL code to perform various tasks in a deferred lighting pipeline such as creating and writing to a G-Buffer.
+In this project, I implemented the basic deferred shader. I write GLSL and OpenGL code to perform various tasks in a deferred lighting pipeline such as creating and writing to a G-Buffer.
 
-NOTE : The Crytek-Sponza scene is still broken, and I will be pushing a fix for
-it soon.
+The live demo can be found here:
+[Live demo](https://cdn.rawgit.com/chiwsy/Project6-DeferredShader/master/index.html)
 
--------------------------------------------------------------------------------
-CONTENTS:
--------------------------------------------------------------------------------
-The Project5 root directory contains the following subdirectories:
-
-* js/ contains the javascript files, including external libraries, necessary.
-* assets/ contains the textures that will be used in the second half of the
-  assignment.
-* resources/ contains the screenshots found in this readme file.
-
- This Readme file edited as described above in the README section.
+Some of the results from this project:
+![Blinn-Phong](https://github.com/chiwsy/Project6-DeferredShader/blob/master/Image/BlinnPhong.png)
+![Unsharp](https://github.com/chiwsy/Project6-DeferredShader/blob/master/Image/Unsharp.png)
+![Comparing Bling-Phong with Unsharp](https://github.com/chiwsy/Project6-DeferredShader/blob/master/Image/Compare.png)
+![Bloom](https://github.com/chiwsy/Project6-DeferredShader/blob/master/Image/Bloom.png)
+![Toon](https://github.com/chiwsy/Project6-DeferredShader/blob/master/Image/Toon.png)
+![SSAO](https://github.com/chiwsy/Project6-DeferredShader/blob/master/Image/SSAO.png)
 
+![All effects in sequence](https://github.com/chiwsy/Project6-DeferredShader/blob/master/Image/AllEffects.gif)
+![Debug View](https://github.com/chiwsy/Project6-DeferredShader/blob/master/Image/DebugView.gif)
+![Blinn-Phong](https://github.com/chiwsy/Project6-DeferredShader/blob/master/Image/Blinn_Phong.gif)
+![More Visual Effects](https://github.com/chiwsy/Project6-DeferredShader/blob/master/Image/VisualEffects.gif)
+![Blinn-Phong VS. Unsharp](https://github.com/chiwsy/Project6-DeferredShader/blob/master/Image/BlinnPhongVsUnsharp.gif)
 -------------------------------------------------------------------------------
 OVERVIEW:
 -------------------------------------------------------------------------------
-The deferred shader you will write will have the following stages:
+The deferred shader here will have the following stages:
 
 Stage 1 renders the scene geometry to the G-Buffer
 * pass.vert
 * pass.frag
 
 Stage 2 renders the lighting passes and accumulates to the P-Buffer
-* shade.vert
-* ambient.frag
-* point.frag
+* quad.vert
+* diffuse.frag
 * diagnostic.frag
 
 Stage 3 renders the post processing
@@ -59,52 +59,48 @@ Stage 3 renders the post processing
 
 The keyboard controls are as follows:
 WASDRF - Movement (along w the arrow keys)
-W - Zoom in
-S - Zoom out
-A - Left
-D - Right
-R - Up
-F - Down
-^ - Up
-v - Down
-< - Left
-> - Right
+* W - Zoom in
+* S - Zoom out
+* A - Left
+* D - Right
+* R - Up
+* F - Down
+* ^ - Up
+* v - Down
+* < - Left
+* > - Right
+* 1 - World Space Position
+* 2 - Normals
+* 3 - Color
+* 4 - Depth
+* 5 - Blinn-Phong
+* 6 - Bloom
+* 7 - Toon
+* 8 - SSAO
+* 9 - Unsharp
+* 0 - Full deferred pipeline
 
 There are also mouse controls for camera rotation.
 
 -------------------------------------------------------------------------------
-REQUIREMENTS:
+Functions:
 -------------------------------------------------------------------------------
 
 In this project, you are given code for:
 * Loading .obj file
-* Forward shading pipeline
+* Deferred shading pipeline
+* GBuffer pass
 
-NOTE : The full deferred pipeline will be released on Friday.  If you set up
-your deferred pipeline for extra credit, please submit a pull request by Friday.
-If it is partially done, we will give partial extra credit.
+I have implemented:
+* Bloom
+* "Toon" Shading (with basic silhouetting)
+* Screen Space Ambient Occlusion
+* Diffuse and Blinn-Phong shading
 
-The baseline OpenGL shaders for the rest of the pipeline have been provided to give you
-a sense of what will be neede in subsequent passes.
+And one additional post effect:
+* Unsharp Mask
 
-You are required to implement:
-* Either of the following effects
-  * Bloom
-  * "Toon" Shading (with basic silhouetting)
-* Point light sources
-* Screen Space Ambient Occlusion 
 
-**NOTE**: Implementing separable convolution will require another link in your pipeline and will count as an extra feature if you do performance analysis with a standard one-pass 2D convolution. The overhead of rendering and reading from a texture _may_ offset the extra computations for smaller 2D kernels.
-
-You must implement one of the following extras:
-* The effect you did not choose above
-* Compare performance to a normal forward renderer with
-  * No optimizations
-  * Coarse sort geometry front-to-back for early-z
-  * Z-prepass for early-z
-* Optimize g-buffer format, e.g., pack things together, quantize, reconstruct z from normal x and y (because it is normalized), etc.
-  * Must be accompanied with a performance analysis to count
-* Additional lighting and pre/post processing effects! (email first please, if they are good you may add multiple).
 
 -------------------------------------------------------------------------------
 RUNNING THE CODE:
@@ -147,77 +143,12 @@ a sense of each of the effects:
   Article](http://floored.com/blog/2013/ssao-screen-space-ambient-occlusion.html)
 
 -------------------------------------------------------------------------------
-README
--------------------------------------------------------------------------------
-All students must replace or augment the contents of this Readme.md in a clear 
-manner with the following:
-
-* A brief description of the project and the specific features you implemented.
-* At least one screenshot of your project running.
-* A 30 second or longer video of your project running.  To create the video you
-  can use [Open Broadcaster Software](http://obsproject.com) 
-* A performance evaluation (described in detail below).
-
--------------------------------------------------------------------------------
-PERFORMANCE EVALUATION
--------------------------------------------------------------------------------
-The performance evaluation is where you will investigate how to make your 
-program more efficient using the skills you've learned in class. You must have
-performed at least one experiment on your code to investigate the positive or
-negative effects on performance. 
-
-We encourage you to get creative with your tweaks. Consider places in your code
-that could be considered bottlenecks and try to improve them. 
-
-Each student should provide no more than a one page summary of their
-optimizations along with tables and or graphs to visually explain any
-performance differences.
-
--------------------------------------------------------------------------------
-THIRD PARTY CODE POLICY
+Performance:
 -------------------------------------------------------------------------------
-* Use of any third-party code must be approved by asking on the Google groups.  
-  If it is approved, all students are welcome to use it.  Generally, we approve 
-  use of third-party code that is not a core part of the project.  For example, 
-  for the ray tracer, we would approve using a third-party library for loading 
-  models, but would not approve copying and pasting a CUDA function for doing 
-  refraction.
-* Third-party code must be credited in README.md.
-* Using third-party code without its approval, including using another 
-  student's code, is an academic integrity violation, and will result in you 
-  receiving an F for the semester.
-
--------------------------------------------------------------------------------
-SELF-GRADING
--------------------------------------------------------------------------------
-* On the submission date, email your grade, on a scale of 0 to 100, to Liam, 
-  [email protected], with a one paragraph explanation.  Be concise and 
-  realistic.  Recall that we reserve 30 points as a sanity check to adjust your 
-  grade.  Your actual grade will be (0.7 * your grade) + (0.3 * our grade).  We 
-  hope to only use this in extreme cases when your grade does not realistically 
-  reflect your work - it is either too high or too low.  In most cases, we plan 
-  to give you the exact grade you suggest.
-* Projects are not weighted evenly, e.g., Project 0 doesn't count as much as 
-  the path tracer.  We will determine the weighting at the end of the semester 
-  based on the size of each project.
+For my browser, I cannot take advantage of the draw buffer. Therefore the program reduced to multi-pass version which is very slow when it comes to the performance part. 
+![Performance](https://github.com/chiwsy/Project6-DeferredShader/blob/master/Image/Performance.png)
 
 
----
-SUBMISSION
----
-As with the previous projects, you should fork this project and work inside of
-your fork. Upon completion, commit your finished project back to your fork, and
-make a pull request to the master repository.  You should include a README.md
-file in the root directory detailing the following
-
-* A brief description of the project and specific features you implemented
-* At least one screenshot of your project running.
-* A link to a video of your project running.
-* Instructions for building and running your project if they differ from the
-  base code.
-* A performance writeup as detailed above.
-* A list of all third-party code used.
-* This Readme file edited as described above in the README section.
 
 ---
 ACKNOWLEDGEMENTS

diff --git a/assets/deferred/colorPass.frag b/assets/deferred/colorPass.frag
@@ -0,0 +1,7 @@
+precision highp float;
+
+uniform sampler2D u_sampler;
+
+void main(void){
+	gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);
+}
diff --git a/assets/deferred/colorPass.vert b/assets/deferred/colorPass.vert
@@ -0,0 +1,9 @@
+precision highp float;
+
+attribute vec3 a_pos;
+
+uniform mat4 u_mvp;
+
+void main(void){
+	gl_Position = u_mvp * vec4( a_pos, 1.0 );
+}
diff --git a/assets/deferred/diagnostic.frag b/assets/deferred/diagnostic.frag
@@ -0,0 +1,40 @@
+precision highp float;
+
+#define DISPLAY_POS 1
+#define DISPLAY_NORMAL 2
+#define DISPLAY_COLOR 3
+#define DISPLAY_DEPTH 4
+
+uniform sampler2D u_positionTex;
+uniform sampler2D u_normalTex;
+uniform sampler2D u_colorTex;
+uniform sampler2D u_depthTex;
+
+uniform float u_zFar;
+uniform float u_zNear;
+uniform int u_displayType;
+
+varying vec2 v_texcoord;
+
+float linearizeDepth( float exp_depth, float near, float far ){
+	return ( 2.0 * near ) / ( far + near - exp_depth * ( far - near ) );
+}
+
+void main()
+{
+	vec3 normal = texture2D( u_normalTex, v_texcoord ).xyz;
+	vec3 position = texture2D( u_positionTex, v_texcoord ).xyz;
+	vec4 color = texture2D( u_colorTex, v_texcoord );
+	float depth = texture2D( u_depthTex, v_texcoord ).x;
+
+	depth = linearizeDepth( depth, u_zNear, u_zFar );
+
+  if( u_displayType == DISPLAY_DEPTH )
+	    gl_FragColor = vec4( depth, depth, depth, 1 );
+	else if( u_displayType == DISPLAY_COLOR )
+	    gl_FragColor = color;
+	else if( u_displayType == DISPLAY_NORMAL )
+	    gl_FragColor = vec4( normal, 1 );
+	else
+	    gl_FragColor = vec4( position, 1 );
+}
diff --git a/assets/deferred/diffuse.frag b/assets/deferred/diffuse.frag
@@ -0,0 +1,23 @@
+precision highp float;
+
+uniform sampler2D u_positionTex;
+uniform sampler2D u_normalTex;
+uniform sampler2D u_colorTex;
+uniform sampler2D u_depthTex;
+
+uniform float u_zFar;
+uniform float u_zNear;
+uniform int u_displayType;
+
+varying vec2 v_texcoord;
+
+float linearizeDepth( float exp_depth, float near, float far ){
+	return ( 2.0 * near ) / ( far + near - exp_depth * ( far - near ) );
+}
+
+void main()
+{
+  // Write a diffuse shader and a Blinn-Phong shader
+  // NOTE : You may need to add your own normals to fulfill the second's requirements
+  gl_FragColor = vec4(texture2D(u_colorTex, v_texcoord).rgb, 1.0);
+}
diff --git a/assets/deferred/normPass.frag b/assets/deferred/normPass.frag
@@ -0,0 +1,7 @@
+precision highp float;
+
+varying vec3 v_normal;
+
+void main(void){
+	gl_FragColor = vec4(v_normal, 1.0);
+}
diff --git a/assets/deferred/normPass.vert b/assets/deferred/normPass.vert
@@ -0,0 +1,15 @@
+precision highp float;
+
+attribute vec3 a_pos;
+attribute vec3 a_normal;
+
+uniform mat4 u_mvp;
+uniform mat4 u_normalMat;
+
+varying vec3 v_normal;
+
+void main(void){
+	gl_Position = u_mvp * vec4( a_pos, 1.0 );
+
+	v_normal = vec3( u_normalMat * vec4(a_normal, 0.0) );
+}
diff --git a/assets/deferred/pass.frag b/assets/deferred/pass.frag
@@ -0,0 +1,16 @@
+#extension GL_EXT_draw_buffers: require
+precision highp float;
+
+uniform sampler2D u_sampler;
+
+varying vec4 v_pos;
+varying vec3 v_normal;
+varying vec2 v_texcoord;
+varying float v_depth;
+
+void main(void){
+	gl_FragData[0] = v_pos;
+	gl_FragData[1] = vec4( normalize(v_normal), 1.0 );
+	gl_FragData[2] = vec4( 1.0, 0.0, 0.0, 1.0 );
+	gl_FragData[3] = vec4( v_depth, 0, 0, 0 );
+}
diff --git a/assets/deferred/pass.vert b/assets/deferred/pass.vert
@@ -0,0 +1,26 @@
+precision highp float;
+
+attribute vec3 a_pos;
+attribute vec3 a_normal;
+attribute vec2 a_texcoord;
+
+uniform mat4 u_projection;
+uniform mat4 u_modelview;
+uniform mat4 u_mvp;
+uniform mat4 u_normalMat;
+
+varying vec4 v_pos;
+varying vec3 v_normal;
+varying vec2 v_texcoord;
+varying float v_depth;
+
+void main(void){
+	gl_Position = u_mvp * vec4( a_pos, 1.0 );
+
+	v_pos = u_modelview * vec4( a_pos, 1.0 );
+	v_normal = vec3( u_normalMat * vec4(a_normal,0.0) );
+
+	v_texcoord = a_texcoord;
+
+	v_depth = ( gl_Position.z / gl_Position.w + 1.0 ) / 2.0;
+}
diff --git a/assets/deferred/posPass.frag b/assets/deferred/posPass.frag
@@ -0,0 +1,8 @@
+precision highp float;
+
+varying vec4 v_pos;
+varying float v_depth;
+
+void main(void){
+	gl_FragColor = v_pos;
+}
diff --git a/assets/deferred/posPass.vert b/assets/deferred/posPass.vert
@@ -0,0 +1,15 @@
+precision highp float;
+
+attribute vec3 a_pos;
+
+uniform mat4 u_modelview;
+uniform mat4 u_mvp;
+
+varying vec4 v_pos;
+varying float v_depth;
+
+void main(void){
+	gl_Position = u_mvp * vec4( a_pos, 1.0 );
+  v_pos = u_modelview * vec4( a_pos, 1.0 );
+  v_depth = ( gl_Position.z / gl_Position.w + 1.0 )  / 2.0;
+}