CIS565-Fall-2013 · YuqinShao · Nov 4, 2013 · Nov 4, 2013 · Nov 7, 2013 · Nov 8, 2013
diff --git a/README.md b/README.md
diff --git a/images/bumpMapping.JPG b/images/bumpMapping.JPG
diff --git a/images/bumpMapping2.JPG b/images/bumpMapping2.JPG
diff --git a/images/bumpMapping3.JPG b/images/bumpMapping3.JPG
diff --git a/images/custom.JPG b/images/custom.JPG
diff --git a/images/rim.JPG b/images/rim.JPG
diff --git a/images/skybox.JPG b/images/skybox.JPG
diff --git a/part1/index_custom.html b/part1/index_custom.html
@@ -0,0 +1,58 @@
+<html>
+
+<head>
+<title>Custom Wave</title>
+<meta charset ="utf-8">
+<meta http-equiv="X-UA-Compatible" content="chrome=1">  <!-- Use Chrome Frame in IE --> 
+</head>
+
+<body>
+<div id="fps">fps: 0</div>
+<div id="message" style="position:absolute;top:100px"></div> <!-- Pixel offset to avoid FPS counter -->
+<canvas id="canvas" style="border: none;" width="1024" height="768" tabindex="1"></canvas>
+
+<script id="vs" type="x-shader/x-vertex">
+    attribute vec2 position;
+
+    uniform mat4 u_modelViewPerspective;
+    uniform float u_time;
+
+	varying vec4 FragColor;
+
+
+    void main(void)
+    {
+
+		float weight = (1.0-length(position - vec2(0.5, 0.5)));        
+
+        float s_contrib = weight * abs(cos(weight*2.0*3.14159 + u_time));
+        float t_contrib = weight * abs(cos(weight*2.0*3.14159 + u_time));
+
+		float height = s_contrib * t_contrib;
+		FragColor = mix(vec4(0.5,0.5,0.0,1.0),vec4(0.0,0.8,1.0,1.0),height);
+
+		gl_Position = u_modelViewPerspective * vec4(vec3(position, height), 1.0);
+
+    }
+
+
+
+</script>
+
+<script id="fs" type="x-shader/x-fragment">
+    precision mediump float;
+	varying vec4 FragColor;
+
+    void main(void)
+    {
+		gl_FragColor = FragColor;
+		//gl_FragColor = vec4(vec3(0.0), 1.0);
+    }    
+</script>
+
+<script src ="gl-matrix.js" type ="text/javascript"></script>
+<script src ="webGLUtility.js" type ="text/javascript"></script>
+<script src ="vert_wave_custom.js" type ="text/javascript"></script>
+</body>
+
+</html>
diff --git a/part1/index_simplex.html b/part1/index_simplex.html
@@ -0,0 +1,93 @@
+<html>
+
+<head>
+<title>Noise Wave</title>
+<meta charset ="utf-8">
+<meta http-equiv="X-UA-Compatible" content="chrome=1">  <!-- Use Chrome Frame in IE --> 
+</head>
+
+<body>
+<div id="message" style="position:absolute;top:100px"></div> <!-- Pixel offset to avoid FPS counter -->
+<canvas id="canvas" style="border: none;" width="1024" height="768" tabindex="1"></canvas>
+
+<script id="vs" type="x-shader/x-vertex">
+    attribute vec2 position;
+
+    uniform mat4 u_modelViewPerspective;
+    uniform float u_time;
+	varying vec4 FragColor;
+	vec3 permute(vec3 x) 
+	{
+	  x = ((x*34.0)+1.0)*x;
+	  return x - floor(x * (1.0 / 289.0)) * 289.0;
+	}
+	float simplexNoise(vec2 v)
+	{
+	  const vec4 C = vec4(0.211324865405187, 0.366025403784439,  -0.577350269189626, 0.024390243902439); 
+
+	  vec2 i  = floor(v + dot(v, C.yy) );
+	  vec2 x0 = v -   i + dot(i, C.xx);
+
+	  vec2 i1;
+	  i1 = (x0.x > x0.y) ? vec2(1.0, 0.0) : vec2(0.0, 1.0);
+
+	  vec4 x12 = x0.xyxy + C.xxzz;
+	  x12.xy -= i1;
+
+	  i = i - floor(i * (1.0 / 289.0)) * 289.0;
+
+	  vec3 p = permute( permute( i.y + vec3(0.0, i1.y, 1.0 ))
+			+ i.x + vec3(0.0, i1.x, 1.0 ));
+
+	  vec3 m = max(0.5 - vec3(dot(x0,x0), dot(x12.xy,x12.xy), dot(x12.zw,x12.zw)), 0.0);
+	  m = m*m ;
+	  m = m*m ;
+
+	  vec3 x = 2.0 * fract(p * C.www) - 1.0;
+	  vec3 h = abs(x) - 0.5;
+	  vec3 ox = floor(x + 0.5);
+	  vec3 a0 = x - ox;
+
+	  m *= inversesqrt( a0*a0 + h*h );
+
+	  vec3 g;
+	  g.x  = a0.x  * x0.x  + h.x  * x0.y;
+	  g.yz = a0.yz * x12.xz + h.yz * x12.yw;
+	  return 130.0 * dot(m, g);
+	}
+    void main(void)
+    {
+		//float s_contrib = sin(position.x*2.0*3.14159 + u_time);
+		//float t_contrib = cos(position.y*2.0*3.14159 + u_time);
+
+		vec2 simplexVec = vec2(u_time,position);
+		float s_contrib = simplexNoise(simplexVec);
+		float t_contrib = simplexNoise(vec2(s_contrib,u_time));
+
+		float height = s_contrib * t_contrib;
+		FragColor = mix(vec4(0.5,0.5,0.0,1.0),vec4(0.0,0.8,1.0,1.0),height);
+		gl_Position = u_modelViewPerspective * vec4(vec3(position, height), 1.0);
+
+    }
+
+
+
+</script>
+
+<script id="fs" type="x-shader/x-fragment">
+    precision mediump float;
+	varying vec4 FragColor;
+
+    void main(void)
+    {
+		gl_FragColor = FragColor;
+		//gl_FragColor = vec4(vec3(0.0), 1.0);
+    }    
+</script>
+
+<script src ="gl-matrix.js" type ="text/javascript"></script>
+<script src ="webGLUtility.js" type ="text/javascript"></script>
+<script src ="vert_wave.js" type ="text/javascript"></script>
+</body>
+
+</html>
diff --git a/part1/vert_wave.html b/part1/vert_wave.html
@@ -14,20 +14,28 @@
     attribute vec2 position;
 
     uniform mat4 u_modelViewPerspective;
