Moved raylib webpage to docs folder

raylib webpage has been completely reorganized and moved from gh-pages
(a pain to work with) to docs folder. Useless libs have been removed,
webs have been renamed, etc.

Now it would be easier (hopefully) to update webpage. :)

docs/examples/web/resources/fonts/bmfont.fnt

@@ -0,0 +1,99 @@
+info face="Arial Black" size=-32 bold=0 italic=0 charset="" unicode=1 stretchH=100 smooth=1 aa=1 padding=0,0,0,0 spacing=2,2 outline=0
+common lineHeight=45 base=35 scaleW=512 scaleH=256 pages=1 packed=0 alphaChnl=0 redChnl=4 greenChnl=4 blueChnl=4
+page id=0 file="bmfont.png"
+chars count=95
+char id=32   x=423   y=141   width=3     height=45    xoffset=-1    yoffset=0     xadvance=11    page=0  chnl=15
+char id=33   x=323   y=141   width=9     height=45    xoffset=1     yoffset=0     xadvance=11    page=0  chnl=15
+char id=34   x=123   y=141   width=16    height=45    xoffset=0     yoffset=0     xadvance=16    page=0  chnl=15
+char id=35   x=221   y=47    width=21    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=36   x=244   y=47    width=21    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=37   x=70    y=0     width=30    height=45    xoffset=1     yoffset=0     xadvance=32    page=0  chnl=15
+char id=38   x=390   y=0     width=25    height=45    xoffset=2     yoffset=0     xadvance=28    page=0  chnl=15
+char id=39   x=378   y=141   width=8     height=45    xoffset=1     yoffset=0     xadvance=9     page=0  chnl=15
+char id=40   x=222   y=141   width=11    height=45    xoffset=1     yoffset=0     xadvance=12    page=0  chnl=15
+char id=41   x=499   y=94    width=11    height=45    xoffset=1     yoffset=0     xadvance=12    page=0  chnl=15
+char id=42   x=497   y=47    width=13    height=45    xoffset=2     yoffset=0     xadvance=18    page=0  chnl=15
+char id=43   x=394   y=94    width=19    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=44   x=367   y=141   width=9     height=45    xoffset=1     yoffset=0     xadvance=11    page=0  chnl=15
+char id=45   x=261   y=141   width=11    height=45    xoffset=0     yoffset=0     xadvance=11    page=0  chnl=15
+char id=46   x=356   y=141   width=9     height=45    xoffset=1     yoffset=0     xadvance=11    page=0  chnl=15
+char id=47   x=248   y=141   width=11    height=45    xoffset=-1    yoffset=0     xadvance=9     page=0  chnl=15
+char id=48   x=382   y=47    width=21    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=49   x=496   y=0     width=14    height=45    xoffset=2     yoffset=0     xadvance=21    page=0  chnl=15
+char id=50   x=134   y=94    width=20    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=51   x=359   y=47    width=21    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=52   x=313   y=47    width=21    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=53   x=336   y=47    width=21    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=54   x=178   y=94    width=20    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=55   x=478   y=94    width=19    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=56   x=290   y=47    width=21    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=57   x=90    y=94    width=20    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=58   x=345   y=141   width=9     height=45    xoffset=1     yoffset=0     xadvance=11    page=0  chnl=15
+char id=59   x=334   y=141   width=9     height=45    xoffset=1     yoffset=0     xadvance=11    page=0  chnl=15
+char id=60   x=0     y=141   width=19    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=61   x=21    y=141   width=19    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=62   x=310   y=94    width=19    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=63   x=352   y=94    width=19    height=45    xoffset=1     yoffset=0     xadvance=20    page=0  chnl=15
+char id=64   x=279   y=0     width=26    height=45    xoffset=-1    yoffset=0     xadvance=24    page=0  chnl=15
+char id=65   x=193   y=0     width=27    height=45    xoffset=-1    yoffset=0     xadvance=25    page=0  chnl=15
+char id=66   x=150   y=47    width=22    height=45    xoffset=2     yoffset=0     xadvance=25    page=0  chnl=15
+char id=67   x=444   y=0     width=24    height=45    xoffset=1     yoffset=0     xadvance=25    page=0  chnl=15
+char id=68   x=174   y=47    width=22    height=45    xoffset=2     yoffset=0     xadvance=25    page=0  chnl=15
+char id=69   x=156   y=94    width=20    height=45    xoffset=2     yoffset=0     xadvance=23    page=0  chnl=15
+char id=70   x=63    y=141   width=18    height=45    xoffset=2     yoffset=0     xadvance=21    page=0  chnl=15
+char id=71   x=417   y=0     width=25    height=45    xoffset=1     yoffset=0     xadvance=27    page=0  chnl=15
+char id=72   x=125   y=47    width=23    height=45    xoffset=2     yoffset=0     xadvance=27    page=0  chnl=15
+char id=73   x=388   y=141   width=8     height=45    xoffset=2     yoffset=0     xadvance=12    page=0  chnl=15
+char id=74   x=200   y=94    width=20    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=75   x=251   y=0     width=26    height=45    xoffset=2     yoffset=0     xadvance=27    page=0  chnl=15
+char id=76   x=373   y=94    width=19    height=45    xoffset=2     yoffset=0     xadvance=21    page=0  chnl=15
+char id=77   x=134   y=0     width=28    height=45    xoffset=1     yoffset=0     xadvance=30    page=0  chnl=15
+char id=78   x=100   y=47    width=23    height=45    xoffset=2     yoffset=0     xadvance=27    page=0  chnl=15
+char id=79   x=363   y=0     width=25    height=45    xoffset=1     yoffset=0     xadvance=27    page=0  chnl=15
+char id=80   x=112   y=94    width=20    height=45    xoffset=2     yoffset=0     xadvance=23    page=0  chnl=15
+char id=81   x=335   y=0     width=26    height=45    xoffset=1     yoffset=0     xadvance=27    page=0  chnl=15
+char id=82   x=470   y=0     width=24    height=45    xoffset=2     yoffset=0     xadvance=25    page=0  chnl=15
+char id=83   x=75    y=47    width=23    height=45    xoffset=0     yoffset=0     xadvance=23    page=0  chnl=15
+char id=84   x=50    y=47    width=23    height=45    xoffset=0     yoffset=0     xadvance=23    page=0  chnl=15
+char id=85   x=25    y=47    width=23    height=45    xoffset=2     yoffset=0     xadvance=27    page=0  chnl=15
+char id=86   x=307   y=0     width=26    height=45    xoffset=0     yoffset=0     xadvance=25    page=0  chnl=15
+char id=87   x=0     y=0     width=34    height=45    xoffset=-1    yoffset=0     xadvance=32    page=0  chnl=15
+char id=88   x=222   y=0     width=27    height=45    xoffset=-1    yoffset=0     xadvance=25    page=0  chnl=15
+char id=89   x=164   y=0     width=27    height=45    xoffset=-1    yoffset=0     xadvance=25    page=0  chnl=15
+char id=90   x=0     y=47    width=23    height=45    xoffset=0     yoffset=0     xadvance=23    page=0  chnl=15
+char id=91   x=274   y=141   width=11    height=45    xoffset=1     yoffset=0     xadvance=12    page=0  chnl=15
+char id=92   x=300   y=141   width=10    height=45    xoffset=-1    yoffset=0     xadvance=9     page=0  chnl=15
+char id=93   x=287   y=141   width=11    height=45    xoffset=0     yoffset=0     xadvance=12    page=0  chnl=15
+char id=94   x=457   y=94    width=19    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=95   x=103   y=141   width=18    height=45    xoffset=-1    yoffset=0     xadvance=16    page=0  chnl=15
+char id=96   x=312   y=141   width=9     height=45    xoffset=0     yoffset=0     xadvance=11    page=0  chnl=15
+char id=97   x=474   y=47    width=21    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=98   x=68    y=94    width=20    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=99   x=267   y=47    width=21    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=100  x=46    y=94    width=20    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=101  x=198   y=47    width=21    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=102  x=141   y=141   width=15    height=45    xoffset=-1    yoffset=0     xadvance=12    page=0  chnl=15
+char id=103  x=222   y=94    width=20    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=104  x=415   y=94    width=19    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=105  x=398   y=141   width=7     height=45    xoffset=2     yoffset=0     xadvance=11    page=0  chnl=15
+char id=106  x=235   y=141   width=11    height=45    xoffset=-2    yoffset=0     xadvance=11    page=0  chnl=15
+char id=107  x=405   y=47    width=21    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=108  x=407   y=141   width=7     height=45    xoffset=2     yoffset=0     xadvance=11    page=0  chnl=15
+char id=109  x=102   y=0     width=30    height=45    xoffset=1     yoffset=0     xadvance=32    page=0  chnl=15
+char id=110  x=331   y=94    width=19    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=111  x=428   y=47    width=21    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=112  x=266   y=94    width=20    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=113  x=288   y=94    width=20    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=114  x=158   y=141   width=15    height=45    xoffset=1     yoffset=0     xadvance=14    page=0  chnl=15
+char id=115  x=244   y=94    width=20    height=45    xoffset=0     yoffset=0     xadvance=20    page=0  chnl=15
+char id=116  x=175   y=141   width=14    height=45    xoffset=0     yoffset=0     xadvance=14    page=0  chnl=15
+char id=117  x=436   y=94    width=19    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15
+char id=118  x=451   y=47    width=21    height=45    xoffset=0     yoffset=0     xadvance=20    page=0  chnl=15
+char id=119  x=36    y=0     width=32    height=45    xoffset=-1    yoffset=0     xadvance=30    page=0  chnl=15
+char id=120  x=0     y=94    width=21    height=45    xoffset=0     yoffset=0     xadvance=21    page=0  chnl=15
+char id=121  x=23    y=94    width=21    height=45    xoffset=0     yoffset=0     xadvance=20    page=0  chnl=15
+char id=122  x=83    y=141   width=18    height=45    xoffset=0     yoffset=0     xadvance=18    page=0  chnl=15
+char id=123  x=191   y=141   width=14    height=45    xoffset=-1    yoffset=0     xadvance=12    page=0  chnl=15
+char id=124  x=416   y=141   width=5     height=45    xoffset=2     yoffset=0     xadvance=9     page=0  chnl=15
+char id=125  x=207   y=141   width=13    height=45    xoffset=0     yoffset=0     xadvance=12    page=0  chnl=15
+char id=126  x=42    y=141   width=19    height=45    xoffset=1     yoffset=0     xadvance=21    page=0  chnl=15

