🔧 Fix straight alpha

src/Wisps.js

@@ -177,6 +177,7 @@ if (utils.isInShellProcess()) {
         ${shaderSnippets.standardUniforms()}
         ${shaderSnippets.noise()}
         ${shaderSnippets.edgeMask()}
+        ${shaderSnippets.compositing()}
 
         uniform bool  uForOpening;
         uniform vec2  uSeed;
@@ -222,7 +223,7 @@ if (utils.isInShellProcess()) {
           // Use distance to center of shifted / rotated UV coordinates to draw a glaring point.
           float dist = length(cellUV - 0.5) * gridSize / radius;
           if (dist < 1.0) {
-            return min(10, 0.01 / pow(dist, 2.0));
+            return min(5, 0.01 / pow(dist, 2.0));
           }
 
           return 0.0;
@@ -233,7 +234,7 @@ if (utils.isInShellProcess()) {
         float progress = uForOpening ? 1.0-uProgress : uProgress;
         
         // Get the color of the window.
-        vec4 windowColor = texture2D(uTexture, cogl_tex_coord_in[0].st);
+        cogl_color_out = texture2D(uTexture, cogl_tex_coord_in[0].st);
         
         // Compute several layers of moving wisps.
         vec2 uv = (cogl_tex_coord_in[0].st-0.5) / mix(1.0, 0.5, progress) + 0.5;
@@ -254,10 +255,11 @@ if (utils.isInShellProcess()) {
         // Use a noise function to dissolve the window.
         float noise = smoothstep(1.0, 0.0, abs(2.0 * simplex2DFractal(uv * vec2(uSizeX, uSizeY) / 250) - 1.0));
         float windowMask = 1.0 - (windowOut < 0.5 ? mix(0.0, noise, windowOut * 2.0) : mix(noise, 1.0, windowOut * 2.0 - 1.0));
-        cogl_color_out = windowColor * windowMask * mask;
+        cogl_color_out.a *= windowMask * mask;
 
         // Add the wisps.
-        cogl_color_out += min(wispsIn, 1.0 - wispsOut) * wisps * vec4(uColor, 1.0) * mask * windowColor.a;
+        vec4 wispColor = wisps * vec4(uColor, min(wispsIn, 1.0 - wispsOut)*mask);
+        cogl_color_out = alphaOver(cogl_color_out, wispColor);
 
         // These are pretty useful for understanding how this works.
         // cogl_color_out = vec4(vec3(windowMask), 1.0);