added shadow demo.

asalga · Dec 17, 2011 · ea13fe8 · ea13fe8
1 parent 550c64c
commit ea13fe8
Show file tree

Hide file tree

Showing 6 changed files with 140,634 additions and 0 deletions.
diff --git a/clouds/point_1.asc b/clouds/point_1.asc
@@ -0,0 +1 @@
+0 0 0 238 221 130
diff --git a/clouds/shadow_0.asc b/clouds/shadow_0.asc
diff --git a/demos/shadow_vertex_proj/index.html b/demos/shadow_vertex_proj/index.html
@@ -0,0 +1,21 @@
+<html>
+
+  <head>
+    <link rel="stylesheet" type="text/css" href="../style.css" />
+    <script src="../../xbps.js"></script>
+    <script src="../../libs/c3.js"></script>
+    <script src="shadow.js"></script>
+  </head>
+
+  <body onLoad="start();" style="background-color: transparent;">
+      <h1><a href="http://zenit.senecac.on.ca/wiki/index.php/XB_PointStream">XB PointStream</a> Vertex Projection Shadow Demo</h1>
+      <p>
+        This demonstrates simple vertex projection shadows/planar shadows.
+      </p>
+
+    <p>
+      <canvas id="canvas" width="500" height="500"></canvas><br />
+      FPS: <span id="debug"></span>
+    </p>
+  </body>
+</html>
diff --git a/demos/shadow_vertex_proj/shadow.fs b/demos/shadow_vertex_proj/shadow.fs
@@ -0,0 +1,9 @@
+#ifdef GL_ES
+  precision highp float;
+#endif
+
+varying vec4 frontColor;
+
+void main(void){
+  gl_FragColor = frontColor;
+}
diff --git a/demos/shadow_vertex_proj/shadow.js b/demos/shadow_vertex_proj/shadow.js
@@ -0,0 +1,107 @@
+var ps,
+    ctx,
+    cloud,
+    light;
+var shadow;
+
+// Camera and camera control
+var cam = new OrbitCam({closest:20, farthest:1000, distance: 100});
+cam.setOrbitPoint([0,50,0]);
+var rotationStartCoords = [0, 0];
+var isDragging;
+
+function mousePressed(){
+  isDragging = true;
+  rotationStartCoords[0] = ps.mouseX;
+  rotationStartCoords[1] = ps.mouseY;
+}
+
+function mouseReleased(){
+  isDragging = false;
+}
+
+function zoom(amt){
+  if(amt < 0)
+    cam.goCloser(-amt * 10);
+  else
+    cam.goFarther(amt * 10);
+}
+
+function render() {
+  ps.clear();
+
+  if(isDragging === true){
+    // how much was the cursor moved compared to last time
+    // this function was called?
+    var deltaX = ps.mouseX - rotationStartCoords[0];
+    var deltaY = ps.mouseY - rotationStartCoords[1];
+
+    // now that the camera was updated, reset where the
+    // rotation will start for the next time this function is called.
+    rotationStartCoords = [ps.mouseX, ps.mouseY];
+
+    cam.yaw(-deltaX * 0.015);
+    cam.pitch(deltaY * 0.015);
+  }
+
+  ps.multMatrix(M4x4.makeLookAt(cam.pos, V3.add(cam.pos, cam.dir), cam.up));
+
+  // Move the light around
+  var x = -200 * Math.cos(ps.frameCount/100);
+  var y = 600;
+  var z = -200 * Math.sin(ps.frameCount/100);
+  var c = cloud.getCenter();
+
+  // Draw a light
+  ps.pushMatrix();
+  ps.pointSize(10);
+  ps.attenuation(1,0, 0);
+  ps.translate(x, y, z);
+  ps.render(light);
+  ps.popMatrix();
+
+  // Draw shadow
+  ps.pointSize(3);
+  ps.attenuation(1,0, 0);
+  ps.pushMatrix();
+  ps.scale(0.25);
+  ps.uniformi("drawShadow", true);
+  ps.uniformf("lightPos",[x, y, z]);
+  ps.render(shadow);
+  ps.popMatrix();
+
+  // Draw cloud
+  ps.pointSize(15);
+  ps.attenuation(0.05, 0, 0.003);
+  ps.uniformi("drawShadow", false);
+  ps.translate(-c[0], -c[1]+45, -c[2]);
+  ps.render(cloud);
+  document.getElementById('debug').innerHTML = Math.floor(ps.frameRate);
+}
+
+function start(){
+  // put the camera in an interesting place
+  cam.pitch(0.8);
+  cam.yaw(-1);
+
+  ps = new PointStream();
+  ps.setup(document.getElementById('canvas'));
+  ctx = ps.getContext();
+
+  // Use a single shader for the cloud and the shadow.
+  var vert = ps.getShaderStr("shadow.vs");
+  var frag = ps.getShaderStr("shadow.fs");
+  progObj = ps.createProgram(vert, frag);
+  ps.useProgram(progObj);
+
+  ps.onRender = render;
+  ps.onMouseScroll = zoom;
+  ps.onMousePressed = mousePressed;
+  ps.onMouseReleased = mouseReleased;
+
+  ps.pointSize(12.0);
+
+  light = ps.load("../../clouds/point_1.asc");
+  cloud = ps.load("../../clouds/ariusman_842K_n.psi");
+  shadow = ps.load("../../clouds/shadow_0.asc");  
+}
diff --git a/demos/shadow_vertex_proj/shadow.vs b/demos/shadow_vertex_proj/shadow.vs
@@ -0,0 +1,50 @@
+attribute vec3 ps_Vertex;
+attribute vec4 ps_Color;
+
+varying vec4 frontColor;
+
+uniform float ps_PointSize;
+uniform vec3 ps_Attenuation;
+
+uniform vec3 lightPos;
+uniform bool drawShadow;
+uniform vec3 objCenter;
+
+uniform mat4 ps_ModelViewMatrix;
+uniform mat4 ps_ProjectionMatrix;
+
+void drawShadow(in vec3 l, in vec4 v){
+
+  // Calculate rise / run   
+  float slopeX = (l.y-v.y)/(l.x-v.x);
+  float slopeZ = (l.y-v.y)/(l.z-v.z); 
+
+  // We need to flatten by making all the y components the same.
+  v.y = 0.0;
+  v.x = l.x - (l.y / slopeX);
+  v.z = l.z - (l.y / slopeZ);
+
+  gl_Position = ps_ProjectionMatrix * ps_ModelViewMatrix * v;
+  frontColor = vec4(0.0, 0.0, 0.0, 1.0);
+}
+
+void main(void){
+  vec4 vert = vec4(ps_Vertex, 1.0);
+
+  float dist = length( vert );
+  float attn = ps_Attenuation[0] + 
+              (ps_Attenuation[1] * dist) + 
+              (ps_Attenuation[2] * dist * dist);
+
+  if(attn <= 0.0){ attn = 1.0;}
+
+  gl_PointSize = ps_PointSize * sqrt(1.0/attn);
+
+  if(drawShadow){
+    drawShadow(lightPos, vert);
+  }
+  else{
+    frontColor = ps_Color;
+    gl_Position = ps_ProjectionMatrix * ps_ModelViewMatrix * vert;
+  }
+}