docs/examples/web/resources/shaders/glsl100/base.vs

@@ -0,0 +1,26 @@
+#version 100
+
+// Input vertex attributes
+attribute vec3 vertexPosition;
+attribute vec2 vertexTexCoord;
+attribute vec3 vertexNormal;
+attribute vec4 vertexColor;
+
+// Input uniform values
+uniform mat4 mvpMatrix;
+
+// Output vertex attributes (to fragment shader)
+varying vec2 fragTexCoord;
+varying vec4 fragColor;
+
+// NOTE: Add here your custom variables 
+
+void main()
+{
+    // Send vertex attributes to fragment shader
+    fragTexCoord = vertexTexCoord;
+    fragColor = vertexColor;
+    
+    // Calculate final vertex position
+    gl_Position = mvpMatrix*vec4(vertexPosition, 1.0);
+}

docs/examples/web/resources/shaders/glsl100/bloom.fs

@@ -0,0 +1,37 @@
+#version 100
+
+precision mediump float;
+
+// Input vertex attributes (from vertex shader)
+varying vec2 fragTexCoord;
+varying vec4 fragColor;
+
+// Input uniform values
+uniform sampler2D texture0;
+uniform vec4 fragTintColor;
+
+// NOTE: Add here your custom variables
+
+void main()
+{
+    vec4 sum = vec4(0);
+    vec4 tc = vec4(0);
+
+    for (int i = -4; i < 4; i++)
+    {
+        for (int j = -3; j < 3; j++)
+        {
+            sum += texture2D(texture0, fragTexCoord + vec2(j, i)*0.004) * 0.25;
+        }
+    }
+    
+    // Texel color fetching from texture sampler
+    vec4 texelColor = texture2D(texture0, fragTexCoord);
+    
+    // Calculate final fragment color
+    if (texelColor.r < 0.3) tc = sum*sum*0.012 + texelColor;
+    else if (texelColor.r < 0.5) tc = sum*sum*0.009 + texelColor;
+    else tc = sum*sum*0.0075 + texelColor;
+    
+    gl_FragColor = tc;
+}

