lots

RAYGL.md

@@ -1,8 +1,8 @@
 # RayGL
 
-RayGL makes use of special prefixes and directives that transpile to glsl and setup the multi pass state. THe main script and all dependencies are composed in a single uber shader(Multi pass is controlled with conditional defines and the pass directive). If you want to debug the final glsl output, for now, just make a small typo and click "Apply". The side editor will show the final shader text along with the error message.
+RayGL makes use of special prefixes and directives. THe main script and all dependencies are composed in a single uber shader(Multi pass is controlled with conditional defines and the pass directive). If you want to debug the final glsl output, for now, just make a small typo and click "Apply". The side editor will show the final shader text along with the error message.
 
-All scripts must use "$main(vec4 outputColor, vec3 fragCoords)" as the entry point. The use of the "$" character does the name mangling to prevent conflicts and allow for variable/function reuse in other scripts.
+All scripts must use "$main(vec4 outputColor, vec3 fragCoords)" as the entry point. The use of the "$" character does the namespacing to prevent conflicts and allow for variable/function reuse in other scripts.
 
 Code modularization is performed with the following directives:
 
@@ -16,9 +16,9 @@ vec3 $myfunc(float myArg) {
 }
 ```
 
-We get the state from the Save link, and short url it to "someUrl"
+We get the editor state in a url from the Save link, and short url it to "someUrl"
 
-We can then import it in another script and give it a namespace which we can access with the "@" prefix as follows.
+We can then import it in another script and namespace it using the "@" prefix as follows.
 ```
 #import myModule < http://someUrl >
 
@@ -30,7 +30,7 @@ $main(vec4 outputColor, vec3 fragCoords)
 
 ## #export
 