-
+    uniform float u_time;
+	varying vec4 FragColor;
+
     void main(void)
     {
-		float height = 0.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);
+		float height = s_contrib * t_contrib;
+		FragColor = mix(vec4(0.5,0.5,0.0,1.0),vec4(0.0,0.8,1.0,1.0),height);
 		gl_Position = u_modelViewPerspective * vec4(vec3(position, height), 1.0);
+
     }
 </script>
 
 <script id="fs" type="x-shader/x-fragment">
     precision mediump float;
-
+	varying vec4 FragColor;
+
     void main(void)
     {
-		gl_FragColor = vec4(vec3(0.0), 1.0);
+		gl_FragColor = FragColor;
+		//gl_FragColor = vec4(vec3(0.0), 1.0);
     }    
 </script>
 

diff --git a/part1/vert_wave.js b/part1/vert_wave.js
@@ -31,7 +31,8 @@
     var positionLocation = 0;
     var heightLocation = 1;
     var u_modelViewPerspectiveLocation;
-
+
+
     (function initializeShader() {
         var program;
         var vs = getShaderSource(document.getElementById("vs"));
@@ -40,7 +41,9 @@
 		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);
     })();
 
@@ -125,7 +128,10 @@
         uploadMesh(positions, heights, indices);
         numberOfIndices = indices.length;
     })();
-
+
+	var u_time;
+	var time = 0;
+	var decrease = false;
     (function animate(){
         ///////////////////////////////////////////////////////////////////////////
         // Update
@@ -137,15 +143,31 @@
         mat4.multiply(view, model, mv);
         var mvp = mat4.create();
         mat4.multiply(persp, mv, mvp);
-
+
+		time += 0.001;
+
+
+
         ///////////////////////////////////////////////////////////////////////////
         // Render
         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);
-
+
+		context.uniform1f(u_time,time);
+
 		window.requestAnimFrame(animate);
     })();
-
+
+	var lastMouseX = null;
+	var lastMouseY = null;
+
+	(function handleMouseMove(event){
+		var newX = event.clientX;
+        var newY = event.clientY;
+	})();
+
+
+
 }());