docs/examples/web/resources/shaders/glsl100/distortion.fs

@@ -0,0 +1,54 @@
+#version 100
+
+precision mediump float;
+
+// Input vertex attributes (from vertex shader)
+varying vec2 fragTexCoord;
+
+// Input uniform values
+uniform sampler2D texture0;
+
+// NOTE: Default parameters for Oculus Rift DK2 device
+const vec2 LeftLensCenter = vec2(0.2863248, 0.5);
+const vec2 RightLensCenter = vec2(0.7136753, 0.5);
+const vec2 LeftScreenCenter = vec2(0.25, 0.5);
+const vec2 RightScreenCenter = vec2(0.75, 0.5);
+const vec2 Scale = vec2(0.25, 0.45);
+const vec2 ScaleIn = vec2(4.0, 2.5);
+const vec4 HmdWarpParam = vec4(1.0, 0.22, 0.24, 0.0);
+const vec4 ChromaAbParam = vec4(0.996, -0.004, 1.014, 0.0);
+
+void main()
+{
+    // The following two variables need to be set per eye
+    vec2 LensCenter = fragTexCoord.x < 0.5 ? LeftLensCenter : RightLensCenter;
+    vec2 ScreenCenter = fragTexCoord.x < 0.5 ? LeftScreenCenter : RightScreenCenter;
+    
+    // Scales input texture coordinates for distortion: vec2 HmdWarp(vec2 fragTexCoord, vec2 LensCenter)
+    vec2 theta = (fragTexCoord - LensCenter)*ScaleIn;   // Scales to [-1, 1]
+    float rSq = theta.x*theta.x + theta.y*theta.y;
+    vec2 theta1 = theta*(HmdWarpParam.x + HmdWarpParam.y*rSq + HmdWarpParam.z*rSq*rSq + HmdWarpParam.w*rSq*rSq*rSq);
+    //vec2 tc = LensCenter + Scale*theta1;
+    
+    // Detect whether blue texture coordinates are out of range since these will scaled out the furthest
+    vec2 thetaBlue = theta1*(ChromaAbParam.z + ChromaAbParam.w*rSq);
+    vec2 tcBlue = LensCenter + Scale*thetaBlue;
+
+    if (any(bvec2(clamp(tcBlue, ScreenCenter - vec2(0.25, 0.5), ScreenCenter + vec2(0.25, 0.5)) - tcBlue))) gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0);
+    else
+    {
+        // Do blue texture lookup
+        float blue = texture2D(texture0, tcBlue).b;
+
+        // Do green lookup (no scaling)
+        vec2 tcGreen = LensCenter + Scale*theta1;
+        float green = texture2D(texture0, tcGreen).g;
+
+        // Do red scale and lookup
+        vec2 thetaRed = theta1*(ChromaAbParam.x + ChromaAbParam.y*rSq);
+        vec2 tcRed = LensCenter + Scale*thetaRed;
+        float red = texture2D(texture0, tcRed).r;
+
+        gl_FragColor = vec4(red, green, blue, 1.0);
+    }
+}