-Scripts can define special placeholders in a global namespace to allow for overridable behavior(or a poor man's callback mechanism):
+Scripts can define special placeholders in a global namespace to allow for overridable behavior:
 
 ```
 #export a_global_func < vec3 (vec3 col) >
@@ -48,7 +48,7 @@ $main(vec4 outputColor, vec3 fragCoords)
 }
 ```
 
-Functions must be defined in the scripts but variables must not, they will be automatically added on the top of the shader using the configuration.
+Functions must be defined but variables must not, they will be automatically added on the top of the shader using the configuration.
 
 We then save/short url this script in someUrl and make a new one like:
 
@@ -150,7 +150,7 @@ outputColor.rg = uv.xy;
 // This will run in the main pass, read  
 // from the texture generated by MYPASS
 
-outputColor.gb = texture2D(@MYPASS.tex, uv).rg;
+outputColor.gbr = texture2D(@MYPASS.tex, uv).rgb;
 
 #endif
 
@@ -171,7 +171,7 @@ The keywords supported are the following:
 
 **screen** - Don't use framebuffers, output directly on screen
 
-**rel** - Interpret provided numbers as fractions of the screen size
+**rel** - Interpret provided coordinates as fractions of the screen size
 
 **func-xxx** - Set the blendFunction like this:
 ```
@@ -200,9 +200,39 @@ They keyword can be accompanied by 2 or 4 tokens, to use blendFunc or blendFuncS
     "min": "MIN_EXT",
     "max": "MAX_EXT"
 
-Mind that rayglider will try to enable the blend_minmax extension but is not guaranteed that the min and max modes will actually be available.
+Mind that rayglider will try to enable the blend_minmax extension but it is not guaranteed that the min and max modes will actually be available.
 
-**wrap** 
+**wrap**  Sets the wrap options for the framebuffer textures:
+
+```
+#pass P1 <1 1 rel wrap-clamp-repeat>
+```
+
+*   "mirror": "MIRRORED_REPEAT",
+    "clamp": "CLAMP_TO_EDGE",
+    "repeat": "REPEAT"
+
+**freq** Controls how often this pass will be performed. Accepts an argument for the number of frames to skip between invocations.
+
+```
+#pass P1 <1 1 rel freq-10>
+```
+
+**mipmap** Try to generate mipmaps for the framebuffer texture after render.
+
+**cube** Render a cubemap texture. In this case the texture uniform for the pass will be a samplerCube. It will perform the pass 6 times during which iFace uniform will take the values 0-6 to configure each face accordingly.  
+
+**map** Reduce the texture. Will perform the number of passes provided with the second argument each time halving both dimensions. The texture exposed as the uniform for the pass will be the previous level while performing the reduce pass. For all other passes it will be the last level.  
+
+**vmap** Same as map but will reduce only the height, useful for physic collision calculations
+
+**rmap** Same as map but will iterate the levels in reverse order, from smaller to bigger. Useful for implementing cone marching
+
+## #post
+
+Sets up a render pass like **#pass** but post passes will run after all normal passes. Useful for making post process modules and gui elements 
+
+## #midi
 
 ## #track
 

index.js

@@ -47,10 +47,11 @@ function render(time) {
         State.text = null;
         delete State.error;
         Config(text, function (c){
-            if(State.error) { ui(State.error); return; } else { ui(); }
+            if(State.error) { ui(State.error); return; } else { ui(null, c.title); }
             if(State.config) {
                 State.config.prepass.forEach(function(p) { p(false); });
                 State.config.passes.forEach(function(p) { p(false); });
+                State.config.postpass.forEach(function(p) { p(false); });
             }
             State.config = c;
             State.config.uniforms.iBoom = twgl.createTexture(State.context, boomOpts);
@@ -79,7 +80,8 @@ function render(time) {
 
     State.config.prepass.forEach(function(p) { p(); });
     State.config.passes.forEach(function(p) { p(); });
-
+    State.config.postpass.forEach(function(p) { p(); });
+
     lastTime = time;
     delete State.needResize;
 }

package.json

@@ -34,7 +34,7 @@
   },
   "homepage": "https://github.com/wizgrav/rayglider#readme",
   "dependencies": {
-    "twgl-base.js": "^4.4.0",
+    "twgl.js": "^4.4.0",
     "glsl-transpiler": "^1.5.8",
     "codemirror": "^5.37.0",
     "clubber": "^1.7.1",

run.html

@@ -371,16 +371,37 @@
       }
 
       #tap div {
+        color: white;
+        font-size: 3.33vh;
+        font-weight: bold;
+        align-self: center;
+      }
+
+      #title {
         color: white;
         font-size: 6.66vh;
         font-weight: bold;
         align-self: center;
+        z-index: 10;
+        position: fixed;
+        width: 100vw;
+        text-align:center;
+        text-shadow: 0.33vh 0.33vh black;
+        left:0;
+        top: 10vh;
+        transition: opacity 1s;
+        opacity: 0;
+        pointer-events: none;
+      }
+
+      #title.show {
+        opacity: 1;
       }
     </style>
     </head>
 
     <body>
-
+      <div id=title></div>
       <div id="audio" title="WARNING: The volume control affects the measurements.">    
 
       </div>

shaders/lib/debug

@@ -0,0 +1,22 @@
+vec4 $bars(vec4 m, vec2 uv) {
+    vec4 color = vec4(0.);
+    float inc = 1. / 4.;
+    for(float j=0.;j<4.;j++) {
+        float v = m.x;
+        m.xyzw = m.yzwx;
+        color.xyzw = color.yzwx;
+        if(uv.x < j * inc || uv.x >= (j + 1.) * inc) { 
+            continue;
+        }
+
+        if(uv.y > v){ 
+            color.w = 0.2;
+            continue;
+        }
+        color.w = 1.0;
+    }
+    if(color.a == 0.2) color.rgb = vec3(0.2);
+    else if(color.a == 1.0) color.rgb = vec3(1.);
+    color.a = 1.0;
+    return color;
+}

shaders/lib/noise/worley2D

@@ -0,0 +1,49 @@
+  // worley noise from glslify
+
+vec3 $permute(vec3 x) {
+    return mod((34.0 * x + 1.0) * x, 289.0);
+  }
+
+vec3 $dist(vec3 x, vec3 y,  bool manhattandistance) {
+  return manhattandistance ?  abs(x) + abs(y) :  (x * x + y * y);
+}
+
+  vec2 $noise(vec2 P, float jitter, bool manhattandistance) {
+  float K= 0.142857142857; // 1/7
+  float Ko= 0.428571428571 ;// 3/7
+  	vec2 Pi = mod(floor(P), 289.0);
+   	vec2 Pf = fract(P);
+  	vec3 oi = vec3(-1.0, 0.0, 1.0);
+  	vec3 of = vec3(-0.5, 0.5, 1.5);
+  	vec3 px = $permute(Pi.x + oi);
+  	vec3 p = $permute(px.x + Pi.y + oi); // p11, p12, p13
+  	vec3 ox = fract(p*K) - Ko;
+  	vec3 oy = mod(floor(p*K),7.0)*K - Ko;
+  	vec3 dx = Pf.x + 0.5 + jitter*ox;
+  	vec3 dy = Pf.y - of + jitter*oy;
+  	vec3 d1 = $dist(dx,dy, manhattandistance); // d11, d12 and d13, squared
+  	p = $permute(px.y + Pi.y + oi); // p21, p22, p23
+  	ox = fract(p*K) - Ko;
+  	oy = mod(floor(p*K),7.0)*K - Ko;
+  	dx = Pf.x - 0.5 + jitter*ox;
+  	dy = Pf.y - of + jitter*oy;
+  	vec3 d2 = $dist(dx,dy, manhattandistance); // d21, d22 and d23, squared
+  	p = $permute(px.z + Pi.y + oi); // p31, p32, p33
+  	ox = fract(p*K) - Ko;
+  	oy = mod(floor(p*K),7.0)*K - Ko;
+  	dx = Pf.x - 1.5 + jitter*ox;
+  	dy = Pf.y - of + jitter*oy;
+  	vec3 d3 = $dist(dx,dy, manhattandistance); // d31, d32 and d33, squared
+  	// Sort out the two smallest distances (F1, F2)
+  	vec3 d1a = min(d1, d2);
+  	d2 = max(d1, d2); // Swap to keep candidates for F2
+  	d2 = min(d2, d3); // neither F1 nor F2 are now in d3
+  	d1 = min(d1a, d2); // F1 is now in d1
+  	d2 = max(d1a, d2); // Swap to keep candidates for F2
+  	d1.xy = (d1.x < d1.y) ? d1.xy : d1.yx; // Swap if smaller
+  	d1.xz = (d1.x < d1.z) ? d1.xz : d1.zx; // F1 is in d1.x
+  	d1.yz = min(d1.yz, d2.yz); // F2 is now not in d2.yz
+  	d1.y = min(d1.y, d1.z); // nor in  d1.z
+  	d1.y = min(d1.y, d2.x); // F2 is in d1.y, we're done.
+  	return sqrt(d1.xy);
+  }