Browse files

Different way of showing next dest gate (WIP)

Modified the shader to highlight your planet in the direction of your next
gate. Not totally working yet though.
  • Loading branch information...
1 parent 3ab84f7 commit 63ccc3fc38aa2c5720587ecd7e531cc2d5e68e25 @vilya committed May 16, 2012
Showing with 53 additions and 12 deletions.
  1. +24 −5 index-small.html
  2. +24 −5 index.html
  3. +5 −2 js/main.js
View
29 index-small.html
@@ -20,32 +20,51 @@
attribute vec2 pos;
attribute vec4 color;
attribute float radius;
+ attribute vec2 dest;
uniform mat4 worldToViewportMatrix;
varying vec4 vColor;
+ varying vec2 vPos;
+ varying vec2 vDest;
void main()
{
vec4 worldPos = vec4(pos, 0.0, 1.0);
gl_Position = worldToViewportMatrix * worldPos;
gl_PointSize = radius * 2.0;
vColor = color;
+ vPos = pos;
+ vDest = dest;
}
</script>
<script type="x-shader/x-fragment" id="draw-fs">
precision mediump float;
varying vec4 vColor;
+ varying vec2 vPos;
+ varying vec2 vDest;
void main()
{
- vec2 dist = vec2(0.5, 0.5) - gl_PointCoord;
- float lenSqr = dist.x * dist.x + dist.y * dist.y;
- if (lenSqr > 0.25)
+ const vec2 center = vec2(0.5, 0.5);
+ const vec3 destRGB = vec3(1.0, 1.0, 0.0);
+
+ vec2 v1 = gl_PointCoord - center;
+ vec2 v2 = vDest - vPos;
+
+ float dist = length(v1);
+ if (dist > 0.5)
discard;
- float z = sqrt(1.0 - lenSqr);
- gl_FragColor = vec4(vColor.xyz * z, vColor.w);
+
+ float z = sqrt(1.0 - dist * dist);
+
+ float t = dot(normalize(v1), normalize(v2));
+ t = clamp(t, 0.0, 1.0);
+
+ vec3 finalRGB = mix(vColor.xyz, destRGB, t) * z;
+
+ gl_FragColor = vec4(finalRGB, vColor.w);
}
</script>
View
29 index.html 100644 → 100755
@@ -20,32 +20,51 @@
attribute vec2 pos;
attribute vec4 color;
attribute float radius;
+ attribute vec2 dest;
uniform mat4 worldToViewportMatrix;
varying vec4 vColor;
+ varying vec2 vPos;
+ varying vec2 vDest;
void main()
{
vec4 worldPos = vec4(pos, 0.0, 1.0);
gl_Position = worldToViewportMatrix * worldPos;
gl_PointSize = radius * 2.0;
vColor = color;
+ vPos = pos;
+ vDest = dest;
}
</script>
<script type="x-shader/x-fragment" id="draw-fs">
precision mediump float;
varying vec4 vColor;
+ varying vec2 vPos;
+ varying vec2 vDest;
void main()
{
- vec2 dist = vec2(0.5, 0.5) - gl_PointCoord;
- float lenSqr = dist.x * dist.x + dist.y * dist.y;
- if (lenSqr > 0.25)
+ const vec2 center = vec2(0.5, 0.5);
+ const vec3 destRGB = vec3(1.0, 1.0, 0.0);
+
+ vec2 v1 = gl_PointCoord - center;
+ vec2 v2 = vDest - vPos;
+
+ float dist = length(v1);
+ if (dist > 0.5)
discard;
- float z = sqrt(1.0 - lenSqr);
- gl_FragColor = vec4(vColor.xyz * z, vColor.w);
+
+ float z = sqrt(1.0 - dist * dist);
+
+ float t = dot(normalize(v1), normalize(v2));
+ t = clamp(t, 0.0, 1.0);
+
+ vec3 finalRGB = mix(vColor.xyz, destRGB, t) * z;
+
+ gl_FragColor = vec4(finalRGB, vColor.w);
}
</script>
View
7 js/main.js
@@ -351,8 +351,8 @@ function init(drawCanvas, textCanvas)
// Set up the shaders
game.drawShader = program("draw-vs", "draw-fs",
- [ "worldToViewportMatrix", "color" ], // uniforms
- [ "pos", "color", "radius" ] ); // attributes
+ [ "worldToViewportMatrix", "color" ], // uniforms
+ [ "pos", "color", "radius", "dest" ] ); // attributes
game.waypointShader = program("waypoint-vs", "waypoint-fs",
[ "worldToViewportMatrix", "color" ], // uniforms
[ "pos" ] ); // attributes
@@ -526,6 +526,9 @@ function drawPlaying()
gl.vertexAttribPointer(game.drawShader.attribs['radius'], 1, gl.FLOAT, false, 4, 0);
gl.bindBuffer(gl.ARRAY_BUFFER, game.racerColorBuf);
gl.vertexAttribPointer(game.drawShader.attribs['color'], 4, gl.FLOAT, false, 16, 0);
+ gl.bindBuffer(gl.ARRAY_BUFFER, game.racerDestBuf);
+ gl.vertexAttribPointer(game.drawShader.attribs['dest'], 2, gl.FLOAT, false, 8, 0);
+
gl.drawArrays(gl.POINTS, 0, game.numRacers);
// Draw the obstacles, using the same shader

0 comments on commit 63ccc3f

Please sign in to comment.