docs/examples/web/resources/shaders/glsl100/grayscale.fs

@@ -0,0 +1,25 @@
+#version 100
+
+precision mediump float;
+
+// Input vertex attributes (from vertex shader)
+varying vec2 fragTexCoord;
+varying vec4 fragColor;
+
+// Input uniform values
+uniform sampler2D texture0;
+uniform vec4 colDiffuse;
+
+// NOTE: Add here your custom variables
+
+void main()
+{
+    // Texel color fetching from texture sampler
+    vec4 texelColor = texture2D(texture0, fragTexCoord)*colDiffuse*fragColor;
+    
+    // Convert texel color to grayscale using NTSC conversion weights
+    float gray = dot(texelColor.rgb, vec3(0.299, 0.587, 0.114));
+    
+    // Calculate final fragment color
+    gl_FragColor = vec4(gray, gray, gray, texelColor.a);
+}

docs/examples/web/resources/shaders/glsl100/swirl.fs

@@ -0,0 +1,45 @@
+#version 100
+
+precision mediump float;
+
+// Input vertex attributes (from vertex shader)
+varying vec2 fragTexCoord;
+varying vec4 fragColor;
+
+// Input uniform values
+uniform sampler2D texture0;
+uniform vec4 colDiffuse;
+
+// NOTE: Add here your custom variables
+
+const float renderWidth = 800.0;      // HARDCODED for example!
+const float renderHeight = 480.0;     // Use uniforms instead...
+
+float radius = 250.0;
+float angle = 0.8;
+
+uniform vec2 center;// = vec2(200.0, 200.0);
+
+void main()
+{
+    vec2 texSize = vec2(renderWidth, renderHeight);
+    vec2 tc = fragTexCoord*texSize;
+    tc -= center;
+    
+    float dist = length(tc);
+
+    if (dist < radius) 
+    {
+        float percent = (radius - dist)/radius;
+        float theta = percent*percent*angle*8.0;
+        float s = sin(theta);
+        float c = cos(theta);
+        
+        tc = vec2(dot(tc, vec2(c, -s)), dot(tc, vec2(s, c)));
+    }
+
+    tc += center;
+    vec4 color = texture2D(texture0, tc/texSize)*colDiffuse*fragColor;;
+
+    gl_FragColor = vec4(color.rgb, 1.0);;
+}

