1var wo=Object.defineProperty;var bo=(o,e,r)=>e in o?wo(o,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):o[e]=r;var S=(o,e,r)=>bo(o,typeof e!="symbol"?e+"":e,r);import{r as k,j as D}from"./index-CP3x4FvD.js";const Ao=`#version 300 es 2precision mediump float; 3 4layout(location = 0) in vec4 a_position; 5 6uniform vec2 u_resolution; 7uniform float u_pixelRatio; 8uniform float u_imageAspectRatio; 9uniform float u_originX; 10uniform float u_originY; 11uniform float u_worldWidth; 12uniform float u_worldHeight; 13uniform float u_fit; 14uniform float u_scale; 15uniform float u_rotation; 16uniform float u_offsetX; 17uniform float u_offsetY; 18 19out vec2 v_objectUV; 20out vec2 v_objectBoxSize; 21out vec2 v_responsiveUV; 22out vec2 v_responsiveBoxGivenSize; 23out vec2 v_patternUV; 24out vec2 v_patternBoxSize; 25out vec2 v_imageUV; 26 27vec3 getBoxSize(float boxRatio, vec2 givenBoxSize) { 28 vec2 box = vec2(0.); 29 // fit = none 30 box.x = boxRatio * min(givenBoxSize.x / boxRatio, givenBoxSize.y); 31 float noFitBoxWidth = box.x; 32 if (u_fit == 1.) { // fit = contain 33 box.x = boxRatio * min(u_resolution.x / boxRatio, u_resolution.y); 34 } else if (u_fit == 2.) { // fit = cover 35 box.x = boxRatio * max(u_resolution.x / boxRatio, u_resolution.y); 36 } 37 box.y = box.x / boxRatio; 38 return vec3(box, noFitBoxWidth); 39} 40 41void main() { 42 gl_Position = a_position; 43 44 vec2 uv = gl_Position.xy * .5; 45 vec2 boxOrigin = vec2(.5 - u_originX, u_originY - .5); 46 vec2 givenBoxSize = vec2(u_worldWidth, u_worldHeight); 47 givenBoxSize = max(givenBoxSize, vec2(1.)) * u_pixelRatio; 48 float r = u_rotation * 3.14159265358979323846 / 180.; 49 mat2 graphicRotation = mat2(cos(r), sin(r), -sin(r), cos(r)); 50 vec2 graphicOffset = vec2(-u_offsetX, u_offsetY); 51 52 53 // =================================================== 54 55 float fixedRatio = 1.; 56 vec2 fixedRatioBoxGivenSize = vec2( 57 (u_worldWidth == 0.) ? u_resolution.x : givenBoxSize.x, 58 (u_worldHeight == 0.) ? u_resolution.y : givenBoxSize.y 59 ); 60 61 v_objectBoxSize = getBoxSize(fixedRatio, fixedRatioBoxGivenSize).xy; 62 vec2 objectWorldScale = u_resolution.xy / v_objectBoxSize; 63 64 v_objectUV = uv; 65 v_objectUV *= objectWorldScale; 66 v_objectUV += boxOrigin * (objectWorldScale - 1.); 67 v_objectUV += graphicOffset; 68 v_objectUV /= u_scale; 69 v_objectUV = graphicRotation * v_objectUV; 70 71 // =================================================== 72 73 v_responsiveBoxGivenSize = vec2( 74 (u_worldWidth == 0.) ? u_resolution.x : givenBoxSize.x, 75 (u_worldHeight == 0.) ? u_resolution.y : givenBoxSize.y 76 ); 77 float responsiveRatio = v_responsiveBoxGivenSize.x / v_responsiveBoxGivenSize.y; 78 vec2 responsiveBoxSize = getBoxSize(responsiveRatio, v_responsiveBoxGivenSize).xy; 79 vec2 responsiveBoxScale = u_resolution.xy / responsiveBoxSize; 80 81 #ifdef ADD_HELPERS 82 v_responsiveHelperBox = uv; 83 v_responsiveHelperBox *= responsiveBoxScale; 84 v_responsiveHelperBox += boxOrigin * (responsiveBoxScale - 1.); 85 #endif 86 87 v_responsiveUV = uv; 88 v_responsiveUV *= responsiveBoxScale; 89 v_responsiveUV += boxOrigin * (responsiveBoxScale - 1.); 90 v_responsiveUV += graphicOffset; 91 v_responsiveUV /= u_scale; 92 v_responsiveUV.x *= responsiveRatio; 93 v_responsiveUV = graphicRotation * v_responsiveUV; 94 v_responsiveUV.x /= responsiveRatio; 95 96 // =================================================== 97 98 float patternBoxRatio = givenBoxSize.x / givenBoxSize.y; 99 vec2 patternBoxGivenSize = vec2( 100 (u_worldWidth == 0.) ? u_resolution.x : givenBoxSize.x, 101 (u_worldHeight == 0.) ? u_resolution.y : givenBoxSize.y 102 ); 103 patternBoxRatio = patternBoxGivenSize.x / patternBoxGivenSize.y; 104 105 vec3 boxSizeData = getBoxSize(patternBoxRatio, patternBoxGivenSize); 106 v_patternBoxSize = boxSizeData.xy; 107 float patternBoxNoFitBoxWidth = boxSizeData.z; 108 vec2 patternBoxScale = u_resolution.xy / v_patternBoxSize; 109 110 v_patternUV = uv; 111 v_patternUV += graphicOffset / patternBoxScale; 112 v_patternUV += boxOrigin; 113 v_patternUV -= boxOrigin / patternBoxScale; 114 v_patternUV *= u_resolution.xy; 115 v_patternUV /= u_pixelRatio; 116 if (u_fit > 0.) { 117 v_patternUV *= (patternBoxNoFitBoxWidth / v_patternBoxSize.x); 118 } 119 v_patternUV /= u_scale; 120 v_patternUV = graphicRotation * v_patternUV; 121 v_patternUV += boxOrigin / patternBoxScale; 122 v_patternUV -= boxOrigin; 123 // x100 is a default multiplier between vertex and fragmant shaders 124 // we use it to avoid UV presision issues 125 v_patternUV *= .01; 126 127 // =================================================== 128 129 vec2 imageBoxSize; 130 if (u_fit == 1.) { // contain 131 imageBoxSize.x = min(u_resolution.x / u_imageAspectRatio, u_resolution.y) * u_imageAspectRatio; 132 } else if (u_fit == 2.) { // cover 133 imageBoxSize.x = max(u_resolution.x / u_imageAspectRatio, u_resolution.y) * u_imageAspectRatio; 134 } else { 135 imageBoxSize.x = min(10.0, 10.0 / u_imageAspectRatio * u_imageAspectRatio); 136 } 137 imageBoxSize.y = imageBoxSize.x / u_imageAspectRatio; 138 vec2 imageBoxScale = u_resolution.xy / imageBoxSize; 139 140 v_imageUV = uv; 141 v_imageUV *= imageBoxScale; 142 v_imageUV += boxOrigin * (imageBoxScale - 1.); 143 v_imageUV += graphicOffset; 144 v_imageUV /= u_scale; 145 v_imageUV.x *= u_imageAspectRatio; 146 v_imageUV = graphicRotation * v_imageUV; 147 v_imageUV.x /= u_imageAspectRatio; 148 149 v_imageUV += .5; 150 v_imageUV.y = 1. - v_imageUV.y; 151}`,Ke=1920*1080*4;let Co=class{constructor(e,r,t,f,i=0,s=0,a=2,p=Ke,l=[]){S(this,"parentElement");S(this,"canvasElement");S(this,"gl");S(this,"program",null);S(this,"uniformLocations",{});S(this,"fragmentShader");S(this,"rafId",null);S(this,"lastRenderTime",0);S(this,"currentFrame",0);S(this,"speed",0);S(this,"currentSpeed",0);S(this,"providedUniforms");S(this,"mipmaps",[]);S(this,"hasBeenDisposed",!1);S(this,"resolutionChanged",!0);S(this,"textures",new Map);S(this,"minPixelRatio");S(this,"maxPixelCount");S(this,"isSafari",ko());S(this,"uniformCache",{});S(this,"textureUnitMap",new Map);S(this,"ownerDocument");S(this,"initProgram",()=>{const e=Bo(this.gl,Ao,this.fragmentShader);e&&(this.program=e)});S(this,"setupPositionAttribute",()=>{const e=this.gl.getAttribLocation(this.program,"a_position"),r=this.gl.createBuffer();this.gl.bindBuffer(this.gl.ARRAY_BUFFER,r);const t=[-1,-1,1,-1,-1,1,-1,1,1,-1,1,1];this.gl.bufferData(this.gl.ARRAY_BUFFER,new Float32Array(t),this.gl.STATIC_DRAW),this.gl.enableVertexAttribArray(e),this.gl.vertexAttribPointer(e,2,this.gl.FLOAT,!1,0,0)});S(this,"setupUniforms",()=>{const e={u_time:this.gl.getUniformLocation(this.program,"u_time"),u_pixelRatio:this.gl.getUniformLocation(this.program,"u_pixelRatio"),u_resolution:this.gl.getUniformLocation(this.program,"u_resolution")};
151Object.entries(this.providedUniforms).forEach(([r,t])=>{if(e[r]=this.gl.getUniformLocation(this.program,r),t instanceof HTMLImageElement){const f=`${r}AspectRatio`;e[f]=this.gl.getUniformLocation(this.program,f)}}),this.uniformLocations=e});S(this,"renderScale",1);S(this,"parentWidth",0);S(this,"parentHeight",0);S(this,"parentDevicePixelWidth",0);S(this,"parentDevicePixelHeight",0);S(this,"devicePixelsSupported",!1);S(this,"resizeObserver",null);S(this,"setupResizeObserver",()=>{this.resizeObserver=new ResizeObserver(([e])=>{var r;if(e!=null&&e.borderBoxSize[0]){const t=(r=e.devicePixelContentBoxSize)==null?void 0:r[0];t!==void 0&&(this.devicePixelsSupported=!0,this.parentDevicePixelWidth=t.inlineSize,this.parentDevicePixelHeight=t.blockSize),this.parentWidth=e.borderBoxSize[0].inlineSize,this.parentHeight=e.borderBoxSize[0].blockSize}this.handleResize()}),this.resizeObserver.observe(this.parentElement)});S(this,"handleVisualViewportChange",()=>{var e;(e=this.resizeObserver)==null||e.disconnect(),this.setupResizeObserver()});S(this,"handleResize",()=>{let e=0,r=0;const t=Math.max(1,window.devicePixelRatio),f=(visualViewport==null?void 0:visualViewport.scale)??1;if(this.devicePixelsSupported){const m=Math.max(1,this.minPixelRatio/t);e=this.parentDevicePixelWidth*m*f,r=this.parentDevicePixelHeight*m*f}else{let m=Math.max(t,this.minPixelRatio)*f;if(this.isSafari){const u=Uo(this.ownerDocument);m*=Math.max(1,u)}e=Math.round(this.parentWidth)*m,r=Math.round(this.parentHeight)*m}const i=Math.sqrt(this.maxPixelCount)/Math.sqrt(e*r),s=Math.min(1,i),a=Math.round(e*s),p=Math.round(r*s),l=a/Math.round(this.parentWidth);(this.canvasElement.width!==a||this.canvasElement.height!==p||this.renderScale!==l)&&(this.renderScale=l,this.canvasElement.width=a,this.canvasElement.height=p,this.resolutionChanged=!0,this.gl.viewport(0,0,this.gl.canvas.width,this.gl.canvas.height),this.render(performance.now()))});S(this,"render",e=>{if(this.hasBeenDisposed)return;if(this.program===null){console.warn("Tried to render before program or gl was initialized");return}const r=e-this.lastRenderTime;this.lastRenderTime=e,this.currentSpeed!==0&&(this.currentFrame+=r*this.currentSpeed),this.gl.clear(this.gl.COLOR_BUFFER_BIT),this.gl.useProgram(this.program),this.gl.uniform1f(this.uniformLocations.u_time,this.currentFrame*.001),this.resolutionChanged&&(this.gl.uniform2f(this.uniformLocations.u_resolution,this.gl.canvas.width,this.gl.canvas.height),this.gl.uniform1f(this.uniformLocations.u_pixelRatio,this.renderScale),this.resolutionChanged=!1),this.gl.drawArrays(this.gl.TRIANGLES,0,6),this.currentSpeed!==0?this.requestRender():this.rafId=null});S(this,"requestRender",()=>{this.rafId!==null&&cancelAnimationFrame(this.rafId),this.rafId=requestAnimationFrame(this.render)});S(this,"setTextureUniform",(e,r)=>{if(!r.complete||r.naturalWidth===0)throw new Error(`Paper Shaders: image for uniform ${e} must be fully loaded`);const t=this.textures.get(e);t&&this.gl.deleteTexture(t),this.textureUnitMap.has(e)||this.textureUnitMap.set(e,this.textureUnitMap.size);const f=this.textureUnitMap.get(e);this.gl.activeTexture(this.gl.TEXTURE0+f);const i=this.gl.createTexture();this.gl.bindTexture(this.gl.TEXTURE_2D,i),this.gl.texParameteri(this.gl.TEXTURE_2D,this.gl.TEXTURE_WRAP_S,this.gl.CLAMP_TO_EDGE),this.gl.texParameteri(this.gl.TEXTURE_2D,this.gl.TEXTURE_WRAP_T,this.gl.CLAMP_TO_EDGE),this.gl.texParameteri(this.gl.TEXTURE_2D,this.gl.TEXTURE_MIN_FILTER,this.gl.LINEAR),this.gl.texParameteri(this.gl.TEXTURE_2D,this.gl.TEXTURE_MAG_FILTER,this.gl.LINEAR),this.gl.texImage2D(this.gl.TEXTURE_2D,0,this.gl.RGBA,this.gl.RGBA,this.gl.UNSIGNED_BYTE,r),this.mipmaps.includes(e)&&(this.gl.generateMipmap(this.gl.TEXTURE_2D),this.gl.texParameteri(this.gl.TEXTURE_2D,this.gl.TEXTURE_MIN_FILTER,this.gl.LINEAR_MIPMAP_LINEAR));const s=this.gl.getError();if(s!==this.gl.NO_ERROR||i===null){console.error("Paper Shaders: WebGL error when uploading texture:",s);return}this.textures.set(e,i);const a=this.uniformLocations[e];if(a){this.gl.uniform1i(a,f);const p=`${e}AspectRatio`,l=this.uniformLocations[p];
151if(l){const m=r.naturalWidth/r.naturalHeight;this.gl.uniform1f(l,m)}}});S(this,"areUniformValuesEqual",(e,r)=>e===r?!0:Array.isArray(e)&&Array.isArray(r)&&e.length===r.length?e.every((t,f)=>this.areUniformValuesEqual(t,r[f])):!1);S(this,"setUniformValues",e=>{this.gl.useProgram(this.program),Object.entries(e).forEach(([r,t])=>{let f=t;if(t instanceof HTMLImageElement&&(f=`${t.src.slice(0,200)}|${t.naturalWidth}x${t.naturalHeight}`),this.areUniformValuesEqual(this.uniformCache[r],f))return;this.uniformCache[r]=f;const i=this.uniformLocations[r];if(!i){console.warn(`Uniform location for ${r} not found`);return}if(t instanceof HTMLImageElement)this.setTextureUniform(r,t);else if(Array.isArray(t)){let s=null,a=null;if(t[0]!==void 0&&Array.isArray(t[0])){const p=t[0].length;if(t.every(l=>l.length===p))s=t.flat(),a=p;else{console.warn(`All child arrays must be the same length for ${r}`);return}}else s=t,a=s.length;switch(a){case 2:this.gl.uniform2fv(i,s);break;case 3:this.gl.uniform3fv(i,s);break;case 4:this.gl.uniform4fv(i,s);break;case 9:this.gl.uniformMatrix3fv(i,!1,s);break;case 16:this.gl.uniformMatrix4fv(i,!1,s);break;default:console.warn(`Unsupported uniform array length: ${a}`)}}else typeof t=="number"?this.gl.uniform1f(i,t):typeof t=="boolean"?this.gl.uniform1i(i,t?1:0):console.warn(`Unsupported uniform type for ${r}: ${typeof t}`)})});S(this,"getCurrentFrame",()=>this.currentFrame);S(this,"setFrame",e=>{this.currentFrame=e,this.lastRenderTime=performance.now(),this.render(performance.now())});S(this,"setSpeed",(e=1)=>{this.speed=e,this.setCurrentSpeed(this.ownerDocument.hidden?0:e)});S(this,"setCurrentSpeed",e=>{this.currentSpeed=e,this.rafId===null&&e!==0&&(this.lastRenderTime=performance.now(),this.rafId=requestAnimationFrame(this.render)),this.rafId!==null&&e===0&&(cancelAnimationFrame(this.rafId),this.rafId=null)});S(this,"setMaxPixelCount",(e=Ke)=>{this.maxPixelCount=e,this.handleResize()});S(this,"setMinPixelRatio",(e=2)=>{this.minPixelRatio=e,this.handleResize()});S(this,"setUniforms",e=>{this.setUniformValues(e),this.providedUniforms={...this.providedUniforms,...e},this.render(performance.now())});S(this,"handleDocumentVisibilityChange",()=>{this.setCurrentSpeed(this.ownerDocument.hidden?0:this.speed)});S(this,"dispose",()=>{this.hasBeenDisposed=!0,this.rafId!==null&&(cancelAnimationFrame(this.rafId),this.rafId=null),this.gl&&this.program&&(this.textures.forEach(e=>{this.gl.deleteTexture(e)}),this.textures.clear(),this.gl.deleteProgram(this.program),this.program=null,this.gl.bindBuffer(this.gl.ARRAY_BUFFER,null),this.gl.bindBuffer(this.gl.ELEMENT_ARRAY_BUFFER,null),this.gl.bindRenderbuffer(this.gl.RENDERBUFFER,null),this.gl.bindFramebuffer(this.gl.FRAMEBUFFER,null),this.gl.getError()),this.resizeObserver&&(this.resizeObserver.disconnect(),this.resizeObserver=null),visualViewport==null||visualViewport.removeEventListener("resize",this.handleVisualViewportChange),this.ownerDocument.removeEventListener("visibilitychange",this.handleDocumentVisibilityChange),this.uniformLocations={},this.canvasElement.remove(),delete this.parentElement.paperShaderMount});if((e==null?void 0:e.nodeType)===1)this.parentElement=e;else throw new Error("Paper Shaders: parent element must be an HTMLElement");if(this.ownerDocument=e.ownerDocument,!this.ownerDocument.querySelector("style[data-paper-shader]")){const h=this.ownerDocument.createElement("style");h.innerHTML=So,h.setAttribute("data-paper-shader",""),this.ownerDocument.head.prepend(h)}const m=this.ownerDocument.createElement("canvas");this.canvasElement=m,this.parentElement.prepend(m),this.fragmentShader=r,this.providedUniforms=t,this.mipmaps=l,this.currentFrame=s,this.minPixelRatio=a,this.maxPixelCount=p;const u=m.getContext("webgl2",f);if(!u)throw new Error("Paper Shaders: WebGL is not supported in this browser");this.gl=u,this.initProgram(),this.setupPositionAttribute(),this.setupUniforms(),this.setUniformValues(this.providedUniforms),this.setupResizeObserver(),visualViewport==null||visualViewport.addEventListener("resize",this.handleVisualViewportChange),this.setSpeed(i),this.parentElement.setAttribute("data-paper-shader",""),this.parentElement.paperShaderMount=this,this.ownerDocument.addEventListener("visibilitychange",this.handleDocumentVisibilityChange)}};function qe(o,e,r){const t=o.createShader(e);return t?(o.shaderSource(t,r),o.compileShader(t),o.getShaderParameter(t,o.COMPILE_STATUS)?t:(console.error("An error occurred compiling the shaders: "+o.getShaderInfoLog(t)),o.deleteShader(t),null)):null}function Bo(o,e,r){const t=o.getShaderPrecisionFormat(o.FRAGMENT_SHADER,o.MEDIUM_FLOAT),f=t?t.precision:null;f&&f<23&&(e=e.replace(/precision\s+(lowp|mediump)\s+float;/g,"precision highp float;"),r=r.replace(/precision\s+(lowp|mediump)\s+float/g,"precision highp float").replace(/\b(uniform|varying|attribute)\s+(lowp|mediump)\s+(\w+)/g,"$1 highp $3"));const i=qe(o,o.VERTEX_SHADER,e),s=qe(o,o.FRAGMENT_SHADER,r);if(!i||!s)return null;const a=o.createProgram();return a?(o.attachShader(a,i),o.attachShader(a,s),o.linkProgram(a),o.getProgramParameter(a,o.LINK_STATUS)?(o.detachShader(a,i),o.detachShader(a,s),o.deleteShader(i),o.deleteShader(s),a):(console.error("Unable to initialize the shader program: "+o.getProgramInfoLog(a)),o.deleteProgram(a),o.deleteShader(i),o.deleteShader(s),null)):null}const So=`@layer paper-shaders { 152 :where([data-paper-shader]) { 153 isolation: isolate; 154 position: relative; 155 156 & canvas { 157 contain: strict; 158 display: block; 159 position: absolute; 160 inset: 0; 161 z-index: -1; 162 width: 100%; 163 height: 100%; 164 border-radius: inherit; 165 corner-shape: inherit; 166 } 167 } 168}`;
168function _r(o){return"paperShaderMount"in o}function ko(){const o=navigator.userAgent.toLowerCase();return o.includes("safari")&&!o.includes("chrome")&&!o.includes("android")}function Uo(o){const e=(visualViewport==null?void 0:visualViewport.scale)??1,r=(visualViewport==null?void 0:visualViewport.width)??window.innerWidth,t=window.innerWidth-o.documentElement.clientWidth,f=e*r+t,i=outerWidth/f,s=Math.round(100*i);return s%5===0?s/100:s===33?1/3:s===67?2/3:s===133?4/3:i}const b={fit:"contain",scale:1,rotation:0,offsetX:0,offsetY:0,originX:.5,originY:.5,worldWidth:0,worldHeight:0},I={fit:"none",scale:1,rotation:0,offsetX:0,offsetY:0,originX:.5,originY:.5,worldWidth:0,worldHeight:0},T={none:0,contain:1,cover:2},X=` 169#define TWO_PI 6.28318530718 170#define PI 3.14159265358979323846 171`,Be=` 172vec2 rotate(vec2 uv, float th) { 173 return mat2(cos(th), sin(th), -sin(th), cos(th)) * uv; 174} 175`,Ye=` 176 float hash11(float p) { 177 p = fract(p * 0.3183099) + 0.1; 178 p *= p + 19.19; 179 return fract(p * p); 180 } 181`,Fe=` 182 float hash21(vec2 p) { 183 p = fract(p * vec2(0.3183099, 0.3678794)) + 0.1; 184 p += dot(p, p + 19.19); 185 return fract(p.x * p.y); 186 } 187`,Pe=` 188 float randomR(vec2 p) { 189 vec2 uv = floor(p) / 100. + .5; 190 return texture(u_noiseTexture, fract(uv)).r; 191 } 192`,Le=` 193 vec2 randomGB(vec2 p) { 194 vec2 uv = floor(p) / 100. + .5; 195 return texture(u_noiseTexture, fract(uv)).gb; 196 } 197`,Ue=` 198 color += 1. / 256. * (fract(sin(dot(.014 * gl_FragCoord.xy, vec2(12.9898, 78.233))) * 43758.5453123) - .5); 199`,ze=` 200vec3 permute(vec3 x) { return mod(((x * 34.0) + 1.0) * x, 289.0); } 201float snoise(vec2 v) { 202 const vec4 C = vec4(0.211324865405187, 0.366025403784439, 203 -0.577350269189626, 0.024390243902439); 204 vec2 i = floor(v + dot(v, C.yy)); 205 vec2 x0 = v - i + dot(i, C.xx); 206 vec2 i1; 207 i1 = (x0.x > x0.y) ? vec2(1.0, 0.0) : vec2(0.0, 1.0); 208 vec4 x12 = x0.xyxy + C.xxzz; 209 x12.xy -= i1; 210 i = mod(i, 289.0); 211 vec3 p = permute(permute(i.y + vec3(0.0, i1.y, 1.0)) 212 + i.x + vec3(0.0, i1.x, 1.0)); 213 vec3 m = max(0.5 - vec3(dot(x0, x0), dot(x12.xy, x12.xy), 214 dot(x12.zw, x12.zw)), 0.0); 215 m = m * m; 216 m = m * m; 217 vec3 x = 2.0 * fract(p * C.www) - 1.0; 218 vec3 h = abs(x) - 0.5; 219 vec3 ox = floor(x + 0.5); 220 vec3 a0 = x - ox; 221 m *= 1.79284291400159 - 0.85373472095314 * (a0 * a0 + h * h); 222 vec3 g; 223 g.x = a0.x * x0.x + h.x * x0.y; 224 g.yz = a0.yz * x12.xz + h.yz * x12.yw; 225 return 130.0 * dot(m, g); 226} 227`,Vo=` 228float fiberRandom(vec2 p) { 229 vec2 uv = floor(p) / 100.; 230 return texture(u_noiseTexture, fract(uv)).b; 231} 232 233float fiberValueNoise(vec2 st) { 234 vec2 i = floor(st); 235 vec2 f = fract(st); 236 float a = fiberRandom(i); 237 float b = fiberRandom(i + vec2(1.0, 0.0)); 238 float c = fiberRandom(i + vec2(0.0, 1.0)); 239 float d = fiberRandom(i + vec2(1.0, 1.0)); 240 vec2 u = f * f * (3.0 - 2.0 * f); 241 float x1 = mix(a, b, u.x); 242 float x2 = mix(c, d, u.x); 243 return mix(x1, x2, u.y); 244} 245 246float fiberNoiseFbm(in vec2 n, vec2 seedOffset) { 247 float total = 0.0, amplitude = 1.; 248 for (int i = 0; i < 4; i++) { 249 n = rotate(n, .7); 250 total += fiberValueNoise(n + seedOffset) * amplitude; 251 n *= 2.; 252 amplitude *= 0.6; 253 } 254 return total; 255} 256 257float fiberNoise(vec2 uv, vec2 seedOffset) { 258 float epsilon = 0.001; 259 float n1 = fiberNoiseFbm(uv + vec2(epsilon, 0.0), seedOffset); 260 float n2 = fiberNoiseFbm(uv - vec2(epsilon, 0.0), seedOffset); 261 float n3 = fiberNoiseFbm(uv + vec2(0.0, epsilon), seedOffset); 262 float n4 = fiberNoiseFbm(uv - vec2(0.0, epsilon), seedOffset); 263 return length(vec2(n1 - n2, n3 - n4)) / (2.0 * epsilon); 264} 265`,Je={maxColorCount:10},Io=`#version 300 es 266precision mediump float; 267 268uniform float u_time; 269 270uniform vec4 u_colors[${Je.maxColorCount}]; 271uniform float u_colorsCount; 272 273uniform float u_distortion; 274uniform float u_swirl; 275uniform float u_grainMixer; 276uniform float u_grainOverlay; 277 278in vec2 v_objectUV; 279out vec4 fragColor; 280 281${X} 282${Be} 283${Fe} 284 285float valueNoise(vec2 st) { 286 vec2 i = floor(st); 287 vec2 f = fract(st); 288 float a = hash21(i); 289 float b = hash21(i + vec2(1.0, 0.0)); 290 float c = hash21(i + vec2(0.0, 1.0)); 291 float d = hash21(i + vec2(1.0, 1.0)); 292 vec2 u = f * f * (3.0 - 2.0 * f); 293 float x1 = mix(a, b, u.x); 294 float x2 = mix(c, d, u.x); 295 return mix(x1, x2, u.y); 296} 297 298float noise(vec2 n, vec2 seedOffset) { 299 return valueNoise(n + seedOffset); 300} 301 302vec2 getPosition(int i, float t) { 303 float a = float(i) * .37; 304 float b = .6 + fract(float(i) / 3.) * .9; 305 float c = .8 + fract(float(i + 1) / 4.); 306 307 float x = sin(t * b + a); 308 float y = cos(t * c + a * 1.5); 309 310 return .5 + .5 * vec2(x, y); 311} 312 313void main() { 314 vec2 uv = v_objectUV; 315 uv += .5; 316 vec2 grainUV = uv * 1000.; 317 318 float grain = noise(grainUV, vec2(0.)); 319 float mixerGrain = .4 * u_grainMixer * (grain - .5); 320 321 const float firstFrameOffset = 41.5; 322 float t = .5 * (u_time + firstFrameOffset); 323 324 float radius = smoothstep(0., 1., length(uv - .5)); 325 float center = 1. - radius; 326 for (float i = 1.; i <= 2.; i++) {
327 uv.x += u_distortion * center / i * sin(t + i * .4 * smoothstep(.0, 1., uv.y)) * cos(.2 * t + i * 2.4 * smoothstep(.0, 1., uv.y)); 328 uv.y += u_distortion * center / i * cos(t + i * 2. * smoothstep(.0, 1., uv.x)); 329 } 330 331 vec2 uvRotated = uv; 332 uvRotated -= vec2(.5); 333 float angle = 3. * u_swirl * radius; 334 uvRotated = rotate(uvRotated, -angle); 335 uvRotated += vec2(.5); 336 337 vec3 color = vec3(0.); 338 float opacity = 0.; 339 float totalWeight = 0.; 340 341 for (int i = 0; i < ${Je.maxColorCount}; i++) { 342 if (i >= int(u_colorsCount)) break; 343 344 vec2 pos = getPosition(i, t) + mixerGrain; 345 vec3 colorFraction = u_colors[i].rgb * u_colors[i].a; 346 float opacityFraction = u_colors[i].a; 347 348 float dist = length(uvRotated - pos); 349 350 dist = pow(dist, 3.5); 351 float weight = 1. / (dist + 1e-3); 352 color += colorFraction * weight; 353 opacity += opacityFraction * weight; 354 totalWeight += weight; 355 } 356 357 color /= max(1e-4, totalWeight); 358 opacity /= max(1e-4, totalWeight); 359 360 float grainOverlay = valueNoise(rotate(grainUV, 1.) + vec2(3.)); 361 grainOverlay = mix(grainOverlay, valueNoise(rotate(grainUV, 2.) + vec2(-1.)), .5); 362 grainOverlay = pow(grainOverlay, 1.3); 363 364 float grainOverlayV = grainOverlay * 2. - 1.; 365 vec3 grainOverlayColor = vec3(step(0., grainOverlayV)); 366 float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV); 367 grainOverlayStrength = pow(grainOverlayStrength, .8); 368 color = mix(color, grainOverlayColor, .35 * grainOverlayStrength); 369 370 opacity += .5 * grainOverlayStrength; 371 opacity = clamp(opacity, 0., 1.); 372 373 fragColor = vec4(color, opacity); 374} 375`,We={maxColorCount:10,maxNoiseIterations:8},Ro=`#version 300 es 376precision mediump float; 377 378uniform float u_time; 379 380uniform sampler2D u_noiseTexture; 381 382uniform vec4 u_colorBack; 383uniform vec4 u_colors[${We.maxColorCount}]; 384uniform float u_colorsCount; 385 386uniform float u_thickness; 387uniform float u_radius; 388uniform float u_innerShape; 389uniform float u_noiseScale; 390uniform float u_noiseIterations; 391 392in vec2 v_objectUV; 393 394out vec4 fragColor; 395 396${X} 397${Pe} 398float valueNoise(vec2 st) { 399 vec2 i = floor(st); 400 vec2 f = fract(st); 401 float a = randomR(i); 402 float b = randomR(i + vec2(1.0, 0.0)); 403 float c = randomR(i + vec2(0.0, 1.0)); 404 float d = randomR(i + vec2(1.0, 1.0)); 405 vec2 u = f * f * (3.0 - 2.0 * f); 406 float x1 = mix(a, b, u.x); 407 float x2 = mix(c, d, u.x); 408 return mix(x1, x2, u.y); 409} 410vec2 fbm(vec2 n0, vec2 n1) { 411 vec2 total = vec2(0.0); 412 float amplitude = .4; 413 for (int i = 0; i < ${We.maxNoiseIterations}; i++) { 414 if (i >= int(u_noiseIterations)) break; 415 total.x += valueNoise(n0) * amplitude; 416 total.y += valueNoise(n1) * amplitude; 417 n0 *= 1.99; 418 n1 *= 1.99; 419 amplitude *= 0.65; 420 } 421 return total; 422} 423 424float getNoise(vec2 uv, vec2 pUv, float t) { 425 vec2 pUvLeft = pUv + .03 * t; 426 float period = max(abs(u_noiseScale * TWO_PI), 1e-6); 427 vec2 pUvRight = vec2(fract(pUv.x / period) * period, pUv.y) + .03 * t; 428 vec2 noise = fbm(pUvLeft, pUvRight); 429 return mix(noise.y, noise.x, smoothstep(-.25, .25, uv.x)); 430} 431 432float getRingShape(vec2 uv) { 433 float radius = u_radius; 434 float thickness = u_thickness; 435 436 float distance = length(uv); 437 float ringValue = 1. - smoothstep(radius, radius + thickness, distance); 438 ringValue *= smoothstep(radius - pow(u_innerShape, 3.) * thickness, radius, distance); 439 440 return ringValue; 441} 442 443void main() { 444 vec2 shape_uv = v_objectUV; 445 446 float t = u_time; 447 448 float cycleDuration = 3.; 449 float period2 = 2.0 * cycleDuration; 450 float localTime1 = fract((0.1 * t + cycleDuration) / period2) * period2; 451 float localTime2 = fract((0.1 * t) / period2) * period2; 452 float timeBlend = .5 + .5 * sin(.1 * t * PI / cycleDuration - .5 * PI); 453 454 float atg = atan(shape_uv.y, shape_uv.x) + .001; 455 float l = length(shape_uv); 456 float radialOffset = .5 * l - inversesqrt(max(1e-4, l)); 457 vec2 polar_uv1 = vec2(atg, localTime1 - radialOffset) * u_noiseScale; 458 vec2 polar_uv2 = vec2(atg, localTime2 - radialOffset) * u_noiseScale; 459 460 float noise1 = getNoise(shape_uv, polar_uv1, t); 461 float noise2 = getNoise(shape_uv, polar_uv2, t); 462 463 float noise = mix(noise1, noise2, timeBlend); 464 465 shape_uv *= (.8 + 1.2 * noise); 466 467 float ringShape = getRingShape(shape_uv); 468 469 float mixer = ringShape * ringShape * (u_colorsCount - 1.); 470 int idxLast = int(u_colorsCount) - 1; 471 vec4 gradient = u_colors[idxLast]; 472 gradient.rgb *= gradient.a; 473 for (int i = ${We.maxColorCount} - 2; i >= 0; i--) { 474 float localT = clamp(mixer - float(idxLast - i - 1), 0., 1.); 475 vec4 c = u_colors[i]; 476 c.rgb *= c.a; 477 gradient = mix(gradient, c, localT); 478 } 479 480 vec3 color = gradient.rgb * ringShape; 481 float opacity = gradient.a * ringShape; 482 483 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 484 color = color + bgColor * (1. - opacity); 485 opacity = opacity + u_colorBack.a * (1. - opacity); 486 487 ${Ue} 488 489 fragColor = vec4(color, opacity); 490} 491`,Fo=`#version 300 es 492precision mediump float; 493 494uniform float u_time; 495uniform vec2 u_resolution; 496uniform float u_pixelRatio; 497 498uniform vec4 u_colorFront; 499uniform vec4 u_colorMid; 500uniform vec4 u_colorBack; 501uniform float u_brightness; 502uniform float u_contrast; 503 504in vec2 v_patternUV; 505 506out vec4 fragColor; 507 508${Be} 509 510float neuroShape(vec2 uv, float t) { 511 vec2 sine_acc = vec2(0.); 512 vec2 res = vec2(0.); 513 float scale = 8.; 514 515 for (int j = 0; j < 15; j++) { 516 uv = rotate(uv, 1.); 517 sine_acc = rotate(sine_acc, 1.); 518 vec2 layer = uv * scale + float(j) + sine_acc - t; 519 sine_acc += sin(layer); 520 res += (.5 + .5 * cos(layer)) / scale; 521 scale *= (1.2); 522 } 523 return res.x + res.y; 524} 525 526void main() { 527 vec2 shape_uv = v_patternUV; 528 shape_uv *= .13; 529 530 float t = .5 * u_time; 531 532 float noise = neuroShape(shape_uv, t); 533 534 noise = (1. + u_brightness) * noise * noise; 535 noise = pow(noise, .7 + 6. * u_contrast); 536 noise = min(1.4, noise); 537 538 float blend = smoothstep(0.7, 1.4, noise); 539 540 vec4 frontC = u_colorFront; 541 frontC.rgb *= frontC.a; 542 vec4 midC = u_colorMid; 543 midC.rgb *= midC.a; 544 vec4 blendFront = mix(midC, frontC, blend); 545 546 float safeNoise = max(noise, 0.0); 547 vec3 color = blendFront.rgb * safeNoise; 548 float opacity = clamp(blendFront.a * safeNoise, 0., 1.); 549 550 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 551 color = color + bgColor * (1. - opacity); 552 opacity = opacity + u_colorBack.a * (1. - opacity); 553 554 ${Ue} 555 556 fragColor = vec4(color, opacity); 557} 558`,Ze={maxColorCount:10},zo=`#version 300 es 559precision mediump float; 560 561uniform float u_time; 562 563uniform sampler2D u_noiseTexture; 564 565uniform vec4 u_colorBack; 566uniform vec4 u_colors[${Ze.maxColorCount}]; 567uniform float u_colorsCount; 568uniform float u_stepsPerColor; 569uniform float u_size; 570uniform float u_sizeRange; 571uniform float u_spreading; 572 573in vec2 v_patternUV; 574 575out vec4 fragColor; 576 577${X} 578${Be} 579${Pe} 580${Le} 581 582
583vec3 voronoiShape(vec2 uv, float time) { 584 vec2 i_uv = floor(uv); 585 vec2 f_uv = fract(uv); 586 587 float spreading = .25 * clamp(u_spreading, 0., 1.); 588 589 float minDist = 1.; 590 vec2 randomizer = vec2(0.); 591 for (int y = -1; y <= 1; y++) { 592 for (int x = -1; x <= 1; x++) { 593 vec2 tileOffset = vec2(float(x), float(y)); 594 vec2 rand = randomGB(i_uv + tileOffset); 595 vec2 cellCenter = vec2(.5 + 1e-4); 596 cellCenter += spreading * cos(time + TWO_PI * rand); 597 cellCenter -= .5; 598 cellCenter = rotate(cellCenter, randomR(vec2(rand.x, rand.y)) + .1 * time); 599 cellCenter += .5; 600 float dist = length(tileOffset + cellCenter - f_uv); 601 if (dist < minDist) { 602 minDist = dist; 603 randomizer = rand; 604 } 605 } 606 } 607 608 return vec3(minDist, randomizer); 609} 610 611void main() { 612 613 vec2 shape_uv = v_patternUV; 614 shape_uv *= 1.5; 615 616 const float firstFrameOffset = -10.; 617 float t = u_time + firstFrameOffset; 618 619 vec3 voronoi = voronoiShape(shape_uv, t) + 1e-4; 620 621 float radius = .25 * clamp(u_size, 0., 1.) - .5 * clamp(u_sizeRange, 0., 1.) * voronoi[2]; 622 float dist = voronoi[0]; 623 float edgeWidth = fwidth(dist); 624 float dots = 1. - smoothstep(radius - edgeWidth, radius + edgeWidth, dist); 625 626 float shape = voronoi[1]; 627 628 float mixer = shape * (u_colorsCount - 1.); 629 mixer = (shape - .5 / u_colorsCount) * u_colorsCount; 630 float steps = max(1., u_stepsPerColor); 631 632 vec4 gradient = u_colors[0]; 633 gradient.rgb *= gradient.a; 634 for (int i = 1; i < ${Ze.maxColorCount}; i++) { 635 if (i >= int(u_colorsCount)) break; 636 float localT = clamp(mixer - float(i - 1), 0.0, 1.0); 637 localT = round(localT * steps) / steps; 638 vec4 c = u_colors[i]; 639 c.rgb *= c.a; 640 gradient = mix(gradient, c, localT); 641 } 642 643 if ((mixer < 0.) || (mixer > (u_colorsCount - 1.))) { 644 float localT = mixer + 1.; 645 if (mixer > (u_colorsCount - 1.)) { 646 localT = mixer - (u_colorsCount - 1.); 647 } 648 localT = round(localT * steps) / steps; 649 vec4 cFst = u_colors[0]; 650 cFst.rgb *= cFst.a; 651 vec4 cLast = u_colors[int(u_colorsCount - 1.)]; 652 cLast.rgb *= cLast.a; 653 gradient = mix(cLast, cFst, localT); 654 } 655 656 vec3 color = gradient.rgb * dots; 657 float opacity = gradient.a * dots; 658 659 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 660 color = color + bgColor * (1. - opacity); 661 opacity = opacity + u_colorBack.a * (1. - opacity); 662 663 fragColor = vec4(color, opacity); 664} 665`,Mo=`#version 300 es 666precision mediump float; 667 668uniform vec4 u_colorBack; 669uniform vec4 u_colorFill; 670uniform vec4 u_colorStroke; 671uniform float u_dotSize; 672uniform float u_gapX; 673uniform float u_gapY; 674uniform float u_strokeWidth; 675uniform float u_sizeRange; 676uniform float u_opacityRange; 677uniform float u_shape; 678 679in vec2 v_patternUV; 680 681out vec4 fragColor; 682 683${X} 684${ze} 685 686float polygon(vec2 p, float N, float rot) { 687 float a = atan(p.x, p.y) + rot; 688 float r = TWO_PI / float(N); 689 690 return cos(floor(.5 + a / r) * r - a) * length(p); 691} 692 693void main() { 694 695 // x100 is a default multiplier between vertex and fragmant shaders 696 // we use it to avoid UV presision issues 697 vec2 shape_uv = 100. * v_patternUV; 698 699 vec2 gap = max(abs(vec2(u_gapX, u_gapY)), vec2(1e-6)); 700 vec2 grid = fract(shape_uv / gap) + 1e-4; 701 vec2 grid_idx = floor(shape_uv / gap); 702 float sizeRandomizer = .5 + .8 * snoise(2. * vec2(grid_idx.x * 100., grid_idx.y)); 703 float opacity_randomizer = .5 + .7 * snoise(2. * vec2(grid_idx.y, grid_idx.x)); 704 705 vec2 center = vec2(0.5) - 1e-3; 706 vec2 p = (grid - center) * vec2(u_gapX, u_gapY); 707 708 float baseSize = u_dotSize * (1. - sizeRandomizer * u_sizeRange); 709 float strokeWidth = u_strokeWidth * (1. - sizeRandomizer * u_sizeRange); 710 711 float dist; 712 if (u_shape < 0.5) { 713 // Circle 714 dist = length(p); 715 } else if (u_shape < 1.5) { 716 // Diamond 717 strokeWidth *= 1.5; 718 dist = polygon(1.5 * p, 4., .25 * PI); 719 } else if (u_shape < 2.5) { 720 // Square 721 dist = polygon(1.03 * p, 4., 1e-3); 722 } else { 723 // Triangle 724 strokeWidth *= 1.5; 725 p = p * 2. - 1.; 726 p *= .9; 727 p.y = 1. - p.y; 728 p.y -= .75 * baseSize; 729 dist = polygon(p, 3., 1e-3); 730 } 731 732 float edgeWidth = fwidth(dist); 733 float shapeOuter = 1. - smoothstep(baseSize - edgeWidth, baseSize + edgeWidth, dist - strokeWidth); 734 float shapeInner = 1. - smoothstep(baseSize - edgeWidth, baseSize + edgeWidth, dist); 735 float stroke = shapeOuter - shapeInner; 736 737 float dotOpacity = max(0., 1. - opacity_randomizer * u_opacityRange); 738 stroke *= dotOpacity; 739 shapeInner *= dotOpacity; 740 741 stroke *= u_colorStroke.a; 742 shapeInner *= u_colorFill.a; 743 744 vec3 color = vec3(0.); 745 color += stroke * u_colorStroke.rgb;
746 color += shapeInner * u_colorFill.rgb; 747 color += (1. - shapeInner - stroke) * u_colorBack.rgb * u_colorBack.a; 748 749 float opacity = 0.; 750 opacity += stroke; 751 opacity += shapeInner; 752 opacity += (1. - opacity) * u_colorBack.a; 753 754 fragColor = vec4(color, opacity); 755} 756`,Oo={circle:0,diamond:1,square:2,triangle:3},$e={maxColorCount:10},Po=`#version 300 es 757precision mediump float; 758 759uniform float u_time; 760uniform float u_scale; 761 762uniform vec4 u_colors[${$e.maxColorCount}]; 763uniform float u_colorsCount; 764uniform float u_stepsPerColor; 765uniform float u_softness; 766 767in vec2 v_patternUV; 768 769out vec4 fragColor; 770 771${ze} 772 773float getNoise(vec2 uv, float t) { 774 float noise = .5 * snoise(uv - vec2(0., .3 * t)); 775 noise += .5 * snoise(2. * uv + vec2(0., .32 * t)); 776 777 return noise; 778} 779 780float steppedSmooth(float m, float steps, float softness) { 781 float stepT = floor(m * steps) / steps; 782 float f = m * steps - floor(m * steps); 783 float fw = steps * fwidth(m); 784 float smoothed = smoothstep(.5 - softness, min(1., .5 + softness + fw), f); 785 return stepT + smoothed / steps; 786} 787 788void main() { 789 vec2 shape_uv = v_patternUV; 790 shape_uv *= .1; 791 792 float t = .2 * u_time; 793 794 float shape = .5 + .5 * getNoise(shape_uv, t); 795 796 bool u_extraSides = true; 797 798 float mixer = shape * (u_colorsCount - 1.); 799 if (u_extraSides == true) { 800 mixer = (shape - .5 / u_colorsCount) * u_colorsCount; 801 } 802 803 float steps = max(1., u_stepsPerColor); 804 805 vec4 gradient = u_colors[0]; 806 gradient.rgb *= gradient.a; 807 for (int i = 1; i < ${$e.maxColorCount}; i++) { 808 if (i >= int(u_colorsCount)) break; 809 810 float localM = clamp(mixer - float(i - 1), 0., 1.); 811 localM = steppedSmooth(localM, steps, .5 * u_softness); 812 813 vec4 c = u_colors[i]; 814 c.rgb *= c.a; 815 gradient = mix(gradient, c, localM); 816 } 817 818 if (u_extraSides == true) { 819 if ((mixer < 0.) || (mixer > (u_colorsCount - 1.))) { 820 float localM = mixer + 1.; 821 if (mixer > (u_colorsCount - 1.)) { 822 localM = mixer - (u_colorsCount - 1.); 823 } 824 localM = steppedSmooth(localM, steps, .5 * u_softness); 825 vec4 cFst = u_colors[0]; 826 cFst.rgb *= cFst.a; 827 vec4 cLast = u_colors[int(u_colorsCount - 1.)]; 828 cLast.rgb *= cLast.a; 829 gradient = mix(cLast, cFst, localM); 830 } 831 } 832 833 vec3 color = gradient.rgb; 834 float opacity = gradient.a; 835 836 ${Ue} 837 838 fragColor = vec4(color, opacity); 839} 840`,Te={maxColorCount:8,maxBallsCount:20},Eo=`#version 300 es 841precision mediump float; 842 843uniform float u_time; 844 845uniform sampler2D u_noiseTexture; 846 847uniform vec4 u_colorBack; 848uniform vec4 u_colors[${Te.maxColorCount}]; 849uniform float u_colorsCount; 850uniform float u_size; 851uniform float u_sizeRange; 852uniform float u_count; 853 854in vec2 v_objectUV; 855 856out vec4 fragColor; 857 858${X} 859${Pe} 860float noise(float x) { 861 float i = floor(x); 862 float f = fract(x); 863 float u = f * f * (3.0 - 2.0 * f); 864 vec2 p0 = vec2(i, 0.0); 865 vec2 p1 = vec2(i + 1.0, 0.0); 866 return mix(randomR(p0), randomR(p1), u); 867} 868 869float getBallShape(vec2 uv, vec2 c, float p) { 870 float s = .5 * length(uv - c); 871 s = 1. - clamp(s, 0., 1.); 872 s = pow(s, p); 873 return s; 874} 875 876void main() { 877 vec2 shape_uv = v_objectUV; 878 879 shape_uv += .5; 880 881 const float firstFrameOffset = 2503.4; 882 float t = .2 * (u_time + firstFrameOffset); 883 884 vec3 totalColor = vec3(0.); 885 float totalShape = 0.; 886 float totalOpacity = 0.; 887 888 for (int i = 0; i < ${Te.maxBallsCount}; i++) { 889 if (i >= int(ceil(u_count))) break; 890 891 float idxFract = float(i) / float(${Te.maxBallsCount}); 892 float angle = TWO_PI * idxFract; 893 894 float speed = 1. - .2 * idxFract; 895 float noiseX = noise(angle * 10. + float(i) + t * speed); 896 float noiseY = noise(angle * 20. + float(i) - t * speed); 897 898 vec2 pos = vec2(.5) + 1e-4 + .9 * (vec2(noiseX, noiseY) - .5); 899 900 int safeIndex = i % int(u_colorsCount + 0.5); 901 vec4 ballColor = u_colors[safeIndex]; 902 ballColor.rgb *= ballColor.a; 903 904 float sizeFrac = 1.; 905 if (float(i) > floor(u_count - 1.)) { 906 sizeFrac *= fract(u_count); 907 } 908 909 float shape = getBallShape(shape_uv, pos, 45. - 30. * u_size * sizeFrac); 910 shape *= pow(u_size, .2); 911 shape = smoothstep(0., 1., shape); 912 913 totalColor += ballColor.rgb * shape; 914 totalShape += shape; 915 totalOpacity += ballColor.a * shape; 916 } 917 918 totalColor /= max(totalShape, 1e-4); 919 totalOpacity /= max(totalShape, 1e-4); 920 921 float edge_width = fwidth(totalShape); 922 float finalShape = smoothstep(.4, .4 + edge_width, totalShape); 923 924 vec3 color = totalColor * finalShape; 925 float opacity = totalOpacity * finalShape; 926 927 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 928 color = color + bgColor * (1. - opacity); 929 opacity = opacity + u_colorBack.a * (1. - opacity); 930 931 ${Ue} 932 933 fragColor = vec4(color, opacity); 934} 935`,Do=`#version 300 es 936precision mediump float; 937 938uniform float u_time; 939 940uniform vec4 u_colorFront; 941uniform vec4 u_colorBack; 942uniform float u_proportion; 943uniform float u_softness; 944uniform float u_octaveCount; 945uniform float u_persistence; 946uniform float u_lacunarity; 947 948in vec2 v_patternUV; 949 950out vec4 fragColor; 951 952${X} 953${Ye} 954${Fe} 955 956float hash31(vec3 p) { 957 p = fract(p * 0.3183099) + 0.1; 958 p += dot(p, p.yzx + 19.19); 959 return fract(p.x * (p.y + p.z)); 960} 961 962vec3 gradientPredefined(float hash) { 963 int idx = int(hash * 12.0) % 12; 964 965 if (idx == 0) return vec3(1, 1, 0); 966 if (idx == 1) return vec3(-1, 1, 0); 967 if (idx == 2) return vec3(1, -1, 0); 968 if (idx == 3) return vec3(-1, -1, 0); 969 if (idx == 4) return vec3(1, 0, 1); 970 if (idx == 5) return vec3(-1, 0, 1); 971 if (idx == 6) return vec3(1, 0, -1); 972 if (idx == 7) return vec3(-1, 0, -1); 973 if (idx == 8) return vec3(0, 1, 1); 974 if (idx == 9) return vec3(0, -1, 1); 975 if (idx == 10) return vec3(0, 1, -1); 976 return vec3(0, -1, -1);// idx == 11 977} 978 979float interpolateSafe(float v000, float v001, float v010, float v011, 980float v100, float v101, float v110, float v111, vec3 t) { 981 t = clamp(t, 0.0, 1.0); 982 983 float v00 = mix(v000, v100, t.x); 984 float v01 = mix(v001, v101, t.x); 985 float v10 = mix(v010, v110, t.x); 986 float v11 = mix(v011, v111, t.x); 987 988 float v0 = mix(v00, v10, t.y); 989 float v1 = mix(v01, v11, t.y); 990 991 return mix(v0, v1, t.z); 992} 993 994vec3 fade(vec3 t) { 995 return t * t * t * (t * (t * 6.0 - 15.0) + 10.0); 996} 997 998float perlinNoise(vec3 position, float seed) { 999 position += vec3(seed * 127.1, seed * 311.7, seed * 74.7); 1000 1001 vec3 i = floor(position); 1002 vec3 f = fract(position); 1003 float h000 = hash31(i); 1004 float h001 = hash31(i + vec3(0, 0, 1)); 1005 float h010 = hash31(i + vec3(0, 1, 0)); 1006 float h011 = hash31(i + vec3(0, 1, 1)); 1007 float h100 = hash31(i + vec3(1, 0, 0)); 1008 float h101 = hash31(i + vec3(1, 0, 1)); 1009 float h110 = hash31(i + vec3(1, 1, 0)); 1010 float h111 = hash31(i + vec3(1, 1, 1)); 1011 vec3 g000 = gradientPredefined(h000); 1012 vec3 g001 = gradientPredefined(h001); 1013 vec3 g010 = gradientPredefined(h010); 1014 vec3 g011 = gradientPredefined(h011); 1015 vec3 g100 = gradientPredefined(h100); 1016 vec3 g101 = gradientPredefined(h101); 1017 vec3 g110 = gradientPredefined(h110); 1018 vec3 g111 = gradientPredefined(h111); 1019 float v000 = dot(g000, f - vec3(0, 0, 0)); 1020 float v001 = dot(g001, f - vec3(0, 0, 1)); 1021 float v010 = dot(g010, f - vec3(0, 1, 0)); 1022 float v011 = dot(g011, f - vec3(0, 1, 1)); 1023 float v100 = dot(g100, f - vec3(1, 0, 0)); 1024 float v101 = dot(g101, f - vec3(1, 0, 1)); 1025 float v110 = dot(g110, f - vec3(1, 1, 0)); 1026 float v111 = dot(g111, f - vec3(1, 1, 1)); 1027 1028 vec3 u = fade(f); 1029 return interpolateSafe(v000, v001, v010, v011, v100, v101, v110, v111, u); 1030} 1031
1032float p_noise(vec3 position, int octaveCount, float persistence, float lacunarity) { 1033 float value = 0.0; 1034 float amplitude = 1.0; 1035 float frequency = 10.0; 1036 float maxValue = 0.0; 1037 octaveCount = clamp(octaveCount, 1, 8); 1038 1039 for (int i = 0; i < octaveCount; i++) { 1040 float seed = float(i) * 0.7319; 1041 value += perlinNoise(position * frequency, seed) * amplitude; 1042 maxValue += amplitude; 1043 amplitude *= persistence; 1044 frequency *= lacunarity; 1045 } 1046 return value; 1047} 1048 1049float get_max_amp(float persistence, float octaveCount) { 1050 persistence = clamp(persistence * 0.999, 0.0, 0.999); 1051 octaveCount = clamp(octaveCount, 1.0, 8.0); 1052 1053 if (abs(persistence - 1.0) < 0.001) { 1054 return octaveCount; 1055 } 1056 1057 return (1.0 - pow(persistence, octaveCount)) / max(1e-4, (1.0 - persistence)); 1058} 1059 1060void main() { 1061 vec2 uv = v_patternUV; 1062 uv *= .5; 1063 1064 float t = .2 * u_time; 1065 1066 vec3 p = vec3(uv, t); 1067 1068 float octCount = floor(u_octaveCount); 1069 float noise = p_noise(p, int(octCount), u_persistence, u_lacunarity); 1070 1071 float max_amp = get_max_amp(u_persistence, octCount); 1072 float noise_normalized = clamp((noise + max_amp) / max(1e-4, (2. * max_amp)) + (u_proportion - .5), 0.0, 1.0); 1073 float sharpness = clamp(u_softness, 0., 1.); 1074 float smooth_w = 0.5 * max(fwidth(noise_normalized), 0.001); 1075 float res = smoothstep( 1076 .5 - .5 * sharpness - smooth_w, 1077 .5 + .5 * sharpness + smooth_w, 1078 noise_normalized 1079 ); 1080 1081 vec3 fgColor = u_colorFront.rgb * u_colorFront.a; 1082 float fgOpacity = u_colorFront.a; 1083 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 1084 float bgOpacity = u_colorBack.a; 1085 1086 vec3 color = fgColor * res; 1087 float opacity = fgOpacity * res; 1088 1089 color += bgColor * (1. - opacity); 1090 opacity += bgOpacity * (1. - opacity); 1091 1092 ${Ue} 1093 1094 fragColor = vec4(color, opacity); 1095} 1096`,eo={maxColorCount:5},Yo=`#version 300 es 1097precision mediump float; 1098 1099uniform float u_time; 1100 1101uniform float u_scale; 1102 1103uniform sampler2D u_noiseTexture; 1104 1105uniform vec4 u_colors[${eo.maxColorCount}]; 1106uniform float u_colorsCount; 1107 1108uniform float u_stepsPerColor; 1109uniform vec4 u_colorGlow; 1110uniform vec4 u_colorGap; 1111uniform float u_distortion; 1112uniform float u_gap; 1113uniform float u_glow; 1114 1115in vec2 v_patternUV; 1116 1117out vec4 fragColor; 1118 1119${X} 1120${Le} 1121 1122vec4 voronoi(vec2 x, float t) { 1123 vec2 ip = floor(x); 1124 vec2 fp = fract(x); 1125 1126 vec2 mg, mr; 1127 float md = 8.; 1128 float rand = 0.; 1129 1130 for (int j = -1; j <= 1; j++) { 1131 for (int i = -1; i <= 1; i++) { 1132 vec2 g = vec2(float(i), float(j)); 1133 vec2 o = randomGB(ip + g); 1134 float raw_hash = o.x; 1135 o = .5 + u_distortion * sin(t + TWO_PI * o); 1136 vec2 r = g + o - fp; 1137 float d = dot(r, r); 1138 1139 if (d < md) { 1140 md = d; 1141 mr = r; 1142 mg = g; 1143 rand = raw_hash; 1144 } 1145 } 1146 } 1147 1148 md = 8.; 1149 for (int j = -2; j <= 2; j++) { 1150 for (int i = -2; i <= 2; i++) { 1151 vec2 g = mg + vec2(float(i), float(j)); 1152 vec2 o = randomGB(ip + g); 1153 o = .5 + u_distortion * sin(t + TWO_PI * o); 1154 vec2 r = g + o - fp; 1155 if (dot(mr - r, mr - r) > .00001) { 1156 md = min(md, dot(.5 * (mr + r), normalize(r - mr))); 1157 } 1158 } 1159 } 1160 1161 return vec4(md, mr, rand); 1162} 1163 1164void main() { 1165 vec2 shape_uv = v_patternUV; 1166 shape_uv *= 1.25; 1167 1168 float t = u_time; 1169 1170 vec4 voronoiRes = voronoi(shape_uv, t); 1171 1172 float shape = clamp(voronoiRes.w, 0., 1.); 1173 float mixer = shape * (u_colorsCount - 1.); 1174 mixer = (shape - .5 / u_colorsCount) * u_colorsCount; 1175 float steps = max(1., u_stepsPerColor); 1176 1177 vec4 gradient = u_colors[0]; 1178 gradient.rgb *= gradient.a; 1179 for (int i = 1; i < ${eo.maxColorCount}; i++) { 1180 if (i >= int(u_colorsCount)) break; 1181 float localT = clamp(mixer - float(i - 1), 0.0, 1.0); 1182 localT = round(localT * steps) / steps; 1183 vec4 c = u_colors[i]; 1184 c.rgb *= c.a; 1185 gradient = mix(gradient, c, localT); 1186 } 1187 1188 if ((mixer < 0.) || (mixer > (u_colorsCount - 1.))) { 1189 float localT = mixer + 1.; 1190 if (mixer > (u_colorsCount - 1.)) { 1191 localT = mixer - (u_colorsCount - 1.); 1192 } 1193 localT = round(localT * steps) / steps; 1194 vec4 cFst = u_colors[0]; 1195 cFst.rgb *= cFst.a; 1196 vec4 cLast = u_colors[int(u_colorsCount - 1.)]; 1197 cLast.rgb *= cLast.a; 1198 gradient = mix(cLast, cFst, localT); 1199 } 1200 1201 vec3 cellColor = gradient.rgb; 1202 float cellOpacity = gradient.a; 1203 1204 float glows = length(voronoiRes.yz * u_glow);
1205 glows = pow(glows, 1.5); 1206 1207 vec3 color = mix(cellColor, u_colorGlow.rgb * u_colorGlow.a, u_colorGlow.a * glows); 1208 float opacity = cellOpacity + u_colorGlow.a * glows; 1209 1210 float edge = voronoiRes.x; 1211 float smoothEdge = .02 / (2. * u_scale) * (1. + .5 * u_gap); 1212 edge = smoothstep(u_gap - smoothEdge, u_gap + smoothEdge, edge); 1213 1214 color = mix(u_colorGap.rgb * u_colorGap.a, color, edge); 1215 opacity = mix(u_colorGap.a, opacity, edge); 1216 1217 fragColor = vec4(color, opacity); 1218} 1219`,Go=`#version 300 es 1220precision mediump float; 1221 1222uniform vec4 u_colorFront; 1223uniform vec4 u_colorBack; 1224uniform float u_shape; 1225uniform float u_frequency; 1226uniform float u_amplitude; 1227uniform float u_spacing; 1228uniform float u_proportion; 1229uniform float u_softness; 1230 1231in vec2 v_patternUV; 1232 1233out vec4 fragColor; 1234 1235${X} 1236 1237void main() { 1238 vec2 shape_uv = v_patternUV; 1239 shape_uv *= 4.; 1240 1241 float wave = .5 * cos(shape_uv.x * u_frequency * TWO_PI); 1242 float zigzag = 2. * abs(fract(shape_uv.x * u_frequency) - .5); 1243 float irregular = sin(shape_uv.x * .25 * u_frequency * TWO_PI) * cos(shape_uv.x * u_frequency * TWO_PI); 1244 float irregular2 = .75 * (sin(shape_uv.x * u_frequency * TWO_PI) + .5 * cos(shape_uv.x * .5 * u_frequency * TWO_PI)); 1245 1246 float offset = mix(zigzag, wave, smoothstep(0., 1., u_shape)); 1247 offset = mix(offset, irregular, smoothstep(1., 2., u_shape)); 1248 offset = mix(offset, irregular2, smoothstep(2., 3., u_shape)); 1249 offset *= 2. * u_amplitude; 1250 1251 float spacing = (.001 + u_spacing); 1252 float shape = .5 + .5 * sin((shape_uv.y + offset) * PI / spacing); 1253 1254 float aa = .0001 + fwidth(shape); 1255 float dc = 1. - clamp(u_proportion, 0., 1.); 1256 float e0 = dc - u_softness - aa; 1257 float e1 = dc + u_softness + aa; 1258 float res = smoothstep(min(e0, e1), max(e0, e1), shape); 1259 1260 vec3 fgColor = u_colorFront.rgb * u_colorFront.a; 1261 float fgOpacity = u_colorFront.a; 1262 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 1263 float bgOpacity = u_colorBack.a; 1264 1265 vec3 color = fgColor * res; 1266 float opacity = fgOpacity * res; 1267 1268 color += bgColor * (1. - opacity); 1269 opacity += bgOpacity * (1. - opacity); 1270 1271 fragColor = vec4(color, opacity); 1272} 1273`,oo={maxColorCount:10},Wo=`#version 300 es 1274precision mediump float; 1275 1276uniform float u_time; 1277uniform float u_scale; 1278 1279uniform sampler2D u_noiseTexture; 1280 1281uniform vec4 u_colors[${oo.maxColorCount}]; 1282uniform float u_colorsCount; 1283uniform float u_proportion; 1284uniform float u_softness; 1285uniform float u_shape; 1286uniform float u_shapeScale; 1287uniform float u_distortion; 1288uniform float u_swirl; 1289uniform float u_swirlIterations; 1290 1291in vec2 v_patternUV; 1292 1293out vec4 fragColor; 1294 1295${X} 1296${Be} 1297float randomG(vec2 p) { 1298 vec2 uv = floor(p) / 100. + .5; 1299 return texture(u_noiseTexture, fract(uv)).g; 1300} 1301float valueNoise(vec2 st) { 1302 vec2 i = floor(st); 1303 vec2 f = fract(st); 1304 float a = randomG(i); 1305 float b = randomG(i + vec2(1.0, 0.0)); 1306 float c = randomG(i + vec2(0.0, 1.0)); 1307 float d = randomG(i + vec2(1.0, 1.0)); 1308 vec2 u = f * f * (3.0 - 2.0 * f); 1309 float x1 = mix(a, b, u.x); 1310 float x2 = mix(c, d, u.x); 1311 return mix(x1, x2, u.y); 1312} 1313 1314 1315void main() { 1316 vec2 uv = v_patternUV; 1317 uv *= .5; 1318 1319 const float firstFrameOffset = 118.; 1320 float t = 0.0625 * (u_time + firstFrameOffset); 1321 1322 float n1 = valueNoise(uv * 1. + t); 1323 float n2 = valueNoise(uv * 2. - t); 1324 float angle = n1 * TWO_PI; 1325 uv.x += 4. * u_distortion * n2 * cos(angle); 1326 uv.y += 4. * u_distortion * n2 * sin(angle); 1327 1328 float swirl = u_swirl; 1329 for (int i = 1; i <= 20; i++) { 1330 if (i >= int(u_swirlIterations)) break; 1331 float iFloat = float(i); 1332 // swirl *= (1. - smoothstep(.0, .25, length(fwidth(uv)))); 1333 uv.x += swirl / iFloat * cos(t + iFloat * 1.5 * uv.y); 1334 uv.y += swirl / iFloat * cos(t + iFloat * 1. * uv.x); 1335 } 1336 1337 float proportion = clamp(u_proportion, 0., 1.); 1338 1339 float shape = 0.; 1340 if (u_shape < .5) { 1341 vec2 checksShape_uv = uv * (.5 + 3.5 * u_shapeScale); 1342 shape = .5 + .5 * sin(checksShape_uv.x) * cos(checksShape_uv.y); 1343 shape += .48 * sign(proportion - .5) * pow(abs(proportion - .5), .5); 1344 } else if (u_shape < 1.5) { 1345 vec2 stripesShape_uv = uv * (2. * u_shapeScale); 1346 float f = fract(stripesShape_uv.y); 1347 shape = smoothstep(.0, .55, f) * (1.0 - smoothstep(.45, 1., f)); 1348 shape += .48 * sign(proportion - .5) * pow(abs(proportion - .5), .5); 1349 } else { 1350 float shapeScaling = 5. * (1. - u_shapeScale); 1351 float e0 = 0.45 - shapeScaling; 1352 float e1 = 0.55 + shapeScaling;
1353 shape = smoothstep(min(e0, e1), max(e0, e1), 1.0 - uv.y + 0.3 * (proportion - 0.5)); 1354 } 1355 1356 float mixer = shape * (u_colorsCount - 1.); 1357 vec4 gradient = u_colors[0]; 1358 gradient.rgb *= gradient.a; 1359 float aa = fwidth(shape); 1360 for (int i = 1; i < ${oo.maxColorCount}; i++) { 1361 if (i >= int(u_colorsCount)) break; 1362 float m = clamp(mixer - float(i - 1), 0.0, 1.0); 1363 1364 float localMixerStart = floor(m); 1365 float softness = .5 * u_softness + fwidth(m); 1366 float smoothed = smoothstep(max(0., .5 - softness - aa), min(1., .5 + softness + aa), m - localMixerStart); 1367 float stepped = localMixerStart + smoothed; 1368 1369 m = mix(stepped, m, u_softness); 1370 1371 vec4 c = u_colors[i]; 1372 c.rgb *= c.a; 1373 gradient = mix(gradient, c, m); 1374 } 1375 1376 vec3 color = gradient.rgb; 1377 float opacity = gradient.a; 1378 1379 ${Ue} 1380 1381 fragColor = vec4(color, opacity); 1382} 1383`,To={checks:0,stripes:1,edge:2},ao={maxColorCount:5},No=`#version 300 es 1384precision mediump float; 1385 1386uniform float u_time; 1387 1388uniform sampler2D u_noiseTexture; 1389 1390uniform vec4 u_colorBack; 1391uniform vec4 u_colorBloom; 1392uniform vec4 u_colors[${ao.maxColorCount}]; 1393uniform float u_colorsCount; 1394 1395uniform float u_density; 1396uniform float u_spotty; 1397uniform float u_midSize; 1398uniform float u_midIntensity; 1399uniform float u_intensity; 1400uniform float u_bloom; 1401 1402in vec2 v_objectUV; 1403 1404out vec4 fragColor; 1405 1406${X} 1407${Be} 1408${Pe} 1409float valueNoise(vec2 st) { 1410 vec2 i = floor(st); 1411 vec2 f = fract(st); 1412 float a = randomR(i); 1413 float b = randomR(i + vec2(1.0, 0.0)); 1414 float c = randomR(i + vec2(0.0, 1.0)); 1415 float d = randomR(i + vec2(1.0, 1.0)); 1416 vec2 u = f * f * (3.0 - 2.0 * f); 1417 float x1 = mix(a, b, u.x); 1418 float x2 = mix(c, d, u.x); 1419 return mix(x1, x2, u.y); 1420} 1421 1422${Ye} 1423 1424float raysShape(vec2 uv, float r, float freq, float intensity, float radius) { 1425 float a = atan(uv.y, uv.x); 1426 vec2 left = vec2(a * freq, r); 1427 vec2 right = vec2(fract(a / TWO_PI) * TWO_PI * freq, r); 1428 float n_left = pow(valueNoise(left), intensity); 1429 float n_right = pow(valueNoise(right), intensity); 1430 float shape = mix(n_right, n_left, smoothstep(-.15, .15, uv.x)); 1431 return shape; 1432} 1433 1434void main() { 1435 vec2 shape_uv = v_objectUV; 1436 1437 float t = .2 * u_time; 1438 1439 float radius = length(shape_uv); 1440 float spots = 6.5 * abs(u_spotty); 1441 1442 float intensity = 4. - 3. * clamp(u_intensity, 0., 1.); 1443 1444 float delta = 1. - smoothstep(0., 1., radius); 1445 1446 float midSize = 10. * abs(u_midSize); 1447 float ms_lo = 0.02 * midSize; 1448 float ms_hi = max(midSize, 1e-6); 1449 float middleShape = pow(u_midIntensity, 0.3) * (1. - smoothstep(ms_lo, ms_hi, 3.0 * radius)); 1450 middleShape = pow(middleShape, 5.0); 1451 1452 vec3 accumColor = vec3(0.0); 1453 float accumAlpha = 0.0; 1454 1455 for (int i = 0; i < ${ao.maxColorCount}; i++) { 1456 if (i >= int(u_colorsCount)) break; 1457 1458 vec2 rotatedUV = rotate(shape_uv, float(i) + 1.0); 1459 1460 float r1 = radius * (1.0 + 0.4 * float(i)) - 3.0 * t; 1461 float r2 = 0.5 * radius * (1.0 + spots) - 2.0 * t; 1462 float density = 6. * u_density + step(.5, u_density) * pow(4.5 * (u_density - .5), 4.); 1463 float f = mix(1.0, 3.0 + 0.5 * float(i), hash11(float(i) * 15.)) * density; 1464 1465 float ray = raysShape(rotatedUV, r1, 5.0 * f, intensity, radius); 1466 ray *= raysShape(rotatedUV, r2, 4.0 * f, intensity, radius); 1467 ray += (1. + 4. * ray) * middleShape; 1468 ray = clamp(ray, 0.0, 1.0); 1469 1470 float srcAlpha = u_colors[i].a * ray; 1471 vec3 srcColor = u_colors[i].rgb * srcAlpha; 1472 1473 vec3 alphaBlendColor = accumColor + (1.0 - accumAlpha) * srcColor; 1474 float alphaBlendAlpha = accumAlpha + (1.0 - accumAlpha) * srcAlpha; 1475 1476 vec3 addBlendColor = accumColor + srcColor; 1477 float addBlendAlpha = accumAlpha + srcAlpha; 1478 1479 accumColor = mix(alphaBlendColor, addBlendColor, u_bloom); 1480 accumAlpha = mix(alphaBlendAlpha, addBlendAlpha, u_bloom); 1481 } 1482 1483 float overlayAlpha = u_colorBloom.a; 1484 vec3 overlayColor = u_colorBloom.rgb * overlayAlpha; 1485 1486 vec3 colorWithOverlay = accumColor + accumAlpha * overlayColor; 1487 accumColor = mix(accumColor, colorWithOverlay, u_bloom); 1488 1489 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 1490 1491 vec3 color = accumColor + (1. - accumAlpha) * bgColor; 1492 float opacity = accumAlpha + (1. - accumAlpha) * u_colorBack.a; 1493 color = clamp(color, 0., 1.); 1494 opacity = clamp(opacity, 0., 1.); 1495 1496 ${Ue} 1497 1498 fragColor = vec4(color, opacity); 1499} 1500`,Qo=`#version 300 es 1501precision mediump float; 1502 1503uniform float u_time; 1504 1505uniform vec4 u_colorBack; 1506uniform vec4 u_colorFront; 1507uniform float u_density; 1508uniform float u_distortion; 1509uniform float u_strokeWidth; 1510uniform float u_strokeCap; 1511uniform float u_strokeTaper; 1512uniform float u_noise; 1513uniform float u_noiseFrequency; 1514uniform float u_softness; 1515 1516in vec2 v_patternUV; 1517 1518out vec4 fragColor; 1519 1520${X} 1521${ze} 1522 1523void main() { 1524 vec2 uv = 2. * v_patternUV; 1525 1526 float t = u_time; 1527 float l = length(uv); 1528 float density = clamp(u_density, 0., 1.); 1529 l = pow(max(l, 1e-6), density); 1530 float angle = atan(uv.y, uv.x) - t; 1531 float angleNormalised = angle / TWO_PI; 1532 1533 angleNormalised += .125 * u_noise * snoise(16. * pow(u_noiseFrequency, 3.) * uv); 1534 1535 float offset = l + angleNormalised; 1536 offset -= u_distortion * (sin(4. * l - .5 * t) * cos(PI + l + .5 * t)); 1537 float stripe = fract(offset); 1538 1539 float shape = 2. * abs(stripe - .5); 1540 float width = 1. - clamp(u_strokeWidth, .005 * u_strokeTaper, 1.); 1541 1542 1543 float wCap = mix(width, (1. - stripe) * (1. - step(.5, stripe)), (1. - clamp(l, 0., 1.))); 1544 width = mix(width, wCap, u_strokeCap); 1545 width *= (1. - clamp(u_strokeTaper, 0., 1.) * l); 1546 1547 float fw = fwidth(offset); 1548 float fwMult = 4. - 3. * (smoothstep(.05, .4, 2. * u_strokeWidth) * smoothstep(.05, .4, 2. * (1. - u_strokeWidth))
1548); 1549 float pixelSize = mix(fwMult * fw, fwidth(shape), clamp(fw, 0., 1.)); 1550 pixelSize = mix(pixelSize, .002, u_strokeCap * (1. - clamp(l, 0., 1.))); 1551 1552 float res = smoothstep(width - pixelSize - u_softness, width + pixelSize + u_softness, shape); 1553 1554 vec3 fgColor = u_colorFront.rgb * u_colorFront.a; 1555 float fgOpacity = u_colorFront.a; 1556 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 1557 float bgOpacity = u_colorBack.a; 1558 1559 vec3 color = fgColor * res; 1560 float opacity = fgOpacity * res; 1561 1562 color += bgColor * (1. - opacity); 1563 opacity += bgOpacity * (1. - opacity); 1564 1565 ${Ue} 1566 1567 fragColor = vec4(color, opacity); 1568} 1569`,to={maxColorCount:10},Xo=`#version 300 es 1570precision mediump float; 1571 1572uniform float u_time; 1573 1574uniform vec4 u_colorBack; 1575uniform vec4 u_colors[${to.maxColorCount}]; 1576uniform float u_colorsCount; 1577uniform float u_bandCount; 1578uniform float u_twist; 1579uniform float u_center; 1580uniform float u_proportion; 1581uniform float u_softness; 1582uniform float u_noise; 1583uniform float u_noiseFrequency; 1584 1585in vec2 v_objectUV; 1586 1587out vec4 fragColor; 1588 1589${X} 1590${ze} 1591${Be} 1592 1593void main() { 1594 vec2 shape_uv = v_objectUV; 1595 1596 float l = length(shape_uv); 1597 l = max(1e-4, l); 1598 1599 float t = u_time; 1600 1601 float angle = ceil(u_bandCount) * atan(shape_uv.y, shape_uv.x) + t; 1602 float angle_norm = angle / TWO_PI; 1603 1604 float twist = 3. * clamp(u_twist, 0., 1.); 1605 float offset = pow(l, -twist) + angle_norm; 1606 1607 float shape = fract(offset); 1608 shape = 1. - abs(2. * shape - 1.); 1609 shape += u_noise * snoise(15. * pow(u_noiseFrequency, 2.) * shape_uv); 1610 1611 float mid = smoothstep(.2, .2 + .8 * u_center, pow(l, twist)); 1612 shape = mix(0., shape, mid); 1613 1614 float proportion = clamp(u_proportion, 0., 1.); 1615 float exponent = mix(.25, 1., proportion * 2.); 1616 exponent = mix(exponent, 10., max(0., proportion * 2. - 1.)); 1617 shape = pow(shape, exponent); 1618 1619 float mixer = shape * u_colorsCount; 1620 vec4 gradient = u_colors[0]; 1621 gradient.rgb *= gradient.a; 1622 1623 float outerShape = 0.; 1624 for (int i = 1; i < ${to.maxColorCount+1}; i++) { 1625 if (i > int(u_colorsCount)) break; 1626 1627 float m = clamp(mixer - float(i - 1), 0., 1.); 1628 float aa = fwidth(m); 1629 m = smoothstep(.5 - .5 * u_softness - aa, .5 + .5 * u_softness + aa, m); 1630 1631 if (i == 1) { 1632 outerShape = m; 1633 } 1634 1635 vec4 c = u_colors[i - 1]; 1636 c.rgb *= c.a; 1637 gradient = mix(gradient, c, m); 1638 } 1639 1640 float midAA = .1 * fwidth(pow(l, -twist)); 1641 float outerMid = smoothstep(.2, .2 + midAA, pow(l, twist)); 1642 outerShape = mix(0., outerShape, outerMid); 1643 1644 vec3 color = gradient.rgb * outerShape; 1645 float opacity = gradient.a * outerShape; 1646 1647 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 1648 color = color + bgColor * (1.0 - opacity); 1649 opacity = opacity + u_colorBack.a * (1.0 - opacity); 1650 1651 ${Ue} 1652 1653 fragColor = vec4(color, opacity); 1654} 1655`,Ho=`#version 300 es 1656precision mediump float; 1657 1658uniform float u_time; 1659 1660uniform vec2 u_resolution; 1661uniform float u_pixelRatio; 1662uniform float u_originX; 1663uniform float u_originY; 1664uniform float u_worldWidth; 1665uniform float u_worldHeight; 1666uniform float u_fit; 1667uniform float u_scale; 1668uniform float u_rotation; 1669uniform float u_offsetX; 1670uniform float u_offsetY; 1671 1672uniform float u_pxSize; 1673uniform vec4 u_colorBack; 1674uniform vec4 u_colorFront; 1675uniform float u_shape; 1676uniform float u_type; 1677 1678out vec4 fragColor; 1679 1680${ze} 1681${X} 1682${Ye} 1683${Fe} 1684 1685float getSimplexNoise(vec2 uv, float t) { 1686 float noise = .5 * snoise(uv - vec2(0., .3 * t)); 1687 noise += .5 * snoise(2. * uv + vec2(0., .32 * t)); 1688 1689 return noise; 1690} 1691 1692const int bayer2x2[4] = int[4](0, 2, 3, 1); 1693const int bayer4x4[16] = int[16]( 16940, 8, 2, 10, 169512, 4, 14, 6, 16963, 11, 1, 9, 169715, 7, 13, 5 1698); 1699 1700const int bayer8x8[64] = int[64]( 17010, 32, 8, 40, 2, 34, 10, 42, 170248, 16, 56, 24, 50, 18, 58, 26, 170312, 44, 4, 36, 14, 46, 6, 38, 170460, 28, 52, 20, 62, 30, 54, 22, 17053, 35, 11, 43, 1, 33, 9, 41, 170651, 19, 59, 27, 49, 17, 57, 25, 170715, 47, 7, 39, 13, 45, 5, 37, 170863, 31, 55, 23, 61, 29, 53, 21 1709); 1710 1711float getBayerValue(vec2 uv, int size) { 1712 ivec2 pos = ivec2(fract(uv / float(size)) * float(size)); 1713 int index = pos.y * size + pos.x; 1714 1715 if (size == 2) { 1716 return float(bayer2x2[index]) / 4.0; 1717 } else if (size == 4) { 1718 return float(bayer4x4[index]) / 16.0; 1719 } else if (size == 8) { 1720 return float(bayer8x8[index]) / 64.0; 1721 } 1722 return 0.0; 1723} 1724 1725 1726void main() { 1727 float t = .5 * u_time; 1728 1729 float pxSize = u_pxSize * u_pixelRatio; 1730 vec2 pxSizeUV = gl_FragCoord.xy - .5 * u_resolution; 1731 pxSizeUV /= pxSize; 1732 vec2 canvasPixelizedUV = (floor(pxSizeUV) + .5) * pxSize; 1733 vec2 normalizedUV = canvasPixelizedUV / u_resolution; 1734 1735 vec2 ditheringNoiseUV = canvasPixelizedUV; 1736 vec2 shapeUV = normalizedUV; 1737 1738 vec2 boxOrigin = vec2(.5 - u_originX, u_originY - .5); 1739 vec2 givenBoxSize = vec2(u_worldWidth, u_worldHeight); 1740 givenBoxSize = max(givenBoxSize, vec2(1.)) * u_pixelRatio; 1741 float r = u_rotation * PI / 180.; 1742 mat2 graphicRotation = mat2(cos(r), sin(r), -sin(r), cos(r)); 1743 vec2 graphicOffset = vec2(-u_offsetX, u_offsetY); 1744 1745 float patternBoxRatio = givenBoxSize.x / givenBoxSize.y; 1746 vec2 boxSize = vec2( 1747 (u_worldWidth == 0.) ? u_resolution.x : givenBoxSize.x, 1748 (u_worldHeight == 0.) ? u_resolution.y : givenBoxSize.y 1749 ); 1750 1751 if (u_shape > 3.5) { 1752 vec2 objectBoxSize = vec2(0.);
1753 // fit = none 1754 objectBoxSize.x = min(boxSize.x, boxSize.y); 1755 if (u_fit == 1.) { // fit = contain 1756 objectBoxSize.x = min(u_resolution.x, u_resolution.y); 1757 } else if (u_fit == 2.) { // fit = cover 1758 objectBoxSize.x = max(u_resolution.x, u_resolution.y); 1759 } 1760 objectBoxSize.y = objectBoxSize.x; 1761 vec2 objectWorldScale = u_resolution.xy / objectBoxSize; 1762 1763 shapeUV *= objectWorldScale; 1764 shapeUV += boxOrigin * (objectWorldScale - 1.); 1765 shapeUV += vec2(-u_offsetX, u_offsetY); 1766 shapeUV /= u_scale; 1767 shapeUV = graphicRotation * shapeUV; 1768 } else { 1769 vec2 patternBoxSize = vec2(0.); 1770 // fit = none 1771 patternBoxSize.x = patternBoxRatio * min(boxSize.x / patternBoxRatio, boxSize.y); 1772 float patternWorldNoFitBoxWidth = patternBoxSize.x; 1773 if (u_fit == 1.) { // fit = contain 1774 patternBoxSize.x = patternBoxRatio * min(u_resolution.x / patternBoxRatio, u_resolution.y); 1775 } else if (u_fit == 2.) { // fit = cover 1776 patternBoxSize.x = patternBoxRatio * max(u_resolution.x / patternBoxRatio, u_resolution.y); 1777 } 1778 patternBoxSize.y = patternBoxSize.x / patternBoxRatio; 1779 vec2 patternWorldScale = u_resolution.xy / patternBoxSize; 1780 1781 shapeUV += vec2(-u_offsetX, u_offsetY) / patternWorldScale; 1782 shapeUV += boxOrigin; 1783 shapeUV -= boxOrigin / patternWorldScale; 1784 shapeUV *= u_resolution.xy; 1785 shapeUV /= u_pixelRatio; 1786 if (u_fit > 0.) { 1787 shapeUV *= (patternWorldNoFitBoxWidth / patternBoxSize.x); 1788 } 1789 shapeUV /= u_scale; 1790 shapeUV = graphicRotation * shapeUV; 1791 shapeUV += boxOrigin / patternWorldScale; 1792 shapeUV -= boxOrigin; 1793 shapeUV += .5; 1794 } 1795 1796 float shape = 0.; 1797 if (u_shape < 1.5) { 1798 // Simplex noise 1799 shapeUV *= .001; 1800 1801 shape = 0.5 + 0.5 * getSimplexNoise(shapeUV, t); 1802 shape = smoothstep(0.3, 0.9, shape); 1803 1804 } else if (u_shape < 2.5) { 1805 // Warp 1806 shapeUV *= .003; 1807 1808 for (float i = 1.0; i < 6.0; i++) { 1809 shapeUV.x += 0.6 / i * cos(i * 2.5 * shapeUV.y + t); 1810 shapeUV.y += 0.6 / i * cos(i * 1.5 * shapeUV.x + t); 1811 } 1812 1813 shape = .15 / max(0.001, abs(sin(t - shapeUV.y - shapeUV.x))); 1814 shape = smoothstep(0.02, 1., shape); 1815 1816 } else if (u_shape < 3.5) { 1817 // Dots 1818 shapeUV *= .05; 1819 1820 float stripeIdx = floor(2. * shapeUV.x / TWO_PI); 1821 float rand = hash11(stripeIdx * 10.); 1822 rand = sign(rand - .5) * pow(.1 + abs(rand), .4); 1823 shape = sin(shapeUV.x) * cos(shapeUV.y - 5. * rand * t); 1824 shape = pow(abs(shape), 6.); 1825 1826 } else if (u_shape < 4.5) { 1827 // Sine wave 1828 shapeUV *= 4.; 1829 1830 float wave = cos(.5 * shapeUV.x - 2. * t) * sin(1.5 * shapeUV.x + t) * (.75 + .25 * cos(3. * t)); 1831 shape = 1. - smoothstep(-1., 1., shapeUV.y + wave); 1832 1833 } else if (u_shape < 5.5) { 1834 // Ripple 1835 1836 float dist = length(shapeUV); 1837 float waves = sin(pow(dist, 1.7) * 7. - 3. * t) * .5 + .5; 1838 shape = waves; 1839 1840 } else if (u_shape < 6.5) { 1841 // Swirl 1842 1843 float l = length(shapeUV); 1844 float angle = 6. * atan(shapeUV.y, shapeUV.x) + 4. * t; 1845 float twist = 1.2; 1846 float offset = 1. / pow(max(l, 1e-6), twist) + angle / TWO_PI; 1847 float mid = smoothstep(0., 1., pow(l, twist)); 1848 shape = mix(0., fract(offset), mid); 1849 1850 } else { 1851 // Sphere 1852 shapeUV *= 2.; 1853 1854 float d = 1. - pow(length(shapeUV), 2.); 1855 vec3 pos = vec3(shapeUV, sqrt(max(0., d))); 1856 vec3 lightPos = normalize(vec3(cos(1.5 * t), .8, sin(1.25 * t))); 1857 shape = .5 + .5 * dot(lightPos, pos); 1858 shape *= step(0., d); 1859 } 1860 1861 1862 int type = int(floor(u_type)); 1863 float dithering = 0.0; 1864 1865 switch (type) { 1866 case 1: { 1867 dithering = step(hash21(ditheringNoiseUV), shape); 1868 } break; 1869 case 2: 1870 dithering = getBayerValue(pxSizeUV, 2); 1871 break; 1872 case 3: 1873 dithering = getBayerValue(pxSizeUV, 4); 1874 break; 1875 default : 1876 dithering = getBayerValue(pxSizeUV, 8); 1877 break; 1878 } 1879 1880 dithering -= .5; 1881 float res = step(.5, shape + dithering); 1882 1883 vec3 fgColor = u_colorFront.rgb * u_colorFront.a; 1884 float fgOpacity = u_colorFront.a; 1885 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 1886 float bgOpacity = u_colorBack.a; 1887 1888 vec3 color = fgColor * res; 1889 float opacity = fgOpacity * res; 1890 1891 color += bgColor * (1. - opacity); 1892 opacity += bgOpacity * (1. - opacity); 1893 1894 fragColor = vec4(color, opacity); 1895} 1896`,Lo={simplex:1,warp:2,dots:3,wave:4,ripple:5,swirl:6,sphere:7},vo={random:1,"2x2":2,"4x4":3,"8x8":4},ro={maxColorCount:7},jo=`#version 300 es 1897precision lowp float; 1898 1899uniform mediump float u_time; 1900uniform mediump vec2 u_resolution; 1901uniform mediump float u_pixelRatio; 1902 1903uniform sampler2D u_noiseTexture; 1904 1905uniform vec4 u_colorBack; 1906uniform vec4 u_colors[${ro.maxColorCount}]; 1907uniform float u_colorsCount; 1908uniform float u_softness; 1909uniform float u_intensity; 1910uniform float u_noise; 1911uniform float u_shape; 1912 1913uniform mediump float u_originX; 1914uniform mediump float u_originY; 1915uniform mediump float u_worldWidth; 1916uniform mediump float u_worldHeight; 1917uniform mediump float u_fit; 1918 1919uniform mediump float u_scale; 1920uniform mediump float u_rotation; 1921uniform mediump float u_offsetX; 1922uniform mediump float u_offsetY; 1923 1924in vec2 v_objectUV; 1925in vec2 v_patternUV; 1926in vec2 v_objectBoxSize; 1927in vec2 v_patternBoxSize; 1928 1929out vec4 fragColor; 1930 1931${X} 1932${ze} 1933${Be} 1934${Pe} 1935 1936float valueNoiseR(vec2 st) { 1937 vec2 i = floor(st); 1938 vec2 f = fract(st); 1939 float a = randomR(i); 1940 float b = randomR(i + vec2(1.0, 0.0)); 1941 float c = randomR(i + vec2(0.0, 1.0)); 1942 float d = randomR(i + vec2(1.0, 1.0)); 1943 vec2 u = f * f * (3.0 - 2.0 * f); 1944 float x1 = mix(a, b, u.x); 1945 float x2 = mix(c, d, u.x); 1946 return mix(x1, x2, u.y); 1947} 1948vec4 fbmR(vec2 n0, vec2 n1, vec2 n2, vec2 n3) { 1949 float amplitude = 0.2; 1950 vec4 total = vec4(0.); 1951 for (int i = 0; i < 3; i++) { 1952 n0 = rotate(n0, 0.3); 1953 n1 = rotate(n1, 0.3); 1954 n2 = rotate(n2, 0.3); 1955 n3 = rotate(n3, 0.3); 1956 total.x += valueNoiseR(n0) * amplitude; 1957 total.y += valueNoiseR(n1) * amplitude; 1958 total.z += valueNoiseR(n2) * amplitude; 1959 total.z += valueNoiseR(n3) * amplitude; 1960 n0 *= 1.99; 1961 n1 *= 1.99; 1962 n2 *= 1.99; 1963 n3 *= 1.99; 1964 amplitude *= 0.6; 1965 } 1966 return total; 1967} 1968 1969${Ye} 1970 1971vec2 truchet(vec2 uv, float idx){ 1972 idx = fract(((idx - .5) * 2.)); 1973 if (idx > 0.75) { 1974 uv = vec2(1.0) - uv; 1975 } else if (idx > 0.5) { 1976 uv = vec2(1.0 - uv.x, uv.y); 1977 } else if (idx > 0.25) { 1978 uv = 1.0 - vec2(1.0 - uv.x, uv.y); 1979 } 1980 return uv; 1981} 1982 1983void main() { 1984 1985 const float firstFrameOffset = 7.; 1986 float t = .1 * (u_time + firstFrameOffset); 1987 1988 vec2 shape_uv = vec2(0.); 1989 vec2 grain_uv = vec2(0.); 1990 1991 float r = u_rotation * PI / 180.; 1992 float cr = cos(r); 1993 float sr = sin(r); 1994 mat2 graphicRotation = mat2(cr, sr, -sr, cr); 1995 vec2 graphicOffset = vec2(-u_offsetX, u_offsetY); 1996 1997 if (u_shape > 3.5) { 1998 shape_uv = v_objectUV; 1999 grain_uv = shape_uv; 2000 2001 // apply inverse transform to grain_uv so it respects the originXY 2002 grain_uv = transpose(graphicRotation) * grain_uv; 2003 grain_uv *= u_scale; 2004 grain_uv -= graphicOffset; 2005 grain_uv *= v_objectBoxSize; 2006 grain_uv *= .7; 2007 } else { 2008 shape_uv = .5 * v_patternUV; 2009 grain_uv = 100. * v_patternUV; 2010 2011 // apply inverse transform to grain_uv so it respects the originXY 2012 grain_uv = transpose(graphicRotation) * grain_uv; 2013 grain_uv *= u_scale; 2014 if (u_fit > 0.) { 2015 vec2 givenBoxSize = vec2(u_worldWidth, u_worldHeight); 2016 givenBoxSize = max(givenBoxSize, vec2(1.)) * u_pixelRatio; 2017 float patternBoxRatio = givenBoxSize.x / givenBoxSize.y; 2018 vec2 patternBoxGivenSize = vec2( 2019 (u_worldWidth == 0.) ? u_resolution.x : givenBoxSize.x, 2020 (u_worldHeight == 0.) ? u_resolution.y : givenBoxSize.y 2021 ); 2022 patternBoxRatio = patternBoxGivenSize.x / patternBoxGivenSize.y; 2023 float patternBoxNoFitBoxWidth = patternBoxRatio * min(patternBoxGivenSize.x / patternBoxRatio, patternBoxGivenSize.y); 2024 grain_uv /= (patternBoxNoFitBoxWidth / v_patternBoxSize.x); 2025 } 2026 vec2 patternBoxScale = u_resolution.xy / v_patternBoxSize; 2027 grain_uv -= graphicOffset / patternBoxScale; 2028 grain_uv *= 1.6; 2029 } 2030 2031 2032 float shape = 0.; 2033 2034 if (u_shape < 1.5) { 2035 // Sine wave 2036 2037 float wave = cos(.5 * shape_uv.x - 4. * t) * sin(1.5 * shape_uv.x + 2. * t) * (.75 + .25 * cos(6. * t)); 2038 shape = 1. - smoothstep(-1., 1., shape_uv.y + wave); 2039 2040 } else if (u_shape < 2.5) { 2041 // Grid (dots) 2042 2043 float stripeIdx = floor(2. * shape_uv.x / TWO_PI); 2044 float rand = hash11(stripeIdx * 100.); 2045 rand = sign(rand - .5) * pow(4. * abs(rand), .3); 2046 shape = sin(shape_uv.x) * cos(shape_uv.y - 5. * rand * t); 2047 shape = pow(abs(shape), 4.); 2048 2049 } else if (u_shape < 3.5) { 2050 // Truchet pattern 2051 2052 float n2 = valueNoiseR(shape_uv * .4 - 3.75 * t); 2053 shape_uv.x += 10.; 2054 shape_uv *= .6; 2055
2056 vec2 tile = truchet(fract(shape_uv), randomR(floor(shape_uv))); 2057 2058 float distance1 = length(tile); 2059 float distance2 = length(tile - vec2(1.)); 2060 2061 n2 -= .5; 2062 n2 *= .1; 2063 shape = smoothstep(.2, .55, distance1 + n2) * (1. - smoothstep(.45, .8, distance1 - n2)); 2064 shape += smoothstep(.2, .55, distance2 + n2) * (1. - smoothstep(.45, .8, distance2 - n2)); 2065 2066 shape = pow(shape, 1.5); 2067 2068 } else if (u_shape < 4.5) { 2069 // Corners 2070 2071 shape_uv *= .6; 2072 vec2 outer = vec2(.5); 2073 2074 vec2 bl = smoothstep(vec2(0.), outer, shape_uv + vec2(.1 + .1 * sin(3. * t), .2 - .1 * sin(5.25 * t))); 2075 vec2 tr = smoothstep(vec2(0.), outer, 1. - shape_uv); 2076 shape = 1. - bl.x * bl.y * tr.x * tr.y; 2077 2078 shape_uv = -shape_uv; 2079 bl = smoothstep(vec2(0.), outer, shape_uv + vec2(.1 + .1 * sin(3. * t), .2 - .1 * cos(5.25 * t))); 2080 tr = smoothstep(vec2(0.), outer, 1. - shape_uv); 2081 shape -= bl.x * bl.y * tr.x * tr.y; 2082 2083 shape = 1. - smoothstep(0., 1., shape); 2084 2085 } else if (u_shape < 5.5) { 2086 // Ripple 2087 2088 shape_uv *= 2.; 2089 float dist = length(.4 * shape_uv); 2090 float waves = sin(pow(dist, 1.2) * 5. - 3. * t) * .5 + .5; 2091 shape = waves; 2092 2093 } else if (u_shape < 6.5) { 2094 // Blob 2095 2096 t *= 2.; 2097 2098 vec2 f1_traj = .25 * vec2(1.3 * sin(t), .2 + 1.3 * cos(.6 * t + 4.)); 2099 vec2 f2_traj = .2 * vec2(1.2 * sin(-t), 1.3 * sin(1.6 * t)); 2100 vec2 f3_traj = .25 * vec2(1.7 * cos(-.6 * t), cos(-1.6 * t)); 2101 vec2 f4_traj = .3 * vec2(1.4 * cos(.8 * t), 1.2 * sin(-.6 * t - 3.)); 2102 2103 shape = .5 * pow(1. - clamp(0., 1., length(shape_uv + f1_traj)), 5.); 2104 shape += .5 * pow(1. - clamp(0., 1., length(shape_uv + f2_traj)), 5.); 2105 shape += .5 * pow(1. - clamp(0., 1., length(shape_uv + f3_traj)), 5.); 2106 shape += .5 * pow(1. - clamp(0., 1., length(shape_uv + f4_traj)), 5.); 2107 2108 shape = smoothstep(.0, .9, shape); 2109 float edge = smoothstep(.25, .3, shape); 2110 shape = mix(.0, shape, edge); 2111 2112 } else { 2113 // Sphere 2114 2115 shape_uv *= 2.; 2116 float d = 1. - pow(length(shape_uv), 2.); 2117 vec3 pos = vec3(shape_uv, sqrt(max(d, 0.))); 2118 vec3 lightPos = normalize(vec3(cos(1.5 * t), .8, sin(1.25 * t))); 2119 shape = .5 + .5 * dot(lightPos, pos); 2120 shape *= step(0., d); 2121 } 2122 2123 float baseNoise = snoise(grain_uv * .5); 2124 vec4 fbmVals = fbmR( 2125 .002 * grain_uv + 10., 2126 .003 * grain_uv, 2127 .001 * grain_uv, 2128 rotate(.4 * grain_uv, 2.) 2129 ); 2130 float grainDist = baseNoise * snoise(grain_uv * .2) - fbmVals.x - fbmVals.y; 2131 float rawNoise = .75 * baseNoise - fbmVals.w - fbmVals.z; 2132 float noise = clamp(rawNoise, 0., 1.); 2133 2134 shape += u_intensity * 2. / u_colorsCount * (grainDist + .5); 2135 shape += u_noise * 10. / u_colorsCount * noise; 2136 2137 float aa = fwidth(shape); 2138 2139 shape = clamp(shape - .5 / u_colorsCount, 0., 1.); 2140 float totalShape = smoothstep(0., u_softness + 2. * aa, clamp(shape * u_colorsCount, 0., 1.)); 2141 float mixer = shape * (u_colorsCount - 1.); 2142 2143 int cntStop = int(u_colorsCount) - 1; 2144 vec4 gradient = u_colors[0]; 2145 gradient.rgb *= gradient.a; 2146 for (int i = 1; i < ${ro.maxColorCount}; i++) { 2147 if (i > cntStop) break; 2148 2149 float localT = clamp(mixer - float(i - 1), 0., 1.); 2150 localT = smoothstep(.5 - .5 * u_softness - aa, .5 + .5 * u_softness + aa, localT); 2151 2152 vec4 c = u_colors[i]; 2153 c.rgb *= c.a; 2154 gradient = mix(gradient, c, localT); 2155 } 2156 2157 vec3 color = gradient.rgb * totalShape; 2158 float opacity = gradient.a * totalShape; 2159 2160 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 2161 color = color + bgColor * (1.0 - opacity); 2162 opacity = opacity + u_colorBack.a * (1.0 - opacity); 2163 2164 fragColor = vec4(color, opacity); 2165} 2166`,Ko={wave:1,dots:2,truchet:3,corners:4,ripple:5,blob:6,sphere:7},Ne={maxColorCount:5,maxSpots:4},qo=`#version 300 es 2167precision lowp float; 2168 2169uniform float u_time; 2170 2171uniform vec4 u_colorBack; 2172uniform vec4 u_colors[${Ne.maxColorCount}]; 2173uniform float u_colorsCount; 2174uniform float u_roundness; 2175uniform float u_thickness; 2176uniform float u_marginLeft; 2177uniform float u_marginRight; 2178uniform float u_marginTop; 2179uniform float u_marginBottom; 2180uniform float u_aspectRatio; 2181uniform float u_softness; 2182uniform float u_intensity; 2183uniform float u_bloom; 2184uniform float u_spotSize; 2185uniform float u_spots; 2186uniform float u_pulse; 2187uniform float u_smoke; 2188uniform float u_smokeSize; 2189 2190uniform sampler2D u_noiseTexture; 2191 2192in vec2 v_responsiveUV; 2193in vec2 v_responsiveBoxGivenSize; 2194in vec2 v_patternUV; 2195 2196out vec4 fragColor; 2197 2198${X} 2199 2200float beat(float time) { 2201 float first = pow(abs(sin(time * TWO_PI)), 10.); 2202 float second = pow(abs(sin((time - .15) * TWO_PI)), 10.); 2203 2204 return clamp(first + 0.6 * second, 0.0, 1.0); 2205} 2206 2207float sst(float edge0, float edge1, float x) { 2208 return smoothstep(edge0, edge1, x); 2209} 2210
2211float roundedBox(vec2 uv, vec2 halfSize, float distance, float cornerDistance, float thickness, float softness) { 2212 float borderDistance = abs(distance); 2213 float aa = 2. * fwidth(distance); 2214 float border = 1. - sst(min(mix(thickness, -thickness, softness), thickness + aa), max(mix(thickness, -thickness, softness), thickness + aa), borderDistance); 2215 float cornerFadeCircles = 0.; 2216 cornerFadeCircles = mix(1., cornerFadeCircles, sst(0., 1., length((uv + halfSize) / thickness))); 2217 cornerFadeCircles = mix(1., cornerFadeCircles, sst(0., 1., length((uv - vec2(-halfSize.x, halfSize.y)) / thickness))); 2218 cornerFadeCircles = mix(1., cornerFadeCircles, sst(0., 1., length((uv - vec2(halfSize.x, -halfSize.y)) / thickness))); 2219 cornerFadeCircles = mix(1., cornerFadeCircles, sst(0., 1., length((uv - halfSize) / thickness))); 2220 aa = fwidth(cornerDistance); 2221 float cornerFade = sst(0., mix(aa, thickness, softness), cornerDistance); 2222 cornerFade *= cornerFadeCircles; 2223 border += cornerFade; 2224 return border; 2225} 2226 2227${Le} 2228 2229float randomG(vec2 p) { 2230 vec2 uv = floor(p) / 100. + .5; 2231 return texture(u_noiseTexture, fract(uv)).g; 2232} 2233float valueNoise(vec2 st) { 2234 vec2 i = floor(st); 2235 vec2 f = fract(st); 2236 float a = randomG(i); 2237 float b = randomG(i + vec2(1.0, 0.0)); 2238 float c = randomG(i + vec2(0.0, 1.0)); 2239 float d = randomG(i + vec2(1.0, 1.0)); 2240 vec2 u = f * f * (3.0 - 2.0 * f); 2241 float x1 = mix(a, b, u.x); 2242 float x2 = mix(c, d, u.x); 2243 return mix(x1, x2, u.y); 2244} 2245 2246void main() { 2247 const float firstFrameOffset = 109.; 2248 float t = 1.2 * (u_time + firstFrameOffset); 2249 2250 vec2 borderUV = v_responsiveUV; 2251 float pulse = u_pulse * beat(.18 * u_time); 2252 2253 float canvasRatio = v_responsiveBoxGivenSize.x / v_responsiveBoxGivenSize.y; 2254 vec2 halfSize = vec2(.5); 2255 borderUV.x *= max(canvasRatio, 1.); 2256 borderUV.y /= min(canvasRatio, 1.); 2257 halfSize.x *= max(canvasRatio, 1.); 2258 halfSize.y /= min(canvasRatio, 1.); 2259 2260 float mL = u_marginLeft; 2261 float mR = u_marginRight; 2262 float mT = u_marginTop; 2263 float mB = u_marginBottom; 2264 float mX = mL + mR; 2265 float mY = mT + mB; 2266 2267 if (u_aspectRatio > 0.) { 2268 float shapeRatio = canvasRatio * (1. - mX) / max(1. - mY, 1e-6); 2269 float freeX = shapeRatio > 1. ? (1. - mX) * (1. - 1. / max(abs(shapeRatio), 1e-6)) : 0.; 2270 float freeY = shapeRatio < 1. ? (1. - mY) * (1. - shapeRatio) : 0.; 2271 mL += freeX * 0.5; 2272 mR += freeX * 0.5; 2273 mT += freeY * 0.5; 2274 mB += freeY * 0.5; 2275 mX = mL + mR; 2276 mY = mT + mB; 2277 } 2278 2279 float thickness = .5 * u_thickness * min(halfSize.x, halfSize.y); 2280 2281 halfSize.x *= (1. - mX); 2282 halfSize.y *= (1. - mY); 2283 2284 vec2 centerShift = vec2( 2285 (mL - mR) * max(canvasRatio, 1.) * 0.5, 2286 (mB - mT) / min(canvasRatio, 1.) * 0.5 2287 ); 2288 2289 borderUV -= centerShift; 2290 halfSize -= mix(thickness, 0., u_softness); 2291 2292 float radius = mix(0., min(halfSize.x, halfSize.y), u_roundness); 2293 vec2 d = abs(borderUV) - halfSize + radius; 2294 float outsideDistance = length(max(d, .0001)) - radius; 2295 float insideDistance = min(max(d.x, d.y), .0001); 2296 float cornerDistance = abs(min(max(d.x, d.y) - .45 * radius, .0)); 2297 float distance = outsideDistance + insideDistance; 2298 2299 float borderThickness = mix(thickness, 3. * thickness, u_softness); 2300 float border = roundedBox(borderUV, halfSize, distance, cornerDistance, borderThickness, u_softness); 2301 border = pow(border, 1. + u_softness); 2302 2303 vec2 smokeUV = .3 * u_smokeSize * v_patternUV; 2304 float smoke = clamp(3. * valueNoise(2.7 * smokeUV + .5 * t), 0., 1.); 2305 smoke -= valueNoise(3.4 * smokeUV - .5 * t); 2306 float smokeThickness = thickness + .2; 2307 smokeThickness = min(.4, max(smokeThickness, .1)); 2308 smoke *= roundedBox(borderUV, halfSize, distance, cornerDistance, smokeThickness, 1.); 2309 smoke = 30. * smoke * smoke; 2310 smoke *= mix(0., .5, pow(u_smoke, 2.)); 2311 smoke *= mix(1., pulse, u_pulse); 2312 smoke = clamp(smoke, 0., 1.); 2313 border += smoke; 2314 2315 border = clamp(border, 0., 1.); 2316 2317 vec3 blendColor = vec3(0.); 2318 float blendAlpha = 0.; 2319 vec3 addColor = vec3(0.); 2320 float addAlpha = 0.; 2321 2322 float bloom = 4. * u_bloom; 2323 float intensity = 1. + (1. + 4. * u_softness) * u_intensity; 2324 2325 float angle = atan(borderUV.y, borderUV.x) / TWO_PI; 2326 2327 for (int colorIdx = 0; colorIdx < ${Ne.maxColorCount}; colorIdx++) { 2328 if (colorIdx >= int(u_colorsCount)) break; 2329 float colorIdxF = float(colorIdx); 2330 2331 vec3 c = u_colors[colorIdx].rgb * u_colors[colorIdx].a; 2332 float a = u_colors[colorIdx].a; 2333 2334 for (int spotIdx = 0; spotIdx < ${Ne.maxSpots}; spotIdx++) { 2335 if (spotIdx >= int(u_spots)) break; 2336 float spotIdxF = float(spotIdx); 2337 2338 vec2 randVal = randomGB(vec2(spotIdxF * 10. + 2., 40. + colorIdxF)); 2339 2340 float time = (.1 + .15 * abs(sin(spotIdxF * (2. + colorIdxF)) * cos(spotIdxF * (2. + 2.5 * colorIdxF)))) * t + randVal.x * 3.; 2341 time *= mix(1., -1., step(.5, randVal.y)); 2342 2343 float mask = .5 + .5 * mix( 2344 sin(t + spotIdxF * (5. - 1.5 * colorIdxF)), 2345 cos(t + spotIdxF * (3. + 1.3 * colorIdxF)), 2346 step(mod(colorIdxF, 2.), .5) 2347 ); 2348 2349 float p = clamp(2. * u_pulse - randVal.x, 0., 1.); 2350 mask = mix(mask, pulse, p); 2351 2352 float atg1 = fract(angle + time); 2353 float spotSize = .05 + .6 * pow(u_spotSize, 2.) + .05 * randVal.x;
2354 spotSize = mix(spotSize, .1, p); 2355 float sector = sst(.5 - spotSize, .5, atg1) * (1. - sst(.5, .5 + spotSize, atg1)); 2356 2357 sector *= mask; 2358 sector *= border; 2359 sector *= intensity; 2360 sector = clamp(sector, 0., 1.); 2361 2362 vec3 srcColor = c * sector; 2363 float srcAlpha = a * sector; 2364 2365 blendColor += ((1. - blendAlpha) * srcColor); 2366 blendAlpha = blendAlpha + (1. - blendAlpha) * srcAlpha; 2367 addColor += srcColor; 2368 addAlpha += srcAlpha; 2369 } 2370 } 2371 2372 vec3 accumColor = mix(blendColor, addColor, bloom); 2373 float accumAlpha = mix(blendAlpha, addAlpha, bloom); 2374 accumAlpha = clamp(accumAlpha, 0., 1.); 2375 2376 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 2377 vec3 color = accumColor + (1. - accumAlpha) * bgColor; 2378 float opacity = accumAlpha + (1. - accumAlpha) * u_colorBack.a; 2379 2380 ${Ue} 2381 2382 fragColor = vec4(color, opacity); 2383}`,Jo={auto:0,square:1},Qe={maxColorCount:7},Zo=`#version 300 es 2384precision lowp float; 2385 2386uniform float u_time; 2387uniform mediump float u_scale; 2388 2389uniform vec4 u_colors[${Qe.maxColorCount}]; 2390uniform float u_colorsCount; 2391uniform vec4 u_colorBack; 2392uniform float u_density; 2393uniform float u_angle1; 2394uniform float u_angle2; 2395uniform float u_length; 2396uniform bool u_edges; 2397uniform float u_blur; 2398uniform float u_fadeIn; 2399uniform float u_fadeOut; 2400uniform float u_gradient; 2401 2402in vec2 v_objectUV; 2403 2404out vec4 fragColor; 2405 2406${X} 2407 2408const float zLimit = .5; 2409 2410vec2 getPanel(float angle, vec2 uv, float invLength, float aa) { 2411 float sinA = sin(angle); 2412 float cosA = cos(angle); 2413 2414 float denom = sinA - uv.y * cosA; 2415 if (abs(denom) < .01) return vec2(0.); 2416 2417 float z = uv.y / denom; 2418 2419 if (z <= 0. || z > zLimit) return vec2(0.); 2420 2421 float zRatio = z / zLimit; 2422 float panelMap = 1. - zRatio; 2423 float x = uv.x * (cosA * z + 1.) * invLength; 2424 2425 float zOffset = zRatio - .5; 2426 float left = -.5 + zOffset * u_angle1; 2427 float right = .5 - zOffset * u_angle2; 2428 float blurX = aa + 2. * panelMap * u_blur; 2429 2430 float leftEdge1 = left - blurX; 2431 float leftEdge2 = left + .25 * blurX; 2432 float rightEdge1 = right - .25 * blurX; 2433 float rightEdge2 = right + blurX; 2434 2435 float panel = smoothstep(leftEdge1, leftEdge2, x) * (1.0 - smoothstep(rightEdge1, rightEdge2, x)); 2436 panel *= mix(0., panel, smoothstep(0., .01 / max(u_scale, 1e-6), panelMap)); 2437 2438 float midScreen = abs(sinA); 2439 if (u_edges == true) { 2440 panelMap = mix(.99, panelMap, panel * clamp(panelMap / (.15 * (1. - pow(midScreen, .1))), 0.0, 1.0)); 2441 } else if (midScreen < .07) { 2442 panel *= (midScreen * 15.); 2443 } 2444 2445 return vec2(panel, panelMap); 2446} 2447
2448vec4 blendColor(vec4 colorA, float panelMask, float panelMap) { 2449 float fade = 1. - smoothstep(.97 - .97 * u_fadeIn, 1., panelMap); 2450 2451 fade *= smoothstep(-.2 * (1. - u_fadeOut), u_fadeOut, panelMap); 2452 2453 vec3 blendedRGB = mix(vec3(0.), colorA.rgb, fade); 2454 float blendedAlpha = mix(0., colorA.a, fade); 2455 2456 return vec4(blendedRGB, blendedAlpha) * panelMask; 2457} 2458 2459void main() { 2460 vec2 uv = v_objectUV; 2461 uv *= 1.25; 2462 2463 float t = .02 * u_time; 2464 t = fract(t); 2465 bool reverseTime = (t < 0.5); 2466 2467 vec3 color = vec3(0.); 2468 float opacity = 0.; 2469 2470 float aa = .005 / u_scale; 2471 int colorsCount = int(u_colorsCount); 2472 2473 vec4 premultipliedColors[${Qe.maxColorCount}]; 2474 for (int i = 0; i < ${Qe.maxColorCount}; i++) { 2475 if (i >= colorsCount) break; 2476 vec4 c = u_colors[i]; 2477 c.rgb *= c.a; 2478 premultipliedColors[i] = c; 2479 } 2480 2481 float invLength = 1.5 / max(u_length, .001); 2482 2483 float totalColorWeight = 0.; 2484 int panelsNumber = 12; 2485 2486 float densityNormalizer = 1.; 2487 if (colorsCount == 4) { 2488 panelsNumber = 16; 2489 densityNormalizer = 1.34; 2490 } else if (colorsCount == 5) { 2491 panelsNumber = 20; 2492 densityNormalizer = 1.67; 2493 } else if (colorsCount == 7) { 2494 panelsNumber = 14; 2495 densityNormalizer = 1.17; 2496 } 2497 2498 float fPanelsNumber = float(panelsNumber); 2499 2500 float totalPanelsShape = 0.; 2501 float panelGrad = 1. - clamp(u_gradient, 0., 1.); 2502 2503 for (int set = 0; set < 2; set++) { 2504 bool isForward = (set == 0 && !reverseTime) || (set == 1 && reverseTime); 2505 if (!isForward) continue; 2506 2507 for (int i = 0; i <= 20; i++) { 2508 if (i >= panelsNumber) break; 2509 2510 int idx = panelsNumber - 1 - i; 2511 2512 float offset = float(idx) / fPanelsNumber; 2513 if (set == 1) { 2514 offset += .5; 2515 } 2516 2517 float densityFract = densityNormalizer * fract(t + offset); 2518 float angleNorm = densityFract / u_density; 2519 if (densityFract >= .5 || angleNorm >= .3) continue; 2520 2521 float smoothDensity = clamp((.5 - densityFract) / .1, 0., 1.) * clamp(densityFract / .01, 0., 1.); 2522 float smoothAngle = clamp((.3 - angleNorm) / .05, 0., 1.); 2523 if (smoothDensity * smoothAngle < .001) continue; 2524 2525 if (angleNorm > .5) { 2526 angleNorm = 0.5; 2527 } 2528 vec2 panel = getPanel(angleNorm * TWO_PI + PI, uv, invLength, aa); 2529 if (panel[0] <= .001) continue; 2530 float panelMask = panel[0] * smoothDensity * smoothAngle; 2531 float panelMap = panel[1]; 2532 2533 int colorIdx = idx % colorsCount; 2534 int nextColorIdx = (idx + 1) % colorsCount; 2535 2536 vec4 colorA = premultipliedColors[colorIdx]; 2537 vec4 colorB = premultipliedColors[nextColorIdx]; 2538 2539 colorA = mix(colorA, colorB, max(0., smoothstep(.0, .45, panelMap) - panelGrad)); 2540 vec4 blended = blendColor(colorA, panelMask, panelMap); 2541 color = blended.rgb + color * (1. - blended.a); 2542 opacity = blended.a + opacity * (1. - blended.a); 2543 } 2544 2545 2546 for (int i = 0; i <= 20; i++) { 2547 if (i >= panelsNumber) break; 2548 2549 int idx = panelsNumber - 1 - i; 2550 2551 float offset = float(idx) / fPanelsNumber; 2552 if (set == 0) { 2553 offset += .5; 2554 } 2555 2556 float densityFract = densityNormalizer * fract(-t + offset); 2557 float angleNorm = -densityFract / u_density; 2558 if (densityFract >= .5 || angleNorm < -.3) continue; 2559 2560 float smoothDensity = clamp((.5 - densityFract) / .1, 0., 1.) * clamp(densityFract / .01, 0., 1.); 2561 float smoothAngle = clamp((angleNorm + .3) / .05, 0., 1.); 2562 if (smoothDensity * smoothAngle < .001) continue; 2563 2564 vec2 panel = getPanel(angleNorm * TWO_PI + PI, uv, invLength, aa); 2565 float panelMask = panel[0] * smoothDensity * smoothAngle; 2566 if (panelMask <= .001) continue; 2567 float panelMap = panel[1]; 2568 2569 int colorIdx = (colorsCount - (idx % colorsCount)) % colorsCount; 2570 if (colorIdx < 0) colorIdx += colorsCount; 2571 int nextColorIdx = (colorIdx + 1) % colorsCount; 2572 2573 vec4 colorA = premultipliedColors[colorIdx]; 2574 vec4 colorB = premultipliedColors[nextColorIdx]; 2575 2576 colorA = mix(colorA, colorB, max(0., smoothstep(.0, .45, panelMap) - panelGrad)); 2577 vec4 blended = blendColor(colorA, panelMask, panelMap); 2578 color = blended.rgb + color * (1. - blended.a); 2579 opacity = blended.a + opacity * (1. - blended.a); 2580 } 2581 } 2582 2583 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 2584 color = color + bgColor * (1.0 - opacity); 2585 opacity = opacity + u_colorBack.a * (1.0 - opacity); 2586 2587 ${Ue} 2588 2589 fragColor = vec4(color, opacity); 2590} 2591`,io={maxColorCount:10},$o=`#version 300 es 2592precision mediump float; 2593 2594uniform vec4 u_colors[${io.maxColorCount}]; 2595uniform float u_colorsCount; 2596 2597uniform float u_positions; 2598uniform float u_waveX; 2599uniform float u_waveXShift; 2600uniform float u_waveY; 2601uniform float u_waveYShift;
2602uniform float u_mixing; 2603uniform float u_grainMixer; 2604uniform float u_grainOverlay; 2605 2606in vec2 v_objectUV; 2607out vec4 fragColor; 2608 2609${X} 2610${Be} 2611${Fe} 2612 2613float valueNoise(vec2 st) { 2614 vec2 i = floor(st); 2615 vec2 f = fract(st); 2616 float a = hash21(i); 2617 float b = hash21(i + vec2(1.0, 0.0)); 2618 float c = hash21(i + vec2(0.0, 1.0)); 2619 float d = hash21(i + vec2(1.0, 1.0)); 2620 vec2 u = f * f * (3.0 - 2.0 * f); 2621 float x1 = mix(a, b, u.x); 2622 float x2 = mix(c, d, u.x); 2623 return mix(x1, x2, u.y); 2624} 2625 2626float noise(vec2 n, vec2 seedOffset) { 2627 return valueNoise(n + seedOffset); 2628} 2629 2630vec2 getPosition(int i, float t) { 2631 float a = float(i) * .37; 2632 float b = .6 + mod(float(i), 3.) * .3; 2633 float c = .8 + mod(float(i + 1), 4.) * 0.25; 2634 2635 float x = sin(t * b + a); 2636 float y = cos(t * c + a * 1.5); 2637 2638 return .5 + .5 * vec2(x, y); 2639} 2640 2641void main() { 2642 vec2 uv = v_objectUV; 2643 uv += .5; 2644 vec2 grainUV = uv * 1000.; 2645 2646 float grain = noise(grainUV, vec2(0.)); 2647 float mixerGrain = .4 * u_grainMixer * (grain - .5); 2648 2649 float radius = smoothstep(0., 1., length(uv - .5)); 2650 float center = 1. - radius; 2651 for (float i = 1.; i <= 2.; i++) { 2652 uv.x += u_waveX * center / i * cos(TWO_PI * u_waveXShift + i * 2. * smoothstep(.0, 1., uv.y)); 2653 uv.y += u_waveY * center / i * cos(TWO_PI * u_waveYShift + i * 2. * smoothstep(.0, 1., uv.x)); 2654 } 2655 2656 vec3 color = vec3(0.); 2657 float opacity = 0.; 2658 float totalWeight = 0.; 2659 float positionSeed = 25. + .33 * u_positions; 2660 2661 for (int i = 0; i < ${io.maxColorCount}; i++) { 2662 if (i >= int(u_colorsCount)) break; 2663 2664 vec2 pos = getPosition(i, positionSeed) + mixerGrain; 2665 float dist = length(uv - pos); 2666 dist = length(uv - pos); 2667 2668 vec3 colorFraction = u_colors[i].rgb * u_colors[i].a; 2669 float opacityFraction = u_colors[i].a; 2670 2671 float mixing = pow(u_mixing, .7); 2672 float power = mix(2., 1., mixing); 2673 dist = pow(dist, power); 2674 2675 float w = 1. / (dist + 1e-3);
2676 float baseSharpness = mix(.0, 8., clamp(w, 0., 1.)); 2677 float sharpness = mix(baseSharpness, 1., mixing); 2678 w = pow(w, sharpness); 2679 color += colorFraction * w; 2680 opacity += opacityFraction * w; 2681 totalWeight += w; 2682 } 2683 2684 color /= max(1e-4, totalWeight); 2685 opacity /= max(1e-4, totalWeight); 2686 2687 float grainOverlay = valueNoise(rotate(grainUV, 1.) + vec2(3.)); 2688 grainOverlay = mix(grainOverlay, valueNoise(rotate(grainUV, 2.) + vec2(-1.)), .5); 2689 grainOverlay = pow(grainOverlay, 1.3); 2690 2691 float grainOverlayV = grainOverlay * 2. - 1.; 2692 vec3 grainOverlayColor = vec3(step(0., grainOverlayV)); 2693 float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV); 2694 grainOverlayStrength = pow(grainOverlayStrength, .8); 2695 color = mix(color, grainOverlayColor, .35 * grainOverlayStrength); 2696 2697 opacity += .5 * grainOverlayStrength; 2698 opacity = clamp(opacity, 0., 1.); 2699 2700 fragColor = vec4(color, opacity); 2701} 2702`,so={maxColorCount:10},ea=`#version 300 es 2703precision mediump float; 2704 2705uniform vec4 u_colorBack; 2706uniform vec4 u_colors[${so.maxColorCount}]; 2707uniform float u_colorsCount; 2708 2709uniform float u_radius; 2710uniform float u_focalDistance; 2711uniform float u_focalAngle; 2712uniform float u_falloff; 2713uniform float u_mixing; 2714uniform float u_distortion; 2715uniform float u_distortionShift; 2716uniform float u_distortionFreq; 2717uniform float u_grainMixer; 2718uniform float u_grainOverlay; 2719 2720in vec2 v_objectUV; 2721out vec4 fragColor; 2722 2723${X} 2724${Be} 2725${Fe} 2726 2727float valueNoise(vec2 st) { 2728 vec2 i = floor(st); 2729 vec2 f = fract(st); 2730 float a = hash21(i); 2731 float b = hash21(i + vec2(1.0, 0.0)); 2732 float c = hash21(i + vec2(0.0, 1.0)); 2733 float d = hash21(i + vec2(1.0, 1.0)); 2734 vec2 u = f * f * (3.0 - 2.0 * f); 2735 float x1 = mix(a, b, u.x); 2736 float x2 = mix(c, d, u.x); 2737 return mix(x1, x2, u.y); 2738} 2739 2740float noise(vec2 n, vec2 seedOffset) { 2741 return valueNoise(n + seedOffset); 2742} 2743 2744vec2 getPosition(int i, float t) { 2745 float a = float(i) * .37; 2746 float b = .6 + mod(float(i), 3.) * .3; 2747 float c = .8 + mod(float(i + 1), 4.) * 0.25; 2748 2749 float x = sin(t * b + a); 2750 float y = cos(t * c + a * 1.5); 2751 2752 return .5 + .5 * vec2(x, y); 2753} 2754 2755void main() { 2756 vec2 uv = 2. * v_objectUV; 2757 vec2 grainUV = uv * 1000.; 2758 2759 vec2 center = vec2(0.); 2760 float angleRad = -radians(u_focalAngle + 90.); 2761 vec2 focalPoint = vec2(cos(angleRad), sin(angleRad)) * u_focalDistance; 2762 float radius = u_radius; 2763 2764 vec2 c_to_uv = uv - center; 2765 vec2 f_to_uv = uv - focalPoint; 2766 vec2 f_to_c = center - focalPoint; 2767 float r = length(c_to_uv); 2768 2769 float fragAngle = atan(c_to_uv.y, c_to_uv.x); 2770 float angleDiff = fract((fragAngle - angleRad + PI) / TWO_PI) * TWO_PI - PI; 2771 2772 float halfAngle = acos(clamp(radius / max(u_focalDistance, 1e-4), 0.0, 1.0)); 2773 float e0 = 0.6 * PI, e1 = halfAngle; 2774 float lo = min(e0, e1), hi = max(e0, e1); 2775 float s = smoothstep(lo, hi, abs(angleDiff)); 2776 float isInSector = (e1 >= e0) ? (1.0 - s) : s; 2777 2778 float a = dot(f_to_uv, f_to_uv); 2779 float b = -2.0 * dot(f_to_uv, f_to_c); 2780 float c = dot(f_to_c, f_to_c) - radius * radius; 2781 2782 float discriminant = b * b - 4.0 * a * c; 2783 float t = 1.0; 2784 2785 if (discriminant >= 0.0) { 2786 float sqrtD = sqrt(discriminant); 2787 float div = max(1e-4, 2.0 * a); 2788 float t0 = (-b - sqrtD) / div; 2789 float t1 = (-b + sqrtD) / div; 2790 t = max(t0, t1); 2791 if (t < 0.0) t = 0.0; 2792 } 2793 2794 float dist = length(f_to_uv); 2795 float normalized = dist / max(1e-4, length(f_to_uv * t)); 2796 float shape = clamp(normalized, 0.0, 1.0); 2797 2798 float falloffMapped = mix(.2 + .8 * max(0., u_falloff + 1.), mix(1., 15., u_falloff * u_falloff), step(.0, u_falloff)); 2799 2800 float falloffExp = mix(falloffMapped, 1., shape); 2801 shape = pow(shape, falloffExp); 2802 shape = 1. - clamp(shape, 0., 1.); 2803 2804 2805 float outerMask = .002; 2806 float outer = 1.0 - smoothstep(radius - outerMask, radius + outerMask, r); 2807 outer = mix(outer, 1., isInSector); 2808 2809 shape = mix(0., shape, outer); 2810 shape *= 1. - smoothstep(radius - .01, radius, r); 2811 2812 float angle = atan(f_to_uv.y, f_to_uv.x); 2813 shape -= pow(u_distortion, 2.) * shape * pow(abs(sin(PI * clamp(length(f_to_uv) - 0.2 + u_distortionShift, 0.0, 1.0))), 4.0) * (sin(u_distortionFreq * angle) + cos(floor(0.65 * u_distortionFreq) * angle)); 2814 2815 float grain = noise(grainUV, vec2(0.)); 2816 float mixerGrain = .4 * u_grainMixer * (grain - .5); 2817 2818 float mixer = shape * u_colorsCount + mixerGrain; 2819 vec4 gradient = u_colors[0]; 2820 gradient.rgb *= gradient.a; 2821 2822 float outerShape = 0.; 2823 for (int i = 1; i < ${so.maxColorCount+1}; i++) { 2824 if (i > int(u_colorsCount)) break; 2825 float mLinear = clamp(mixer - float(i - 1), 0.0, 1.0); 2826 2827 float aa = fwidth(mLinear); 2828 float width = min(u_mixing, 0.5); 2829 float t = clamp((mLinear - (0.5 - width - aa)) / (2. * width + 2. * aa), 0., 1.); 2830 float p = mix(2., 1., clamp((u_mixing - 0.5) * 2., 0., 1.)); 2831 float m = t < 0.5 2832 ? 0.5 * pow(2. * t, p) 2833 : 1. - 0.5 * pow(2. * (1. - t), p); 2834 2835 float quadBlend = clamp((u_mixing - 0.5) * 2., 0., 1.); 2836 m = mix(m, m * m, 0.5 * quadBlend); 2837 2838 if (i == 1) { 2839 outerShape = m; 2840 } 2841 2842 vec4 c = u_colors[i - 1]; 2843 c.rgb *= c.a; 2844 gradient = mix(gradient, c, m); 2845 } 2846 2847 vec3 color = gradient.rgb * outerShape; 2848 float opacity = gradient.a * outerShape; 2849 2850 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 2851 color = color + bgColor * (1.0 - opacity); 2852 opacity = opacity + u_colorBack.a * (1.0 - opacity); 2853 2854 float grainOverlay = valueNoise(rotate(grainUV, 1.) + vec2(3.)); 2855 grainOverlay = mix(grainOverlay, valueNoise(rotate(grainUV, 2.) + vec2(-1.)), .5); 2856 grainOverlay = pow(grainOverlay, 1.3); 2857 2858 float grainOverlayV = grainOverlay * 2. - 1.; 2859 vec3 grainOverlayColor = vec3(step(0., grainOverlayV)); 2860 float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV); 2861 grainOverlayStrength = pow(grainOverlayStrength, .8); 2862 color = mix(color, grainOverlayColor, .35 * grainOverlayStrength); 2863 2864 opacity += .5 * grainOverlayStrength; 2865 opacity = clamp(opacity, 0., 1.); 2866 2867 fragColor = vec4(color, opacity); 2868} 2869`,oa=`#version 300 es 2870precision mediump float; 2871 2872uniform vec2 u_resolution; 2873uniform float u_pixelRatio; 2874 2875uniform vec4 u_colorFront; 2876uniform vec4 u_colorBack; 2877 2878uniform sampler2D u_image; 2879uniform float u_imageAspectRatio; 2880 2881uniform float u_contrast; 2882uniform float u_roughness; 2883uniform float u_fiber; 2884uniform float u_fiberSize; 2885uniform float u_crumples; 2886uniform float u_crumpleSize; 2887uniform float u_folds; 2888uniform float u_foldCount; 2889uniform float u_drops; 2890uniform float u_seed; 2891uniform float u_fade; 2892 2893uniform sampler2D u_noiseTexture; 2894 2895in vec2 v_imageUV; 2896 2897out vec4 fragColor; 2898 2899float getUvFrame(vec2 uv) { 2900 float aax = 2. * fwidth(uv.x); 2901 float aay = 2. * fwidth(uv.y); 2902 2903 float left = smoothstep(0., aax, uv.x); 2904 float right = 1. - smoothstep(1. - aax, 1., uv.x); 2905 float bottom = smoothstep(0., aay, uv.y); 2906 float top = 1. - smoothstep(1. - aay, 1., uv.y); 2907 2908 return left * right * bottom * top; 2909} 2910 2911${X} 2912${Be} 2913${Pe} 2914float valueNoise(vec2 st) { 2915 vec2 i = floor(st); 2916 vec2 f = fract(st); 2917 float a = randomR(i); 2918 float b = randomR(i + vec2(1.0, 0.0)); 2919 float c = randomR(i + vec2(0.0, 1.0)); 2920 float d = randomR(i + vec2(1.0, 1.0)); 2921 vec2 u = f * f * (3.0 - 2.0 * f); 2922 float x1 = mix(a, b, u.x); 2923 float x2 = mix(c, d, u.x); 2924 return mix(x1, x2, u.y); 2925} 2926float fbm(vec2 n) { 2927 float total = 0.0, amplitude = .4; 2928 for (int i = 0; i < 3; i++) { 2929 total += valueNoise(n) * amplitude; 2930 n *= 1.99; 2931 amplitude *= 0.65; 2932 } 2933 return total; 2934} 2935 2936 2937float randomG(vec2 p) { 2938 vec2 uv = floor(p) / 50. + .5; 2939 return texture(u_noiseTexture, fract(uv)).g; 2940} 2941float roughness(vec2 p) { 2942 p *= .1; 2943 float o = 0.; 2944 for (float i = 0.; ++i < 4.; p *= 2.1) { 2945 vec4 w = vec4(floor(p), ceil(p)); 2946 vec2 f = fract(p); 2947 o += mix(
2948 mix(randomG(w.xy), randomG(w.xw), f.y), 2949 mix(randomG(w.zy), randomG(w.zw), f.y), 2950 f.x); 2951 o += .2 / exp(2. * abs(sin(.2 * p.x + .5 * p.y))); 2952 } 2953 return o / 3.; 2954} 2955 2956${Vo} 2957 2958vec2 randomGB(vec2 p) { 2959 vec2 uv = floor(p) / 50. + .5; 2960 return texture(u_noiseTexture, fract(uv)).gb; 2961} 2962float crumpledNoise(vec2 t, float pw) { 2963 vec2 p = floor(t); 2964 float wsum = 0.; 2965 float cl = 0.; 2966 for (int y = -1; y < 2; y += 1) { 2967 for (int x = -1; x < 2; x += 1) { 2968 vec2 b = vec2(float(x), float(y)); 2969 vec2 q = b + p; 2970 vec2 q2 = q - floor(q / 8.) * 8.; 2971 vec2 c = q + randomGB(q2); 2972 vec2 r = c - t; 2973 float w = pow(smoothstep(0., 1., 1. - abs(r.x)), pw) * pow(smoothstep(0., 1., 1. - abs(r.y)), pw); 2974 cl += (.5 + .5 * sin((q2.x + q2.y * 5.) * 8.)) * w; 2975 wsum += w; 2976 } 2977 } 2978 return pow(wsum != 0.0 ? cl / wsum : 0.0, .5) * 2.; 2979} 2980float crumplesShape(vec2 uv) { 2981 return crumpledNoise(uv * .25, 16.) * crumpledNoise(uv * .5, 2.); 2982} 2983 2984 2985vec2 folds(vec2 uv) { 2986 vec3 pp = vec3(0.); 2987 float l = 9.; 2988 for (float i = 0.; i < 15.; i++) { 2989 if (i >= u_foldCount) break; 2990 vec2 rand = randomGB(vec2(i, i * u_seed)); 2991 float an = rand.x * TWO_PI; 2992 vec2 p = vec2(cos(an), sin(an)) * rand.y; 2993 float dist = distance(uv, p); 2994 l = min(l, dist); 2995 2996 if (l == dist) { 2997 pp.xy = (uv - p.xy); 2998 pp.z = dist; 2999 } 3000 } 3001 return mix(pp.xy, vec2(0.), pow(pp.z, .25)); 3002} 3003 3004float drops(vec2 uv) { 3005 vec2 iDropsUV = floor(uv); 3006 vec2 fDropsUV = fract(uv); 3007 float dropsMinDist = 1.; 3008 for (int j = -1; j <= 1; j++) { 3009 for (int i = -1; i <= 1; i++) { 3010 vec2 neighbor = vec2(float(i), float(j)); 3011 vec2 offset = randomGB(iDropsUV + neighbor); 3012 offset = .5 + .5 * sin(10. * u_seed + TWO_PI * offset); 3013 vec2 pos = neighbor + offset - fDropsUV; 3014 float dist = length(pos); 3015 dropsMinDist = min(dropsMinDist, dropsMinDist*dist); 3016 } 3017 } 3018 return 1. - smoothstep(.05, .09, pow(dropsMinDist, .5)); 3019} 3020 3021float lst(float edge0, float edge1, float x) { 3022 return clamp((x - edge0) / (edge1 - edge0), 0.0, 1.0); 3023} 3024 3025void main() { 3026 3027 vec2 imageUV = v_imageUV; 3028 vec2 patternUV = v_imageUV - .5; 3029 patternUV = 5. * (patternUV * vec2(u_imageAspectRatio, 1.)); 3030 3031 vec2 roughnessUv = 1.5 * (gl_FragCoord.xy - .5 * u_resolution) / u_pixelRatio; 3032 float roughness = roughness(roughnessUv + vec2(1., 0.)) - roughness(roughnessUv - vec2(1., 0.)); 3033 3034 vec2 crumplesUV = fract(patternUV * .02 / u_crumpleSize - u_seed) * 32.; 3035 float crumples = u_crumples * (crumplesShape(crumplesUV + vec2(.05, 0.)) - crumplesShape(crumplesUV)); 3036 3037 vec2 fiberUV = 2. / u_fiberSize * patternUV; 3038 float fiber = fiberNoise(fiberUV, vec2(0.)); 3039 fiber = .5 * u_fiber * (fiber - 1.); 3040 3041 vec2 normal = vec2(0.); 3042 vec2 normalImage = vec2(0.); 3043 3044 vec2 foldsUV = patternUV * .12; 3045 foldsUV = rotate(foldsUV, 4. * u_seed); 3046 vec2 w = folds(foldsUV); 3047 foldsUV = rotate(foldsUV + .007 * cos(u_seed), .01 * sin(u_seed)); 3048 vec2 w2 = folds(foldsUV); 3049 3050 float drops = u_drops * drops(patternUV * 2.); 3051 3052 float fade = u_fade * fbm(.17 * patternUV + 10. * u_seed); 3053 fade = clamp(8. * fade * fade * fade, 0., 1.); 3054 3055 w = mix(w, vec2(0.), fade); 3056 w2 = mix(w2, vec2(0.), fade); 3057 crumples = mix(crumples, 0., fade); 3058 drops = mix(drops, 0., fade); 3059 fiber *= mix(1., .5, fade); 3060 roughness *= mix(1., .5, fade); 3061 3062 normal.xy += u_folds * min(5. * u_contrast, 1.) * 4. * max(vec2(0.), w + w2); 3063 normalImage.xy += u_folds * 2. * w; 3064 3065 normal.xy += crumples; 3066 normalImage.xy += 1.5 * crumples; 3067 3068 normal.xy += 3. * drops; 3069 normalImage.xy += .2 * drops; 3070 3071 normal.xy += u_roughness * 1.5 * roughness; 3072 normal.xy += fiber; 3073 3074 normalImage += u_roughness * .75 * roughness; 3075 normalImage += .2 * fiber; 3076 3077 vec3 lightPos = vec3(1., 2., 1.); 3078 float res = dot(normalize(vec3(normal, 9.5 - 9. * pow(u_contrast, .1))), normalize(lightPos)); 3079 3080 vec3 fgColor = u_colorFront.rgb * u_colorFront.a; 3081 float fgOpacity = u_colorFront.a; 3082 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 3083 float bgOpacity = u_colorBack.a; 3084 3085 imageUV += .02 * normalImage; 3086 float frame = getUvFrame(imageUV); 3087 vec4 image = texture(u_image, imageUV); 3088 image.rgb += .6 * pow(u_contrast, .4) * (res - .7); 3089 3090 frame *= image.a; 3091 3092 vec3 color = fgColor * res; 3093 float opacity = fgOpacity * res; 3094 3095 color += bgColor * (1. - opacity); 3096 opacity += bgOpacity * (1. - opacity); 3097 opacity = mix(opacity, 1., frame); 3098 3099 color -= .007 * drops; 3100 3101 color.rgb = mix(color, image.rgb, frame); 3102 3103 fragColor = vec4(color, opacity); 3104} 3105`,aa=`#version 300 es 3106precision mediump float; 3107 3108uniform float u_time; 3109 3110uniform vec4 u_colorBack; 3111uniform vec4 u_colorHighlight; 3112 3113uniform sampler2D u_image; 3114uniform float u_imageAspectRatio; 3115 3116uniform float u_size; 3117uniform float u_highlights; 3118uniform float u_layering; 3119uniform float u_edges; 3120uniform float u_caustic; 3121uniform float u_waves; 3122 3123in vec2 v_imageUV; 3124 3125out vec4 fragColor; 3126 3127${X} 3128${Be} 3129${ze} 3130 3131float getUvFrame(vec2 uv) { 3132 float aax = 2. * fwidth(uv.x); 3133 float aay = 2. * fwidth(uv.y); 3134 3135 float left = smoothstep(0., aax, uv.x); 3136 float right = 1.0 - smoothstep(1. - aax, 1., uv.x); 3137 float bottom = smoothstep(0., aay, uv.y); 3138 float top = 1.0 - smoothstep(1. - aay, 1., uv.y); 3139 3140 return left * right * bottom * top; 3141} 3142 3143mat2 rotate2D(float r) { 3144 return mat2(cos(r), sin(r), -sin(r), cos(r)); 3145} 3146 3147float getCausticNoise(vec2 uv, float t, float scale) { 3148 vec2 n = vec2(.1); 3149 vec2 N = vec2(.1); 3150 mat2 m = rotate2D(.5); 3151 for (int j = 0; j < 6; j++) { 3152 uv *= m; 3153 n *= m; 3154 vec2 q = uv * scale + float(j) + n + (.5 + .5 * float(j)) * (mod(float(j), 2.) - 1.) * t; 3155 n += sin(q); 3156 N += cos(q) / scale; 3157 scale *= 1.1; 3158 } 3159 return (N.x + N.y + 1.); 3160} 3161 3162void main() { 3163 vec2 imageUV = v_imageUV; 3164 vec2 patternUV = v_imageUV - .5; 3165 patternUV = (patternUV * vec2(u_imageAspectRatio, 1.)); 3166 patternUV /= (.01 + .09 * u_size); 3167 3168 float t = u_time; 3169 3170 float wavesNoise = snoise((.3 + .1 * sin(t)) * .1 * patternUV + vec2(0., .4 * t)); 3171 3172 float causticNoise = getCausticNoise(patternUV + u_waves * vec2(1., -1.) * wavesNoise, 2. * t, 1.5); 3173 3174 causticNoise += u_layering * getCausticNoise(patternUV + 2. * u_waves * vec2(1., -1.) * wavesNoise, 1.5 * t, 2.); 3175 causticNoise = causticNoise * causticNoise; 3176 3177 float edgesDistortion = smoothstep(0., .1, imageUV.x); 3178 edgesDistortion *= smoothstep(0., .1, imageUV.y); 3179 edgesDistortion *= (smoothstep(1., 1.1, imageUV.x) + (1.0 - smoothstep(.8, .95, imageUV.x))); 3180 edgesDistortion *= (1.0 - smoothstep(.9, 1., imageUV.y)); 3181 edgesDistortion = mix(edgesDistortion, 1., u_edges); 3182 3183 float causticNoiseDistortion = .02 * causticNoise * edgesDistortion; 3184
3185 float wavesDistortion = .1 * u_waves * wavesNoise; 3186 3187 imageUV += vec2(wavesDistortion, -wavesDistortion); 3188 imageUV += (u_caustic * causticNoiseDistortion); 3189 3190 float frame = getUvFrame(imageUV); 3191 3192 vec4 image = texture(u_image, imageUV); 3193 vec4 backColor = u_colorBack; 3194 backColor.rgb *= backColor.a; 3195 3196 vec3 color = mix(backColor.rgb, image.rgb, image.a * frame); 3197 float opacity = backColor.a + image.a * frame; 3198 3199 causticNoise = max(-.2, causticNoise); 3200 3201 float hightlight = .025 * u_highlights * causticNoise; 3202 hightlight *= u_colorHighlight.a; 3203 color = mix(color, u_colorHighlight.rgb, .05 * u_highlights * causticNoise); 3204 opacity += hightlight; 3205 3206 color += hightlight * (.5 + .5 * wavesNoise); 3207 opacity += hightlight * (.5 + .5 * wavesNoise); 3208 3209 opacity = clamp(opacity, 0., 1.); 3210 3211 fragColor = vec4(color, opacity); 3212} 3213`,ta=`#version 300 es 3214precision mediump float; 3215 3216uniform vec2 u_resolution; 3217uniform float u_pixelRatio; 3218uniform float u_rotation; 3219 3220uniform vec4 u_colorBack; 3221uniform vec4 u_colorShadow; 3222uniform vec4 u_colorHighlight; 3223 3224uniform sampler2D u_image; 3225uniform float u_imageAspectRatio; 3226 3227uniform float u_size; 3228uniform float u_shadows; 3229uniform float u_angle; 3230uniform float u_stretch; 3231uniform float u_shape; 3232uniform float u_distortion; 3233uniform float u_highlights; 3234uniform float u_distortionShape; 3235uniform float u_shift; 3236uniform float u_blur; 3237uniform float u_edges; 3238uniform float u_marginLeft; 3239uniform float u_marginRight; 3240uniform float u_marginTop; 3241uniform float u_marginBottom; 3242uniform float u_grainMixer; 3243uniform float u_grainOverlay; 3244 3245in vec2 v_imageUV; 3246 3247out vec4 fragColor; 3248 3249${X} 3250${Be} 3251${Fe} 3252 3253float valueNoise(vec2 st) { 3254 vec2 i = floor(st); 3255 vec2 f = fract(st); 3256 float a = hash21(i); 3257 float b = hash21(i + vec2(1.0, 0.0)); 3258 float c = hash21(i + vec2(0.0, 1.0)); 3259 float d = hash21(i + vec2(1.0, 1.0)); 3260 vec2 u = f * f * (3.0 - 2.0 * f); 3261 float x1 = mix(a, b, u.x); 3262 float x2 = mix(c, d, u.x); 3263 return mix(x1, x2, u.y); 3264} 3265 3266float getUvFrame(vec2 uv, float softness) { 3267 float aax = 2. * fwidth(uv.x); 3268 float aay = 2. * fwidth(uv.y); 3269 float left = smoothstep(0., aax + softness, uv.x); 3270 float right = 1. - smoothstep(1. - softness - aax, 1., uv.x); 3271 float bottom = smoothstep(0., aay + softness, uv.y); 3272 float top = 1. - smoothstep(1. - softness - aay, 1., uv.y); 3273 return left * right * bottom * top; 3274} 3275 3276const int MAX_RADIUS = 50; 3277vec4 samplePremultiplied(sampler2D tex, vec2 uv) { 3278 vec4 c = texture(tex, uv); 3279 c.rgb *= c.a; 3280 return c; 3281} 3282vec4 getBlur(sampler2D tex, vec2 uv, vec2 texelSize, vec2 dir, float sigma) { 3283 if (sigma <= .5) return texture(tex, uv); 3284 int radius = int(min(float(MAX_RADIUS), ceil(3.0 * sigma))); 3285 3286 float twoSigma2 = 2.0 * sigma * sigma; 3287 float gaussianNorm = 1.0 / sqrt(TWO_PI * sigma * sigma); 3288 3289 vec4 sum = samplePremultiplied(tex, uv) * gaussianNorm; 3290 float weightSum = gaussianNorm; 3291 3292 for (int i = 1; i <= MAX_RADIUS; i++) { 3293 if (i > radius) break; 3294 3295 float x = float(i); 3296 float w = exp(-(x * x) / twoSigma2) * gaussianNorm; 3297 3298 vec2 offset = dir * texelSize * x; 3299 vec4 s1 = samplePremultiplied(tex, uv + offset); 3300 vec4 s2 = samplePremultiplied(tex, uv - offset); 3301 3302 sum += (s1 + s2) * w; 3303 weightSum += 2.0 * w; 3304 } 3305 3306 vec4 result = sum / weightSum; 3307 if (result.a > 0.) { 3308 result.rgb /= result.a; 3309 } 3310 3311 return result; 3312} 3313 3314vec2 rotateAspect(vec2 p, float a, float aspect) { 3315 p.x *= aspect; 3316 p = rotate(p, a); 3317 p.x /= aspect; 3318 return p; 3319} 3320 3321float smoothFract(float x) { 3322 float f = fract(x); 3323 float w = fwidth(x); 3324 3325 float edge = abs(f - 0.5) - 0.5; 3326 float band = smoothstep(-w, w, edge); 3327 3328 return mix(f, 1.0 - f, band); 3329} 3330 3331void main() { 3332 3333 float patternRotation = -u_angle * PI / 180.; 3334 float patternSize = mix(200., 5., u_size); 3335 3336 vec2 uv = v_imageUV; 3337 3338 vec2 uvMask = gl_FragCoord.xy / u_resolution.xy; 3339 vec2 sw = vec2(.005); 3340 vec4 margins = vec4(u_marginLeft, u_marginTop, u_marginRight, u_marginBottom); 3341 float mask = 3342 smoothstep(margins[0], margins[0] + sw.x, uvMask.x + sw.x) * 3343 smoothstep(margins[2], margins[2] + sw.x, 1.0 - uvMask.x + sw.x) * 3344 smoothstep(margins[1], margins[1] + sw.y, uvMask.y + sw.y) * 3345 smoothstep(margins[3], margins[3] + sw.y, 1.0 - uvMask.y + sw.y); 3346 float maskOuter = 3347 smoothstep(margins[0] - sw.x, margins[0], uvMask.x + sw.x) * 3348 smoothstep(margins[2] - sw.x, margins[2], 1.0 - uvMask.x + sw.x) * 3349 smoothstep(margins[1] - sw.y, margins[1], uvMask.y + sw.y) * 3350 smoothstep(margins[3] - sw.y, margins[3], 1.0 - uvMask.y + sw.y); 3351 float maskStroke = maskOuter - mask; 3352 float maskInner = 3353 smoothstep(margins[0] - 2. * sw.x, margins[0], uvMask.x) * 3354 smoothstep(margins[2] - 2. * sw.x, margins[2], 1.0 - uvMask.x) * 3355 smoothstep(margins[1] - 2. * sw.y, margins[1], uvMask.y) * 3356 smoothstep(margins[3] - 2. * sw.y, margins[3], 1.0 - uvMask.y); 3357 float maskStrokeInner = maskInner - mask; 3358 3359 uv -= .5; 3360 uv *= patternSize; 3361 uv = rotateAspect(uv, patternRotation, u_imageAspectRatio); 3362 3363 float curve = 0.; 3364 float patternY = uv.y / u_imageAspectRatio; 3365 if (u_shape > 4.5) { 3366 // pattern 3367 curve = .5 + .5 * sin(.5 * PI * uv.x) * cos(.5 * PI * patternY); 3368 } else if (u_shape > 3.5) { 3369 // zigzag 3370 curve = 10. * abs(fract(.1 * patternY) - .5); 3371 } else if (u_shape > 2.5) { 3372 // wave 3373 curve = 4. * sin(.23 * patternY); 3374 } else if (u_shape > 1.5) { 3375 // lines irregular 3376 curve = .5 + .5 * sin(.5 * uv.x) * sin(1.7 * uv.x); 3377 } else { 3378 // lines 3379 } 3380 3381 vec2 UvToFract = uv + curve; 3382 vec2 fractOrigUV = fract(uv); 3383 vec2 floorOrigUV = floor(uv); 3384 3385 float x = smoothFract(UvToFract.x); 3386 float xNonSmooth = fract(UvToFract.x) + .0001; 3387 3388 float highlightsWidth = 2. * max(.001, fwidth(UvToFract.x)); 3389 highlightsWidth += 2. * maskStrokeInner; 3390 float highlights = smoothstep(0., highlightsWidth, xNonSmooth); 3391 highlights *= smoothstep(1., 1. - highlightsWidth, xNonSmooth); 3392 highlights = 1. - highlights; 3393 highlights *= u_highlights; 3394 highlights = clamp(highlights, 0., 1.); 3395 highlights *= mask; 3396 3397 float shadows = pow(x, 1.3); 3398 float distortion = 0.; 3399 float fadeX = 1.; 3400 float frameFade = 0.; 3401 3402 float aa = fwidth(xNonSmooth); 3403 aa = max(aa, fwidth(uv.x)); 3404 aa = max(aa, fwidth(UvToFract.x)); 3405 aa = max(aa, .0001); 3406 3407 if (u_distortionShape == 1.) { 3408 distortion = -pow(1.5 * x, 3.); 3409 distortion += (.5 - u_shift); 3410 3411 frameFade = pow(1.5 * x, 3.); 3412 aa = max(.2, aa); 3413 aa += mix(.2, 0., u_size); 3414 fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth); 3415 distortion = mix(.5, distortion, fadeX); 3416 } else if (u_distortionShape == 2.) { 3417 distortion = 2. * pow(x, 2.); 3418 distortion -= (.5 + u_shift); 3419 3420 frameFade = pow(abs(x - .5), 4.); 3421 aa = max(.2, aa); 3422 aa += mix(.2, 0., u_size); 3423 fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth); 3424 distortion = mix(.5, distortion, fadeX); 3425 frameFade = mix(1., frameFade, .5 * fadeX); 3426 } else if (u_distortionShape == 3.) { 3427 distortion = pow(2. * (xNonSmooth - .5), 6.); 3428 distortion -= .25; 3429 distortion -= u_shift; 3430 3431 frameFade = 1. - 2. * pow(abs(x - .4), 2.); 3432 aa = .15; 3433 aa += mix(.1, 0., u_size); 3434 fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth); 3435 frameFade = mix(1., frameFade, fadeX); 3436 3437 } else if (u_distortionShape == 4.) { 3438 x = xNonSmooth; 3439 distortion = sin((x + .25) * TWO_PI); 3440 shadows = .5 + .5 * asin(distortion) / (.5 * PI); 3441 distortion *= .5; 3442 distortion -= u_shift; 3443 frameFade = .5 + .5 * sin(x * TWO_PI); 3444 } else if (u_distortionShape == 5.) { 3445 distortion -= pow(abs(x), .2) * x; 3446 distortion += .33; 3447 distortion -= 3. * u_shift; 3448 distortion *= .33; 3449 3450 frameFade = .3 * (smoothstep(.0, 1., x)); 3451 shadows = pow(x, 2.5); 3452 3453 aa = max(.1, aa); 3454 aa += mix(.1, 0., u_size); 3455 fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth); 3456 distortion *= fadeX; 3457 } 3458 3459 vec2 dudx = dFdx(v_imageUV); 3460 vec2 dudy = dFdy(v_imageUV); 3461 vec2 grainUV = v_imageUV - .5; 3462 grainUV *= (.8 / vec2(length(dudx), length(dudy))); 3463 grainUV += .5; 3464 float grain = valueNoise(grainUV); 3465 grain = smoothstep(.4, .7, grain); 3466 grain *= u_grainMixer; 3467 distortion = mix(distortion, 0., grain); 3468
3469 shadows = min(shadows, 1.); 3470 shadows += maskStrokeInner; 3471 shadows *= mask; 3472 shadows = min(shadows, 1.); 3473 shadows *= pow(u_shadows, 2.); 3474 shadows = clamp(shadows, 0., 1.); 3475 3476 distortion *= 3. * u_distortion; 3477 frameFade *= u_distortion; 3478 3479 fractOrigUV.x += distortion; 3480 floorOrigUV = rotateAspect(floorOrigUV, -patternRotation, u_imageAspectRatio); 3481 fractOrigUV = rotateAspect(fractOrigUV, -patternRotation, u_imageAspectRatio); 3482 3483 uv = (floorOrigUV + fractOrigUV) / patternSize; 3484 uv += pow(maskStroke, 4.); 3485 3486 uv += vec2(.5); 3487 3488 uv = mix(v_imageUV, uv, smoothstep(0., .7, mask)); 3489 float blur = mix(0., 50., u_blur); 3490 blur = mix(0., blur, smoothstep(.5, 1., mask)); 3491 3492 float edgeDistortion = mix(.0, .04, u_edges); 3493 edgeDistortion += .06 * frameFade * u_edges; 3494 edgeDistortion *= mask; 3495 float frame = getUvFrame(uv, edgeDistortion); 3496 3497 float stretch = 1. - smoothstep(0., .5, xNonSmooth) * smoothstep(1., 1. - .5, xNonSmooth); 3498 stretch = pow(stretch, 2.); 3499 stretch *= mask; 3500 stretch *= getUvFrame(uv, .1 + .05 * mask * frameFade); 3501 uv.y = mix(uv.y, .5, u_stretch * stretch); 3502 3503 vec4 image = getBlur(u_image, uv, 1. / u_resolution / u_pixelRatio, vec2(0., 1.), blur); 3504 image.rgb *= image.a; 3505 vec4 backColor = u_colorBack; 3506 backColor.rgb *= backColor.a; 3507 vec4 highlightColor = u_colorHighlight; 3508 highlightColor.rgb *= highlightColor.a; 3509 vec4 shadowColor = u_colorShadow; 3510 3511 vec3 color = highlightColor.rgb * highlights; 3512 float opacity = highlightColor.a * highlights; 3513 3514 shadows = mix(shadows * shadowColor.a, 0., highlights); 3515 color = mix(color, shadowColor.rgb * shadowColor.a, .5 * shadows); 3516 color += .5 * pow(shadows, .5) * shadowColor.rgb; 3517 opacity += shadows; 3518 color = clamp(color, vec3(0.), vec3(1.)); 3519 opacity = clamp(opacity, 0., 1.); 3520 3521 color += image.rgb * (1. - opacity) * frame; 3522 opacity += image.a * (1. - opacity) * frame; 3523 3524 color += backColor.rgb * (1. - opacity); 3525 opacity += backColor.a * (1. - opacity); 3526 3527 float grainOverlay = valueNoise(rotate(grainUV, 1.) + vec2(3.)); 3528 grainOverlay = mix(grainOverlay, valueNoise(rotate(grainUV, 2.) + vec2(-1.)), .5); 3529 grainOverlay = pow(grainOverlay, 1.3); 3530 3531 float grainOverlayV = grainOverlay * 2. - 1.; 3532 vec3 grainOverlayColor = vec3(step(0., grainOverlayV)); 3533 float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV); 3534 grainOverlayStrength = pow(grainOverlayStrength, .8); 3535 grainOverlayStrength *= mask; 3536 color = mix(color, grainOverlayColor, .35 * grainOverlayStrength); 3537 3538 opacity += .5 * grainOverlayStrength; 3539 opacity = clamp(opacity, 0., 1.); 3540 3541 fragColor = vec4(color, opacity); 3542} 3543`,ra={lines:1,linesIrregular:2,wave:3,zigzag:4,pattern:5},ia={prism:1,lens:2,contour:3,cascade:4,flat:5},sa=`#version 300 es 3544precision mediump float; 3545 3546uniform vec2 u_resolution; 3547uniform float u_pixelRatio; 3548uniform float u_originX; 3549uniform float u_originY; 3550uniform float u_worldWidth; 3551uniform float u_worldHeight; 3552uniform float u_fit; 3553 3554uniform float u_scale; 3555uniform float u_rotation; 3556uniform float u_offsetX; 3557uniform float u_offsetY; 3558 3559uniform vec4 u_colorFront; 3560uniform vec4 u_colorBack; 3561uniform vec4 u_colorHighlight; 3562 3563uniform sampler2D u_image; 3564uniform float u_imageAspectRatio; 3565 3566uniform float u_type; 3567uniform float u_pxSize; 3568uniform bool u_originalColors; 3569uniform bool u_inverted; 3570uniform float u_colorSteps; 3571 3572out vec4 fragColor; 3573 3574 3575${Fe} 3576${X} 3577 3578float getUvFrame(vec2 uv, vec2 pad) { 3579 float aa = 0.0001; 3580 3581 float left = smoothstep(-pad.x, -pad.x + aa, uv.x); 3582 float right = smoothstep(1.0 + pad.x, 1.0 + pad.x - aa, uv.x); 3583 float bottom = smoothstep(-pad.y, -pad.y + aa, uv.y); 3584 float top = smoothstep(1.0 + pad.y, 1.0 + pad.y - aa, uv.y); 3585 3586 return left * right * bottom * top; 3587} 3588 3589vec2 getImageUV(vec2 uv) { 3590 vec2 boxOrigin = vec2(.5 - u_originX, u_originY - .5); 3591 float r = u_rotation * PI / 180.; 3592 mat2 graphicRotation = mat2(cos(r), sin(r), -sin(r), cos(r)); 3593 vec2 graphicOffset = vec2(-u_offsetX, u_offsetY); 3594 3595 vec2 imageBoxSize; 3596 if (u_fit == 1.) { // contain 3597 imageBoxSize.x = min(u_resolution.x / u_imageAspectRatio, u_resolution.y) * u_imageAspectRatio; 3598 } else if (u_fit == 2.) { // cover 3599 imageBoxSize.x = max(u_resolution.x / u_imageAspectRatio, u_resolution.y) * u_imageAspectRatio; 3600 } else { 3601 imageBoxSize.x = min(10.0, 10.0 / u_imageAspectRatio * u_imageAspectRatio); 3602 } 3603 imageBoxSize.y = imageBoxSize.x / u_imageAspectRatio; 3604 vec2 imageBoxScale = u_resolution.xy / imageBoxSize; 3605 3606 vec2 imageUV = uv; 3607 imageUV *= imageBoxScale; 3608 imageUV += boxOrigin * (imageBoxScale - 1.); 3609 imageUV += graphicOffset; 3610 imageUV /= u_scale; 3611 imageUV.x *= u_imageAspectRatio; 3612 imageUV = graphicRotation * imageUV; 3613 imageUV.x /= u_imageAspectRatio; 3614 3615 imageUV += .5; 3616 imageUV.y = 1. - imageUV.y; 3617 3618 return imageUV; 3619} 3620 3621const int bayer2x2[4] = int[4](0, 2, 3, 1); 3622const int bayer4x4[16] = int[16]( 36230, 8, 2, 10, 362412, 4, 14, 6, 36253, 11, 1, 9, 362615, 7, 13, 5 3627); 3628 3629const int bayer8x8[64] = int[64]( 36300, 32, 8, 40, 2, 34, 10, 42, 363148, 16, 56, 24, 50, 18, 58, 26, 363212, 44, 4, 36, 14, 46, 6, 38, 363360, 28, 52, 20, 62, 30, 54, 22, 36343, 35, 11, 43, 1, 33, 9, 41, 363551, 19, 59, 27, 49, 17, 57, 25, 363615, 47, 7, 39, 13, 45, 5, 37, 363763, 31, 55, 23, 61, 29, 53, 21 3638); 3639 3640float getBayerValue(vec2 uv, int size) { 3641 ivec2 pos = ivec2(fract(uv / float(size)) * float(size)); 3642 int index = pos.y * size + pos.x; 3643 3644 if (size == 2) { 3645 return float(bayer2x2[index]) / 4.0; 3646 } else if (size == 4) { 3647 return float(bayer4x4[index]) / 16.0; 3648 } else if (size == 8) { 3649 return float(bayer8x8[index]) / 64.0; 3650 } 3651 return 0.0; 3652} 3653 3654 3655void main() { 3656 3657 float pxSize = u_pxSize * u_pixelRatio; 3658 vec2 pxSizeUV = gl_FragCoord.xy - .5 * u_resolution; 3659 pxSizeUV /= pxSize; 3660 vec2 canvasPixelizedUV = (floor(pxSizeUV) + .5) * pxSize; 3661 vec2 normalizedUV = canvasPixelizedUV / u_resolution; 3662 3663 vec2 imageUV = getImageUV(normalizedUV); 3664 vec2 ditheringNoiseUV = canvasPixelizedUV; 3665 vec4 image = texture(u_image, imageUV); 3666 float frame = getUvFrame(imageUV, pxSize / u_resolution); 3667 3668 int type = int(floor(u_type)); 3669 float dithering = 0.0; 3670 3671 float lum = dot(vec3(.2126, .7152, .0722), image.rgb); 3672 lum = u_inverted ? (1. - lum) : lum; 3673 3674 switch (type) { 3675 case 1: { 3676 dithering = step(hash21(ditheringNoiseUV), lum); 3677 } break; 3678 case 2: 3679 dithering = getBayerValue(pxSizeUV, 2); 3680 break; 3681 case 3: 3682 dithering = getBayerValue(pxSizeUV, 4); 3683 break; 3684 default : 3685 dithering = getBayerValue(pxSizeUV, 8); 3686 break; 3687 } 3688 3689 float colorSteps = max(floor(u_colorSteps), 1.); 3690 vec3 color = vec3(0.0); 3691 float opacity = 1.; 3692 3693 dithering -= .5; 3694 float brightness = clamp(lum + dithering / colorSteps, 0.0, 1.0); 3695 brightness = mix(0.0, brightness, frame); 3696 brightness = mix(0.0, brightness, image.a); 3697 float quantLum = floor(brightness * colorSteps + 0.5) / colorSteps; 3698 quantLum = mix(0.0, quantLum, frame); 3699 3700 if (u_originalColors == true) { 3701 vec3 normColor = image.rgb / max(lum, 0.001); 3702 color = normColor * quantLum; 3703 3704 float quantAlpha = floor(image.a * colorSteps + 0.5) / colorSteps; 3705 opacity = mix(quantLum, 1., quantAlpha); 3706 } else { 3707 vec3 fgColor = u_colorFront.rgb * u_colorFront.a; 3708 float fgOpacity = u_colorFront.a; 3709 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 3710 float bgOpacity = u_colorBack.a; 3711 vec3 hlColor = u_colorHighlight.rgb * u_colorHighlight.a; 3712 float hlOpacity = u_colorHighlight.a; 3713 3714 fgColor = mix(fgColor, hlColor, step(1.02 - .02 * u_colorSteps, brightness)); 3715 fgOpacity = mix(fgOpacity, hlOpacity, step(1.02 - .02 * u_colorSteps, brightness)); 3716 3717 color = fgColor * quantLum; 3718 opacity = fgOpacity * quantLum; 3719 color += bgColor * (1.0 - opacity); 3720 opacity += bgOpacity * (1.0 - opacity); 3721 } 3722 3723 fragColor = vec4(color, opacity); 3724} 3725`,no={maxColorCount:10},na=`#version 300 es 3726precision highp float; 3727 3728in mediump vec2 v_imageUV; 3729in mediump vec2 v_objectUV; 3730out vec4 fragColor; 3731 3732uniform sampler2D u_image; 3733uniform float u_time; 3734uniform mediump float u_imageAspectRatio; 3735 3736uniform vec4 u_colorBack; 3737uniform vec4 u_colors[${no.maxColorCount}]; 3738uniform float u_colorsCount; 3739 3740uniform float u_angle; 3741uniform float u_noise; 3742uniform float u_innerGlow; 3743uniform float u_outerGlow; 3744uniform float u_contour; 3745 3746#define TWO_PI 6.28318530718 3747#define PI 3.14159265358979323846 3748
3749float getImgFrame(vec2 uv, float th) { 3750 float frame = 1.; 3751 frame *= smoothstep(0., th, uv.y); 3752 frame *= 1. - smoothstep(1. - th, 1., uv.y); 3753 frame *= smoothstep(0., th, uv.x); 3754 frame *= 1. - smoothstep(1. - th, 1., uv.x); 3755 return frame; 3756} 3757 3758float circle(vec2 uv, vec2 c, vec2 r) { 3759 return 1. - smoothstep(r[0], r[1], length(uv - c)); 3760} 3761 3762float lst(float edge0, float edge1, float x) { 3763 return clamp((x - edge0) / (edge1 - edge0), 0.0, 1.0); 3764} 3765 3766float sst(float edge0, float edge1, float x) { 3767 return smoothstep(edge0, edge1, x); 3768} 3769 3770float shadowShape(vec2 uv, float t, float contour) { 3771 vec2 scaledUV = uv; 3772 3773 // base shape tranjectory 3774 float posY = mix(-1., 2., t); 3775 3776 // scaleX when it's moving down 3777 scaledUV.y -= .5; 3778 float mainCircleScale = sst(0., .8, posY) * lst(1.4, .9, posY); 3779 scaledUV *= vec2(1., 1. + 1.5 * mainCircleScale); 3780 scaledUV.y += .5; 3781 3782 // base shape 3783 float innerR = .4; 3784 float outerR = 1. - .3 * (sst(.1, .2, t) * (1. - sst(.2, .5, t))); 3785 float s = circle(scaledUV, vec2(.5, posY - .2), vec2(innerR, outerR)); 3786 float shapeSizing = sst(.2, .3, t) * sst(.6, .3, t); 3787 s = pow(s, 1.4); 3788 s *= 1.2; 3789 3790 // flat gradient to take over the shadow shape 3791 float topFlattener = 0.; 3792 { 3793 float pos = posY - uv.y; 3794 float edge = 1.2; 3795 topFlattener = lst(-.4, 0., pos) * (1. - sst(.0, edge, pos)); 3796 topFlattener = pow(topFlattener, 3.); 3797 float topFlattenerMixer = (1. - sst(.0, .3, pos)); 3798 s = mix(topFlattener, s, topFlattenerMixer); 3799 } 3800 3801 // apple right circle 3802 { 3803 float visibility = sst(.6, .7, t) * (1. - sst(.8, .9, t)); 3804 float angle = -2. -t * TWO_PI; 3805 float rightCircle = circle(uv, vec2(.95 - .2 * cos(angle), .4 - .1 * sin(angle)), vec2(.15, .3)); 3806 rightCircle *= visibility; 3807 s = mix(s, 0., rightCircle); 3808 } 3809 3810 // apple top circle 3811 { 3812 float topCircle = circle(uv, vec2(.5, .19), vec2(.05, .25)); 3813 topCircle += 2. * contour * circle(uv, vec2(.5, .19), vec2(.2, .5)); 3814 float visibility = .55 * sst(.2, .3, t) * (1. - sst(.3, .45, t)); 3815 topCircle *= visibility; 3816 s = mix(s, 0., topCircle); 3817 } 3818 3819 float leafMask = circle(uv, vec2(.53, .13), vec2(.08, .19)); 3820 leafMask = mix(leafMask, 0., 1. - sst(.4, .54, uv.x)); 3821 leafMask = mix(0., leafMask, sst(.0, .2, uv.y)); 3822 leafMask *= (sst(.5, 1.1, posY) * sst(1.5, 1.3, posY)); 3823 s += leafMask; 3824 3825 // apple bottom circle 3826 { 3827 float visibility = sst(.0, .4, t) * (1. - sst(.6, .8, t)); 3828 s = mix(s, 0., visibility * circle(uv, vec2(.52, .92), vec2(.09, .25))); 3829 } 3830 3831 // random balls that are invisible if apple logo is selected 3832 { 3833 float pos = sst(.0, .6, t) * (1. - sst(.6, 1., t)); 3834 s = mix(s, .5, circle(uv, vec2(.0, 1.2 - .5 * pos), vec2(.1, .3))); 3835 s = mix(s, .0, circle(uv, vec2(1., .5 + .5 * pos), vec2(.1, .3))); 3836 3837 s = mix(s, 1., circle(uv, vec2(.95, .2 + .2 * sst(.3, .4, t) * sst(.7, .5, t)), vec2(.07, .22))); 3838 s = mix(s, 1., circle(uv, vec2(.95, .2 + .2 * sst(.3, .4, t) * (1. - sst(.5, .7, t))), vec2(.07, .22))); 3839 s /= max(1e-4, sst(1., .85, uv.y)); 3840 } 3841 3842 s = clamp(0., 1., s); 3843 return s; 3844} 3845 3846float blurEdge3x3(sampler2D tex, vec2 uv, vec2 dudx, vec2 dudy, float radius, float centerSample) { 3847 vec2 texel = 1.0 / vec2(textureSize(tex, 0)); 3848 vec2 r = radius * texel; 3849 3850 float w1 = 1.0, w2 = 2.0, w4 = 4.0; 3851 float norm = 16.0; 3852 float sum = w4 * centerSample; 3853 3854 sum += w2 * textureGrad(tex, uv + vec2(0.0, -r.y), dudx, dudy).g; 3855 sum += w2 * textureGrad(tex, uv + vec2(0.0, r.y), dudx, dudy).g; 3856 sum += w2 * textureGrad(tex, uv + vec2(-r.x, 0.0), dudx, dudy).g; 3857 sum += w2 * textureGrad(tex, uv + vec2(r.x, 0.0), dudx, dudy).g; 3858 3859 sum += w1 * textureGrad(tex, uv + vec2(-r.x, -r.y), dudx, dudy).g; 3860 sum += w1 * textureGrad(tex, uv + vec2(r.x, -r.y), dudx, dudy).g; 3861 sum += w1 * textureGrad(tex, uv + vec2(-r.x, r.y), dudx, dudy).g; 3862 sum += w1 * textureGrad(tex, uv + vec2(r.x, r.y), dudx, dudy).g; 3863 3864 return sum / norm; 3865} 3866 3867void main() { 3868 vec2 uv = v_objectUV + .5; 3869 uv.y = 1. - uv.y; 3870 3871 vec2 imgUV = v_imageUV; 3872 imgUV -= .5; 3873 imgUV *= 0.5714285714285714; 3874 imgUV += .5; 3875 float imgSoftFrame = getImgFrame(imgUV, .03); 3876 3877 vec4 img = texture(u_image, imgUV); 3878 vec2 dudx = dFdx(imgUV); 3879 vec2 dudy = dFdy(imgUV); 3880 3881 if (img.a == 0.) { 3882 fragColor = u_colorBack; 3883 return; 3884 } 3885 3886 float t = .1 * u_time; 3887 t -= .3; 3888 3889 float tCopy = t + 1. / 3.; 3890 float tCopy2 = t + 2. / 3.; 3891 3892 t = mod(t, 1.); 3893 tCopy = mod(tCopy, 1.); 3894 tCopy2 = mod(tCopy2, 1.); 3895 3896 vec2 animationUV = imgUV - vec2(.5); 3897 float angle = -u_angle * PI / 180.; 3898 float cosA = cos(angle); 3899 float sinA = sin(angle); 3900 animationUV = vec2( 3901 animationUV.x * cosA - animationUV.y * sinA, 3902 animationUV.x * sinA + animationUV.y * cosA 3903 ) + vec2(.5); 3904 3905 float shape = img[0]; 3906 3907 img[1] = blurEdge3x3(u_image, imgUV, dudx, dudy, 8., img[1]); 3908 3909 float outerBlur = 1. - mix(1., img[1], shape); 3910 float innerBlur = mix(img[1], 0., shape); 3911 float contour = mix(img[2], 0., shape); 3912 3913 outerBlur *= imgSoftFrame; 3914 3915 float shadow = shadowShape(animationUV, t, innerBlur); 3916 float shadowCopy = shadowShape(animationUV, tCopy, innerBlur); 3917 float shadowCopy2 = shadowShape(animationUV, tCopy2, innerBlur); 3918 3919 float inner = .8 + .8 * innerBlur; 3920 inner = mix(inner, 0., shadow); 3921 inner = mix(inner, 0., shadowCopy); 3922 inner = mix(inner, 0., shadowCopy2); 3923 3924 inner *= mix(0., 2., u_innerGlow); 3925 3926 inner += (u_contour * 2.) * contour; 3927 inner = min(1., inner); 3928 inner *= (1. - shape); 3929 3930 float outer = 0.; 3931 { 3932 t *= 3.; 3933 t = mod(t - .1, 1.); 3934 3935 outer = .9 * pow(outerBlur, .8); 3936 float y = mod(animationUV.y - t, 1.); 3937 float animatedMask = sst(.3, .65, y) * (1. - sst(.65, 1., y)); 3938 animatedMask = .5 + animatedMask; 3939 outer *= animatedMask; 3940 outer *= mix(0., 5., pow(u_outerGlow, 2.)); 3941 outer *= imgSoftFrame; 3942 } 3943 3944 inner = pow(inner, 1.2); 3945 float heat = clamp(inner + outer, 0., 1.); 3946 3947 heat += (.005 + .35 * u_noise) * (fract(sin(dot(uv, vec2(12.9898, 78.233))) * 43758.5453123) - .5); 3948 3949 float mixer = heat * u_colorsCount; 3950 vec4 gradient = u_colors[0]; 3951 gradient.rgb *= gradient.a; 3952 float outerShape = 0.; 3953 for (int i = 1; i < ${no.maxColorCount+1}; i++) { 3954 if (i > int(u_colorsCount)) break; 3955 float m = clamp(mixer - float(i - 1), 0., 1.); 3956 if (i == 1) { 3957 outerShape = m; 3958 } 3959 vec4 c = u_colors[i - 1]; 3960 c.rgb *= c.a; 3961 gradient = mix(gradient, c, m); 3962 } 3963 3964 vec3 color = gradient.rgb * outerShape; 3965 float opacity = gradient.a * outerShape; 3966 3967 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 3968 color = color + bgColor * (1.0 - opacity); 3969 opacity = opacity + u_colorBack.a * (1.0 - opacity); 3970 3971 color += .02 * (fract(sin(dot(uv + 1., vec2(12.9898, 78.233))) * 43758.5453123) - .5); 3972 3973 fragColor = vec4(color, opacity); 3974} 3975`;function lo(o){const e=document.createElement("canvas"),r=1e3;return new Promise((t,f)=>{const i=new Image;i.crossOrigin="anonymous",i.addEventListener("load",()=>
3975{(typeof o=="string"?o.endsWith(".svg"):o.type==="image/svg+xml")&&(i.width=r,i.height=r);const s=i.naturalWidth/i.naturalHeight,a=Math.floor(r*.15),p=Math.ceil(a*2.5);let l=r,m=r;s>1?m=Math.floor(r/s):l=Math.floor(r*s),e.width=l+2*p,e.height=m+2*p;const u=e.getContext("2d",{willReadFrequently:!0});if(!u)throw new Error("Failed to get canvas 2d context");u.fillStyle="white",u.fillRect(0,0,e.width,e.height),u.drawImage(i,p,p,l,m);const{width:h,height:_}=e,n=u.getImageData(0,0,h,_).data,c=h*_,d=new Uint8ClampedArray(c);for(let B=0;B<c;B++){const F=B*4,H=n[F]??0,N=n[F+1]??0,te=n[F+2]??0;d[B]=.299*H+.587*N+.114*te|0}const x=a,w=Math.max(1,Math.round(.12*a)),v=5,y=Xe(d,h,_,x,3),A=Xe(d,h,_,w,3),U=Xe(d,h,_,v,1),E=u.createImageData(h,_),R=E.data;for(let B=0;B<c;B++){const F=B*4;R[F]=U[B]??0,R[F+1]=y[B]??0,R[F+2]=A[B]??0,R[F+3]=255}u.putImageData(E,0,0),e.toBlob(B=>{if(!B){f(new Error("Failed to create PNG blob"));return}t({blob:B})},"image/png")}),i.addEventListener("error",()=>{f(new Error("Failed to load image"))}),i.src=typeof o=="string"?o:URL.createObjectURL(o)})}function co(o,e,r,t){if(t<=0)return o.slice();const f=new Uint8ClampedArray(e*r),i=new Uint32Array(e*r);for(let s=0;s<r;s++){let a=0;for(let p=0;p<e;p++){const l=s*e+p,m=o[l]??0;a+=m,i[l]=a+(s>0?i[l-e]??0:0)}}for(let s=0;s<r;s++){const a=Math.max(0,s-t),p=Math.min(r-1,s+t);for(let l=0;l<e;l++){const m=Math.max(0,l-t),u=Math.min(e-1,l+t),h=p*e+u,_=p*e+(m-1),g=(a-1)*e+u,n=(a-1)*e+(m-1),c=i[h]??0,d=m>0?i[_]??0:0,x=a>0?i[g]??0:0,w=m>0&&a>0?i[n]??0:0,v=c-d-x+w,y=(u-m+1)*(p-a+1);f[s*e+l]=Math.round(v/y)}}return f}function Xe(o,e,r,t,f){if(t<=0||f<=1)return co(o,e,r,t);let i=o,s=o;for(let a=0;a<f;a++)s=co(i,e,r,t),i=s;return s}const la=`#version 300 es 3976precision mediump float; 3977 3978uniform sampler2D u_image; 3979uniform float u_imageAspectRatio; 3980 3981uniform vec2 u_resolution; 3982uniform float u_time; 3983 3984uniform vec4 u_colorBack; 3985uniform vec4 u_colorTint; 3986 3987uniform float u_softness; 3988uniform float u_repetition; 3989uniform float u_shiftRed; 3990uniform float u_shiftBlue; 3991uniform float u_distortion; 3992uniform float u_contour; 3993uniform float u_angle; 3994 3995uniform float u_shape; 3996uniform bool u_isImage; 3997 3998in vec2 v_objectUV; 3999in vec2 v_responsiveUV; 4000in vec2 v_responsiveBoxGivenSize; 4001in vec2 v_imageUV; 4002 4003out vec4 fragColor; 4004 4005${X} 4006${Be} 4007${ze} 4008 4009float getColorChanges(float c1, float c2, float stripe_p, vec3 w, float blur, float bump, float tint) { 4010 4011 float ch = mix(c2, c1, smoothstep(.0, 2. * blur, stripe_p)); 4012 4013 float border = w[0]; 4014 ch = mix(ch, c2, smoothstep(border, border + 2. * blur, stripe_p)); 4015 4016 if (u_isImage == true) { 4017 bump = smoothstep(.2, .8, bump); 4018 } 4019 border = w[0] + .4 * (1. - bump) * w[1]; 4020 ch = mix(ch, c1, smoothstep(border, border + 2. * blur, stripe_p)); 4021 4022 border = w[0] + .5 * (1. - bump) * w[1]; 4023 ch = mix(ch, c2, smoothstep(border, border + 2. * blur, stripe_p)); 4024 4025 border = w[0] + w[1]; 4026 ch = mix(ch, c1, smoothstep(border, border + 2. * blur, stripe_p)); 4027 4028 float gradient_t = (stripe_p - w[0] - w[1]) / w[2]; 4029 float gradient = mix(c1, c2, smoothstep(0., 1., gradient_t)); 4030 ch = mix(ch, gradient, smoothstep(border, border + .5 * blur, stripe_p)); 4031 4032 // Tint color is applied with color burn blending 4033 ch = mix(ch, 1. - min(1., (1. - ch) / max(tint, 0.0001)), u_colorTint.a); 4034 return ch; 4035} 4036 4037float getImgFrame(vec2 uv, float th) { 4038 float frame = 1.; 4039 frame *= smoothstep(0., th, uv.y); 4040 frame *= 1.0 - smoothstep(1. - th, 1., uv.y); 4041 frame *= smoothstep(0., th, uv.x); 4042 frame *= 1.0 - smoothstep(1. - th, 1., uv.x); 4043 return frame; 4044} 4045 4046float blurEdge3x3(sampler2D tex, vec2 uv, vec2 dudx, vec2 dudy, float radius, float centerSample) { 4047 vec2 texel = 1.0 / vec2(textureSize(tex, 0)); 4048 vec2 r = radius * texel; 4049 4050 float w1 = 1.0, w2 = 2.0, w4 = 4.0; 4051 float norm = 16.0; 4052 float sum = w4 * centerSample; 4053 4054 sum += w2 * textureGrad(tex, uv + vec2(0.0, -r.y), dudx, dudy).r; 4055 sum += w2 * textureGrad(tex, uv + vec2(0.0, r.y), dudx, dudy).r; 4056 sum += w2 * textureGrad(tex, uv + vec2(-r.x, 0.0), dudx, dudy).r; 4057 sum += w2 * textureGrad(tex, uv + vec2(r.x, 0.0), dudx, dudy).r; 4058 4059 sum += w1 * textureGrad(tex, uv + vec2(-r.x, -r.y), dudx, dudy).r; 4060 sum += w1 * textureGrad(tex, uv + vec2(r.x, -r.y), dudx, dudy).r; 4061 sum += w1 * textureGrad(tex, uv + vec2(-r.x, r.y), dudx, dudy).r; 4062 sum += w1 * textureGrad(tex, uv + vec2(r.x, r.y), dudx, dudy).r; 4063 4064 return sum / norm; 4065} 4066 4067float lst(float edge0, float edge1, float x) { 4068 return clamp((x - edge0) / (edge1 - edge0), 0.0, 1.0); 4069} 4070 4071void main() { 4072 4073 const float firstFrameOffset = 2.8; 4074 float t = .3 * (u_time + firstFrameOffset); 4075 4076 vec2 uv = v_imageUV; 4077 vec2 dudx = dFdx(v_imageUV); 4078 vec2 dudy = dFdy(v_imageUV); 4079 vec4 img = textureGrad(u_image, uv, dudx, dudy); 4080 4081 if (u_isImage == false) { 4082 uv = v_objectUV + .5; 4083 uv.y = 1. - uv.y; 4084 } 4085 4086 float cycleWidth = u_repetition; 4087 float edge = 0.; 4088 float contOffset = 1.; 4089 4090 vec2 rotatedUV = uv - vec2(.5); 4091 float angle = (-u_angle + 70.) * PI / 180.; 4092 float cosA = cos(angle); 4093 float sinA = sin(angle); 4094 rotatedUV = vec2( 4095 rotatedUV.x * cosA - rotatedUV.y * sinA, 4096 rotatedUV.x * sinA + rotatedUV.y * cosA 4097 ) + vec2(.5); 4098 4099 if (u_isImage == true) { 4100 float edgeRaw = img.r; 4101 edge = blurEdge3x3(u_image, uv, dudx, dudy, 6., edgeRaw); 4102 edge = pow(edge, 1.6); 4103 edge *= mix(0.0, 1.0, smoothstep(0.0, 0.4, u_contour)); 4104 } else { 4105 if (u_shape < 1.) { 4106 // full-fill on canvas 4107 vec2 borderUV = v_responsiveUV + .5; 4108 float ratio = v_responsiveBoxGivenSize.x / v_responsiveBoxGivenSize.y; 4109 vec2 mask = min(borderUV, 1. - borderUV); 4110 vec2 pixel_thickness = min(250. / v_responsiveBoxGivenSize, vec2(.5)); 4111 float maskX = smoothstep(0.0, pixel_thickness.x, mask.x); 4112 float maskY = smoothstep(0.0, pixel_thickness.y, mask.y); 4113 maskX = pow(maskX, .25); 4114 maskY = pow(maskY, .25); 4115 edge = clamp(1. - maskX * maskY, 0., 1.); 4116 4117 uv = v_responsiveUV; 4118 if (ratio > 1.) { 4119 uv.y /= ratio; 4120 } else { 4121 uv.x *= ratio; 4122 } 4123 uv += .5; 4124 uv.y = 1. - uv.y; 4125 4126 cycleWidth *= 2.; 4127 contOffset = 1.5; 4128 4129 } else if (u_shape < 2.) { 4130 // circle 4131 vec2 shapeUV = uv - .5; 4132 shapeUV *= .67; 4133 edge = pow(clamp(3. * length(shapeUV), 0., 1.), 18.); 4134 } else if (u_shape < 3.) { 4135 // daisy 4136 vec2 shapeUV = uv - .5; 4137 shapeUV *= 1.68; 4138 4139 float r = length(shapeUV) * 2.; 4140 float a = atan(shapeUV.y, shapeUV.x) + .2; 4141 r *= (1. + .05 * sin(3. * a + 2. * t)); 4142 float f = abs(cos(a * 3.)); 4143 edge = smoothstep(f, f + .7, r); 4144 edge *= edge; 4145 4146 uv *= .8; 4147 cycleWidth *= 1.6; 4148 4149 } else if (u_shape < 4.) { 4150 // diamond 4151 vec2 shapeUV = uv - .5;
4152 shapeUV = rotate(shapeUV, .25 * PI); 4153 shapeUV *= 1.42; 4154 shapeUV += .5; 4155 vec2 mask = min(shapeUV, 1. - shapeUV); 4156 vec2 pixel_thickness = vec2(.15); 4157 float maskX = smoothstep(0.0, pixel_thickness.x, mask.x); 4158 float maskY = smoothstep(0.0, pixel_thickness.y, mask.y); 4159 maskX = pow(maskX, .25); 4160 maskY = pow(maskY, .25); 4161 edge = clamp(1. - maskX * maskY, 0., 1.); 4162 } else if (u_shape < 5.) { 4163 // metaballs 4164 vec2 shapeUV = uv - .5; 4165 shapeUV *= 1.3; 4166 edge = 0.; 4167 for (int i = 0; i < 5; i++) { 4168 float fi = float(i); 4169 float speed = 1.5 + 2./3. * sin(fi * 12.345); 4170 float angle = -fi * 1.5; 4171 vec2 dir1 = vec2(cos(angle), sin(angle)); 4172 vec2 dir2 = vec2(cos(angle + 1.57), sin(angle + 1.)); 4173 vec2 traj = .4 * (dir1 * sin(t * speed + fi * 1.23) + dir2 * cos(t * (speed * 0.7) + fi * 2.17)); 4174 float d = length(shapeUV + traj); 4175 edge += pow(1.0 - clamp(d, 0.0, 1.0), 4.0); 4176 } 4177 edge = 1. - smoothstep(.65, .9, edge); 4178 edge = pow(edge, 4.); 4179 } 4180 4181 edge = mix(smoothstep(.9 - 2. * fwidth(edge), .9, edge), edge, smoothstep(0.0, 0.4, u_contour)); 4182 4183 } 4184 4185 float opacity = 0.; 4186 if (u_isImage == true) { 4187 opacity = img.g; 4188 float frame = getImgFrame(v_imageUV, 0.); 4189 opacity *= frame; 4190 } else { 4191 opacity = 1. - smoothstep(.9 - 2. * fwidth(edge), .9, edge); 4192 if (u_shape < 2.) { 4193 edge = 1.2 * edge; 4194 } else if (u_shape < 5.) { 4195 edge = 1.8 * pow(edge, 1.5); 4196 } 4197 } 4198 4199 float diagBLtoTR = rotatedUV.x - rotatedUV.y; 4200 float diagTLtoBR = rotatedUV.x + rotatedUV.y; 4201 4202 vec3 color = vec3(0.); 4203 vec3 color1 = vec3(.98, 0.98, 1.); 4204 vec3 color2 = vec3(.1, .1, .1 + .1 * smoothstep(.7, 1.3, diagTLtoBR)); 4205 4206 vec2 grad_uv = uv - .5; 4207 4208 float dist = length(grad_uv + vec2(0., .2 * diagBLtoTR)); 4209 grad_uv = rotate(grad_uv, (.25 - .2 * diagBLtoTR) * PI); 4210 float direction = grad_uv.x; 4211 4212 float bump = pow(1.8 * dist, 1.2); 4213 bump = 1. - bump; 4214 bump *= pow(uv.y, .3); 4215 4216 4217 float thin_strip_1_ratio = .12 / cycleWidth * (1. - .4 * bump); 4218 float thin_strip_2_ratio = .07 / cycleWidth * (1. + .4 * bump); 4219 float wide_strip_ratio = (1. - thin_strip_1_ratio - thin_strip_2_ratio); 4220 4221 float thin_strip_1_width = cycleWidth * thin_strip_1_ratio; 4222 float thin_strip_2_width = cycleWidth * thin_strip_2_ratio; 4223 4224 float noise = snoise(uv - t); 4225 4226 edge += (1. - edge) * u_distortion * noise; 4227 4228 direction += diagBLtoTR; 4229 float contour = 0.; 4230 direction -= 2. * noise * diagBLtoTR * (smoothstep(0., 1., edge) * (1.0 - smoothstep(0., 1., edge))); 4231 direction *= mix(1., 1. - edge, smoothstep(.5, 1., u_contour)); 4232 direction -= 1.7 * edge * smoothstep(.5, 1., u_contour); 4233 direction += .2 * pow(u_contour, 4.) * (1.0 - smoothstep(0., 1., edge)); 4234 4235 bump *= clamp(pow(uv.y, .1), .3, 1.); 4236 direction *= (.1 + (1.1 - edge) * bump); 4237 4238 direction *= (.4 + .6 * (1.0 - smoothstep(.5, 1., edge))); 4239 direction += .18 * (smoothstep(.1, .2, uv.y) * (1.0 - smoothstep(.2, .4, uv.y))); 4240 direction += .03 * (smoothstep(.1, .2, 1. - uv.y) * (1.0 - smoothstep(.2, .4, 1. - uv.y))); 4241 4242 direction *= (.5 + .5 * pow(uv.y, 2.)); 4243 direction *= cycleWidth; 4244 direction -= t; 4245 4246 4247 float colorDispersion = (1. - bump); 4248 colorDispersion = clamp(colorDispersion, 0., 1.); 4249 float dispersionRed = colorDispersion; 4250 dispersionRed += .03 * bump * noise; 4251 dispersionRed += 5. * (smoothstep(-.1, .2, uv.y) * (1.0 - smoothstep(.1, .5, uv.y))) * (smoothstep(.4, .6, bump) * (1.0 - smoothstep(.4, 1., bump))); 4252 dispersionRed -= diagBLtoTR; 4253 4254 float dispersionBlue = colorDispersion; 4255 dispersionBlue *= 1.3; 4256 dispersionBlue += (smoothstep(0., .4, uv.y) * (1.0 - smoothstep(.1, .8, uv.y))) * (smoothstep(.4, .6, bump) * (1.0 - smoothstep(.4, .8, bump))); 4257 dispersionBlue -= .2 * edge; 4258 4259 dispersionRed *= (u_shiftRed / 20.); 4260 dispersionBlue *= (u_shiftBlue / 20.); 4261 4262 float blur = 0.; 4263 float rExtraBlur = 0.; 4264 float gExtraBlur = 0.; 4265 if (u_isImage == true) { 4266 float softness = 0.05 * u_softness; 4267 blur = softness + .5 * smoothstep(1., 10., u_repetition) * smoothstep(.0, 1., edge); 4268 float smallCanvasT = 1.0 - smoothstep(100., 500., min(u_resolution.x, u_resolution.y)); 4269 blur += smallCanvasT * smoothstep(.0, 1., edge); 4270 rExtraBlur = softness * (0.05 + .1 * (u_shiftRed / 20.) * bump); 4271 gExtraBlur = softness * 0.05 / max(0.001, abs(1. - diagBLtoTR)); 4272 } else { 4273 blur = u_softness / 15. + .3 * contour; 4274 } 4275 4276 vec3 w = vec3(thin_strip_1_width, thin_strip_2_width, wide_strip_ratio); 4277 w[1] -= .02 * smoothstep(.0, 1., edge + bump); 4278 float stripe_r = fract(direction + dispersionRed); 4279 float r = getColorChanges(color1.r, color2.r, stripe_r, w, blur + fwidth(stripe_r) + rExtraBlur, bump, u_colorTint.r); 4280 float stripe_g = fract(direction); 4281 float g = getColorChanges(color1.g, color2.g, stripe_g, w, blur + fwidth(stripe_g) + gExtraBlur, bump, u_colorTint.g); 4282 float stripe_b = fract(direction - dispersionBlue); 4283 float b = getColorChanges(color1.b, color2.b, stripe_b, w, blur + fwidth(stripe_b), bump, u_colorTint.b); 4284 4285 color = vec3(r, g, b); 4286 color *= opacity; 4287 4288 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 4289 color = color + bgColor * (1. - opacity); 4290 opacity = opacity + u_colorBack.a * (1. - opacity); 4291 4292 ${Ue} 4293 4294 fragColor = vec4(color, opacity); 4295} 4296`,_o={workingSize:512,iterations:40};function fo(o){const e=document.createElement("canvas"),r=e.getContext("2d"),t=typeof o=="str
4296ing"&&o.startsWith("blob:");return new Promise((f,i)=>{if(!o||!r){i(new Error("Invalid file or canvas context"));return}const s=t&&fetch(o).then(p=>p.headers.get("Content-Type")),a=new Image;a.crossOrigin="anonymous",performance.now(),a.onload=async()=>{let p;const l=await s;l?p=l==="image/svg+xml":typeof o=="string"?p=o.endsWith(".svg")||o.startsWith("data:image/svg+xml"):p=o.type==="image/svg+xml";let m=a.width||a.naturalWidth,u=a.height||a.naturalHeight;if(p){const z=m/u;m>u?(m=4096,u=4096/z):(u=4096,m=4096*z),a.width=m,a.height=u}const h=Math.min(m,u),g=_o.workingSize/h,n=Math.round(m*g),c=Math.round(u*g);e.width=m,e.height=u;const d=document.createElement("canvas");d.width=n,d.height=c;const x=d.getContext("2d");x.drawImage(a,0,0,n,c),performance.now();const v=x.getImageData(0,0,n,c).data,y=new Uint8Array(n*c),A=new Uint8Array(n*c);for(let V=0,z=0;V<v.length;V+=4,z++){const xe=v[V+3]===0?0:1;y[z]=xe}const U=[],E=[];for(let V=0;V<c;V++)for(let z=0;z<n;z++){const $=V*n+z;if(!y[$])continue;let xe=!1;z===0||z===n-1||V===0||V===c-1?xe=!0:xe=!y[$-1]||!y[$+1]||!y[$-n]||!y[$+n]||!y[$-n-1]||!y[$-n+1]||!y[$+n-1]||!y[$+n+1],xe?(A[$]=1,U.push($)):E.push($)}const R=ca(y,A,new Uint32Array(E),new Uint32Array(U),n,c);performance.now();const B=fa(R,y,A,n,c);let F=0,H;for(let V=0;V<E.length;V++){const z=E[V];B[z]>F&&(F=B[z])}const N=document.createElement("canvas");N.width=n,N.height=c;const te=N.getContext("2d"),G=te.createImageData(n,c);for(let V=0;V<c;V++)for(let z=0;z<n;z++){const $=V*n+z,xe=$*4;if(!y[$])G.data[xe]=255,G.data[xe+1]=255,G.data[xe+2]=255,G.data[xe+3]=0;else{const Me=255*(1-B[$]/F);G.data[xe]=Me,G.data[xe+1]=Me,G.data[xe+2]=Me,G.data[xe+3]=255}}te.putImageData(G,0,0),r.imageSmoothingEnabled=!0,r.imageSmoothingQuality="high",r.drawImage(N,0,0,n,c,0,0,m,u);const Q=r.getImageData(0,0,m,u),ke=document.createElement("canvas");ke.width=m,ke.height=u;const Ve=ke.getContext("2d");Ve.drawImage(a,0,0,m,u);const Re=Ve.getImageData(0,0,m,u);for(let V=0;V<Q.data.length;V+=4){const z=Re.data[V+3],$=Q.data[V+3];z===0?(Q.data[V]=255,Q.data[V+1]=0):(Q.data[V]=$===0?0:Q.data[V],Q.data[V+1]=z),Q.data[V+2]=255,Q.data[V+3]=255}r.putImageData(Q,0,0),H=Q,e.toBlob(V=>{if(!V){i(new Error("Failed to create PNG blob"));return}f({imageData:H,pngBlob:V})},"image/png")},a.onerror=()=>i(new Error("Failed to load image")),a.src=typeof o=="string"?o:URL.createObjectURL(o)})}function ca(o,e,r,t,f,i){const s=r.length,a=new Int32Array(s*4);for(let p=0;p<s;p++){const l=r[p],m=l%f,u=Math.floor(l/f);a[p*4+0]=m<f-1&&o[l+1]?l+1:-1,a[p*4+1]=m>0&&o[l-1]?l-1:-1,a[p*4+2]=u>0&&o[l-f]?l-f:-1,a[p*4+3]=u<i-1&&o[l+f]?l+f:-1}return{interiorPixels:r,boundaryPixels:t,pixelCount:s,neighborIndices:a}}function fa(o,e,r,t,f){const i=_o.iterations,s=.01,a=new Float32Array(t*f),{interiorPixels:p,neighborIndices:l,pixelCount:m}=o;performance.now();const u=1.9,h=[],_=[];for(let g=0;g<m;g++){const n=p[g],c=n%t,d=Math.floor(n/t);(c+d)%2===0?h.push(g):_.push(g)}for(let g=0;g<i;g++){for(const n of h){const c=p[n],d=l[n*4+0],x=l[n*4+1],w=l[n*4+2],v=l[n*4+3];let y=0;d>=0&&(y+=a[d]),x>=0&&(y+=a[x]),w>=0&&(y+=a[w]),v>=0&&(y+=a[v]);const A=(s+y)/4;a[c]=u*A+(1-u)*a[c]}for(const n of _){const c=p[n],d=l[n*4+0],x=l[n*4+1],w=l[n*4+2],v=l[n*4+3];let y=0;d>=0&&(y+=a[d]),x>=0&&(y+=a[x]),w>=0&&(y+=a[w]),v>=0&&(y+=a[v]);const A=(s+y)/4;a[c]=u*A+(1-u)*a[c]}}return a}const ua={none:0,circle:1,daisy:2,diamond:3,metaballs:4},ma=`#version 300 es 4297precision mediump float; 4298 4299uniform float u_rotation; 4300 4301uniform float u_time; 4302 4303uniform vec4 u_colorFront; 4304uniform vec4 u_colorBack; 4305uniform float u_radius; 4306uniform float u_contrast; 4307 4308uniform sampler2D u_image; 4309uniform float u_imageAspectRatio; 4310 4311uniform float u_size; 4312uniform float u_grainMixer; 4313uniform float u_grainOverlay; 4314uniform float u_grainSize; 4315uniform float u_grid; 4316uniform bool u_originalColors; 4317uniform bool u_inverted; 4318uniform float u_type; 4319 4320in vec2 v_imageUV; 4321 4322out vec4 fragColor; 4323 4324${X} 4325${Be} 4326${Fe} 4327 4328float valueNoise(vec2 st) { 4329 vec2 i = floor(st); 4330 vec2 f = fract(st); 4331 float a = hash21(i); 4332 float b = hash21(i + vec2(1.0, 0.0)); 4333 float c = hash21(i + vec2(0.0, 1.0));
4334 float d = hash21(i + vec2(1.0, 1.0)); 4335 vec2 u = f * f * (3.0 - 2.0 * f); 4336 float x1 = mix(a, b, u.x); 4337 float x2 = mix(c, d, u.x); 4338 return mix(x1, x2, u.y); 4339} 4340 4341float lst(float edge0, float edge1, float x) { 4342 return clamp((x - edge0) / (edge1 - edge0), 0.0, 1.0); 4343} 4344 4345float sst(float edge0, float edge1, float x) { 4346 return smoothstep(edge0, edge1, x); 4347} 4348 4349float getCircle(vec2 uv, float r, float baseR) { 4350 r = mix(.25 * baseR, 0., r); 4351 float d = length(uv - .5); 4352 float aa = fwidth(d); 4353 return 1. - smoothstep(r - aa, r + aa, d); 4354} 4355 4356float getCell(vec2 uv) { 4357 float insideX = step(0.0, uv.x) * (1.0 - step(1.0, uv.x)); 4358 float insideY = step(0.0, uv.y) * (1.0 - step(1.0, uv.y)); 4359 return insideX * insideY; 4360} 4361 4362float getCircleWithHole(vec2 uv, float r, float baseR) { 4363 float cell = getCell(uv); 4364 4365 r = mix(.75 * baseR, 0., r); 4366 float rMod = mod(r, .5); 4367 4368 float d = length(uv - .5); 4369 float aa = fwidth(d); 4370 float circle = 1. - smoothstep(rMod - aa, rMod + aa, d); 4371 if (r < .5) { 4372 return circle; 4373 } else { 4374 return cell - circle; 4375 } 4376} 4377 4378float getGooeyBall(vec2 uv, float r, float baseR) { 4379 float d = length(uv - .5); 4380 float sizeRadius = .3; 4381 if (u_grid == 1.) { 4382 sizeRadius = .42; 4383 } 4384 sizeRadius = mix(sizeRadius * baseR, 0., r); 4385 d = 1. - sst(0., sizeRadius, d); 4386 4387 d = pow(d, 2. + baseR); 4388 return d; 4389} 4390 4391float getSoftBall(vec2 uv, float r, float baseR) { 4392 float d = length(uv - .5); 4393 float sizeRadius = clamp(baseR, 0., 1.); 4394 sizeRadius = mix(.5 * sizeRadius, 0., r); 4395 d = 1. - lst(0., sizeRadius, d); 4396 float powRadius = 1. - lst(0., 2., baseR); 4397 d = pow(d, 4. + 3. * powRadius); 4398 return d; 4399} 4400 4401float getUvFrame(vec2 uv, vec2 pad) { 4402 float aa = 0.0001; 4403 4404 float left = smoothstep(-pad.x, -pad.x + aa, uv.x); 4405 float right = smoothstep(1.0 + pad.x, 1.0 + pad.x - aa, uv.x); 4406 float bottom = smoothstep(-pad.y, -pad.y + aa, uv.y); 4407 float top = smoothstep(1.0 + pad.y, 1.0 + pad.y - aa, uv.y); 4408 4409 return left * right * bottom * top; 4410} 4411 4412float sigmoid(float x, float k) { 4413 return 1.0 / (1.0 + exp(-k * (x - 0.5))); 4414} 4415 4416float getLumAtPx(vec2 uv, float contrast) { 4417 vec4 tex = texture(u_image, uv); 4418 vec3 color = vec3( 4419 sigmoid(tex.r, contrast), 4420 sigmoid(tex.g, contrast), 4421 sigmoid(tex.b, contrast) 4422 ); 4423 float lum = dot(vec3(0.2126, 0.7152, 0.0722), color); 4424 lum = mix(1., lum, tex.a); 4425 lum = u_inverted ? (1. - lum) : lum; 4426 return lum; 4427} 4428 4429float getLumBall(vec2 p, vec2 pad, vec2 inCellOffset, float contrast, float baseR, float stepSize, out vec4 ballColor) { 4430 p += inCellOffset; 4431 vec2 uv_i = floor(p); 4432 vec2 uv_f = fract(p); 4433 vec2 samplingUV = (uv_i + .5 - inCellOffset) * pad + vec2(.5); 4434 float outOfFrame = getUvFrame(samplingUV, pad * stepSize); 4435 4436 float lum = getLumAtPx(samplingUV, contrast); 4437 ballColor = texture(u_image, samplingUV); 4438 ballColor.rgb *= ballColor.a; 4439 ballColor *= outOfFrame; 4440 4441 float ball = 0.; 4442 if (u_type == 0.) { 4443 // classic 4444 ball = getCircle(uv_f, lum, baseR); 4445 } else if (u_type == 1.) { 4446 // gooey 4447 ball = getGooeyBall(uv_f, lum, baseR); 4448 } else if (u_type == 2.) { 4449 // holes 4450 ball = getCircleWithHole(uv_f, lum, baseR); 4451 } else if (u_type == 3.) { 4452 // soft 4453 ball = getSoftBall(uv_f, lum, baseR); 4454 } 4455 4456 return ball * outOfFrame; 4457} 4458 4459 4460void main() { 4461 4462 float stepMultiplier = 1.; 4463 if (u_type == 0.) { 4464 // classic 4465 stepMultiplier = 2.; 4466 } else if (u_type == 1. || u_type == 3.) { 4467 // gooey & soft 4468 stepMultiplier = 6.; 4469 } 4470 4471 float cellsPerSide = mix(300., 7., pow(u_size, .7)); 4472 cellsPerSide /= stepMultiplier; 4473 float cellSizeY = 1. / cellsPerSide; 4474 vec2 pad = cellSizeY * vec2(1. / u_imageAspectRatio, 1.); 4475 if (u_type == 1. && u_grid == 1.) { 4476 // gooey diagonal grid works differently 4477 pad *= .7; 4478 } 4479 4480 vec2 uv = v_imageUV; 4481 uv -= vec2(.5); 4482 uv /= pad; 4483 4484 float contrast = mix(0., 15., pow(u_contrast, 1.5)); 4485 float baseRadius = u_radius; 4486 if (u_originalColors == true) { 4487 contrast = mix(.1, 4., pow(u_contrast, 2.)); 4488 baseRadius = 2. * pow(.5 * u_radius, .3); 4489 } 4490 4491 float totalShape = 0.; 4492 vec3 totalColor = vec3(0.); 4493 float totalOpacity = 0.; 4494 4495 vec4 ballColor; 4496 float shape; 4497 float stepSize = 1. / stepMultiplier; 4498 for (float x = -0.5; x < 0.5; x += stepSize) { 4499 for (float y = -0.5; y < 0.5; y += stepSize) { 4500 vec2 offset = vec2(x, y); 4501 4502 if (u_grid == 1.) { 4503 float rowIndex = floor((y + .5) / stepSize); 4504 float colIndex = floor((x + .5) / stepSize); 4505 if (stepSize == 1.) { 4506 rowIndex = floor(uv.y + y + 1.); 4507 if (u_type == 1.) { 4508 colIndex = floor(uv.x + x + 1.); 4509 } 4510 } 4511 if (u_type == 1.) { 4512 if (mod(rowIndex + colIndex, 2.) == 1.) { 4513 continue; 4514 } 4515 } else { 4516 if (mod(rowIndex, 2.) == 1.) { 4517 offset.x += .5 * stepSize; 4518 } 4519 } 4520 } 4521 4522 shape = getLumBall(uv, pad, offset, contrast, baseRadius, stepSize, ballColor); 4523 totalColor += ballColor.rgb * shape; 4524 totalShape += shape; 4525 totalOpacity += shape; 4526 } 4527 } 4528 4529 const float eps = 1e-4; 4530 4531 totalColor /= max(totalShape, eps); 4532 totalOpacity /= max(totalShape, eps); 4533 4534 float finalShape = 0.; 4535 if (u_type == 0.) { 4536 finalShape = min(1., totalShape); 4537 } else if (u_type == 1.) { 4538 float aa = fwidth(totalShape); 4539 float th = .5; 4540 finalShape = smoothstep(th - aa, th + aa, totalShape); 4541 } else if (u_type == 2.) { 4542 finalShape = min(1., totalShape); 4543 } else if (u_type == 3.) { 4544 finalShape = totalShape; 4545 } 4546 4547 vec2 grainSize = mix(2000., 200., u_grainSize) * vec2(1., 1. / u_imageAspectRatio); 4548 vec2 grainUV = v_imageUV - .5; 4549 grainUV *= grainSize; 4550 grainUV += .5; 4551 float grain = valueNoise(grainUV); 4552 grain = smoothstep(.55, .7 + .2 * u_grainMixer, grain); 4553 grain *= u_grainMixer; 4554 finalShape = mix(finalShape, 0., grain); 4555 4556 vec3 color = vec3(0.); 4557 float opacity = 0.; 4558 4559 if (u_originalColors == true) { 4560 color = totalColor * finalShape; 4561 opacity = totalOpacity * finalShape; 4562 4563 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 4564 color = color + bgColor * (1. - opacity); 4565 opacity = opacity + u_colorBack.a * (1. - opacity); 4566 } else { 4567 vec3 fgColor = u_colorFront.rgb * u_colorFront.a; 4568 float fgOpacity = u_colorFront.a; 4569 vec3 bgColor = u_colorBack.rgb * u_colorBack.a; 4570 float bgOpacity = u_colorBack.a; 4571 4572 color = fgColor * finalShape; 4573 opacity = fgOpacity * finalShape; 4574 color += bgColor * (1. - opacity); 4575 opacity += bgOpacity * (1. - opacity); 4576 } 4577 4578 float grainOverlay = valueNoise(rotate(grainUV, 1.) + vec2(3.)); 4579 grainOverlay = mix(grainOverlay, valueNoise(rotate(grainUV, 2.) + vec2(-1.)), .5); 4580 grainOverlay = pow(grainOverlay, 1.3); 4581 4582 float grainOverlayV = grainOverlay * 2. - 1.; 4583 vec3 grainOverlayColor = vec3(step(0., grainOverlayV)); 4584 float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV); 4585 grainOverlayStrength = pow(grainOverlayStrength, .8); 4586 color = mix(color, grainOverlayColor, .5 * grainOverlayStrength); 4587 4588 opacity += .5 * grainOverlayStrength; 4589 opacity = clamp(opacity, 0., 1.); 4590 4591 fragColor = vec4(color, opacity); 4592} 4593`,pa={classic:0,gooey:1,holes:2,soft:3},da={square:0,hex:1},ga=`#version 300 es 4594precision mediump float; 4595 4596uniform sampler2D u_image; 4597uniform float u_imageAspectRatio; 4598 4599uniform vec4 u_colorBack; 4600uniform vec4 u_colorC; 4601uniform vec4 u_colorM; 4602uniform vec4 u_colorY; 4603uniform vec4 u_colorK; 4604uniform float u_size; 4605uniform float u_minDot; 4606uniform float u_contrast; 4607uniform float u_grainSize; 4608uniform float u_grainMixer; 4609uniform float u_grainOverlay; 4610uniform float u_gridNoise; 4611uniform float u_softness; 4612uniform float u_floodC; 4613uniform float u_floodM; 4614uniform float u_floodY; 4615uniform float u_floodK; 4616uniform float u_gainC; 4617uniform float u_gainM; 4618uniform float u_gainY; 4619uniform float u_gainK; 4620uniform float u_type; 4621uniform sampler2D u_noiseTexture; 4622 4623in vec2 v_imageUV; 4624out vec4 fragColor; 4625 4626const float shiftC = -.5; 4627const float shiftM = -.25; 4628const float shiftY = .2; 4629const float shiftK = 0.; 4630 4631// Precomputed sin/cos for rotation angles (15°, 75°, 0°, 45°) 4632const float cosC = 0.9659258; const float sinC = 0.2588190; // 15° 4633const float cosM = 0.2588190; const float sinM = 0.9659258; // 75° 4634const float cosY = 1.0; const float sinY = 0.0; // 0° 4635const float cosK = 0.7071068; const float sinK = 0.7071068; // 45° 4636 4637${X} 4638 4639vec2 randomRG(vec2 p) { 4640 vec2 uv = floor(p) / 100. + .5; 4641 return texture(u_noiseTexture, fract(uv)).rg; 4642} 4643vec3 hash23(vec2 p) { 4644 vec3 p3 = fract(vec3(p.xyx) * vec3(0.3183099, 0.3678794, 0.3141592)) + 0.1; 4645 p3 += dot(p3, p3.yzx + 19.19); 4646 return fract(vec3(p3.x * p3.y, p3.y * p3.z, p3.z * p3.x)); 4647} 4648 4649float sst(float edge0, float edge1, float x) { 4650 return smoothstep(edge0, edge1, x); 4651} 4652 4653vec3 valueNoise3(vec2 st) { 4654 vec2 i = floor(st); 4655 vec2 f = fract(st); 4656 vec3 a = hash23(i); 4657 vec3 b = hash23(i + vec2(1.0, 0.0)); 4658 vec3 c = hash23(i + vec2(0.0, 1.0)); 4659 vec3 d = hash23(i + vec2(1.0, 1.0)); 4660 vec2 u = f * f * (3.0 - 2.0 * f); 4661 vec3 x1 = mix(a, b, u.x); 4662 vec3 x2 = mix(c, d, u.x); 4663 return mix(x1, x2, u.y); 4664} 4665 4666float getUvFrame(vec2 uv, vec2 pad) { 4667 float left = smoothstep(-pad.x, 0., uv.x); 4668 float right = smoothstep(1. + pad.x, 1., uv.x); 4669 float bottom = smoothstep(-pad.y, 0., uv.y); 4670 float top = smoothstep(1. + pad.y, 1., uv.y); 4671 4672 return left * right * bottom * top; 4673} 4674 4675vec4 RGBAtoCMYK(vec4 rgba) { 4676 float k = 1. - max(max(rgba.r, rgba.g), rgba.b); 4677 float denom = 1. - k; 4678 vec3 cmy = vec3(0.); 4679 if (denom > 1e-5) { 4680 cmy = (1. - rgba.rgb - vec3(k)) / denom; 4681 } 4682 return vec4(cmy, k) * rgba.a; 4683} 4684 4685vec3 applyContrast(vec3 rgb) { 4686 return clamp((rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0); 4687} 4688 4689// Single-component CMYK extractors with contrast built-in, alpha-aware 4690float getCyan(vec4 rgba) { 4691 vec3 c = clamp((rgba.rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0); 4692 float maxRGB = max(max(c.r, c.g), c.b); 4693 return (maxRGB > 1e-5 ? (maxRGB - c.r) / maxRGB : 0.) * rgba.a; 4694} 4695float getMagenta(vec4 rgba) { 4696 vec3 c = clamp((rgba.rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0); 4697 float maxRGB = max(max(c.r, c.g), c.b); 4698 return (maxRGB > 1e-5 ? (maxRGB - c.g) / maxRGB : 0.) * rgba.a; 4699} 4700float getYellow(vec4 rgba) { 4701 vec3 c = clamp((rgba.rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0); 4702 float maxRGB = max(max(c.r, c.g), c.b); 4703 return (maxRGB > 1e-5 ? (maxRGB - c.b) / maxRGB : 0.) * rgba.a; 4704} 4705float getBlack(vec4 rgba) { 4706 vec3 c = clamp((rgba.rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0); 4707 return (1. - max(max(c.r, c.g), c.b)) * rgba.a; 4708} 4709 4710vec2 cellCenterPos(vec2 uv, vec2 cellOffset, float channelIdx) { 4711 vec2 cellCenter = floor(uv) + .5 + cellOffset; 4712 return cellCenter + (randomRG(cellCenter + channelIdx * 50.) - .5) * u_gridNoise; 4713} 4714 4715vec2 gridToImageUV(vec2 cellCenter, float cosA, float sinA, float shift, vec2 pad) { 4716 vec2 uvGrid = mat2(cosA, -sinA, sinA, cosA) * (cellCenter - shift); 4717 return uvGrid * pad + 0.5; 4718} 4719 4720void colorMask(vec2 pos, vec2 cellCenter, float rad, float transparency, float grain, float channelAddon, float channelgain, float generalComp, bool isJoined, inout float outMask) { 4721 float dist = length(pos - cellCenter); 4722 4723 float radius = rad; 4724 radius *= (1. + generalComp); 4725 radius += (.15 + channelgain * radius); 4726 radius = max(0., radius); 4727 radius = mix(0., radius, transparency); 4728 radius += channelAddon; 4729 radius *= (1. - grain); 4730 4731 float mask = 1. - sst(0., radius, dist); 4732 if (isJoined) { 4733 // ink or sharp (joined) 4734 mask = pow(mask, 1.2); 4735 } else { 4736 // dots (separate) 4737 mask = sst(.5 - .5 * u_softness, .51 + .49 * u_softness, mask); 4738 } 4739 4740 mask *= mix(1., mix(.5, 1., 1.5 * radius), u_softness); 4741 outMask += mask; 4742} 4743 4744vec3 applyInk(vec3 paper, vec3 inkColor, float cov) { 4745 vec3 inkEffect = mix(vec3(1.0), inkColor, clamp(cov, 0.0, 1.0)); 4746 return paper * inkEffect; 4747} 4748 4749void main() { 4750 vec2 uv = v_imageUV; 4751 4752 float cellsPerSide = mix(400.0, 7.0, pow(u_size, 0.7)); 4753 float cellSizeY = 1.0 / cellsPerSide; 4754 vec2 pad = cellSizeY * vec2(1.0 / u_imageAspectRatio, 1.0); 4755 vec2 uvGrid = (uv - .5) / pad; 4756 float insideImageBox = getUvFrame(uv, pad); 4757 4758 float generalComp = .1 * u_softness + .1 * u_gridNoise + .1 * (1. - step(0.5, u_type)) * (1.5 - u_softness); 4759 4760 vec2 uvC = mat2(cosC, sinC, -sinC, cosC) * uvGrid + shiftC; 4761 vec2 uvM = mat2(cosM, sinM, -sinM, cosM) * uvGrid + shiftM; 4762 vec2 uvY = mat2(cosY, sinY, -sinY, cosY) * uvGrid + shiftY; 4763 vec2 uvK = mat2(cosK, sinK, -sinK, cosK) * uvGrid + shiftK; 4764 4765 vec2 grainSize = mix(2000., 200., u_grainSize) * vec2(1., 1. / u_imageAspectRatio); 4766 vec2 grainUV = (v_imageUV - .5) * grainSize + .5; 4767 vec3 noiseValues = valueNoise3(grainUV); 4768 float grain = sst(.55, 1., noiseValues.r); 4769 grain *= u_grainMixer; 4770 4771 vec4 outMask = vec4(0.); 4772 bool isJoined = u_type > 0.5; 4773 4774 if (u_type < 1.5) { 4775 // dots or ink: per-cell color sampling 4776 for (int dy = -1; dy <= 1; dy++) { 4777 for (int dx = -1; dx <= 1; dx++) { 4778 vec2 cellOffset = vec2(float(dx), float(dy)); 4779 4780 vec2 cellCenterC = cellCenterPos(uvC, cellOffset, 0.); 4781 vec4 texC = texture(u_image, gridToImageUV(cellCenterC, cosC, sinC, shiftC, pad)); 4782 colorMask(uvC, cellCenterC, getCyan(texC), insideImageBox * texC.a, grain, u_floodC, u_gainC, generalComp, isJoined, outMask[0]); 4783 4784 vec2 cellCenterM = cellCenterPos(uvM, cellOffset, 1.); 4785 vec4 texM = texture(u_image, gridToImageUV(cellCenterM, cosM, sinM, shiftM, pad)); 4786 colorMask(uvM, cellCenterM, getMagenta(texM), insideImageBox * texM.a, grain, u_floodM, u_gainM, generalComp, isJoined, outMask[1]); 4787
4788 vec2 cellCenterY = cellCenterPos(uvY, cellOffset, 2.); 4789 vec4 texY = texture(u_image, gridToImageUV(cellCenterY, cosY, sinY, shiftY, pad)); 4790 colorMask(uvY, cellCenterY, getYellow(texY), insideImageBox * texY.a, grain, u_floodY, u_gainY, generalComp, isJoined, outMask[2]); 4791 4792 vec2 cellCenterK = cellCenterPos(uvK, cellOffset, 3.); 4793 vec4 texK = texture(u_image, gridToImageUV(cellCenterK, cosK, sinK, shiftK, pad)); 4794 colorMask(uvK, cellCenterK, getBlack(texK), insideImageBox * texK.a, grain, u_floodK, u_gainK, generalComp, isJoined, outMask[3]); 4795 } 4796 } 4797 } else { 4798 // sharp: direct px color sampling 4799 vec4 tex = texture(u_image, uv); 4800 tex.rgb = applyContrast(tex.rgb); 4801 insideImageBox *= tex.a; 4802 vec4 cmykOriginal = RGBAtoCMYK(tex); 4803 for (int dy = -1; dy <= 1; dy++) { 4804 for (int dx = -1; dx <= 1; dx++) { 4805 vec2 cellOffset = vec2(float(dx), float(dy)); 4806 4807 colorMask(uvC, cellCenterPos(uvC, cellOffset, 0.), cmykOriginal.x, insideImageBox, grain, u_floodC, u_gainC, generalComp, isJoined, outMask[0]); 4808 colorMask(uvM, cellCenterPos(uvM, cellOffset, 1.), cmykOriginal.y, insideImageBox, grain, u_floodM, u_gainM, generalComp, isJoined, outMask[1]); 4809 colorMask(uvY, cellCenterPos(uvY, cellOffset, 2.), cmykOriginal.z, insideImageBox, grain, u_floodY, u_gainY, generalComp, isJoined, outMask[2]); 4810 colorMask(uvK, cellCenterPos(uvK, cellOffset, 3.), cmykOriginal.w, insideImageBox, grain, u_floodK, u_gainK, generalComp, isJoined, outMask[3]); 4811 } 4812 } 4813 } 4814 4815 float shape; 4816 4817 float C = outMask[0]; 4818 float M = outMask[1]; 4819 float Y = outMask[2]; 4820 float K = outMask[3]; 4821 4822 if (isJoined) { 4823 // ink or sharp: apply threshold for joined dots 4824 float th = .5; 4825 float sLeft = th * u_softness; 4826 float sRight = (1. - th) * u_softness + .01; 4827 C = smoothstep(th - sLeft - fwidth(C), th + sRight, C); 4828 M = smoothstep(th - sLeft - fwidth(M), th + sRight, M); 4829 Y = smoothstep(th - sLeft - fwidth(Y), th + sRight, Y); 4830 K = smoothstep(th - sLeft - fwidth(K), th + sRight, K); 4831 } 4832 4833 C *= u_colorC.a; 4834 M *= u_colorM.a; 4835 Y *= u_colorY.a; 4836 K *= u_colorK.a; 4837 4838 vec3 ink = vec3(1.); 4839 ink = applyInk(ink, u_colorK.rgb, K); 4840 ink = applyInk(ink, u_colorC.rgb, C); 4841 ink = applyInk(ink, u_colorM.rgb, M); 4842 ink = applyInk(ink, u_colorY.rgb, Y); 4843 4844 shape = clamp(max(max(C, M), max(Y, K)), 0., 1.); 4845 4846 vec3 color = u_colorBack.rgb * u_colorBack.a; 4847 4848 float opacity = u_colorBack.a; 4849 color = mix(color, ink, shape); 4850 opacity += shape; 4851 opacity = clamp(opacity, 0., 1.); 4852 4853 float grainOverlay = mix(noiseValues.g, noiseValues.b, .5); 4854 grainOverlay = pow(grainOverlay, 1.3); 4855 4856 float grainOverlayV = grainOverlay * 2. - 1.; 4857 vec3 grainOverlayColor = vec3(step(0., grainOverlayV)); 4858 float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV); 4859 grainOverlayStrength = pow(grainOverlayStrength, .8); 4860 color = mix(color, grainOverlayColor, .5 * grainOverlayStrength); 4861 4862 opacity += .5 * grainOverlayStrength; 4863 opacity = clamp(opacity, 0., 1.); 4864 4865 fragColor = vec4(color, opacity); 4866} 4867`,ha={dots:0,ink:1,sharp:2},uo={maxColorCount:6},va=`#version 300 es 4868precision mediump float; 4869 4870in mediump vec2 v_imageUV; 4871in mediump vec2 v_objectUV; 4872in mediump vec2 v_responsiveUV; 4873in mediump vec2 v_responsiveBoxGivenSize; 4874out vec4 fragColor; 4875 4876// Image 4877uniform sampler2D u_image; 4878uniform float u_imageAspectRatio; 4879 4880// Canvas 4881uniform vec2 u_resolution; 4882uniform float u_time; 4883 4884// Colors 4885uniform vec4 u_colors[${uo.maxColorCount}]; 4886uniform float u_colorsCount; 4887uniform vec4 u_colorBack; 4888uniform vec4 u_colorInner; 4889 4890// Effect controls 4891uniform float u_innerDistortion; 4892uniform float u_outerDistortion; 4893uniform float u_outerGlow; 4894uniform float u_innerGlow; 4895uniform float u_offset; 4896uniform float u_angle; 4897uniform float u_size; 4898 4899// Shape controls 4900uniform float u_shape; 4901uniform bool u_isImage; 4902 4903${X} 4904${Be} 4905 4906// 9x9 Gaussian blur on R and G channels 4907vec2 gaussBlur9x9RG(sampler2D tex, vec2 uv, vec2 dudx, vec2 dudy, float radius) { 4908 vec2 texel = 1.0 / vec2(textureSize(tex, 0)); 4909 vec2 r = max(radius, 0.0) * texel; 4910 // Pascal's row 8: sum = 256, 2D norm = 65536 4911 const float k[9] = float[9](1.0, 8.0, 28.0, 56.0, 70.0, 56.0, 28.0, 8.0, 1.0); 4912 vec2 sum = vec2(0.0); 4913
4914 for (int j = -4; j <= 4; ++j) { 4915 float wy = k[j + 4]; 4916 for (int i = -4; i <= 4; ++i) { 4917 float w = k[i + 4] * wy; 4918 vec2 off = vec2(float(i) * r.x, float(j) * r.y); 4919 sum += w * texture(tex, uv + off).rg; 4920 } 4921 } 4922 4923 return sum / 65536.0; 4924} 4925 4926float sst(float a, float b, float x) { 4927 return smoothstep(a, b, x); 4928} 4929 4930void main() { 4931 float time = u_time; 4932 4933 float roundness = 0.; 4934 float imgAlpha = 0.; 4935 4936 if (u_isImage == true) { 4937 // Image sampling (UV scaled inward to account for padding) 4938 vec2 imageUV = v_imageUV; 4939 imageUV -= .5; 4940 imageUV *= .95; 4941 imageUV += .5; 4942 4943 vec2 dudx = dFdx(v_imageUV); 4944 vec2 dudy = dFdy(v_imageUV); 4945 4946 // Blurred image: x = roundness, y = alpha 4947 vec2 blurred = gaussBlur9x9RG(u_image, imageUV, dudx, dudy, 10.); 4948 roundness = 1. - blurred.x; 4949 vec2 texelA = 1.0 / vec2(textureSize(u_image, 0)); 4950 const float k3[3] = float[3](1.0, 2.0, 1.0); 4951 for (int j = -1; j <= 1; ++j) { 4952 for (int i = -1; i <= 1; ++i) { 4953 imgAlpha += k3[i + 1] * k3[j + 1] * texture(u_image, imageUV + vec2(float(i) * texelA.x, float(j) * texelA.y)).g; 4954 } 4955 } 4956 imgAlpha /= 16.0; 4957 } else { 4958 vec2 uv = v_objectUV + .5; 4959 uv.y = 1. - uv.y; 4960 float edge = 0.; 4961 4962 if (u_shape < 1.) { 4963 // full-fill on canvas 4964 vec2 borderUV = v_responsiveUV + .5; 4965 vec2 mask = min(borderUV, 1. - borderUV); 4966 vec2 pixel_thickness = min(250. / v_responsiveBoxGivenSize, vec2(.5)); 4967 float maskX = smoothstep(0.0, pixel_thickness.x, mask.x); 4968 float maskY = smoothstep(0.0, pixel_thickness.y, mask.y); 4969 maskX = pow(maskX, .25); 4970 maskY = pow(maskY, .25); 4971 edge = clamp(1. - maskX * maskY, 0., 1.); 4972 } else if (u_shape < 2.) { 4973 // circle 4974 vec2 shapeUV = uv - .5; 4975 shapeUV *= .67; 4976 edge = pow(clamp(3. * length(shapeUV), 0., 1.), 18.); 4977 } else if (u_shape < 3.) { 4978 // daisy 4979 vec2 shapeUV = uv - .5; 4980 shapeUV *= 1.68; 4981 4982 float r = length(shapeUV) * 2.; 4983 float a = atan(shapeUV.y, shapeUV.x) + .2; 4984 r *= (1. + .05 * sin(3. * a + 2. * time)); 4985 float f = abs(cos(a * 3.)); 4986 edge = smoothstep(f, f + .7, r); 4987 edge *= edge; 4988 } else if (u_shape < 4.) { 4989 // diamond 4990 vec2 shapeUV = uv - .5; 4991 shapeUV = rotate(shapeUV, .25 * PI); 4992 shapeUV *= 1.42; 4993 shapeUV += .5; 4994 vec2 mask = min(shapeUV, 1. - shapeUV); 4995 vec2 pixel_thickness = vec2(.15); 4996 float maskX = smoothstep(0.0, pixel_thickness.x, mask.x); 4997 float maskY = smoothstep(0.0, pixel_thickness.y, mask.y); 4998 maskX = pow(maskX, .25); 4999 maskY = pow(maskY, .25); 5000 edge = clamp(1. - maskX * maskY, 0., 1.); 5001 } else if (u_shape < 5.) { 5002 // metaballs 5003 vec2 shapeUV = uv - .5; 5004 shapeUV *= 1.3; 5005 edge = 0.; 5006 for (int i = 0; i < 5; i++) { 5007 float fi = float(i); 5008 float speed = 1.5 + 2./3. * sin(fi * 12.345); 5009 float angle = -fi * 1.5; 5010 vec2 dir1 = vec2(cos(angle), sin(angle)); 5011 vec2 dir2 = vec2(cos(angle + 1.57), sin(angle + 1.)); 5012 vec2 traj = .4 * (dir1 * sin(time * speed + fi * 1.23) + dir2 * cos(time * (speed * 0.7) + fi * 2.17)); 5013 float d = length(shapeUV + traj); 5014 edge += pow(1.0 - clamp(d, 0.0, 1.0), 4.0); 5015 } 5016 edge = 1. - smoothstep(.65, .9, edge); 5017 edge = pow(edge, 4.); 5018 } 5019 5020 imgAlpha = 1. - smoothstep(.9 - 2. * fwidth(edge), .9, edge); 5021 roundness = 1. - edge; 5022 } 5023 5024// Smoke UV setup 5025 vec2 smokeUV = v_objectUV; 5026 smokeUV = rotate(smokeUV, u_angle * PI / 180.); 5027 smokeUV *= mix(4., 1., u_size); 5028 5029 // Two swirl paths: inner (shape-masked) and outer (free), each with independent distortion 5030 vec2 innerUV = smokeUV; 5031 vec2 outerUV = smokeUV; 5032 5033 // Vertical displacement — applied independently to inner and outer 5034 innerUV.y += u_innerDistortion * (1. - sst(0., 1., length(.4 * innerUV))); 5035 innerUV.y -= .4 * u_innerDistortion; 5036 innerUV.y += .7 * u_offset * roundness; 5037 5038 outerUV.y += u_outerDistortion * (1. - sst(0., 1., length(.4 * outerUV))); 5039 outerUV.y -= .4 * u_outerDistortion; 5040 5041 float innerSwirl = u_innerDistortion * roundness; 5042 float outerSwirl = u_outerDistortion; 5043 5044 for (int i = 1; i < 5; i++) { 5045 float fi = float(i); 5046 5047 float stretchIn = max(length(dFdx(innerUV)), length(dFdy(innerUV))); 5048 float dampenIn = 1. / (1. + stretchIn * 8.); 5049 float sIn = innerSwirl * dampenIn; 5050 innerUV.x += sIn / fi * cos(time + fi * 2.9 * innerUV.y); 5051 innerUV.y += sIn / fi * cos(time + fi * 1.5 * innerUV.x); 5052 5053 float stretchOut = max(length(dFdx(outerUV)), length(dFdy(outerUV))); 5054 float dampenOut = 1. / (1. + stretchOut * 8.); 5055 float sOut = outerSwirl * dampenOut; 5056 outerUV.x += sOut / fi * cos(time + fi * 2.9 * outerUV.y); 5057 outerUV.y += sOut / fi * cos(time + fi * 1.5 * outerUV.x); 5058 } 5059 5060 // Smoke shapes from swirl fields 5061 float innerShape = exp(-1.5 * dot(innerUV, innerUV)); 5062 float outerShape = exp(-1.5 * dot(outerUV, outerUV)); 5063 5064 // Visibility masks 5065 float outerMask = pow(u_outerGlow, 2.) * (1. - imgAlpha); 5066 float innerMask = (.01 + .99 * u_innerGlow) * imgAlpha; 5067 5068 innerShape *= innerMask; 5069 outerShape *= outerMask; 5070 5071 // Color gradient 5072 float mixer = (innerShape + outerShape) * u_colorsCount; 5073 vec4 gradient = u_colors[0]; 5074 gradient.rgb *= gradient.a; 5075 5076 float smokeMask = 0.; 5077 for (int i = 1; i < ${uo.maxColorCount+1}; i++) { 5078 if (i > int(u_colorsCount)) break; 5079 5080 float m = sst(0., 1., clamp(mixer - float(i - 1), 0., 1.)); 5081 if (i == 1) smokeMask = m; 5082 5083 vec4 c = u_colors[i - 1]; 5084 c.rgb *= c.a; 5085 gradient = mix(gradient, c, m); 5086 } 5087 5088 // Compositing (premultiplied alpha, front-to-back) 5089 vec3 color = gradient.rgb * smokeMask; 5090 float opacity = gradient.a * smokeMask; 5091 5092 float innerOpacity = u_colorInner.a * imgAlpha; 5093 vec3 innerColor = u_colorInner.rgb * innerOpacity; 5094 color += innerColor * (1.0 - opacity); 5095 opacity += innerOpacity * (1.0 - opacity); 5096 5097 vec3 backColor = u_colorBack.rgb * u_colorBack.a; 5098 color += backColor * (1.0 - opacity); 5099 opacity += u_colorBack.a * (1.0 - opacity); 5100 5101 fragColor = vec4(color, opacity); 5102} 5103`,xo={workingSize:512,iterations:32};function mo(o){const e=document.createElement("canvas"),r=e.getContext("2d"),t=typeof o=="str
5103ing"&&o.startsWith("blob:");return new Promise((f,i)=>{if(!o||!r){i(new Error("Invalid file or canvas context"));return}const s=t&&fetch(o).then(p=>p.headers.get("Content-Type")),a=new Image;a.crossOrigin="anonymous",performance.now(),a.onload=async()=>{let p;const l=await s;l?p=l==="image/svg+xml":typeof o=="string"?p=o.endsWith(".svg")||o.startsWith("data:image/svg+xml"):p=o.type==="image/svg+xml";let m=a.width||a.naturalWidth,u=a.height||a.naturalHeight;if(p){const re=m/u;m>u?(m=4096,u=4096/re):(u=4096,m=4096*re),a.width=m,a.height=u}const h=Math.min(m,u),g=xo.workingSize/h,n=Math.round(m*g),c=Math.round(u*g);e.width=m,e.height=u;const d=.025,x=Math.ceil(n*d),w=Math.ceil(c*d),v=n-2*x,y=c-2*w,A=document.createElement("canvas");A.width=n,A.height=c;const U=A.getContext("2d");U.drawImage(a,x,w,v,y),performance.now();const R=U.getImageData(0,0,n,c).data,B=new Uint8Array(n*c),F=new Uint8Array(n*c);for(let M=0,re=0;M<R.length;M+=4,re++){const Se=R[M+3]===0?0:1;B[re]=Se}const H=[],N=[];for(let M=0;M<c;M++)for(let re=0;re<n;re++){const me=M*n+re;if(!B[me])continue;let Se=!1;re===0||re===n-1||M===0||M===c-1?Se=!0:Se=!B[me-1]||!B[me+1]||!B[me-n]||!B[me+n]||!B[me-n-1]||!B[me-n+1]||!B[me+n-1]||!B[me+n+1],Se?(F[me]=1,H.push(me)):N.push(me)}const te=_a(B,F,new Uint32Array(N),new Uint32Array(H),n,c);performance.now();const G=xa(te,B,F,n,c);let Q=0,ke;for(let M=0;M<N.length;M++){const re=N[M];G[re]>Q&&(Q=G[re])}const Ve=document.createElement("canvas");Ve.width=n,Ve.height=c;const Re=Ve.getContext("2d"),V=Re.createImageData(n,c);for(let M=0;M<c;M++)for(let re=0;re<n;re++){const me=M*n+re,Se=me*4;if(!B[me])V.data[Se]=255,V.data[Se+1]=255,V.data[Se+2]=255,V.data[Se+3]=0;else{let Ge=255*(1-G[me]/Q);V.data[Se]=Ge,V.data[Se+1]=Ge,V.data[Se+2]=Ge,V.data[Se+3]=255}}Re.putImageData(V,0,0),r.imageSmoothingEnabled=!0,r.imageSmoothingQuality="high",r.drawImage(Ve,0,0,n,c,0,0,m,u);const z=r.getImageData(0,0,m,u),$=Math.ceil(m*d),xe=Math.ceil(u*d),Ee=document.createElement("canvas");Ee.width=m,Ee.height=u;const Me=Ee.getContext("2d");Me.drawImage(a,$,xe,m-2*$,u-2*xe);const yo=Me.getImageData(0,0,m,u);for(let M=0;M<z.data.length;M+=4){const re=yo.data[M+3],me=z.data[M+3];re===0?(z.data[M]=255,z.data[M+1]=0):(z.data[M]=me===0?0:z.data[M],z.data[M+1]=re),z.data[M+2]=255,z.data[M+3]=255}r.putImageData(z,0,0),ke=z,e.toBlob(M=>{if(!M){i(new Error("Failed to create PNG blob"));return}f({imageData:ke,pngBlob:M})},"image/png")},a.onerror=()=>i(new Error("Failed to load image")),a.src=typeof o=="string"?o:URL.createObjectURL(o)})}function _a(o,e,r,t,f,i){const s=r.length,a=new Int32Array(s*4);for(let p=0;p<s;p++){const l=r[p],m=l%f,u=Math.floor(l/f);a[p*4+0]=m<f-1&&o[l+1]?l+1:-1,a[p*4+1]=m>0&&o[l-1]?l-1:-1,a[p*4+2]=u>0&&o[l-f]?l-f:-1,a[p*4+3]=u<i-1&&o[l+f]?l+f:-1}return{interiorPixels:r,boundaryPixels:t,pixelCount:s,neighborIndices:a}}function xa(o,e,r,t,f){const i=xo.iterations,s=.01,a=new Float32Array(t*f),{interiorPixels:p,neighborIndices:l,pixelCount:m}=o;performance.now();const u=1.9,h=[],_=[];for(let n=0;n<m;n++){const c=p[n],d=c%t,x=Math.floor(c/t);(d+x)%2===0?h.push(n):_.push(n)}for(let n=0;n<i;n++){for(const c of h){const d=p[c],x=l[c*4+0],w=l[c*4+1],v=l[c*4+2],y=l[c*4+3];let A=0;x>=0&&(A+=a[x]),w>=0&&(A+=a[w]),v>=0&&(A+=a[v]),y>=0&&(A+=a[y]);const U=(s+A)/4;a[d]=u*U+(1-u)*a[d]}for(const c of _){const d=p[c],x=l[c*4+0],w=l[c*4+1],v=l[c*4+2],y=l[c*4+3];let A=0;x>=0&&(A+=a[x]),w>=0&&(A+=a[w]),v>=0&&(A+=a[v]),y>=0&&(A+=a[y]);const U=(s+A)/4;a[d]=u*U+(1-u)*a[d]}}const g=new Float32Array(t*f);for(let n=0;n<3;n++){g.set(a);for(let c=0;c<m;c++){const d=p[c],x=l[c*4+0],w=l[c*4+1],v=l[c*4+2],y=l[c*4+3];let A=0,U=0;x>=0&&(A+=g[x],U++),w>=0&&(A+=g[w],U++),v>=0&&(A+=g[v],U++),y>=0&&(A+=g[y],U++),a[d]=U>0?(g[d]+A/U)*.5:g[d]}}return a}const ya={none:0,circle:1,daisy:2,diamond:3,metaballs:4};function C(o){if(Array.isArray(o))return o.length===4?o:o.length===3?[...o,1]:He;if(typeof o!="string")return He;let e,r,t,f=1;if(o.startsWith("#"))[e,r,t,f]=wa(o);else if(o.startsWith("rgb"))[e,r,t,f]=ba(o);else if(o.startsWith("hsl"))[e,r,t,f]=Ca(Aa(o));else return console.error("Unsupported color format",o),He;return[De(e,0,1),De(r,0,1),De(t,0,1),De(f,0,1)]}function wa(o){o=o.replace(/^#/,""),o.length===3&&(o=o.split("").map(i=>i+i).join("")),o.length===6&&(o=o+"ff");const e=parseInt(o.slice(0,2),16)/255,r=parseInt(o.slice(2,4),16)/255,t=parseInt(o.slice(4,6),16)/255,f=parseInt(o.slice(6,8),16)/255;return[e,r,t,f]}function ba(o){const e=o.match(/^rgba?\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*(?:,\s*([0-9.]+))?\s*\)$/i);return e?[parseInt(e[1]??"0")/255,parseInt(e[2]??"0")/255,parseInt(e[3]??"0")/255,e[4]===void 0?1:parseFloat(e[4])]:[0,0,0,1]}function Aa(o){const e=o.match(/^hsla?\s*\(\s*(\d+)\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(?:,\s*([0-9.]+))?\s*\)$/i);return e?[parseInt(e[1]??"0"),parseInt(e[2]??"0"),parseInt(e[3]??"0"),e[4]===void 0?1:parseFloat(e[4])]:[0,0,0,1]}function Ca(o){const[e,r,t,f]=o,i=e/360,s=r/100,a=t/100;let p,l,m;if(r===0)p=l=m=a;else{const u=(g,n,c)=>(c<0&&(c+=1),c>
51031&&(c-=1),c<.16666666666666666?g+(n-g)*6*c:c<.5?n:c<.6666666666666666?g+(n-g)*(.6666666666666666-c)*6:g),h=a<.5?a*(1+s):a+s-a*s,_=2*a-h;p=u(_,h,i+1/3),l=u(_,h,i),m=u(_,h,i-1/3)}return[p,l,m,f]}const De=(o,e,r)=>Math.min(Math.max(o,e),r),He=[0,0,0,1];function Ie(){if(typeof window>"u")return;const o=new Image;return o.src=Ba,o}const Ba=
vendor: 23,248 bytes, line 5103
5103"data:image/png;base64,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"
5103,Sa="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==";function ka(o){const e=k.useRef(void 0),r=k.useCallback(t=>{const f=o.map(i=>{if(i!=null){if(typeof i=="function"){const s=i,a=s(t);return typeof a=="function"?a:()=>{s(null)}}return i.current=t,()=>{i.current=null}}});return()=>{f.forEach(i=>i==null?void 0:i())}},o);return k.useMemo(()=>o.every(t=>t==null)?null:t=>{e.current&&(e.current(),e.current=void 0),t!=null&&(e.current=r(t))},o)}function po(o){if(o.naturalWidth<1024&&o.naturalHeight<1024){if(o.naturalWidth<1||o.naturalHeight<1)return;const e=o.naturalWidth/o.naturalHeight;o.width=Math.round(e>1?1024*e:1024),o.height=Math.round(e>1?1024:1024/e)}}async function go(o){const e={},r=[],t=i=>{try{return i.startsWith("/")||new URL(i),!0}catch{return!1}},f=i=>{try{return i.startsWith("/")?!1:new URL(i,window.location.origin).origin!==window.location.origin}catch{return!1}};return Object.entries(o).forEach(([i,s])=>{if(typeof s=="string"){const a=s||Sa;if(!t(a)){console.warn(`Uniform "${i}" has invalid URL "${a}". Skipping image loading.`);return}const p=new Promise((l,m)=>{const u=new Image;f(a)&&(u.crossOrigin="anonymous"),u.onload=()=>{po(u),e[i]=u,l()},u.onerror=()=>{console.error(`Could not set uniforms. Failed to load image at ${a}`),m()},u.src=a});r.push(p)}else s instanceof HTMLImageElement&&po(s),e[i]=s}),await Promise.all(r),e}const Y=k.forwardRef(function({fragmentShader:e,uniforms:r,webGlContextAttributes:t,speed:f=0,frame:i=0,width:s,height:a,minPixelRatio:p,maxPixelCount:l,mipmaps:m,style:u,...h},_){const[g,n]=k.useState(!1),c=k.useRef(null),d=k.useRef(null),x=k.useRef(t);k.useEffect(()=>((async()=>{const y=await go(r);c.current&&!d.current&&(d.current=new Co(c.current,e,y,x.current,f,i,p,l,m),n(!0))})(),()=>{var y;(y=d.current)==null||y.dispose(),d.current=null}),[e]),k.useEffect(()=>{let v=!1;return(async()=>{var U;const A=await go(r);v||(U=d.current)==null||U.setUniforms(A)})(),()=>{v=!0}},[r,g]),k.useEffect(()=>{var v;(v=d.current)==null||v.setSpeed(f)},[f,g]),k.useEffect(()=>{var v;(v=d.current)==null||v.setMaxPixelCount(l)},[l,g]),k.useEffect(()=>{var v;(v=d.current)==null||v.setMinPixelRatio(p)},[p,g]),k.useEffect(()=>{var v;(v=d.current)==null||v.setFrame(i)},[i,g]);const w=ka([c,_]);return D.jsx("div",{ref:w,style:s!==void 0||a!==void 0?{width:typeof s=="string"&&isNaN(+s)===!1?+s:s,height:typeof a=="string"&&isNaN(+a)===!1?+a:a,...u}:u,...h})});Y.displayName="ShaderMount";function j(o,e){var r,t,f;for(const i in o){if(i==="colors"){const s=Array.isArray(o.colors),a=Array.isArray(e.colors);if(!s||!a){if(Object.is(o.colors,e.colors)===!1)return!1;continue}if(((r=o.colors)==null?void 0:r.length)!==((t=e.colors)==null?void 0:t.length)||!((f=o.colors)!=null&&f.every((p,l)=>{var m;return p===((m=e.colors)==null?void 0:m[l])})))return!1;continue}if(Object.is(o[i],e[i])===!1)return!1}return!0}const ye={name:"Default",params:{...b,speed:1,frame:0,colors:["#e0eaff","#241d9a","#f75092","#9f50d3"],distortion:.8,swirl:.1,grainMixer:0,grainOverlay:0}},Ua={name:"Purple",params:{...b,speed:.6,frame:0,colors:["#aaa7d7","#3c2b8e"],distortion:1,swirl:1,grainMixer:0,grainOverlay:0}},Va={name:"Beach",params:{...b,speed:.1,frame:0,colors:["#bcecf6","#00aaff","#00f7ff","#ffd447"],distortion:.8,swirl:.35,grainMixer:0,grainOverlay:0}},Ia={name:"Ink",params:{...b,speed:1,frame:0,colors:["#ffffff","#000000"],distortion:1,swirl:.2,rotation:90,grainMixer:0,grainOverlay:0}},xr=[ye,Ia,Ua,Va],yr=k.memo(function({speed:e=ye.params.speed,frame:r=ye.params.frame,colors:t=ye.params.colors,distortion:f=ye.params.distortion,swirl:i=ye.params.swirl,grainMixer:s=ye.params.grainMixer,grainOverlay:a=ye.params.grainOverlay,fit:p=ye.params.fit,rotation:l=ye.params.rotation,scale:m=ye.params.scale,originX:u=ye.params.originX,originY:h=ye.params.originY,offsetX:_=ye.params.offsetX,offsetY:g=ye.params.offsetY,worldWidth:n=ye.params.worldWidth,worldHeight:c=ye.params.worldHeight,...d}){const x={u_colors:t.map(C),u_colorsCount:t.length,u_distortion:f,u_swirl:i,u_grainMixer:s,u_grainOverlay:a,u_fit:T[p],u_rotation:l,u_scale:m,u_offsetX:_,u_offsetY:g,u_originX:u,u_originY:h,u_worldWidth:n,u_worldHeight:c};return D.jsx(Y,{...d,speed:e,frame:r,fragmentShader:Io,uniforms:x})},j),pe={name:"Default",params:{...b,speed:.5,frame:0,colorBack:"#000000",colors:["#ffffff"],noiseScale:3,noiseIterations:8,radiu
5103s:.25,thickness:.65,innerShape:.7,scale:.8}},Ra={name:"Solar",params:{...b,speed:1,frame:0,colorBack:"#000000",colors:["#ffffff","#ffca0a","#fc6203","#fc620366"],noiseScale:2,noiseIterations:3,radius:.4,thickness:.8,innerShape:4,scale:2,offsetY:1}},Fa={name:"Line",params:{...b,frame:0,colorBack:"#000000",colors:["#4540a4","#1fe8ff"],noiseScale:1.1,noiseIterations:2,radius:.38,thickness:.01,innerShape:.88,speed:4}},za={name:"Cloud",params:{...b,frame:0,colorBack:"#81ADEC",colors:["#ffffff"],noiseScale:3,noiseIterations:10,radius:.5,thickness:.65,innerShape:.85,speed:.5,scale:2.5}},wr=[pe,Fa,Ra,za],br=k.memo(function({speed:e=pe.params.speed,frame:r=pe.params.frame,colorBack:t=pe.params.colorBack,colors:f=pe.params.colors,noiseScale:i=pe.params.noiseScale,thickness:s=pe.params.thickness,radius:a=pe.params.radius,innerShape:p=pe.params.innerShape,noiseIterations:l=pe.params.noiseIterations,fit:m=pe.params.fit,scale:u=pe.params.scale,rotation:h=pe.params.rotation,originX:_=pe.params.originX,originY:g=pe.params.originY,offsetX:n=pe.params.offsetX,offsetY:c=pe.params.offsetY,worldWidth:d=pe.params.worldWidth,worldHeight:x=pe.params.worldHeight,...w}){const v={u_colorBack:C(t),u_colors:f.map(C),u_colorsCount:f.length,u_noiseScale:i,u_thickness:s,u_radius:a,u_innerShape:p,u_noiseIterations:l,u_noiseTexture:Ie(),u_fit:T[m],u_scale:u,u_rotation:h,u_offsetX:n,u_offsetY:c,u_originX:_,u_originY:g,u_worldWidth:d,u_worldHeight:x};return D.jsx(Y,{...w,speed:e,frame:r,fragmentShader:Ro,uniforms:v})},j),we={name:"Default",params:{...I,speed:1,frame:0,colorFront:"#ffffff",colorMid:"#47a6ff",colorBack:"#000000",brightness:.05,contrast:.3}},Ma={name:"Sensation",params:{...I,speed:1,frame:0,colorFront:"#00c8ff",colorMid:"#fbff00",colorBack:"#8b42ff",brightness:.19,contrast:.12,scale:3}},Oa={name:"Bloodstream",params:{...I,speed:1,frame:0,colorFront:"#ff0000",colorMid:"#ff0000",colorBack:"#ffffff",brightness:.24,contrast:.17,scale:.7}},Pa={name:"Ghost",params:{...I,speed:1,frame:0,colorFront:"#ffffff",colorMid:"#000000",colorBack:"#ffffff",brightness:0,contrast:1,scale:.55}},Ar=[we,Ma,Oa,Pa],Cr=k.memo(function({speed:e=we.params.speed,frame:r=we.params.frame,colorFront:t=we.params.colorFront,colorMid:f=we.params.colorMid,colorBack:i=we.params.colorBack,brightness:s=we.params.brightness,contrast:a=we.params.contrast,fit:p=we.params.fit,scale:l=we.params.scale,rotation:m=we.params.rotation,originX:u=we.params.originX,originY:h=we.params.originY,offsetX:_=we.params.offsetX,offsetY:g=we.params.offsetY,worldWidth:n=we.params.worldWidth,worldHeight:c=we.params.worldHeight,...d}){const x={u_colorFront:C(t),u_colorMid:C(f),u_colorBack:C(i),u_brightness:s,u_contrast:a,u_fit:T[p],u_scale:l,u_rotation:m,u_offsetX:_,u_offsetY:g,u_originX:u,u_originY:h,u_worldWidth:n,u_worldHeight:c};return D.jsx(Y,{...d,speed:e,frame:r,fragmentShader:Fo,uniforms:x})},j),he={name:"Default",params:{...I,speed:1.5,frame:0,colorBack:"#000000",colors:["#ffc96b","#ff6200","#ff2f00","#421100","#1a0000"],size:1,sizeRange:0,spreading:1,stepsPerColor:4}},Ea={name:"Shine",params:{...I,speed:.1,frame:0,colors:["#ffffff","#006aff","#fff675"],colorBack:"#000000",stepsPerColor:4,size:.3,sizeRange:.2,spreading:1,scale:.4}},Da={name:"Bubbles",params:{...I,speed:.4,frame:0,colors:["#D0D2D5"],colorBack:"#989CA4",stepsPerColor:2,size:.9,sizeRange:.7,spreading:1,scale:1.64}},Ya={name:"Hallucinatory",params:{...I,speed:5,frame:0,colors:["#000000"],colorBack:"#ffe500",stepsPerColor:2,size:.65,sizeRange:0,spreading:.3,scale:.5}},Br=[he,Da,Ea,Ya],Sr=k.memo(function({speed:e=he.params.speed,frame:r=he.params.frame,colorBack:t=he.params.colorBack,colors:f=he.params.colors,size:i=he.params.size,sizeRange:s=he.params.sizeRange,spreading:a=he.params.spreading,stepsPerColor:p=he.params.stepsPerColor,fit:l=he.params.fit,scale:m=he.params.scale,rotation:u=he.params.rotation,originX:h=he.params.originX,originY:_=he.params.originY,offsetX:g=he.params.offsetX,offsetY:n=he.params.offsetY,worldWidth:c=he.params.worldWidth,worldHeight:d=he.params.worldHeight,...x}){const w={u_colorBack:C(t),u_colors:f.map(C),u_colorsCount:f.length,u_size:i,u_sizeRange:s,u_spreading:a,u_stepsPerColor:p,u_noiseTexture:Ie(),u_fit:T[l],u_scale:m,u_rotation:u,u_offsetX:g,u_offsetY:n,u_originX:h,u_originY:_,u_worldWidth:c,u_worldHeight:d};return D.jsx(Y,{...x,speed:e,frame:r,fragmentShader:zo,uniforms:w})},j),le={name:"Default",params:{...I,colorBack:"#000000",colorFill:"#ffffff",colorStroke:"#ffaa00",size:2,gapX:32,gapY:32,strokeWidth:0,sizeRange:0,opacityRange:0,shape:"circle"}},Ga={name:"Triangles",params:{...I,colorBack:"#ffffff",colorFill:"#ffffff",colorStroke:"#808080",size:5,gapX:32,gapY:32,strokeWidth:1,sizeRange:0,opacityRange:0,shape:"triangle"}},Wa={name:"Tree line",params:{...I,colorBack:"#f4fce7",colorFill:"#052e19",colorStroke:"#000000",size:8,gapX:20,gapY:90,strokeWidth:0,sizeRange:1,opacityRange:.6,shape:"circle"}},Ta={name:"Wallpaper",params:{...I,colorBack:"#204030",colorFill:"#000000",colorStroke:"#bd955b",size:9,gapX:32,gapY:32,strokeWidth:1,sizeRange:0,opacityRange:0,shape:"diamond"}},kr=[le,Ga,Wa,Ta],Ur=k.memo(function({colorBack:e=le.params.colorBack,colorFill:r=le.params.colorFill,colorStroke:t=le.params.colorStroke,size:f=le.params.size,gapX:i=le.params.gapX,gapY:s=le.params.gapY,strokeWidth:a=le.params.strokeWidth,sizeRange:p=le.params.sizeRange,opacityRange:l=le.params.opacityRange,shape:m=le.params.shape,fit:u=le.params.fit,scale:h=le.params.scale,rotation:_=le.params.rotation,originX:g=le.params.originX,originY:n=le.params.originY,offsetX:c=le.params.offsetX,offsetY:d=le.params.offsetY,worldWidth:x=le.params.worldWidth,worldHeight:w=le.params.worldHeight,maxPixelCount:v=6016*3384,...y}){const A={u_colorBack:C(e),u_colorFill:C(r),u_colorStroke:C(t),u_dotSize:f,u_gapX:i,u_gapY:s,u_strokeWidth:a,u_sizeRange:p,u_opacityRange:l,u_shape:Oo[m],u_fit:T[u],u_scale:h,u_rotation:_,u_offsetX:c,u_offsetY:d,u_originX:g,u_originY:n,u_worldWidth:x,u_worldHeight:w};return D.jsx(Y,{...y,maxPixelCount:v,fragmentShader:Mo,uniforms:A})},j),Ce={name:"Default",params:{...I,scale:.6,speed:.5,frame:0,colors:["#4449CF","#FFD1E0","#F94446","#FFD36B","#FFFFFF"],stepsPerColor:2,softness:0}},Na={name:"Bubblegum",params:{...I,speed:2,frame:0,colors:["#ffffff","#ff9e9e","#5f57ff","#00f7ff"],stepsPerColor:1,softness:1,scale:1.6}},Qa={name:"Spots",params:{...I,speed:.6,frame:0,colors:["#ff7b00","#f9ffeb","#320d82"],stepsPerColor:1,softness:0,scale:1}}
5103,Xa={name:"First contact",params:{...I,speed:2,frame:0,colors:["#e8cce6","#120d22","#442c44","#e6baba","#fff5f5"],stepsPerColor:2,softness:0,scale:.2}},Vr=[Ce,Qa,Xa,Na],Ir=k.memo(function({speed:e=Ce.params.speed,frame:r=Ce.params.frame,colors:t=Ce.params.colors,stepsPerColor:f=Ce.params.stepsPerColor,softness:i=Ce.params.softness,fit:s=Ce.params.fit,scale:a=Ce.params.scale,rotation:p=Ce.params.rotation,originX:l=Ce.params.originX,originY:m=Ce.params.originY,offsetX:u=Ce.params.offsetX,offsetY:h=Ce.params.offsetY,worldWidth:_=Ce.params.worldWidth,worldHeight:g=Ce.params.worldHeight,...n}){const c={u_colors:t.map(C),u_colorsCount:t.length,u_stepsPerColor:f,u_softness:i,u_fit:T[s],u_scale:a,u_rotation:p,u_offsetX:u,u_offsetY:h,u_originX:l,u_originY:m,u_worldWidth:_,u_worldHeight:g};return D.jsx(Y,{...n,speed:e,frame:r,fragmentShader:Po,uniforms:c})},j),Ae={name:"Default",params:{...b,scale:1,speed:1,frame:0,colorBack:"#000000",colors:["#6e33cc","#ff5500","#ffc105","#ffc800","#f585ff"],count:10,size:.83}},Ha={name:"Ink Drops",params:{...b,scale:1,speed:2,frame:0,colorBack:"#ffffff00",colors:["#000000"],count:18,size:.1}},La={name:"Background",params:{...b,speed:.5,frame:0,colors:["#ae00ff","#00ff95","#ffc105"],colorBack:"#2a273f",count:13,size:.81,scale:4,rotation:0,offsetX:-.3}},ja={name:"Solar",params:{...b,speed:1,frame:0,colors:["#ffc800","#ff5500","#ffc105"],colorBack:"#102f84",count:7,size:.75,scale:1}},Rr=[Ae,Ha,ja,La],Fr=k.memo(function({speed:e=Ae.params.speed,frame:r=Ae.params.frame,colorBack:t=Ae.params.colorBack,colors:f=Ae.params.colors,size:i=Ae.params.size,count:s=Ae.params.count,fit:a=Ae.params.fit,rotation:p=Ae.params.rotation,scale:l=Ae.params.scale,originX:m=Ae.params.originX,originY:u=Ae.params.originY,offsetX:h=Ae.params.offsetX,offsetY:_=Ae.params.offsetY,worldWidth:g=Ae.params.worldWidth,worldHeight:n=Ae.params.worldHeight,...c}){const d={u_colorBack:C(t),u_colors:f.map(C),u_colorsCount:f.length,u_size:i,u_count:s,u_noiseTexture:Ie(),u_fit:T[a],u_rotation:p,u_scale:l,u_offsetX:h,u_offsetY:_,u_originX:m,u_originY:u,u_worldWidth:g,u_worldHeight:n};return D.jsx(Y,{...c,speed:e,frame:r,fragmentShader:Eo,uniforms:d})},j),ve={name:"Default",params:{...I,scale:.6,colorFront:"#ffbb00",colorBack:"#000000",shape:0,frequency:.5,amplitude:.5,spacing:1.2,proportion:.1,softness:0}},Ka={name:"Groovy",params:{...I,scale:5,rotation:90,colorFront:"#fcfcee",colorBack:"#ff896b",shape:3,frequency:.2,amplitude:.25,spacing:1.17,proportion:.57,softness:0}},qa={name:"Tangled up",params:{...I,scale:.5,rotation:0,colorFront:"#133a41",colorBack:"#c2d8b6",shape:2.07,frequency:.44,amplitude:.57,spacing:1.05,proportion:.75,softness:0}},Ja={name:"Ride the wave",params:{...I,scale:1.7,rotation:0,colorFront:"#fdffe6",colorBack:"#1f1f1f",shape:2.25,frequency:.2,amplitude:1,spacing:1.25,proportion:1,softness:0}},zr=[ve,Ka,qa,Ja],Mr=k.memo(function({colorFront:e=ve.params.colorFront,colorBack:r=ve.params.colorBack,shape:t=ve.params.shape,frequency:f=ve.params.frequency,amplitude:i=ve.params.amplitude,spacing:s=ve.params.spacing,proportion:a=ve.params.proportion,softness:p=ve.params.softness,fit:l=ve.params.fit,scale:m=ve.params.scale,rotation:u=ve.params.rotation,offsetX:h=ve.params.offsetX,offsetY:_=ve.params.offsetY,originX:g=ve.params.originX,originY:n=ve.params.originY,worldWidth:c=ve.params.worldWidth,worldHeight:d=ve.params.worldHeight,maxPixelCount:x=6016*3384,...w}){const v={u_colorFront:C(e),u_colorBack:C(r),u_shape:t,u_frequency:f,u_amplitude:i,u_spacing:s,u_proportion:a,u_softness:p,u_fit:T[l],u_scale:m,u_rotation:u,u_offsetX:h,u_offsetY:_,u_originX:g,u_originY:n,u_worldWidth:c,u_worldHeight:d};return D.jsx(Y,{...w,fragmentShader:Go,uniforms:v})},j),ee={name:"Default",params:{...I,speed:.5,frame:0,colorBack:"#632ad5",colorFront:"#fccff7",proportion:.35,softness:.1,octaveCount:1,persistence:1,lacunarity:1.5}},Za={name:"Nintendo Water",params:{...I,scale:1/.2,speed:.4,frame:0,colorBack:"#2d69d4",colorFront:"#d1eefc",proportion:.42,softness:0,octaveCount:2,persistence:.55,lacunarity:1.8}},$a={name:"Moss",params:{...I,scale:1/.15,speed:.02,frame:0,colorBack:"#05ff4a",colorFront:"#262626",proportion:.65,softness:.35,octaveCount:6,persistence:1,lacunarity:2.55}},et={name:"Worms",params:{...I,scale:.9,speed:0,frame:0,colorBack:"#ffffff00",colorFront:"#595959",proportion:.5,softness:0,octaveCount:1,persistence:1,lacunarity:1.5}},Or=[ee,Za,$a,et],Pr=k.memo(function({speed:e=ee.params.speed,frame:r=ee.params.frame,colorFront:t=ee.params.colorFront,colorBack:f=ee.params.colorBack,proportion:i=ee.params.proportion,softness:s=ee.params.softness,octaveCount:a=ee.params.octaveCount,persistence:p=ee.params.persistence,lacunarity:l,fit:m=ee.params.fit,worldWidth:u=ee.params.worldWidth,worldHeight:h=ee.params.worldHeight,scale:_=ee.params.scale,rotation:g=ee.params.rotation,originX:n=ee.params.originX,originY:c=ee.params.originY,offsetX:d=ee.params.offsetX,offsetY:x=ee.params.offsetY,...w}){const v={u_colorBack:C(f),u_colorFront:C(t),u_proportion:i,u_softness:s??ee.params.softness,u_octaveCount:a??ee.params.octaveCount,u_persistence:p??ee.params.persistence,u_lacunarity:l??ee.params.lacunarity,u_fit:T[m],u_scale:_,u_rotation:g,u_offsetX:d,u_offsetY:x,u_originX:n,u_originY:c,u_worldWidth:u,u_worldHeight:h};return D.jsx(Y,{...w,speed:e,frame:r,fragmentShader:Do,uniforms:v})},j),de={name:"Default",params:{...I,speed:.5,frame:0,colors:["#ff8247","#ffe53d"],stepsPerColor:3,colorGlow:"#ffffff",colorGap:"#2e0000",distortion:.4,gap:.04,glow:0,scale:.5}},ot={name:"Cells",params:{...I,scale:.5,speed:.5,frame:0,colors:["#ffffff"],stepsPerColor:1,colorGlow:"#ffffff",colorGap:"#000000",distortion:.5,gap:.03,glow:.8}},at={name:"Bubbles",params:{...I,scale:.75,speed:.5,frame:0,colors:["#83c9fb"],stepsPerColor:1,colorGlow:"#ffffff",colorGap:"#ffffff",distortion:.4,gap:0,glow:1}},tt={name:"Lights",params:{...I,scale:3.3,speed:.5,frame:0,colors:["#fffffffc","#bbff00","#00ffff"],colorGlow:"#ff00d0",colorGap:"#ff00d0",stepsPerColor:2,distortion:.38,gap:0,glow:1}},Er=[de,tt,ot,at],Dr=k.memo(function({speed:e=de.params.speed,frame:r=de.params.frame,colors:t=de.params.colors,stepsPerColor:f=de.params.stepsPerColor,colorGlow:i=de.params.colorGlow,colorGap:s=de.params.colorGap,distortion:a=de.params.distortion,gap:p=de.params.gap,glow:l=de.params.glow,fit:m=de.params.fit,scale:u=de.params.scale,rotation:h=de.params.rotation,originX:_=de.params.originX,originY:g=de.params.originY,offsetX:n=de.params.offsetX,offsetY:c=de.params.offsetY,worldWidth:d=de.params.worldWidth,worldHeight:x=de.params.worldHeight,...w}){const v={u_colors:t.map(C),u_colorsCount:t.length,u_stepsPerColor:f,u_colorGlow:C(i),u_colorGap:C(s),u_distortion:a,u_gap:p,u_glow:l,u_noiseTexture:Ie(),u_fit:T[m],u_scale:u,u_rotation:h,u_offsetX:n,u_offsetY:c,u_originX:_,u_originY:g,u_worldWidth:d,u_worldHeight:x};return D.jsx(Y,{...w,speed:e,frame:r,fragmentShader:Yo,uniforms:v})},j),ce={name:"Default",params:{...I,rotation:0,speed:1,frame:0,colors:["#121212","#9470ff","#121212","#8838ff"],proportion:.45,softness:1,distortion:.25,swirl:.8,swirlIterations:10,shapeScale:.1,shape:"checks"}},rt={name:"Cauldron Pot",params:{...I,scale:.9,rotation:160,speed:10,frame:0,colors:["#a7e58b","#324472","#0a180d"],proportion:.64,softness:1.5,distortion:.2,swirl:.86,swirlIterations:7,shapeScale:.6,shape:"edge"}},it={name:"Live Ink",params:{...I,scale:1.2,rotation:44,offsetY:-.3,speed:2.5,frame:0,colors:["#111314","#9faeab","#f3fee7","#f3fee7"],proportion:.05,softness:0,distortion:.25,swirl:.8,swirlIterations:10,shapeScale:.28,shape:"checks"}},st={name:"Kelp",params:{...I,scale:.8,rotation:50,speed:20,frame:0,colors:["#dbff8f","#404f3e","#091316"],proportion:.67,softness:0,distortion:0,swirl:.2,swirlIterations:3,shapeScale:1,shape:"stripes"}},nt={name:"Nectar",params:{...I,scale:2,offsetY:.6,rotation:0,speed:4.2,frame:0,colors:["#151310","#d3a86b","#f0edea"],proportion:.24,softness:1,distortion:.21,swirl:.57,swirlIterations:10,shapeScale:.75,shape:"edge"}},lt={name:"Passion",params:{...I,scale:2.5,rotation:1.35,speed:3,frame:0,colors:["#3b1515","#954751","#ffc085"],proportion:.5,softness:1,distortion:.09,swirl:.9,swirlIterations:6,shapeScale:.25,shape:"checks"}},Yr=[ce,rt,it,st,nt,lt],Gr=k.memo(function({speed:e=ce.params.speed,frame:r=ce.params.frame,colors:t=ce.params.colors,proportion:f=ce.params.proportion,softness:i=ce.params.softness,distortion:s=ce.params.distortion,swirl:a=ce.params.swirl,swirlIterations:p=ce.params.swirlIterations,shapeScale:l=ce.params.shapeScale,shape:m=ce.params.shape,fit:u=ce.params.fit,scale:h=ce.params.scale,rotation:_=ce.params.rotation,originX:g=ce.params.originX,originY:n=ce.params.originY,offsetX:c=ce.params.offsetX,offsetY:d=ce.params.offsetY,worldWidth:x=ce.params.worldWidth,worldHeight:w=ce.params.worldHeight,...v}){const y={u_colors:t.map(C),u_colorsCount:t.length,u_proportion:f,u_softness:i,u_distortion:s,u_swirl:a,u_swirlIterations:p,u_shapeScale:l,u_shape:To[m],u_noiseTexture:Ie(),u_scale:h,u_rotation:_,u_fit:T[u],u_offsetX:c,u_offsetY:d,u_originX:g,u_originY:n,u_worldWidth:x,u_worldHeight:w};return D.jsx(Y,{...v,speed:e,frame:r,fragmentShader:Wo,uniforms:y})},j),ie={name:"Default",params:{...b,offsetX:0,offsetY:-.55,colorBack:"#000000",colorBloom:"#0000ff",colors:["#a600ff6e","#6200fff0","#ffffff","#33fff5"],density:.3,spotty:.3,midIntensity:.4,midSize:.2,intensity:.8,bloom:.4,speed:.75,frame:0}},ct={name:"Warp",params:{...b,colorBack:"#000000",colorBloom:"#222288",colors:["#ff47d4","#ff8c00","#ffffff"],density:.45,spotty:.15,midIntensity:.4,midSize:.33,intensity:.79,bloom:.4,speed:2,frame:0}},ft={name:"Linear",params:{...b,offsetX:.2,offsetY:-.8,colorBack:"#000000",colorBloom:"#eeeeee",colors:["#ffffff1f","#ffffff3d","#ffffff29"],density:.41,spotty:.25,midSize:.1,midIntensity:.75,intensity:.79,bloom:1,speed:.5,frame:0}},ut={name:"Ether",params:{...b,offsetX:-.6,colorBack:"#090f1d",colorBloom:"#ffffff",colors:["#148effa6","#c4dffebe","#232a47"],density:.03,spotty:.77,midSize:.1,midIntensity:.6,intensity:.6,bloom:.6,speed:1,frame:0}},Wr=[ie,ct,ft,ut],Tr=k.memo(function({speed:e=ie.params.speed,frame:r=ie.params.frame,colorBloom:t=ie.params.colorBloom,colorBack:f=ie.params.colorBack,colors:i=ie.params.colors,density:s=ie.params.density,spotty:a=ie.params.spotty,midIntensity:p=ie.params.midIntensity,midSize:l=ie.params.midSize,intensity:m=ie.params.intensity,bloom:u=ie.params.bloom,fit:h=ie.params.fit,scale:_=ie.params.scale,rotation:g=ie.params.rotation,originX:n=ie.params.originX,originY:c=ie.params.originY,offsetX:d=ie.params.offsetX,offsetY:x=ie.params.offsetY,worldWidth:w=ie.params.worldWidth,worldHeight:v=ie.params.worldHeight,...y}){const A={u_colorBloom:C(t),u_colorBack:C(f),u_colors:i.map(C),u_colorsCount:i.length,u_density:s,u_spotty:a,u_midIntensity:p,u_midSize:l,u_intensity:m,u_bloom:u,u_noiseTexture:Ie(),u_fit:T[h],u_scale:_,u_rotation:g,u_offsetX:d,u_offsetY:x,u_originX:n,u_originY:c,u_worldWidth:w,u_worldHeight:v};return D.jsx(Y,{...y,speed:e,frame:r,fragmentShader:No,uniforms:A})},j),oe={name:"Default",params:{...I,scale:1,colorBack:"#001429",colorFront:"#79D1FF",density:1,distortion:0,strokeWidth:.5,strokeTaper:0,strokeCap:0,noise:0,noiseFrequency:0,softness:0,speed:1,frame:0}},mt={name:"Droplet",params:{...I,colorBack:"#effafe",colorFront:"#bf40a0",density:.9,distortion:0,strokeWidth:.75,strokeTaper:.18,strokeCap:1,noise:.74,noiseFrequency:.33,softness:.02,speed:1,frame:0}},pt={name:"Jungle",params:{...I,scale:1.3,density:.5,colorBack:"#a0ef2a",colorFront:"#288b18",distortion:0,strokeWidth:.5,strokeTaper:0,strokeCap:0,noise:1,noiseFrequency:.25,softness:0,speed:.75,frame:0}},dt={name:"Swirl",params:{...I,scale:.45,colorBack:"#b3e6d9",colorFront:"#1a2b4d",density:.2,distortion:0,strokeWidth:.5,strokeTaper:0,strokeCap:0,noise:0,noiseFrequency:.3,softness:.5,speed:1,frame:0}},Nr=[oe,pt,mt,dt],Qr=k.memo(function({speed:e=oe.params.speed,frame:r=oe.params.frame,colorBack:t=oe.params.colorBack,colorFront:f=oe.params.colorFront,density:i=oe.params.density,distortion:s=oe.params.distortion,strokeWidth:a=oe.params.strokeWidth,strokeTaper:p=oe.params.strokeTaper,strokeCap:l=oe.params.strokeCap,noiseFrequency:m=oe.params.noiseFrequency,noise:u=oe.params.noise,softness:h=oe.params.softness,fit:_=oe.params.fit,rotation:g=oe.params.rotation,scale:n=oe.params.scale,originX:c=oe.params.originX,originY:d=oe.params.originY,offsetX:x=oe.params.offsetX,offsetY:w=oe.params.offsetY,worldWidth:v=oe.params.worldWidth,worldHeight:y=oe.params.worldHeight,...A}){const U={u_colorBack:C(t),u_colorFront:C(f),u_density:i,u_distortion:s,u_strokeWidth:a,u_strokeTaper:p,u_strokeCap:l,u_noiseFrequency:m,u_noise:u,u_softness:h,u_fit:T[_],u_scale:n,u_rotation:g,u_offsetX:x,u_offsetY:w,u_originX:c,u_originY:d,u_worldWidth:v,u_worldHeight:y};return D.jsx(Y,{...A,speed:e,frame:r,fragmentShader:Qo,uniforms:U})},j),se={name:"Default",params:{...b,speed:.32,frame:0,colorBack:"#330000",colors:["#ffd1d1","#ff8a8a","#660000"],bandCount:4,twist:.1,center:.2,proportion:.5,softness:0,noiseFrequency:.4,noise:.2}}
5103,gt={name:"Opening",params:{...b,offsetX:-.4,offsetY:1,speed:.5,frame:0,colorBack:"#ff8b61",colors:["#fefff0","#ffd8bd","#ff8b61"],bandCount:2,twist:.3,center:.2,proportion:.5,softness:0,noiseFrequency:0,noise:0,scale:1}},ht={name:"007",params:{...b,speed:1,frame:0,colorBack:"#E9E7DA",colors:["#000000"],bandCount:5,twist:.3,center:0,proportion:0,softness:0,noiseFrequency:.5,noise:0}},vt={name:"Candy",params:{...b,speed:1,frame:0,colorBack:"#ffcd66",colors:["#6bbceb","#d7b3ff","#ff9fff"],bandCount:2,twist:.15,center:.2,proportion:.5,softness:1,noiseFrequency:.5,noise:0}},Xr=[se,ht,gt,vt],Hr=k.memo(function({speed:e=se.params.speed,frame:r=se.params.frame,colorBack:t=se.params.colorBack,colors:f=se.params.colors,bandCount:i=se.params.bandCount,twist:s=se.params.twist,center:a=se.params.center,proportion:p=se.params.proportion,softness:l=se.params.softness,noiseFrequency:m=se.params.noiseFrequency,noise:u=se.params.noise,fit:h=se.params.fit,rotation:_=se.params.rotation,scale:g=se.params.scale,originX:n=se.params.originX,originY:c=se.params.originY,offsetX:d=se.params.offsetX,offsetY:x=se.params.offsetY,worldWidth:w=se.params.worldWidth,worldHeight:v=se.params.worldHeight,...y}){const A={u_colorBack:C(t),u_colors:f.map(C),u_colorsCount:f.length,u_bandCount:i,u_twist:s,u_center:a,u_proportion:p,u_softness:l,u_noiseFrequency:m,u_noise:u,u_fit:T[h],u_scale:g,u_rotation:_,u_offsetX:d,u_offsetY:x,u_originX:n,u_originY:c,u_worldWidth:w,u_worldHeight:v};return D.jsx(Y,{...y,speed:e,frame:r,fragmentShader:Xo,uniforms:A})},j),be={name:"Default",params:{...I,speed:1,frame:0,scale:.6,colorBack:"#000000",colorFront:"#00b2ff",shape:"sphere",type:"4x4",size:2}},_t={name:"Sine Wave",params:{...I,speed:1,frame:0,colorBack:"#730d54",colorFront:"#00becc",shape:"wave",type:"4x4",size:11,scale:1.2}},xt={name:"Bugs",params:{...I,speed:1,frame:0,colorBack:"#000000",colorFront:"#008000",shape:"dots",type:"random",size:9}},yt={name:"Ripple",params:{...b,speed:1,frame:0,colorBack:"#603520",colorFront:"#c67953",shape:"ripple",type:"2x2",size:3}},wt={name:"Swirl",params:{...b,speed:1,frame:0,colorBack:"#00000000",colorFront:"#47a8e1",shape:"swirl",type:"8x8",size:2}},bt={name:"Warp",params:{...b,speed:1,frame:0,colorBack:"#301c2a",colorFront:"#56ae6c",shape:"warp",type:"4x4",size:2.5}},Lr=[be,bt,_t,yt,xt,wt],jr=k.memo(function({speed:e=be.params.speed,frame:r=be.params.frame,colorBack:t=be.params.colorBack,colorFront:f=be.params.colorFront,shape:i=be.params.shape,type:s=be.params.type,pxSize:a,size:p=a===void 0?be.params.size:a,fit:l=be.params.fit,scale:m=be.params.scale,rotation:u=be.params.rotation,originX:h=be.params.originX,originY:_=be.params.originY,offsetX:g=be.params.offsetX,offsetY:n=be.params.offsetY,worldWidth:c=be.params.worldWidth,worldHeight:d=be.params.worldHeight,...x}){const w={u_colorBack:C(t),u_colorFront:C(f),u_shape:Lo[i],u_type:vo[s],u_pxSize:p,u_fit:T[l],u_scale:m,u_rotation:u,u_offsetX:g,u_offsetY:n,u_originX:h,u_originY:_,u_worldWidth:c,u_worldHeight:d};return D.jsx(Y,{...x,speed:e,frame:r,fragmentShader:Ho,uniforms:w})}),_e={name:"Default",params:{...b,speed:1,frame:0,colorBack:"#000000",colors:["#7300ff","#eba8ff","#00bfff","#2a00ff"],softness:.5,intensity:.5,noise:.25,shape:"corners"}},At={name:"Wave",params:{...I,speed:1,frame:0,colorBack:"#000a0f",colors:["#c4730b","#bdad5f","#d8ccc7"],softness:.7,intensity:.15,noise:.5,shape:"wave"}},Ct={name:"Dots",params:{...I,scale:.6,speed:1,frame:0,colorBack:"#0a0000",colors:["#6f0000","#0080ff","#f2ebc9","#33cc33"],softness:1,intensity:1,noise:.7,shape:"dots"}},Bt={name:"Truchet",params:{...I,speed:1,frame:0,colorBack:"#0a0000",colors:["#6f2200","#eabb7c","#39b523"],softness:0,intensity:.2,noise:1,shape:"truchet"}},St={name:"Ripple",params:{...b,scale:.5,speed:1,frame:0,colorBack:"#140a00",colors:["#6f2d00","#88ddae","#2c0b1d"],softness:.5,intensity:.5,noise:.5,shape:"ripple"}},kt={name:"Blob",params:{...b,scale:1.3,speed:1,frame:0,colorBack:"#0f0e18",colors:["#3e6172","#a49b74","#568c50"],softness:0,intensity:.15,noise:.5,shape:"blob"}},Kr=[_e,At,Ct,Bt,St,kt],qr=k.memo(function({speed:e=_e.params.speed,frame:r=_e.params.frame,colorBack:t=_e.params.colorBack,colors:f=_e.params.colors,softness:i=_e.params.softness,intensity:s=_e.params.intensity,noise:a=_e.params.noise,shape:p=_e.params.shape,fit:l=_e.params.fit,scale:m=_e.params.scale,rotation:u=_e.params.rotation,originX:h=_e.params.originX,originY:_=_e.params.originY,offsetX:g=_e.params.offsetX,offsetY:n=_e.params.offsetY,worldWidth:c=_e.params.worldWidth,worldHeight:d=_e.params.worldHeight,...x}){const w={u_colorBack:C(t),u_colors:f.map(C),u_colorsCount:f.length,u_softness:i,u_intensity:s,u_noise:a,u_shape:Ko[p],u_noiseTexture:Ie(),u_fit:T[l],u_scale:m,u_rotation:u,u_offsetX:g,u_offsetY:n,u_originX:h,u_originY:_,u_worldWidth:c,u_worldHeight:d};return D.jsx(Y,{...x,speed:e,frame:r,fragmentShader:jo,uniforms:w})}
5103),W={name:"Default",params:{...b,speed:1,frame:0,scale:.6,colorBack:"#000000",colors:["#0dc1fd","#d915ef","#ff3f2ecc"],roundness:.25,thickness:.1,margin:0,marginLeft:0,marginRight:0,marginTop:0,marginBottom:0,aspectRatio:"auto",softness:.75,intensity:.2,bloom:.25,spots:5,spotSize:.5,pulse:.25,smoke:.3,smokeSize:.6}},Ut={name:"Circle",params:{...b,aspectRatio:"square",scale:.6,speed:1,frame:0,colorBack:"#000000",colors:["#0dc1fd","#d915ef","#ff3f2ecc"],roundness:1,margin:0,marginLeft:0,marginRight:0,marginTop:0,marginBottom:0,thickness:0,softness:.75,intensity:.2,bloom:.45,spots:3,spotSize:.4,pulse:.5,smoke:1,smokeSize:0}},Vt={name:"Northern lights",params:{...b,speed:.18,scale:1.1,frame:0,colors:["#4c4794","#774a7d","#12694a","#0aff78","#4733cc"],colorBack:"#0c182c",roundness:0,thickness:1,softness:1,margin:0,marginLeft:0,marginRight:0,marginTop:0,marginBottom:0,aspectRatio:"auto",intensity:.1,bloom:.2,spots:4,spotSize:.25,pulse:0,smoke:.32,smokeSize:.5}},It={name:"Solid line",params:{...b,speed:1,frame:0,colors:["#81ADEC"],colorBack:"#00000000",roundness:0,thickness:.05,margin:0,marginLeft:0,marginRight:0,marginTop:0,marginBottom:0,aspectRatio:"auto",softness:0,intensity:0,bloom:.15,spots:4,spotSize:1,pulse:0,smoke:0,smokeSize:0}},Jr=[W,Ut,Vt,It],Zr=k.memo(function({speed:e=W.params.speed,frame:r=W.params.frame,colors:t=W.params.colors,colorBack:f=W.params.colorBack,roundness:i=W.params.roundness,thickness:s=W.params.thickness,aspectRatio:a=W.params.aspectRatio,softness:p=W.params.softness,bloom:l=W.params.bloom,intensity:m=W.params.intensity,spots:u=W.params.spots,spotSize:h=W.params.spotSize,pulse:_=W.params.pulse,smoke:g=W.params.smoke,smokeSize:n=W.params.smokeSize,margin:c,marginLeft:d=c??W.params.marginLeft,marginRight:x=c??W.params.marginRight,marginTop:w=c??W.params.marginTop,marginBottom:v=c??W.params.marginBottom,fit:y=W.params.fit,rotation:A=W.params.rotation,scale:U=W.params.scale,originX:E=W.params.originX,originY:R=W.params.originY,offsetX:B=W.params.offsetX,offsetY:F=W.params.offsetY,worldWidth:H=W.params.worldWidth,worldHeight:N=W.params.worldHeight,...te}){const G={u_colorBack:C(f),u_colors:t.map(C),u_colorsCount:t.length,u_roundness:i,u_thickness:s,u_marginLeft:d,u_marginRight:x,u_marginTop:w,u_marginBottom:v,u_aspectRatio:Jo[a],u_softness:p,u_intensity:m,u_bloom:l,u_spots:u,u_spotSize:h,u_pulse:_,u_smoke:g,u_smokeSize:n,u_noiseTexture:Ie(),u_fit:T[y],u_rotation:A,u_scale:U,u_offsetX:B,u_offsetY:F,u_originX:E,u_originY:R,u_worldWidth:H,u_worldHeight:N};return D.jsx(Y,{...te,speed:e,frame:r,fragmentShader:qo,uniforms:G})},j),J={name:"Default",params:{...b,speed:.5,frame:0,colors:["#ff9d00","#fd4f30","#809bff","#6d2eff","#333aff","#f15cff","#ffd557"],colorBack:"#000000",angle1:0,angle2:0,length:1.1,edges:!1,blur:0,fadeIn:1,fadeOut:.3,gradient:0,density:3,scale:.8}},Rt={name:"Glass",params:{...b,rotation:112,speed:1,frame:0,colors:["#00cfff","#ff2d55","#34c759","#af52de"],colorBack:"#ffffff00",angle1:.3,angle2:.3,length:1,edges:!0,blur:.25,fadeIn:.85,fadeOut:.3,gradient:0,density:1.6}},Ft={name:"Gradient",params:{...b,speed:.5,frame:0,colors:["#f2ff00","#00000000","#00000000","#5a0283","#005eff"],colorBack:"#8ffff2",angle1:.4,angle2:.4,length:3,edges:!1,blur:.5,fadeIn:1,fadeOut:.39,gradient:.78,density:1.65,scale:1.72,rotation:270,offsetX:.18}},zt={name:"Opening",params:{...b,speed:2,frame:0,colors:["#00ffff"],colorBack:"#570044",angle1:-1,angle2:-1,length:.52,edges:!1,blur:0,fadeIn:0,fadeOut:1,gradient:0,density:2.21,scale:2.32,rotation:360,offsetX:-.3,offsetY:.6}},$r=[J,Rt,Ft,zt],ei=k.memo(function({speed:e=J.params.speed,frame:r=J.params.frame,colors:t=J.params.colors,colorBack:f=J.params.colorBack,angle1:i=J.params.angle1,angle2:s=J.params.angle2,length:a=J.params.length,edges:p=J.params.edges,blur:l=J.params.blur,fadeIn:m=J.params.fadeIn,fadeOut:u=J.params.fadeOut,density:h=J.params.density,gradient:_=J.params.gradient,fit:g=J.params.fit,scale:n=J.params.scale,rotation:c=J.params.rotation,originX:d=J.params.originX,originY:x=J.params.originY,offsetX:w=J.params.offsetX,offsetY:v=J.params.offsetY,worldWidth:y=J.params.worldWidth,worldHeight:A=J.params.worldHeight,...U}){const E={u_colors:t.map(C),u_colorsCount:t.length,u_colorBack:C(f),u_angle1:i,u_angle2:s,u_length:a,u_edges:p,u_blur:l,u_fadeIn:m,u_fadeOut:u,u_density:h,u_gradient:_,u_fit:T[g],u_scale:n,u_rotation:c,u_offsetX:w,u_offsetY:v,u_originX:d,u_originY:x,u_worldWidth:y,u_worldHeight:A};return D.jsx(Y,{...U,speed:e,frame:r,fragmentShader:Zo,uniforms:E})},j),ne={name:"Default",params:{...b,rotation:270,speed:0,frame:0,colors:["#ffad0a","#6200ff","#e2a3ff","#ff99fd"],positions:2,waveX:1,waveXShift:.6,waveY:1,waveYShift:.21,mixing:.93,grainMixer:0,grainOverlay:0}},Mt={name:"Sea",params:{...b,speed:0,frame:0,colors:["#013b65","#03738c","#a3d3ff","#f2faef"],positions:0,waveX:.53,waveXShift:0,waveY:.95,waveYShift:.64,mixing:.5,grainMixer:0,grainOverlay:0}},Ot={name:"1960s",params:{...b,speed:0,frame:0,colors:["#000000","#082400","#b1aa91","#8e8c15"],positions:42,waveX:.45,waveXShift:0,waveY:1,waveYShift:0,mixing:0,grainMixer:.37,grainOverlay:.78}},Pt={name:"Sunset",params:{...b,speed:0,frame:0,colors:["#264653","#9c2b2b","#f4a261","#ffffff"],positions:0,waveX:.6,waveXShift:.7,waveY:.7,waveYShift:.7,mixing:.5,grainMixer:0,grainOverlay:0}},oi=[ne,Ot,Pt,Mt],ai=k.memo(function({speed:e=ne.params.speed,frame:r=ne.params.frame,colors:t=ne.params.colors,positions:f=ne.params.positions,waveX:i=ne.params.waveX,waveXShift:s=ne.params.waveXShift,waveY:a=ne.params.waveY,waveYShift:p=ne.params.waveYShift,mixing:l=ne.params.mixing,grainMixer:m=ne.params.grainMixer,grainOverlay:u=ne.params.grainOverlay,fit:h=ne.params.fit,rotation:_=ne.params.rotation,scale:g=ne.params.scale,originX:n=ne.params.originX,originY:c=ne.params.originY,offsetX:d=ne.params.offsetX,offsetY:x=ne.params.offsetY,worldWidth:w=ne.params.worldWidth,worldHeight:v=ne.params.worldHeight,...y}){const A={u_colors:t.map(C),u_colorsCount:t.length,u_positions:f,u_waveX:i,u_waveXShift:s,u_waveY:a,u_waveYShift:p,u_mixing:l,u_grainMixer:m,u_grainOverlay:u,u_fit:T[h],u_rotation:_,u_scale:g,u_offsetX:d,u_offsetY:x,u_originX:n,u_originY:c,u_worldWidth:w,u_worldHeight:v};return D.jsx(Y,{...y,speed:e,frame:r,fragmentShader:$o,uniforms:A})}
5103,j),K={name:"Default",params:{...b,scale:1,speed:0,frame:0,colorBack:"#000000",colors:["#00bbff","#00ffe1","#ffffff"],radius:.8,focalDistance:.99,focalAngle:0,falloff:.24,mixing:.5,distortion:0,distortionShift:0,distortionFreq:12,grainMixer:0,grainOverlay:0}},Et={name:"Cross Section",params:{...b,scale:1,speed:0,frame:0,colorBack:"#3d348b",colors:["#7678ed","#f7b801","#f18701","#37a066"],radius:1,focalDistance:0,focalAngle:0,falloff:0,mixing:0,distortion:1,distortionShift:0,distortionFreq:12,grainMixer:0,grainOverlay:0}},Dt={name:"Radial",params:{...b,scale:1,speed:0,frame:0,colorBack:"#264653",colors:["#9c2b2b","#f4a261","#ffffff"],radius:1,focalDistance:0,focalAngle:0,falloff:0,mixing:1,distortion:0,distortionShift:0,distortionFreq:12,grainMixer:0,grainOverlay:0}},Yt={name:"Lo-Fi",params:{...b,speed:0,frame:0,colorBack:"#2e1f27",colors:["#d72638","#3f88c5","#f49d37"],radius:1,focalDistance:0,focalAngle:0,falloff:.9,mixing:.7,distortion:0,distortionShift:0,distortionFreq:12,grainMixer:1,grainOverlay:.5}},ti=[K,Yt,Et,Dt],ri=k.memo(function({speed:e=K.params.speed,frame:r=K.params.frame,colorBack:t=K.params.colorBack,colors:f=K.params.colors,radius:i=K.params.radius,focalDistance:s=K.params.focalDistance,focalAngle:a=K.params.focalAngle,falloff:p=K.params.falloff,grainMixer:l=K.params.grainMixer,mixing:m=K.params.mixing,distortion:u=K.params.distortion,distortionShift:h=K.params.distortionShift,distortionFreq:_=K.params.distortionFreq,grainOverlay:g=K.params.grainOverlay,fit:n=K.params.fit,rotation:c=K.params.rotation,scale:d=K.params.scale,originX:x=K.params.originX,originY:w=K.params.originY,offsetX:v=K.params.offsetX,offsetY:y=K.params.offsetY,worldWidth:A=K.params.worldWidth,worldHeight:U=K.params.worldHeight,...E}){const R={u_colorBack:C(t),u_colors:f.map(C),u_colorsCount:f.length,u_radius:i,u_focalDistance:s,u_focalAngle:a,u_falloff:p,u_mixing:m,u_distortion:u,u_distortionShift:h,u_distortionFreq:_,u_grainMixer:l,u_grainOverlay:g,u_fit:T[n],u_rotation:c,u_scale:d,u_offsetX:v,u_offsetY:y,u_originX:x,u_originY:w,u_worldWidth:A,u_worldHeight:U};return D.jsx(Y,{...E,speed:e,frame:r,fragmentShader:ea,uniforms:R})},j),L={name:"Default",params:{...b,fit:"cover",scale:.6,speed:0,frame:0,colorFront:"#9fadbc",colorBack:"#ffffff",contrast:.3,roughness:.4,fiber:.3,fiberSize:.2,crumples:.3,crumpleSize:.35,folds:.65,foldCount:5,fade:0,drops:.2,seed:5.8}},Gt={name:"Abstract",params:{...b,fit:"cover",speed:0,frame:0,scale:.6,colorFront:"#00eeff",colorBack:"#ff0a81",contrast:.85,roughness:0,fiber:.1,fiberSize:.2,crumples:0,crumpleSize:.3,folds:1,foldCount:3,fade:0,drops:.2,seed:2.2}},Wt={name:"Cardboard",params:{...b,fit:"cover",speed:0,frame:0,scale:.6,colorFront:"#c7b89e",colorBack:"#999180",contrast:.4,roughness:0,fiber:.35,fiberSize:.14,crumples:.7,crumpleSize:.1,folds:0,foldCount:1,fade:0,drops:.1,seed:1.6}},Tt={name:"Details",params:{...b,speed:0,frame:0,fit:"cover",scale:3,colorFront:"#00000000",colorBack:"#00000000",contrast:0,roughness:1,fiber:.27,fiberSize:.22,crumples:1,crumpleSize:.5,folds:1,foldCount:15,fade:0,drops:0,seed:6}},ii=[L,Wt,Gt,Tt],si=k.memo(function({speed:e=L.params.speed,frame:r=L.params.frame,colorFront:t=L.params.colorFront,colorBack:f=L.params.colorBack,image:i="",contrast:s=L.params.contrast,roughness:a=L.params.roughness,fiber:p=L.params.fiber,crumples:l=L.params.crumples,folds:m=L.params.folds,drops:u=L.params.drops,seed:h=L.params.seed,fiberScale:_,fiberSize:g=_===void 0?L.params.fiberSize:.2/_,crumplesScale:n,crumpleSize:c=n===void 0?L.params.crumpleSize:.2/n,blur:d,fade:x=d===void 0?L.params.fade:d,foldsNumber:w,foldCount:v=w===void 0?L.params.foldCount:w,fit:y=L.params.fit,scale:A=L.params.scale,rotation:U=L.params.rotation,originX:E=L.params.originX,originY:R=L.params.originY,offsetX:B=L.params.offsetX,offsetY:F=L.params.offsetY,worldWidth:H=L.params.worldWidth,worldHeight:N=L.params.worldHeight,...te}){const G=typeof window<"u"&&{u_noiseTexture:Ie()},Q={u_image:i,u_colorFront:C(t),u_colorBack:C(f),u_contrast:s,u_roughness:a,u_fiber:p,u_fiberSize:g,u_crumples:l,u_crumpleSize:c,u_foldCount:v,u_folds:m,u_fade:x,u_drops:u,u_seed:h,...G,u_fit:T[y],u_scale:A,u_rotation:U,u_offsetX:B,u_offsetY:F,u_originX:E,u_originY:R,u_worldWidth:H,u_worldHeight:N};return D.jsx(Y,{...te,speed:e,frame:r,fragmentShader:oa,mipmaps:["u_image"],uniforms:Q})},j),P={name:"Default",params:{...b,fit:"cover",speed:0,frame:0,colorBack:"#00000000",colorShadow:"#000000",colorHighlight:"#ffffff",shadows:.25,size:.5,angle:0,distortionShape:"prism",highlights:.1,shape:"lines",distortion:.5,shift:0,blur:0,edges:.25,stretch:0,margin:0,marginLeft:0,marginRight:0,marginTop:0,marginBottom:0,grainMixer:0,grainOverlay:0}},Nt={name:"Waves",params:{...b,fit:"cover",scale:1.2,speed:0,frame:0,colorBack:"#00000000",colorShadow:"#000000",colorHighlight:"#ffffff",shadows:0,size:.9,angle:0,distortionShape:"contour",highlights:0,shape:"wave",distortion:.5,shift:0,blur:.1,edges:.5,stretch:1,margin:0,marginLeft:0,marginRight:0,marginTop:0,marginBottom:0,grainMixer:0,grainOverlay:.05}},Qt={name:"Abstract",params:{...b,fit:"cover",scale:4,speed:0,frame:0,colorBack:"#00000000",colorShadow:"#000000",colorHighlight:"#ffffff",shadows:0,size:.7,angle:30,distortionShape:"flat",highlights:0,shape:"linesIrregular",distortion:1,shift:0,blur:1,edges:.5,stretch:1,margin:0,marginLeft:0,marginRight:0,marginTop:0,marginBottom:0,grainMixer:.1,grainOverlay:.1}},Xt={name:"Folds",params:{...b,fit:"cover",speed:0,frame:0,colorBack:"#00000000",colorShadow:"#000000",colorHighlight:"#ffffff",shadows:.4,size:.4,angle:0,distortionShape:"cascade",highlights:0,shape:"lines",distortion:.75,shift:0,blur:.25,edges:.5,stretch:0,margin:.1,marginLeft:.1,marginRight:.1,marginTop:.1,marginBottom:.1,grainMixer:0,grainOverlay:0}},ni=[P,Qt,Nt,Xt],li=k.memo(function({speed:e=P.params.speed,frame:r=P.params.frame,colorBack:t=P.params.colorBack,colorShadow:f=P.params.colorShadow,colorHighlight:i=P.params.colorHighlight,image:s="",shadows:a=P.params.shadows,angle:p=P.params.angle,distortion:l=P.params.distortion,distortionShape:m=P.params.distortionShape,highlights:u=P.params.highlights,shape:h=P.params.shape,shift:_=P.params.shift,blur:g=P.params.blur,edges:n=P.params.edges,margin:c,marginLeft:d=c??P.params.marginLeft,marginRight:x=c??P.params.marginRight,marginTop:w=c??P.params.marginTop,marginBottom:v=c??P.params.marginBottom,grainMixer:y=P.params.grainMixer,grainOverlay:A=P.params.grainOverlay,stretch:U=P.params.stretch,count:E,size:R=E===void 0?P.params.size:Math.pow(1/(E*1.6),1/6)/.7-.5,fit:B=P.params.fit,scale:F=P.params.scale,rotation:H=P.params.rotation,originX:N=P.params.originX,originY:te=P.params.originY,offsetX:G=P.params.offsetX,offsetY:Q=P.params.offsetY,worldWidth:ke=P.params.worldWidth,worldHeight:Ve=P.params.worldHeight,...Re}){const V={u_image:s,u_colorBack:C(t),u_colorShadow:C(f),u_colorHighlight:C(i),u_shadows:a,u_size:R,u_angle:p,u_distortion:l,u_shift:_,u_blur:g,u_edges:n,u_stretch:U,u_distortionShape:ia[m],u_highlights:u,u_shape:ra[h],u_marginLeft:d,u_marginRight:x,u_marginTop:w,u_marginBottom:v,u_grainMixer:y,u_grainOverlay:A,u_fit:T[B],u_scale:F,u_rotation:H,u_offsetX:G,u_offsetY:Q,u_originX:N,u_originY:te,u_worldWidth:ke,u_worldHeight:Ve};return D.jsx(Y,{...Re,speed:e,frame:r,fragmentShader:ta,mipmaps:["u_image"],uniforms:V})}),fe={name:"Default",params:{...b,scale:.8,speed:1,frame:0,colorBack:"#909090",colorHighlight:"#ffffff",highlights:.07,layering:.5,edges:.8,waves:.3,caustic:.1,size:1}},Ht={name:"Abstract",params:{...b,fit:"cover",scale:3,speed:1,frame:0,colorBack:"#909090",colorHighlight:"#ffffff",highlights:0,layering:0,edges:1,waves:1,caustic:.4,size:.15}},Lt={name:"Streaming",params:{...b,fit:"contain",scale:.4,speed:2,frame:0,colorBack:"#909090",colorHighlight:"#ffffff",highlights:0,layering:0,edges:0,waves:.5,caustic:0,size:.5}},jt={name:"Slow-mo",params:{...b,fit:"cover",scale:1,speed:.1,frame:0,colorBack:"#909090",colorHighlight:"#ffffff",highlights:.4,layering:0,edges:0,waves:0,caustic:.2,size:.7}},ci=[fe,jt,Ht,Lt],fi=k.memo(function({speed:e=fe.params.speed,frame:r=fe.params.frame,colorBack:t=fe.params.colorBack,colorHighlight:f=fe.params.colorHighlight,image:i="",highlights:s=fe.params.highlights,layering:a=fe.params.layering,waves:p=fe.params.waves,edges:l=fe.params.edges,caustic:m=fe.params.caustic,effectScale:u,size:h=u===void 0?fe.params.size:10/9/u-1/9,fit:_=fe.params.fit,scale:g=fe.params.scale,rotation:n=fe.params.rotation,originX:c=fe.params.originX,originY:d=fe.params.originY,offsetX:x=fe.params.offsetX,offsetY:w=fe.params.offsetY,worldWidth:v=fe.params.worldWidth,worldHeight:y=fe.params.worldHeight,...A}){const U={u_image:i,u_colorBack:C(t),u_colorHighlight:C(f),u_highlights:s,u_layering:a,u_waves:p,u_edges:l,u_caustic:m,u_size:h,u_fit:T[_],u_rotation:n,u_scale:g,u_offsetX:x,u_offsetY:w,u_originX:c,u_originY:d,u_worldWidth:v,u_worldHeight:y};return D.jsx(Y,{...A,speed:e,frame:r,fragmentShader:aa,mipmaps:["u_image"],uniforms:U})},j),ue={name:"Default",params:{...b,fit:"cover",speed:0,frame:0,colorFront:"#94ffaf",colorBack:"#000c38",colorHighlight:"#eaff94",type:"8x8",size:2,colorSteps:2,originalColors:!1,inverted:!1}},Kt={name:"Retro",params:{...b,fit:"cover",speed:0,frame:0,colorFront:"#eeeeee",colorBack:"#5452ff",colorHighlight:"#eeeeee",type:"2x2",size:3,colorSteps:1,originalColors:!0,inverted:!1}},qt={name:"Noise",params:{...b,fit:"cover",speed:0,frame:0,colorFront:"#a2997c",colorBack:"#000000",colorHighlight:"#ededed",type:"random",size:1,colorSteps:1,originalColors:!1,inverted:!1}},Jt={name:"Natural",params:{...b,fit:"cover",speed:0,frame:0,colorFront:"#ffffff",colorBack:"#000000",colorHighlight:"#ffffff",type:"8x8",size:2,colorSteps:5,originalColors:!0,inverted:!1}},ui=[ue,qt,Kt,Jt],mi=k.memo(function({speed:e=ue.params.speed,frame:r=ue.params.frame,colorFront:t=ue.params.colorFront,colorBack:f=ue.params.colorBack,colorHighlight:i=ue.params.colorHighlight,image:s="",type:a=ue.params.type,colorSteps:p=ue.params.colorSteps,originalColors:l=ue.params.originalColors,inverted:m=ue.params.inverted,pxSize:u,size:h=u===void 0?ue.params.size:u,fit:_=ue.params.fit,scale:g=ue.params.scale,rotation:n=ue.params.rotation,originX:c=ue.params.originX,originY:d=ue.params.originY,offsetX:x=ue.params.offsetX,offsetY:w=ue.params.offsetY,worldWidth:v=ue.params.worldWidth,worldHeight:y=ue.params.worldHeight,...A}){const U={u_image:s,u_colorFront:C(t),u_colorBack:C(f),u_colorHighlight:C(i),u_type:vo[a],u_pxSize:h,u_colorSteps:p,u_originalColors:l,u_inverted:m,u_fit:T[_],u_rotation:n,u_scale:g,u_offsetX:x,u_offsetY:w,u_originX:c,u_originY:d,u_worldWidth:v,u_worldHeight:y};return D.jsx(Y,{...A,speed:e,frame:r,fragmentShader:sa,uniforms:U})},j),Oe="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==",Zt=o=>typeof o=="object"&&typeof o.then=="function",ho=[];function $t(o,e){if(o===e)return!0;
5103if(!o||!e)return!1;const r=o.length;if(e.length!==r)return!1;for(let t=0;t<r;t++)if(o[t]!==e[t])return!1;return!0}function er(o,e=null){e===null&&(e=[o]);for(const t of ho)if($t(e,t.keys)){if(Object.prototype.hasOwnProperty.call(t,"error"))throw t.error;if(Object.prototype.hasOwnProperty.call(t,"response"))return t.response;throw t.promise}const r={keys:e,promise:(Zt(o)?o:o(...e)).then(t=>{r.response=t}).catch(t=>r.error=t)};throw ho.push(r),r.promise}const je=(o,e)=>er(o,e),ge={name:"Default",params:{...b,scale:.75,speed:1,frame:0,contour:.5,angle:0,noise:0,innerGlow:.5,outerGlow:.5,colorBack:"#000000",colors:["#11206a","#1f3ba2","#2f63e7","#6bd7ff","#ffe679","#ff991e","#ff4c00"]}},or={name:"Sepia",params:{...b,scale:.75,speed:.5,frame:0,contour:.5,angle:0,noise:.75,innerGlow:.5,outerGlow:.5,colorBack:"#000000",colors:["#997F45","#ffffff"]}},pi=[ge,or],di=k.memo(function({speed:e=ge.params.speed,frame:r=ge.params.frame,image:t="",contour:f=ge.params.contour,angle:i=ge.params.angle,noise:s=ge.params.noise,innerGlow:a=ge.params.innerGlow,outerGlow:p=ge.params.outerGlow,colorBack:l=ge.params.colorBack,colors:m=ge.params.colors,suspendWhenProcessingImage:u=!1,fit:h=ge.params.fit,offsetX:_=ge.params.offsetX,offsetY:g=ge.params.offsetY,originX:n=ge.params.originX,originY:c=ge.params.originY,rotation:d=ge.params.rotation,scale:x=ge.params.scale,worldHeight:w=ge.params.worldHeight,worldWidth:v=ge.params.worldWidth,...y}){const A=typeof t=="string"?t:t.src,[U,E]=k.useState(Oe);let R;u&&typeof window<"u"?R=je(()=>lo(A).then(F=>URL.createObjectURL(F.blob)),[A,"heatmap"]):R=U,k.useLayoutEffect(()=>{if(u)return;if(!A){E(Oe);return}let F,H=!0;return lo(A).then(N=>{H&&(F=URL.createObjectURL(N.blob),E(F))}),()=>{H=!1}},[A,u]);const B=k.useMemo(()=>({u_image:R,u_contour:f,u_angle:i,u_noise:s,u_innerGlow:a,u_outerGlow:p,u_colorBack:C(l),u_colors:m.map(C),u_colorsCount:m.length,u_fit:T[h],u_offsetX:_,u_offsetY:g,u_originX:n,u_originY:c,u_rotation:d,u_scale:x,u_worldHeight:w,u_worldWidth:v}),[e,r,f,i,s,a,p,m,l,R,h,_,g,n,c,d,x,w,v]);return D.jsx(Y,{...y,speed:e,frame:r,fragmentShader:na,mipmaps:["u_image"],uniforms:B})},j),ae={name:"Default",params:{...b,scale:.6,speed:1,frame:0,colorBack:"#AAAAAC",colorTint:"#ffffff",distortion:.07,repetition:2,shiftRed:.3,shiftBlue:.3,contour:.4,softness:.1,angle:70,shape:"diamond"}},ar={name:"Noir",params:{...b,scale:.6,speed:1,frame:0,colorBack:"#000000",colorTint:"#606060",softness:.45,repetition:1.5,shiftRed:0,shiftBlue:0,distortion:0,contour:0,angle:90,shape:"diamond"}},tr={name:"Backdrop",params:{...b,speed:1,frame:0,scale:1,colorBack:"#AAAAAC",colorTint:"#ffffff",softness:.05,repetition:1.5,shiftRed:.3,shiftBlue:.3,distortion:.1,contour:.4,shape:"none",angle:90,worldWidth:0,worldHeight:0}},rr={name:"Stripes",params:{...b,speed:1,frame:0,scale:.6,colorBack:"#000000",colorTint:"#2c5d72",softness:.8,repetition:6,shiftRed:1,shiftBlue:-1,distortion:.4,contour:.4,shape:"circle",angle:0}},gi=[ae,ar,tr,rr],hi=k.memo(function({colorBack:e=ae.params.colorBack,colorTint:r=ae.params.colorTint,speed:t=ae.params.speed,frame:f=ae.params.frame,image:i="",contour:s=ae.params.contour,distortion:a=ae.params.distortion,softness:p=ae.params.softness,repetition:l=ae.params.repetition,shiftRed:m=ae.params.shiftRed,shiftBlue:u=ae.params.shiftBlue,angle:h=ae.params.angle,shape:_=ae.params.shape,suspendWhenProcessingImage:g=!1,fit:n=ae.params.fit,scale:c=ae.params.scale,rotation:d=ae.params.rotation,originX:x=ae.params.originX,originY:w=ae.params.originY,offsetX:v=ae.params.offsetX,offsetY:y=ae.params.offsetY,worldWidth:A=ae.params.worldWidth,worldHeight:U=ae.params.worldHeight,...E}){const R=typeof i=="string"?i:i.src,[B,F]=k.useState(Oe);let H;g&&typeof window<"u"&&R?H=je(()=>fo(R).then(te=>URL.createObjectURL(te.pngBlob)),[R,"liquid-metal"]):H=B,k.useLayoutEffect(()=>{if(g)return;if(!R){F(Oe);return}let te,G=!0;return fo(R).then(Q=>{G&&(te=URL.createObjectURL(Q.pngBlob),F(te))}),()=>{G=!1}},[R,g]);const N={u_colorBack:C(e),u_colorTint:C(r),u_image:H,u_contour:s,u_distortion:a,u_softness:p,u_repetition:l,u_shiftRed:m,u_shiftBlue:u,u_angle:h,u_isImage:!!i,u_shape:ua[_],u_fit:T[n],u_scale:c,u_rotation:d,u_offsetX:v,u_offsetY:y,u_originX:x,u_originY:w,u_worldWidth:A,u_worldHeight:U};return D.jsx(Y,{...E,speed:t,frame:f,fragmentShader:la,mipmaps:["u_image"],uniforms:N})}),q={name:"Default",params:{...b,fit:"cover",speed:0,frame:0,colorBack:"#f2f1e8",colorFront:"#2b2b2b",size:.5,radius:1.25,contrast:.4,originalColors:!1,inverted:!1,grainMixer:.2,grainOverlay:.2,grainSize:.5,grid:"hex",type:"gooey"}},ir={name:"LED screen",params:{...b,fit:"cover",speed:0,frame:0,colorBack:"#000000",colorFront:"#29ff7b",size:.5,radius:1.5,contrast:.3,originalColors:!1,inverted:!1,grainMixer:0,grainOverlay:0,grainSize:.5,grid:"square",type:"soft"}},sr={name:"Mosaic",params:{...b,fit:"cover",speed:0,frame:0,colorBack:"#000000",colorFront:"#b2aeae",size:.6,radius:2,contrast:.01,originalColors:!0,inverted:!1,grainMixer:0,grainOverlay:0,grainSize:.5,grid:"hex",type:"classic"}},nr={name:"Round and square",params:{...b,fit:"cover",speed:0,frame:0,colorBack:"#141414",colorFront:"#ff8000",size:.8,radius:1,contrast:1,originalColors:!1,inverted:!0,grainMixer:.05,grainOverlay:.3,grainSize:.5,grid:"square",type:"holes"}},vi=[q,ir,sr,nr],_i=k.memo(function({speed:e=q.params.speed,frame:r=q.params.frame,colorFront:t=q.params.colorFront,colorBack:f=q.params.colorBack,image:i="",size:s=q.params.size,radius:a=q.params.radius,contrast:p=q.params.contrast,originalColors:l=q.params.originalColors,inverted:m=q.params.inverted,grainMixer:u=q.params.grainMixer,grainOverlay:h=q.params.grainOverlay,grainSize:_=q.params.grainSize,grid:g=q.params.grid,type:n=q.params.type,fit:c=q.params.fit,scale:d=q.params.scale,rotation:x=q.params.rotation,originX:w=q.params.originX,originY:v=q.params.originY,offsetX:y=q.params.offsetX,offsetY:A=q.params.offsetY,worldWidth:U=q.params.worldWidth,worldHeight:E=q.params.worldHeight,...R}){const B={u_image:i,u_colorFront:C(t),u_colorBack:C(f),u_size:s,u_radius:a,u_contrast:p,u_originalColors:l,u_inverted:m,u_grainMixer:u,u_grainOverlay:h,u_grainSize:_,u_grid:da[g],u_type:pa[n],u_fit:T[c],u_rotation:x,u_scale:d,u_offsetX:y,u_offsetY:A,u_originX:w,u_originY:v,u_worldWidth:U,u_worldHeight:E};return D.jsx(Y,{...R,speed:e,frame:r,fragmentShader:ma,uniforms:B})},j),O={name:"Default",params:{...b,scale:1,fit:"cover",speed:0,frame:0,colorBack:"#fbfaf5",colorC:"#00b4ff",colorM:"#fc519f",colorY:"#ffd800",colorK:"#231f20",size:.2,contrast:1,softness:1,grainSize:.5,grainMixer:0,grainOverlay:0,gridNoise:.2,floodC:.15,floodM:0,floodY:0,floodK:0,gainC:.3,gainM:0,gainY:.2,gainK:0,type:"ink"}},lr={name:"Drops",params:{...b,scale:1,fit:"cover",speed:0,frame:0,colorBack:"#eeefd7",colorC:"#00b2ff",colorM:"#fc4f4f",colorY:"#ffd900",colorK:"#231f20",size:.88,contrast:1.15,softness:0,grainSize:.01,grainMixer:.05,grainOverlay:.25,gridNoise:.5,floodC:.15,floodM:0,floodY:0,floodK:0,gainC:1,gainM:.44,gainY:-1,gainK:0,type:"ink"}},cr={name:"Newspaper",params:{...b,scale:1,fit:"cover",speed:0,frame:0,colorBack:"#f2f1e8",colorC:"#7a7a75",colorM:"#7a7a75",colorY:"#7a7a75",colorK:"#231f20",size:.01,contrast:2,softness:.2,grainSize:0,grainMixer:0,grainOverlay:.2,gridNoise:.6,floodC:0,floodM:0,floodY:0,floodK:.1,gainC:-.17,gainM:-.45,gainY:-.45,gainK:0,type:"dots"}},fr={name:"Vintage",params:{...b,scale:1,fit:"cover",speed:0,frame:0,colorBack:"#fffaf0",colorC:"#59afc5",colorM:"#d8697c",colorY:"#fad85c",colorK:"#2d2824",size:.2,contrast:1.25,softness:.4,grainSize:.5,grainMixer:.15,grainOverlay:.1,gridNoise:.45,floodC:.15,floodM:0,floodY:0,floodK:0,gainC:.3,gainM:0,gainY:.2,gainK:0,type:"sharp"}},xi=[O,lr,cr,fr],yi=k.memo(function({speed:e=O.params.speed,frame:r=O.params.frame,colorBack:t=O.params.colorBack,colorC:f=O.params.colorC,colorM:i=O.params.colorM,colorY:s=O.params.colorY,colorK:a=O.params.colorK,image:p="",size:l=O.params.size,contrast:m=O.params.contrast,
5103softness:u=O.params.softness,grainSize:h=O.params.grainSize,grainMixer:_=O.params.grainMixer,grainOverlay:g=O.params.grainOverlay,gridNoise:n=O.params.gridNoise,floodC:c=O.params.floodC,floodM:d=O.params.floodM,floodY:x=O.params.floodY,floodK:w=O.params.floodK,gainC:v=O.params.gainC,gainM:y=O.params.gainM,gainY:A=O.params.gainY,gainK:U=O.params.gainK,type:E=O.params.type,fit:R=O.params.fit,scale:B=O.params.scale,rotation:F=O.params.rotation,originX:H=O.params.originX,originY:N=O.params.originY,offsetX:te=O.params.offsetX,offsetY:G=O.params.offsetY,worldWidth:Q=O.params.worldWidth,worldHeight:ke=O.params.worldHeight,...Ve}){const Re={u_image:p,u_noiseTexture:Ie(),u_colorBack:C(t),u_colorC:C(f),u_colorM:C(i),u_colorY:C(s),u_colorK:C(a),u_size:l,u_contrast:m,u_softness:u,u_grainSize:h,u_grainMixer:_,u_grainOverlay:g,u_gridNoise:n,u_floodC:c,u_floodM:d,u_floodY:x,u_floodK:w,u_gainC:v,u_gainM:y,u_gainY:A,u_gainK:U,u_type:ha[E],u_fit:T[R],u_rotation:F,u_scale:B,u_offsetX:te,u_offsetY:G,u_originX:H,u_originY:N,u_worldWidth:Q,u_worldHeight:ke};return D.jsx(Y,{...Ve,speed:e,frame:r,fragmentShader:ga,uniforms:Re})},j),Z={name:"Default",params:{...b,scale:.6,speed:1,frame:0,colorBack:"#f0efea",colorInner:"#fafaf5",colors:["#333333","#e7e6df"],outerGlow:.55,innerGlow:1,innerDistortion:.8,outerDistortion:.6,offset:0,angle:0,size:.8,shape:"diamond"}},ur={name:"Fluorescent",params:{...b,scale:.6,speed:1,frame:0,colorBack:"#000000",colorInner:"#000000",colors:["#2fb64c","#cdff61","#ffffff"],outerGlow:0,innerGlow:1,innerDistortion:1,outerDistortion:.8,offset:0,angle:0,size:.8,shape:"diamond"}},mr={name:"Fire",params:{...b,scale:.6,speed:1,frame:0,colorBack:"#000000",colorInner:"#000000",colors:["#fe5b16","#f7ff61","#ffffff"],outerGlow:1,innerGlow:.65,innerDistortion:.6,outerDistortion:.8,offset:0,angle:0,size:.8,shape:"diamond"}},pr={name:"Infrared",params:{...b,scale:.6,speed:.5,frame:0,colorBack:"#cd28dc",colorInner:"#00000000",colors:["#ff9900","#fff67a","#dcff52","#00ffbb","#0077ff"],outerGlow:1,innerGlow:1,innerDistortion:1,outerDistortion:1,offset:.2,angle:0,size:1,shape:"diamond"}},wi=[Z,mr,ur,pr],bi=k.memo(function({colorBack:e=Z.params.colorBack,colors:r=Z.params.colors,speed:t=Z.params.speed,frame:f=Z.params.frame,image:i="",innerDistortion:s=Z.params.innerDistortion,outerDistortion:a=Z.params.outerDistortion,outerGlow:p=Z.params.outerGlow,innerGlow:l=Z.params.innerGlow,colorInner:m=Z.params.colorInner,offset:u=Z.params.offset,angle:h=Z.params.angle,size:_=Z.params.size,shape:g=Z.params.shape,suspendWhenProcessingImage:n=!1,fit:c=Z.params.fit,scale:d=Z.params.scale,rotation:x=Z.params.rotation,originX:w=Z.params.originX,originY:v=Z.params.originY,offsetX:y=Z.params.offsetX,offsetY:A=Z.params.offsetY,worldWidth:U=Z.params.worldWidth,worldHeight:E=Z.params.worldHeight,...R}){const B=typeof i=="string"?i:i.src,[F,H]=k.useState(Oe);let N;n&&typeof window<"u"&&B?N=je(()=>mo(B).then(G=>URL.createObjectURL(G.pngBlob)),[B,"gemSmoke"]):N=F,k.useLayoutEffect(()=>{if(n)return;if(!B){H(Oe);return}let G,Q=!0;return mo(B).then(ke=>{Q&&(G=URL.createObjectURL(ke.pngBlob),H(G))}),()=>{Q=!1}},[B,n]);const te={u_colors:r.map(C),u_colorsCount:r.length,u_colorBack:C(e),u_image:N,u_innerDistortion:s,u_outerDistortion:a,u_outerGlow:p,u_innerGlow:l,u_colorInner:C(m),u_offset:u,u_angle:h,u_size:_,u_isImage:!!i,u_shape:ya[g],u_fit:T[c],u_scale:d,u_rotation:x,u_offsetX:y,u_offsetY:A,u_originX:w,u_originY:v,u_worldWidth:U,u_worldHeight:E};return D.jsx(Y,{...R,speed:t,frame:f,fragmentShader:va,mipmaps:["u_image"],uniforms:te})},j);export{ei as ColorPanels,jr as Dithering,Ur as DotGrid,Sr as DotOrbit,li as FlutedGlass,bi as GemSmoke,Tr as GodRays,qr as GrainGradient,yi as HalftoneCmyk,_i as HalftoneDots,di as Heatmap,mi as ImageDithering,hi as LiquidMetal,yr as MeshGradient,Fr as Metaballs,Cr as NeuroNoise,si as PaperTexture,Pr as PerlinNoise,Zr as PulsingBorder,Y as ShaderMount,Ir as SimplexNoise,br as SmokeRing,Qr as Spiral,ai as StaticMeshGradient,ri as StaticRadialGradient,Hr as Swirl,Dr as Voronoi,Gr as Warp,fi as Water,Mr as Waves,Qe as colorPanelsMeta,$r as colorPanelsPresets,Lr as ditheringPresets,kr as dotGridPresets,Ze as dotOrbitMeta,Br as dotOrbitPresets,ni as flutedGlassPresets,wi as gemSmokePresets,C as getShaderColorFromString,ao as godRaysMeta,Wr as godRaysPresets,ro as grainGradientMeta,Kr as grainGradientPresets,xi as halftoneCmykPresets,vi as halftoneDotsPresets,no as heatmapMeta,pi as heatmapPresets,ui as imageDitheringPresets,_r as isPaperShaderElement,gi as liquidMetalPresets,Je as meshGradientMeta,xr as meshGradientPresets,Te as metaballsMeta,Rr as metaballsPresets,Ar as neuroNoisePresets,ii as paperTexturePresets,Or as perlinNoisePresets,Ne as pulsingBorderMeta,Jr as pulsingBorderPresets,$e as simplexNoiseMeta,Vr as simplexNoisePresets,We as smokeRingMeta,wr as smokeRingPresets,Nr as spiralPresets,io as staticMeshGradientMeta,oi as staticMeshGradientPresets,so as staticRadialGradientMeta,ti as staticRadialGradientPresets,to as swirlMeta,Xr as swirlPresets,eo as voronoiMeta,Er as voronoiPresets,oo as warpMeta,Yr as warpPresets,ci as waterPresets,zr as wavesPresets};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.