diff --git a/Original.PNG b/Original.PNG new file mode 100644 index 0000000..5b87a2e Binary files /dev/null and b/Original.PNG differ diff --git a/README.md b/README.md index 388c810..9775d81 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -------------------------------------------------------------------------------- +------------------------------------------------------------------------------- CIS565: Project 4: Image Processing/Vertex Shading ------------------------------------------------------------------------------- Fall 2012 @@ -6,6 +6,28 @@ Fall 2012 Due Friday 11/09/2012 ------------------------------------------------------------------------------- +Implemented the following: +1 - Original Image +2 - Box blur +3 - Negative +4 - Gaussian Blur +5 - Grayscale +6 - Edge Detection +7 - Toon Shading +8 - Vintage Photo (Blur, Noise, Vignettting) +9 - Brightness +0 - Unsharp Mask +- - Sharpened image +q - Night Vision (Noise and circular mask) + + +In my custom vertex shader, I randomized using the position's y value and then nultiplied it with time and then took a sin wave to get a wave moving up and down randomized on y position. + + +Blog: +http://tijugraphics.blogspot.com/ + + ------------------------------------------------------------------------------- NOTE: ------------------------------------------------------------------------------- diff --git a/part1/ImageProcessing/ImageProcessing.sdf b/part1/ImageProcessing/ImageProcessing.sdf new file mode 100644 index 0000000..87b19f6 Binary files /dev/null and b/part1/ImageProcessing/ImageProcessing.sdf differ diff --git a/part1/ImageProcessing/ImageProcessing/ImageProcessing.vcxproj b/part1/ImageProcessing/ImageProcessing/ImageProcessing.vcxproj index 554291c..e896da9 100644 --- a/part1/ImageProcessing/ImageProcessing/ImageProcessing.vcxproj +++ b/part1/ImageProcessing/ImageProcessing/ImageProcessing.vcxproj @@ -12,8 +12,18 @@ + + + + + + + + + + diff --git a/part1/ImageProcessing/ImageProcessing/ImageProcessing.vcxproj.user b/part1/ImageProcessing/ImageProcessing/ImageProcessing.vcxproj.user new file mode 100644 index 0000000..9a0b0ae --- /dev/null +++ b/part1/ImageProcessing/ImageProcessing/ImageProcessing.vcxproj.user @@ -0,0 +1,6 @@ + + + + true + + \ No newline at end of file diff --git a/part1/ImageProcessing/ImageProcessing/Lenna.png b/part1/ImageProcessing/ImageProcessing/Lenna.png new file mode 100644 index 0000000..59ef68a Binary files /dev/null and b/part1/ImageProcessing/ImageProcessing/Lenna.png differ diff --git a/part1/ImageProcessing/ImageProcessing/MetalScratches0040_1_thumbhuge.bmp b/part1/ImageProcessing/ImageProcessing/MetalScratches0040_1_thumbhuge.bmp new file mode 100644 index 0000000..5330da4 Binary files /dev/null and b/part1/ImageProcessing/ImageProcessing/MetalScratches0040_1_thumbhuge.bmp differ diff --git a/part1/ImageProcessing/ImageProcessing/brightnessFS.glsl b/part1/ImageProcessing/ImageProcessing/brightnessFS.glsl new file mode 100644 index 0000000..228c9ba --- /dev/null +++ b/part1/ImageProcessing/ImageProcessing/brightnessFS.glsl @@ -0,0 +1,8 @@ +varying vec2 v_Texcoords; + +uniform sampler2D u_image; + +void main(void) +{ + gl_FragColor = vec4(texture2D(u_image, v_Texcoords).xyz*1.3, 1.0); +} diff --git a/part1/ImageProcessing/ImageProcessing/edgeDetectionFS.glsl b/part1/ImageProcessing/ImageProcessing/edgeDetectionFS.glsl new file mode 100644 index 0000000..b58145e --- /dev/null +++ b/part1/ImageProcessing/ImageProcessing/edgeDetectionFS.glsl @@ -0,0 +1,31 @@ +varying vec2 v_Texcoords; + +uniform sampler2D u_image; +uniform vec2 u_step; + +const int KERNEL_WIDTH = 3; // Odd +const float offset = 1.0; +const vec3 W = vec3(0.2, 0.2, 0.2); +const mat3 vert = mat3(vec3(-1,-2,-1), vec3(0,0,0), vec3(1,2,1)); +const mat3 hor = mat3(vec3(-1,0,1), vec3(-2,0,2), vec3(-1,0,1)); + +void main(void) +{ + float luminance = dot(texture2D(u_image, v_Texcoords).rgb, W); + + float accumHor = 0.0; + float accumVert = 0.0; + + for (int i = 0; i < KERNEL_WIDTH; ++i) + { + for (int j = 0; j < KERNEL_WIDTH; ++j) + { + vec2 coord = vec2(v_Texcoords.s + ((float(i) - offset) * u_step.s), v_Texcoords.t + ((float(j) - offset) * u_step.t)); + float dotProd = dot(texture2D(u_image, coord).rgb, W); + accumHor += dotProd * hor[i][j]; + accumVert += dotProd * vert[i][j]; + } + } + + gl_FragColor = vec4(vec3(length(vec2(accumHor, accumVert))), 1.0); +} diff --git a/part1/ImageProcessing/ImageProcessing/gaussianBlurFS.glsl b/part1/ImageProcessing/ImageProcessing/gaussianBlurFS.glsl new file mode 100644 index 0000000..c403978 --- /dev/null +++ b/part1/ImageProcessing/ImageProcessing/gaussianBlurFS.glsl @@ -0,0 +1,24 @@ +varying vec2 v_Texcoords; + +uniform sampler2D u_image; +uniform vec2 u_step; + +const int KERNEL_WIDTH = 3; // Odd +const float offset = 1.0; +const mat3 gauss = mat3(vec3(1,2,1), vec3(2,4,2), vec3(1,2,1)); + +void main(void) +{ + vec3 accum = vec3(0.0); + + for (int i = 0; i < KERNEL_WIDTH; ++i) + { + for (int j = 0; j < KERNEL_WIDTH; ++j) + { + vec2 coord = vec2(v_Texcoords.s + ((float(i) - offset) * u_step.s), v_Texcoords.t + ((float(j) - offset) * u_step.t)); + accum += texture2D(u_image, coord).rgb * gauss[i][j]; + } + } + + gl_FragColor = vec4(accum / 16.0, 1.0); +} diff --git a/part1/ImageProcessing/ImageProcessing/grayscaleFS.glsl b/part1/ImageProcessing/ImageProcessing/grayscaleFS.glsl new file mode 100644 index 0000000..6a17ae1 --- /dev/null +++ b/part1/ImageProcessing/ImageProcessing/grayscaleFS.glsl @@ -0,0 +1,10 @@ +varying vec2 v_Texcoords; + +uniform sampler2D u_image; +const vec3 W = vec3(0.2125, 0.7154, 0.0721); + +void main(void) +{ + float luminance = dot(texture2D(u_image, v_Texcoords).rgb, W); + gl_FragColor = vec4(vec3(luminance),1.0); +} diff --git a/part1/ImageProcessing/ImageProcessing/main.cpp b/part1/ImageProcessing/ImageProcessing/main.cpp index 3b1444d..a8d2664 100644 --- a/part1/ImageProcessing/ImageProcessing/main.cpp +++ b/part1/ImageProcessing/ImageProcessing/main.cpp @@ -4,8 +4,8 @@ #include "Utility.h" #include "SOIL.h" -int width = 640; -int height = 480; +int width = 512; +int height = 512; GLuint positionLocation = 0; GLuint texcoordsLocation = 1; @@ -13,6 +13,17 @@ const char *attributeLocations[] = { "Position", "Tex" }; GLuint passthroughProgram; GLuint boxBlurProgram; +GLuint negativeProgram; +GLuint gaussianBlurProgram; +GLuint grayscaleProgram; +GLuint edgeDetectionProgram; +GLuint toonShadingProgram; +GLuint vintageProgram; +GLuint brightnessProgram; +GLuint sharpenProgram; +GLuint unsharpMaskProgram; +GLuint nightVisionProgram; +GLuint weirdProgram; GLuint initShader(const char *vertexShaderPath, const char *fragmentShaderPath) { @@ -36,7 +47,7 @@ GLuint initShader(const char *vertexShaderPath, const char *fragmentShaderPath) void initTextures() { - GLuint image = SOIL_load_OGL_texture("Valve.png", 3, 0, 0); + GLuint image = SOIL_load_OGL_texture("Lenna.png", 3, 0, 0); glBindTexture(GL_TEXTURE_2D, image); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); @@ -104,6 +115,39 @@ void keyboard(unsigned char key, int x, int y) case '2': glUseProgram(boxBlurProgram); break; + case '3': + glUseProgram(negativeProgram); + break; + case '4': + glUseProgram(gaussianBlurProgram); + break; + case '5': + glUseProgram(grayscaleProgram); + break; + case '6': + glUseProgram(edgeDetectionProgram); + break; + case '7': + glUseProgram(toonShadingProgram); + break; + case '8': + glUseProgram(vintageProgram); + break; + case '9': + glUseProgram(brightnessProgram); + break; + case '0': + glUseProgram(unsharpMaskProgram); + break; + case '-': + glUseProgram(sharpenProgram); + break; + case 'q': + glUseProgram(nightVisionProgram); + break; + case 'w': + glUseProgram(weirdProgram); + break; } } @@ -133,6 +177,17 @@ int main(int argc, char* argv[]) initTextures(); passthroughProgram = initShader("passthroughVS.glsl", "passthroughFS.glsl"); boxBlurProgram = initShader("passthroughVS.glsl", "boxBlurFS.glsl"); + negativeProgram = initShader("passthroughVS.glsl", "negativeFS.glsl"); + gaussianBlurProgram = initShader("passthroughVS.glsl", "gaussianBlurFS.glsl"); + grayscaleProgram = initShader("passthroughVS.glsl", "grayscaleFS.glsl"); + edgeDetectionProgram = initShader("passthroughVS.glsl", "edgeDetectionFS.glsl"); + toonShadingProgram = initShader("passthroughVS.glsl", "toonShadingFS.glsl"); + vintageProgram = initShader("passthroughVS.glsl", "vintageFS.glsl"); + brightnessProgram = initShader("passthroughVS.glsl", "brightnessFS.glsl"); + unsharpMaskProgram = initShader("passthroughVS.glsl", "unsharpMaskFS.glsl"); + sharpenProgram = initShader("passthroughVS.glsl", "sharpenFS.glsl"); + nightVisionProgram = initShader("passthroughVS.glsl", "nightVisionFS.glsl"); + weirdProgram = initShader("weirdVS.glsl", "passthroughFS.glsl"); glutDisplayFunc(display); glutReshapeFunc(reshape); diff --git a/part1/ImageProcessing/ImageProcessing/negativeFS.glsl b/part1/ImageProcessing/ImageProcessing/negativeFS.glsl new file mode 100644 index 0000000..d119171 --- /dev/null +++ b/part1/ImageProcessing/ImageProcessing/negativeFS.glsl @@ -0,0 +1,8 @@ +varying vec2 v_Texcoords; + +uniform sampler2D u_image; + +void main(void) +{ + gl_FragColor = 1.0 - texture2D(u_image, v_Texcoords); +} diff --git a/part1/ImageProcessing/ImageProcessing/nightVisionFS.glsl b/part1/ImageProcessing/ImageProcessing/nightVisionFS.glsl new file mode 100644 index 0000000..8e4d4fc --- /dev/null +++ b/part1/ImageProcessing/ImageProcessing/nightVisionFS.glsl @@ -0,0 +1,18 @@ +varying vec2 v_Texcoords; + +uniform sampler2D u_image; + +// From stack overflow +float rand(vec2 val) +{ + return fract(sin(dot(val.xy ,vec2(12.9898,78.233))) * 43758.5453); +} + +void main(void) +{ + float noise = rand(vec2(v_Texcoords.s, v_Texcoords.t)); + if (length(vec2(v_Texcoords.s - 0.5, v_Texcoords.t - 0.5)) > 0.45) + gl_FragColor = vec4(vec3(0),1.0); + else + gl_FragColor = vec4(vec3(texture2D(u_image, v_Texcoords).xyz * vec3(0,1,0)) + vec3(noise/4.0), 1.0); +} diff --git a/part1/ImageProcessing/ImageProcessing/scratches.png b/part1/ImageProcessing/ImageProcessing/scratches.png new file mode 100644 index 0000000..9bd529b Binary files /dev/null and b/part1/ImageProcessing/ImageProcessing/scratches.png differ diff --git a/part1/ImageProcessing/ImageProcessing/sharpenFS.glsl b/part1/ImageProcessing/ImageProcessing/sharpenFS.glsl new file mode 100644 index 0000000..0c7740d --- /dev/null +++ b/part1/ImageProcessing/ImageProcessing/sharpenFS.glsl @@ -0,0 +1,32 @@ +varying vec2 v_Texcoords; + +uniform sampler2D u_image; +uniform vec2 u_step; + +const int KERNEL_WIDTH = 3; // Odd +const float offset = 1.0; +const mat3 gauss = mat3(vec3(1,2,1), vec3(2,4,2), vec3(1,2,1)); + +void main(void) +{ + vec3 accum = vec3(0.0); + + for (int i = 0; i < KERNEL_WIDTH; ++i) + { + for (int j = 0; j < KERNEL_WIDTH; ++j) + { + vec2 coord = vec2(v_Texcoords.s + ((float(i) - offset) * u_step.s), v_Texcoords.t + ((float(j) - offset) * u_step.t)); + accum += texture2D(u_image, coord).rgb * gauss[i][j]; + } + } + + vec4 originalColor = texture2D(u_image, v_Texcoords); + + // Unsharp Mask + vec3 difference = abs(vec3(originalColor.xyz) - accum / 16.0); + + if (difference.x > 0.04 || difference.y > 0.04 || difference.z > 0.04) + gl_FragColor = vec4(originalColor.xyz*1.1, 1.0); + else + gl_FragColor = originalColor; +} diff --git a/part1/ImageProcessing/ImageProcessing/toonShadingFS.glsl b/part1/ImageProcessing/ImageProcessing/toonShadingFS.glsl new file mode 100644 index 0000000..65a9fdb --- /dev/null +++ b/part1/ImageProcessing/ImageProcessing/toonShadingFS.glsl @@ -0,0 +1,43 @@ +varying vec2 v_Texcoords; + +uniform sampler2D u_image; +uniform vec2 u_step; + +const int KERNEL_WIDTH = 3; // Odd +const float offset = 1.0; +const vec3 W = vec3(0.3, 0.3, 0.3); +const mat3 vert = mat3(vec3(-1,-2,-1), vec3(0,0,0), vec3(1,2,1)); +const mat3 hor = mat3(vec3(-1,0,1), vec3(-2,0,2), vec3(-1,0,1)); + +void main(void) +{ + vec3 color = texture2D(u_image, v_Texcoords).rgb; + float luminance = dot(color, W); + + float accumHor = 0.0; + float accumVert = 0.0; + + for (int i = 0; i < KERNEL_WIDTH; ++i) + { + for (int j = 0; j < KERNEL_WIDTH; ++j) + { + vec2 coord = vec2(v_Texcoords.s + ((float(i) - offset) * u_step.s), v_Texcoords.t + ((float(j) - offset) * u_step.t)); + float dotProd = dot(texture2D(u_image, coord).rgb, W); + accumHor += dotProd * hor[i][j]; + accumVert += dotProd * vert[i][j]; + } + } + + float len = length(vec2(accumHor, accumVert)); + if (len > 0.36) + gl_FragColor = vec4(vec3(0),1.0); + else + { + float quantize = 6.3; + color.rgb *= quantize; + color.rgb += vec3(0.5); + ivec3 irgb = ivec3(color.rgb); + color.rgb = vec3(irgb) / quantize; + gl_FragColor = vec4(vec3(color), 1.0); + } +} diff --git a/part1/ImageProcessing/ImageProcessing/unsharpMaskFS.glsl b/part1/ImageProcessing/ImageProcessing/unsharpMaskFS.glsl new file mode 100644 index 0000000..84f403c --- /dev/null +++ b/part1/ImageProcessing/ImageProcessing/unsharpMaskFS.glsl @@ -0,0 +1,30 @@ +varying vec2 v_Texcoords; + +uniform sampler2D u_image; +uniform vec2 u_step; + +const int KERNEL_WIDTH = 3; // Odd +const float offset = 1.0; +const mat3 gauss = mat3(vec3(1,2,1), vec3(2,4,2), vec3(1,2,1)); + +void main(void) +{ + vec3 accum = vec3(0.0); + + for (int i = 0; i < KERNEL_WIDTH; ++i) + { + for (int j = 0; j < KERNEL_WIDTH; ++j) + { + vec2 coord = vec2(v_Texcoords.s + ((float(i) - offset) * u_step.s), v_Texcoords.t + ((float(j) - offset) * u_step.t)); + accum += texture2D(u_image, coord).rgb * gauss[i][j]; + } + } + + vec4 originalColor = texture2D(u_image, v_Texcoords); + + // Unsharp Mask + vec3 difference = abs(vec3(originalColor.xyz) - accum / 16.0); + + gl_FragColor = vec4(difference*4.0, 1.0); + +} diff --git a/part1/ImageProcessing/ImageProcessing/vintageFS.glsl b/part1/ImageProcessing/ImageProcessing/vintageFS.glsl new file mode 100644 index 0000000..95572eb --- /dev/null +++ b/part1/ImageProcessing/ImageProcessing/vintageFS.glsl @@ -0,0 +1,40 @@ +varying vec2 v_Texcoords; + +uniform sampler2D u_image; +uniform vec2 u_step; +const vec3 W = vec3(0.2125, 0.7154, 0.0721); + +const int KERNEL_WIDTH = 7; // Odd +const float offset = 3.0; + +// From stack overflow +float rand(vec2 val) +{ + return fract(sin(dot(val.xy ,vec2(12.9898,78.233))) * 43758.5453); +} + +void main(void) +{ + vec3 accum = vec3(0.0); + + for (int i = 0; i < KERNEL_WIDTH; ++i) + { + for (int j = 0; j < KERNEL_WIDTH; ++j) + { + vec2 coord = vec2(v_Texcoords.s + ((float(i) - offset) * u_step.s), v_Texcoords.t + ((float(j) - offset) * u_step.t)); + accum += texture2D(u_image, coord).rgb; + } + } + + float luminance = dot(texture2D(u_image, v_Texcoords).rgb, W); + float noise = rand(vec2(v_Texcoords.s, v_Texcoords.t)); + float fromCenter = length(vec2(v_Texcoords.s - 0.5, v_Texcoords.t - 0.5)); + vec3 blur = accum / float(KERNEL_WIDTH * KERNEL_WIDTH) / 3.0; + vec3 vintageTone = vec3(luminance)*(vec3(164.0, 155.0, 95.0)/255.0)/1.2; + vec3 finalNoise = vec3(noise/10.0); + vec4 finalColor = vec4(blur + vintageTone + finalNoise, 1.0); + if (fromCenter > 0.3) + gl_FragColor = vec4(finalColor.xyz * (1.0-(fromCenter-0.3)*3.0),1.0); + else + gl_FragColor = finalColor; +} diff --git a/part1/ImageProcessing/ImageProcessing/weirdVS.glsl b/part1/ImageProcessing/ImageProcessing/weirdVS.glsl new file mode 100644 index 0000000..26df2ae --- /dev/null +++ b/part1/ImageProcessing/ImageProcessing/weirdVS.glsl @@ -0,0 +1,14 @@ +attribute vec4 Position; +attribute vec2 Texcoords; +varying vec2 v_Texcoords; + +uniform vec2 u_step; + +void main(void) +{ + v_Texcoords = Texcoords; + if (Position.x <0.1) + gl_Position = Position+0.5; + else + gl_Position = Position; +} \ No newline at end of file diff --git a/part1/ImageProcessing/SOIL/SOIL.vcxproj.user b/part1/ImageProcessing/SOIL/SOIL.vcxproj.user new file mode 100644 index 0000000..ace9a86 --- /dev/null +++ b/part1/ImageProcessing/SOIL/SOIL.vcxproj.user @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/part2/index.html b/part2/index.html index 1e3f7e2..7ebf790 100644 --- a/part2/index.html +++ b/part2/index.html @@ -15,20 +15,30 @@ attribute vec2 position; uniform mat4 u_modelViewPerspective; + uniform float u_time; + varying vec3 v_color; + + const vec3 minColor = vec3(1.0,0.2,0.0); + const vec3 maxColor = vec3(0.0,0.8,1.0); void main(void) { float height = 0.0; - gl_Position = u_modelViewPerspective * vec4(vec3(position, height), 1.0); + float s_contrib = sin(position.x*2.0*3.14159 + u_time); + float t_contrib = cos(position.y*2.0*3.14159 + u_time); + height = s_contrib*t_contrib; + v_color = mix(minColor, maxColor, height); + gl_Position = u_modelViewPerspective * vec4(vec3(position, height), 1.0); } diff --git a/part2/index.js b/part2/index.js index b5df3fb..cd98d2b 100644 --- a/part2/index.js +++ b/part2/index.js @@ -1,10 +1,11 @@ -(function() { +(function () { "use strict"; /*global window,document,Float32Array,Uint16Array,mat4,vec3,snoise*/ /*global getShaderSource,createWebGLContext,createProgram*/ var NUM_WIDTH_PTS = 32; var NUM_HEIGHT_PTS = 32; + var timer = 0; var message = document.getElementById("message"); var canvas = document.getElementById("canvas"); @@ -31,15 +32,17 @@ var positionLocation = 0; var heightLocation = 1; var u_modelViewPerspectiveLocation; + var u_time; (function initializeShader() { var program; var vs = getShaderSource(document.getElementById("vs")); var fs = getShaderSource(document.getElementById("fs")); - var program = createProgram(context, vs, fs, message); - context.bindAttribLocation(program, positionLocation, "position"); - u_modelViewPerspectiveLocation = context.getUniformLocation(program,"u_modelViewPerspective"); + var program = createProgram(context, vs, fs, message); + context.bindAttribLocation(program, positionLocation, "position"); + u_modelViewPerspectiveLocation = context.getUniformLocation(program, "u_modelViewPerspective"); + u_time = context.getUniformLocation(program, "u_time"); context.useProgram(program); })(); @@ -56,8 +59,7 @@ context.vertexAttribPointer(positionLocation, 2, context.FLOAT, false, 0, 0); context.enableVertexAttribArray(positionLocation); - if (heights) - { + if (heights) { // Heights var heightsName = context.createBuffer(); context.bindBuffer(context.ARRAY_BUFFER, heightsName); @@ -84,49 +86,45 @@ var indicesIndex = 0; var length; - for (var j = 0; j < NUM_WIDTH_PTS; ++j) - { - positions[positionsIndex++] = j /(NUM_WIDTH_PTS - 1); + for (var j = 0; j < NUM_WIDTH_PTS; ++j) { + positions[positionsIndex++] = j / (NUM_WIDTH_PTS - 1); positions[positionsIndex++] = 0.0; - if (j>=1) - { + if (j >= 1) { length = positionsIndex / 2; indices[indicesIndex++] = length - 2; indices[indicesIndex++] = length - 1; } } - for (var i = 0; i < HEIGHT_DIVISIONS; ++i) - { - var v = (i + 1) / (NUM_HEIGHT_PTS - 1); - positions[positionsIndex++] = 0.0; - positions[positionsIndex++] = v; - - length = (positionsIndex / 2); - indices[indicesIndex++] = length - 1; - indices[indicesIndex++] = length - 1 - NUM_WIDTH_PTS; - - for (var k = 0; k < WIDTH_DIVISIONS; ++k) - { - positions[positionsIndex++] = (k + 1) / (NUM_WIDTH_PTS - 1); - positions[positionsIndex++] = v; - - length = positionsIndex / 2; - var new_pt = length - 1; - indices[indicesIndex++] = new_pt - 1; // Previous side - indices[indicesIndex++] = new_pt; - - indices[indicesIndex++] = new_pt - NUM_WIDTH_PTS; // Previous bottom - indices[indicesIndex++] = new_pt; - } + for (var i = 0; i < HEIGHT_DIVISIONS; ++i) { + var v = (i + 1) / (NUM_HEIGHT_PTS - 1); + positions[positionsIndex++] = 0.0; + positions[positionsIndex++] = v; + + length = (positionsIndex / 2); + indices[indicesIndex++] = length - 1; + indices[indicesIndex++] = length - 1 - NUM_WIDTH_PTS; + + for (var k = 0; k < WIDTH_DIVISIONS; ++k) { + positions[positionsIndex++] = (k + 1) / (NUM_WIDTH_PTS - 1); + positions[positionsIndex++] = v; + + length = positionsIndex / 2; + var new_pt = length - 1; + indices[indicesIndex++] = new_pt - 1; // Previous side + indices[indicesIndex++] = new_pt; + + indices[indicesIndex++] = new_pt - NUM_WIDTH_PTS; // Previous bottom + indices[indicesIndex++] = new_pt; + } } uploadMesh(positions, heights, indices); numberOfIndices = indices.length; })(); - (function animate(){ + (function animate() { /////////////////////////////////////////////////////////////////////////// // Update @@ -143,9 +141,11 @@ context.clear(context.COLOR_BUFFER_BIT | context.DEPTH_BUFFER_BIT); context.uniformMatrix4fv(u_modelViewPerspectiveLocation, false, mvp); - context.drawElements(context.LINES, numberOfIndices, context.UNSIGNED_SHORT,0); + timer = timer + 0.01; + context.uniform1f(u_time, timer); + context.drawElements(context.LINES, numberOfIndices, context.UNSIGNED_SHORT, 0); - window.requestAnimFrame(animate); + window.requestAnimFrame(animate); })(); -}()); +} ()); diff --git a/part2/index_custom.html b/part2/index_custom.html new file mode 100644 index 0000000..bb950c5 --- /dev/null +++ b/part2/index_custom.html @@ -0,0 +1,54 @@ + + + + +Vertex Wave + + + + + +
+ + + + + + + + + + + + \ No newline at end of file diff --git a/part2/index_simplex.html b/part2/index_simplex.html new file mode 100644 index 0000000..cde2124 --- /dev/null +++ b/part2/index_simplex.html @@ -0,0 +1,92 @@ + + + + +Vertex Wave + + + + + +
+ + + + + + + + + + + + \ No newline at end of file diff --git a/renders/EdgeDetection.PNG b/renders/EdgeDetection.PNG new file mode 100644 index 0000000..43bdab7 Binary files /dev/null and b/renders/EdgeDetection.PNG differ diff --git a/renders/GaussianBlur.PNG b/renders/GaussianBlur.PNG new file mode 100644 index 0000000..5e4362d Binary files /dev/null and b/renders/GaussianBlur.PNG differ diff --git a/renders/GrayScale.PNG b/renders/GrayScale.PNG new file mode 100644 index 0000000..5b4d04c Binary files /dev/null and b/renders/GrayScale.PNG differ diff --git a/renders/Negative.PNG b/renders/Negative.PNG new file mode 100644 index 0000000..fc981ca Binary files /dev/null and b/renders/Negative.PNG differ diff --git a/renders/NightVision.PNG b/renders/NightVision.PNG new file mode 100644 index 0000000..4420c2b Binary files /dev/null and b/renders/NightVision.PNG differ diff --git a/renders/Sharpen.PNG b/renders/Sharpen.PNG new file mode 100644 index 0000000..5f0c336 Binary files /dev/null and b/renders/Sharpen.PNG differ diff --git a/renders/ToonShading.PNG b/renders/ToonShading.PNG new file mode 100644 index 0000000..9be2866 Binary files /dev/null and b/renders/ToonShading.PNG differ diff --git a/renders/UnsharpMask.PNG b/renders/UnsharpMask.PNG new file mode 100644 index 0000000..a4cfad4 Binary files /dev/null and b/renders/UnsharpMask.PNG differ diff --git a/renders/Vintage.PNG b/renders/Vintage.PNG new file mode 100644 index 0000000..88d9537 Binary files /dev/null and b/renders/Vintage.PNG differ