docs/examples/web/resources/shaders/glsl330/base.vs

@@ -0,0 +1,26 @@
+#version 330
+
+// Input vertex attributes
+in vec3 vertexPosition;
+in vec2 vertexTexCoord;
+in vec3 vertexNormal;
+in vec4 vertexColor;
+
+// Input uniform values
+uniform mat4 mvpMatrix;
+
+// Output vertex attributes (to fragment shader)
+out vec2 fragTexCoord;
+out vec4 fragColor;
+
+// NOTE: Add here your custom variables 
+
+void main()
+{
+    // Send vertex attributes to fragment shader
+    fragTexCoord = vertexTexCoord;
+    fragColor = vertexColor;
+    
+    // Calculate final vertex position
+    gl_Position = mvpMatrix*vec4(vertexPosition, 1.0);
+}

docs/examples/web/resources/shaders/glsl330/bloom.fs

@@ -0,0 +1,38 @@
+#version 330
+
+// Input vertex attributes (from vertex shader)
+in vec2 fragTexCoord;
+in vec4 fragColor;
+
+// Input uniform values
+uniform sampler2D texture0;
+uniform vec4 fragTintColor;
+
+// Output fragment color
+out vec4 finalColor;
+
+// NOTE: Add here your custom variables
+
+void main()
+{
+    vec4 sum = vec4(0);
+    vec4 tc = vec4(0);
+
+    for (int i = -4; i < 4; i++)
+    {
+        for (int j = -3; j < 3; j++)
+        {
+            sum += texture(texture0, fragTexCoord + vec2(j, i)*0.004)*0.25;
+        }
+    }
+    
+    // Texel color fetching from texture sampler
+    vec4 texelColor = texture(texture0, fragTexCoord);
+    
+    // Calculate final fragment color
+    if (texelColor.r < 0.3) tc = sum*sum*0.012 + texelColor;
+    else if (texelColor.r < 0.5) tc = sum*sum*0.009 + texelColor;
+    else tc = sum*sum*0.0075 + texelColor;
+
+    finalColor = tc;
+}

docs/examples/web/resources/shaders/glsl330/depth.fs

@@ -0,0 +1,27 @@
+#version 330
+
+// Input vertex attributes (from vertex shader)
+in vec2 fragTexCoord;
+in vec4 fragColor;
+
+// Input uniform values
+uniform sampler2D texture0;     // Depth texture
+uniform vec4 fragTintColor;
+
+// Output fragment color
+out vec4 finalColor;
+
+// NOTE: Add here your custom variables
+
+void main()
+{
+    float zNear = 0.01; // camera z near
+    float zFar = 10.0;  // camera z far
+    float z = texture(texture0, fragTexCoord).x;
+
+    // Linearize depth value
+    float depth = (2.0*zNear)/(zFar + zNear - z*(zFar - zNear));
+    
+    // Calculate final fragment color
+    finalColor = vec4(depth, depth, depth, 1.0f);
+}

docs/examples/web/resources/shaders/glsl330/distortion.fs

@@ -0,0 +1,56 @@
+#version 330
+
+// Input vertex attributes (from vertex shader)
+in vec2 fragTexCoord;
+
+// Input uniform values
+uniform sampler2D texture0;
+
+// Output fragment color
+out vec4 finalColor;
+
+// NOTE: Default parameters for Oculus Rift DK2 device
+const vec2 LeftLensCenter = vec2(0.2863248, 0.5);
+const vec2 RightLensCenter = vec2(0.7136753, 0.5);
+const vec2 LeftScreenCenter = vec2(0.25, 0.5);
+const vec2 RightScreenCenter = vec2(0.75, 0.5);
+const vec2 Scale = vec2(0.25, 0.45);
+const vec2 ScaleIn = vec2(4.0, 2.5);
+const vec4 HmdWarpParam = vec4(1.0, 0.22, 0.24, 0.0);
+const vec4 ChromaAbParam = vec4(0.996, -0.004, 1.014, 0.0);
+
+void main()
+{
+    // The following two variables need to be set per eye
+    vec2 LensCenter = fragTexCoord.x < 0.5 ? LeftLensCenter : RightLensCenter;
+    vec2 ScreenCenter = fragTexCoord.x < 0.5 ? LeftScreenCenter : RightScreenCenter;
+    
+    // Scales input texture coordinates for distortion: vec2 HmdWarp(vec2 fragTexCoord, vec2 LensCenter)
+    vec2 theta = (fragTexCoord - LensCenter)*ScaleIn;   // Scales to [-1, 1]
+    float rSq = theta.x*theta.x + theta.y*theta.y;
+    vec2 theta1 = theta*(HmdWarpParam.x + HmdWarpParam.y*rSq + HmdWarpParam.z*rSq*rSq + HmdWarpParam.w*rSq*rSq*rSq);
+    //vec2 tc = LensCenter + Scale*theta1;
+    
+    // Detect whether blue texture coordinates are out of range since these will scaled out the furthest
+    vec2 thetaBlue = theta1*(ChromaAbParam.z + ChromaAbParam.w*rSq);
+    vec2 tcBlue = LensCenter + Scale*thetaBlue;
+
+    if (any(bvec2(clamp(tcBlue, ScreenCenter - vec2(0.25, 0.5), ScreenCenter + vec2(0.25, 0.5)) - tcBlue))) finalColor = vec4(0.0, 0.0, 0.0, 1.0);
+    else
+    {
+        // Do blue texture lookup
+        float blue = texture(texture0, tcBlue).b;
+
+        // Do green lookup (no scaling)
+        vec2 tcGreen = LensCenter + Scale*theta1;
+        float green = texture(texture0, tcGreen).g;
+
+        // Do red scale and lookup
+        vec2 thetaRed = theta1*(ChromaAbParam.x + ChromaAbParam.y*rSq);
+        vec2 tcRed = LensCenter + Scale*thetaRed;
+        float red = texture(texture0, tcRed).r;
+
+        finalColor = vec4(red, green, blue, 1.0);
+    }
+}
+

docs/examples/web/resources/shaders/glsl330/grayscale.fs

@@ -0,0 +1,26 @@
+#version 330
+
+// Input vertex attributes (from vertex shader)
+in vec2 fragTexCoord;
+in vec4 fragColor;
+
+// Input uniform values
+uniform sampler2D texture0;
+uniform vec4 colDiffuse;
+
+// Output fragment color
+out vec4 finalColor;
+
+// NOTE: Add here your custom variables
+
+void main()
+{
+    // Texel color fetching from texture sampler
+    vec4 texelColor = texture(texture0, fragTexCoord)*colDiffuse*fragColor;
+    
+    // Convert texel color to grayscale using NTSC conversion weights
+    float gray = dot(texelColor.rgb, vec3(0.299, 0.587, 0.114));
+    
+    // Calculate final fragment color
+    finalColor = vec4(gray, gray, gray, texelColor.a);
+}

docs/examples/web/resources/shaders/glsl330/swirl.fs

@@ -0,0 +1,46 @@
+#version 330
+
+// Input vertex attributes (from vertex shader)
+in vec2 fragTexCoord;
+in vec4 fragColor;
+
+// Input uniform values
+uniform sampler2D texture0;
+uniform vec4 fragTintColor;
+
+// Output fragment color
+out vec4 finalColor;
+
+// NOTE: Add here your custom variables
+
+const float renderWidth = 800.0;      // HARDCODED for example!
+const float renderHeight = 480.0;     // Use uniforms instead...
+
+float radius = 250.0;
+float angle = 0.8;
+
+uniform vec2 center = vec2(200.0, 200.0);
+
+void main()
+{
+    vec2 texSize = vec2(renderWidth, renderHeight);
+    vec2 tc = fragTexCoord*texSize;
+    tc -= center;
+    
+    float dist = length(tc);
+
+    if (dist < radius) 
+    {
+        float percent = (radius - dist)/radius;
+        float theta = percent*percent*angle*8.0;
+        float s = sin(theta);
+        float c = cos(theta);
+        
+        tc = vec2(dot(tc, vec2(c, -s)), dot(tc, vec2(s, c)));
+    }
+
+    tc += center;
+    vec4 color = texture2D(texture0, tc/texSize)*colDiffuse*fragColor;;
+
+    finalColor = vec4(color.rgb, 1.0);;
+}