shaders-oneshot 0.0.81-shared.1

package/dist/shaders/fluted-glass.js

@@ -0,0 +1,361 @@
+/* * * * * * * * * * * * * * * * * * * * * * * * * * * *
+ *                    Paper Shaders                    *
+ *       https://github.com/paper-design/shaders       *
+ * * * * * * * * * * * * * * * * * * * * * * * * * * * */
+
+import {} from "../shader-sizing.js";
+import { declarePI, rotation2, proceduralHash21 } from "../shader-utils.js";
+const flutedGlassFragmentShader = `#version 300 es
+precision mediump float;
+
+uniform vec2 u_resolution;
+uniform float u_pixelRatio;
+
+uniform vec4 u_colorBack;
+uniform vec4 u_colorShadow;
+uniform vec4 u_colorHighlight;
+
+uniform sampler2D u_image;
+uniform float u_imageAspectRatio;
+
+uniform float u_size;
+uniform float u_shadows;
+uniform float u_angle;
+uniform float u_stretch;
+uniform float u_shape;
+uniform float u_distortion;
+uniform float u_highlights;
+uniform float u_distortionShape;
+uniform float u_shift;
+uniform float u_blur;
+uniform float u_edges;
+uniform float u_marginLeft;
+uniform float u_marginRight;
+uniform float u_marginTop;
+uniform float u_marginBottom;
+uniform float u_grainMixer;
+uniform float u_grainOverlay;
+
+in vec2 v_imageUV;
+
+out vec4 fragColor;
+
+${declarePI}
+${rotation2}
+${proceduralHash21}
+
+float valueNoise(vec2 st) {
+  vec2 i = floor(st);
+  vec2 f = fract(st);
+  float a = hash21(i);
+  float b = hash21(i + vec2(1.0, 0.0));
+  float c = hash21(i + vec2(0.0, 1.0));
+  float d = hash21(i + vec2(1.0, 1.0));
+  vec2 u = f * f * (3.0 - 2.0 * f);
+  float x1 = mix(a, b, u.x);
+  float x2 = mix(c, d, u.x);
+  return mix(x1, x2, u.y);
+}
+
+float getUvFrame(vec2 uv, float softness) {
+  float aax = 2. * fwidth(uv.x);
+  float aay = 2. * fwidth(uv.y);
+  float left   = smoothstep(0., aax + softness, uv.x);
+  float right  = 1. - smoothstep(1. - softness - aax, 1., uv.x);
+  float bottom = smoothstep(0., aay + softness, uv.y);
+  float top    = 1. - smoothstep(1. - softness - aay, 1., uv.y);
+  return left * right * bottom * top;
+}
+
+const int MAX_RADIUS = 50;
+vec4 samplePremultiplied(sampler2D tex, vec2 uv) {
+  vec4 c = texture(tex, uv);
+  c.rgb *= c.a;
+  return c;
+}
+vec4 getBlur(sampler2D tex, vec2 uv, vec2 texelSize, vec2 dir, float sigma) {
+  if (sigma <= .5) return texture(tex, uv);
+  int radius = int(min(float(MAX_RADIUS), ceil(3.0 * sigma)));
+
+  float twoSigma2 = 2.0 * sigma * sigma;
+  float gaussianNorm = 1.0 / sqrt(TWO_PI * sigma * sigma);
+
+  vec4 sum = samplePremultiplied(tex, uv) * gaussianNorm;
+  float weightSum = gaussianNorm;
+
+  for (int i = 1; i <= MAX_RADIUS; i++) {
+    if (i > radius) break;
+
+    float x = float(i);
+    float w = exp(-(x * x) / twoSigma2) * gaussianNorm;
+
+    vec2 offset = dir * texelSize * x;
+    vec4 s1 = samplePremultiplied(tex, uv + offset);
+    vec4 s2 = samplePremultiplied(tex, uv - offset);
+
+    sum += (s1 + s2) * w;
+    weightSum += 2.0 * w;
+  }
+
+  vec4 result = sum / weightSum;
+  if (result.a > 0.) {
+    result.rgb /= result.a;
+  }
+
+  return result;
+}
+
+vec2 rotateAspect(vec2 p, float a, float aspect) {
+  p.x *= aspect;
+  p = rotate(p, a);
+  p.x /= aspect;
+  return p;
+}
+
+float smoothFract(float x) {
+  float f = fract(x);
+  float w = fwidth(x);
+
+  float edge = abs(f - 0.5) - 0.5;
+  float band = smoothstep(-w, w, edge);
+
+  return mix(f, 1.0 - f, band);
+}
+
+void main() {
+
+  float patternRotation = -u_angle * PI / 180.;
+  float patternSize = mix(200., 5., u_size);
+
+  vec2 uv = v_imageUV;
+
+  vec2 uvMask = gl_FragCoord.xy / u_resolution.xy;
+  vec2 sw = vec2(.005);
+  vec4 margins = vec4(u_marginLeft, u_marginTop, u_marginRight, u_marginBottom);
+  float mask =
+  smoothstep(margins[0], margins[0] + sw.x, uvMask.x + sw.x) *
+  smoothstep(margins[2], margins[2] + sw.x, 1.0 - uvMask.x + sw.x) *
+  smoothstep(margins[1], margins[1] + sw.y, uvMask.y + sw.y) *
+  smoothstep(margins[3], margins[3] + sw.y, 1.0 - uvMask.y + sw.y);
+  float maskOuter =
+  smoothstep(margins[0] - sw.x, margins[0], uvMask.x + sw.x) *
+  smoothstep(margins[2] - sw.x, margins[2], 1.0 - uvMask.x + sw.x) *
+  smoothstep(margins[1] - sw.y, margins[1], uvMask.y + sw.y) *
+  smoothstep(margins[3] - sw.y, margins[3], 1.0 - uvMask.y + sw.y);
+  float maskStroke = maskOuter - mask;
+  float maskInner =
+  smoothstep(margins[0] - 2. * sw.x, margins[0], uvMask.x) *
+  smoothstep(margins[2] - 2. * sw.x, margins[2], 1.0 - uvMask.x) *
+  smoothstep(margins[1] - 2. * sw.y, margins[1], uvMask.y) *
+  smoothstep(margins[3] - 2. * sw.y, margins[3], 1.0 - uvMask.y);
+  float maskStrokeInner = maskInner - mask;
+
+  uv -= .5;
+  uv *= patternSize;
+  uv = rotateAspect(uv, patternRotation, u_imageAspectRatio);
+
+  float curve = 0.;
+  float patternY = uv.y / u_imageAspectRatio;
+  if (u_shape > 4.5) {
+    // pattern
+    curve = .5 + .5 * sin(.5 * PI * uv.x) * cos(.5 * PI * patternY);
+  } else if (u_shape > 3.5) {
+    // zigzag
+    curve = 10. * abs(fract(.1 * patternY) - .5);
+  } else if (u_shape > 2.5) {
+    // wave
+    curve = 4. * sin(.23 * patternY);
+  } else if (u_shape > 1.5) {
+    // lines irregular
+    curve = .5 + .5 * sin(.5 * uv.x) * sin(1.7 * uv.x);
+  } else {
+    // lines
+  }
+
+  vec2 UvToFract = uv + curve;
+  vec2 fractOrigUV = fract(uv);
+  vec2 floorOrigUV = floor(uv);
+
+  float x = smoothFract(UvToFract.x);
+  float xNonSmooth = fract(UvToFract.x) + .0001;
+
+  float highlightsWidth = 2. * max(.001, fwidth(UvToFract.x));
+  highlightsWidth += 2. * maskStrokeInner;
+  float highlights = smoothstep(0., highlightsWidth, xNonSmooth);
+  highlights *= smoothstep(1., 1. - highlightsWidth, xNonSmooth);
+  highlights = 1. - highlights;
+  highlights *= u_highlights;
+  highlights = clamp(highlights, 0., 1.);
+  highlights *= mask;
+
+  float shadows = pow(x, 1.3);
+  float distortion = 0.;
+  float fadeX = 1.;
+  float frameFade = 0.;
+
+  float aa = fwidth(xNonSmooth);
+  aa = max(aa, fwidth(uv.x));
+  aa = max(aa, fwidth(UvToFract.x));
+  aa = max(aa, .0001);
+
+  if (u_distortionShape == 1.) {
+    distortion = -pow(1.5 * x, 3.);
+    distortion += (.5 - u_shift);
+
+    frameFade = pow(1.5 * x, 3.);
+    aa = max(.2, aa);
+    aa += mix(.2, 0., u_size);
+    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);
+    distortion = mix(.5, distortion, fadeX);
+  } else if (u_distortionShape == 2.) {
+    distortion = 2. * pow(x, 2.);
+    distortion -= (.5 + u_shift);
+
+    frameFade = pow(abs(x - .5), 4.);
+    aa = max(.2, aa);
+    aa += mix(.2, 0., u_size);
+    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);
+    distortion = mix(.5, distortion, fadeX);
+    frameFade = mix(1., frameFade, .5 * fadeX);
+  } else if (u_distortionShape == 3.) {
+    distortion = pow(2. * (xNonSmooth - .5), 6.);
+    distortion -= .25;
+    distortion -= u_shift;
+
+    frameFade = 1. - 2. * pow(abs(x - .4), 2.);
+    aa = .15;
+    aa += mix(.1, 0., u_size);
+    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);
+    frameFade = mix(1., frameFade, fadeX);
+
+  } else if (u_distortionShape == 4.) {
+    x = xNonSmooth;
+    distortion = sin((x + .25) * TWO_PI);
+    shadows = .5 + .5 * asin(distortion) / (.5 * PI);
+    distortion *= .5;
+    distortion -= u_shift;
+    frameFade = .5 + .5 * sin(x * TWO_PI);
+  } else if (u_distortionShape == 5.) {
+    distortion -= pow(abs(x), .2) * x;
+    distortion += .33;
+    distortion -= 3. * u_shift;
+    distortion *= .33;
+
+    frameFade = .3 * (smoothstep(.0, 1., x));
+    shadows = pow(x, 2.5);
+
+    aa = max(.1, aa);
+    aa += mix(.1, 0., u_size);
+    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);
+    distortion *= fadeX;
+  }
+
+  vec2 dudx = dFdx(v_imageUV);
+  vec2 dudy = dFdy(v_imageUV);
+  vec2 grainUV = v_imageUV - .5;
+  grainUV *= (.8 / vec2(length(dudx), length(dudy)));
+  grainUV += .5;
+  if (u_grainMixer > 0.) {
+    float grain = valueNoise(grainUV);
+    grain = smoothstep(.4, .7, grain);
+    grain *= u_grainMixer;
+    distortion = mix(distortion, 0., grain);
+  }
+
+  shadows = min(shadows, 1.);
+  shadows += maskStrokeInner;
+  shadows *= mask;
+  shadows = min(shadows, 1.);
+  shadows *= pow(u_shadows, 2.);
+  shadows = clamp(shadows, 0., 1.);
+
+  distortion *= 3. * u_distortion;
+  frameFade *= u_distortion;
+
+  fractOrigUV.x += distortion;
+  floorOrigUV = rotateAspect(floorOrigUV, -patternRotation, u_imageAspectRatio);
+  fractOrigUV = rotateAspect(fractOrigUV, -patternRotation, u_imageAspectRatio);
+
+  uv = (floorOrigUV + fractOrigUV) / patternSize;
+  uv += pow(maskStroke, 4.);
+
+  uv += vec2(.5);
+
+  uv = mix(v_imageUV, uv, smoothstep(0., .7, mask));
+  float blur = mix(0., 50., u_blur);
+  blur = mix(0., blur, smoothstep(.5, 1., mask));
+
+  float edgeDistortion = mix(.0, .04, u_edges);
+  edgeDistortion += .06 * frameFade * u_edges;
+  edgeDistortion *= mask;
+  float frame = getUvFrame(uv, edgeDistortion);
+
+  float stretch = 1. - smoothstep(0., .5, xNonSmooth) * smoothstep(1., 1. - .5, xNonSmooth);
+  stretch = pow(stretch, 2.);
+  stretch *= mask;
+  stretch *= getUvFrame(uv, .1 + .05 * mask * frameFade);
+  uv.y = mix(uv.y, .5, u_stretch * stretch);
+
+  vec4 image = getBlur(u_image, uv, 1. / u_resolution / u_pixelRatio, vec2(0., 1.), blur);
+  image.rgb *= image.a;
+  vec4 backColor = u_colorBack;
+  backColor.rgb *= backColor.a;
+  vec4 highlightColor = u_colorHighlight;
+  highlightColor.rgb *= highlightColor.a;
+  vec4 shadowColor = u_colorShadow;
+
+  vec3 color = highlightColor.rgb * highlights;
+  float opacity = highlightColor.a * highlights;
+
+  shadows = mix(shadows * shadowColor.a, 0., highlights);
+  color = mix(color, shadowColor.rgb * shadowColor.a, .5 * shadows);
+  color += .5 * pow(shadows, .5) * shadowColor.rgb;
+  opacity += shadows;
+  color = clamp(color, vec3(0.), vec3(1.));
+  opacity = clamp(opacity, 0., 1.);
+
+  color += image.rgb * (1. - opacity) * frame;
+  opacity += image.a * (1. - opacity) * frame;
+
+  color += backColor.rgb * (1. - opacity);
+  opacity += backColor.a * (1. - opacity);
+
+  if (u_grainOverlay > 0.) {
+    float grainOverlay = valueNoise(rotate(grainUV, 1.) + vec2(3.));
+    grainOverlay = mix(grainOverlay, valueNoise(rotate(grainUV, 2.) + vec2(-1.)), .5);
+    grainOverlay = pow(grainOverlay, 1.3);
+
+    float grainOverlayV = grainOverlay * 2. - 1.;
+    vec3 grainOverlayColor = vec3(step(0., grainOverlayV));
+    float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV);
+    grainOverlayStrength = pow(grainOverlayStrength, .8);
+    grainOverlayStrength *= mask;
+    color = mix(color, grainOverlayColor, .35 * grainOverlayStrength);
+
+    opacity += .5 * grainOverlayStrength;
+  }
+  opacity = clamp(opacity, 0., 1.);
+
+  fragColor = vec4(color, opacity);
+}
+`;
+const GlassGridShapes = {
+  lines: 1,
+  linesIrregular: 2,
+  wave: 3,
+  zigzag: 4,
+  pattern: 5
+};
+const GlassDistortionShapes = {
+  prism: 1,
+  lens: 2,
+  contour: 3,
+  cascade: 4,
+  flat: 5
+};
+export {
+  GlassDistortionShapes,
+  GlassGridShapes,
+  flutedGlassFragmentShader
+};
+//# sourceMappingURL=fluted-glass.js.map

package/dist/shaders/fluted-glass.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/shaders/fluted-glass.ts"],
+  "sourcesContent": ["import type { ShaderMotionParams } from '../shader-mount.js';\r\nimport { type ShaderSizingParams, type ShaderSizingUniforms } from '../shader-sizing.js';\r\nimport { declarePI, rotation2, proceduralHash21 } from '../shader-utils.js';\r\n\r\n/**\r\n * Fluted glass image filter that transforms an image into streaked, ribbed distortions,\r\n * giving a mix of clarity and obscurity.\r\n *\r\n * Fragment shader uniforms:\r\n * - u_resolution (vec2): Canvas resolution in pixels\r\n * - u_pixelRatio (float): Device pixel ratio\r\n * - u_image (sampler2D): Source image texture\r\n * - u_imageAspectRatio (float): Aspect ratio of the source image\r\n * - u_colorBack (vec4): Background color in RGBA\r\n * - u_colorShadow (vec4): Shadows color in RGBA, needs shadows > 0\r\n * - u_colorHighlight (vec4): Highlights color in RGBA, needs highlights > 0\r\n * - u_shadows (float): Color gradient added over image and background, following distortion shape, needs colorShadow alpha > 0 (0 to 1)\r\n * - u_highlights (float): Thin strokes along distortion shape, useful for antialiasing on small grid (0 to 1)\r\n * - u_size (float): Size of the distortion shape grid (0 to 1)\r\n * - u_shape (float): Grid shape (1 = lines, 2 = linesIrregular, 3 = wave, 4 = zigzag, 5 = pattern)\r\n * - u_angle (float): Direction of the grid relative to the image in degrees (0 to 180)\r\n * - u_distortionShape (float): Shape of distortion (1 = prism, 2 = lens, 3 = contour, 4 = cascade, 5 = flat)\r\n * - u_distortion (float): Power of distortion applied within each stripe (0 to 1)\r\n * - u_shift (float): Texture shift in direction opposite to the grid, needs distortion > 0 (-1 to 1)\r\n * - u_stretch (float): Extra distortion along the grid lines (0 to 1)\r\n * - u_blur (float): One-directional blur over the image and extra blur around edges (0 to 1)\r\n * - u_edges (float): Glass distortion and softness on the image edges (0 to 1)\r\n * - u_marginLeft (float): Distance from the left edge to the effect (0 to 1)\r\n * - u_marginRight (float): Distance from the right edge to the effect (0 to 1)\r\n * - u_marginTop (float): Distance from the top edge to the effect (0 to 1)\r\n * - u_marginBottom (float): Distance from the bottom edge to the effect (0 to 1)\r\n * - u_grainMixer (float): Strength of grain distortion applied to shape edges, needs distortion > 0 (0 to 1)\r\n * - u_grainOverlay (float): Post-processing black/white grain overlay (0 to 1)\r\n *\r\n * Vertex shader outputs (used in fragment shader):\r\n * - v_imageUV (vec2): Image UV coordinates with global sizing (rotation, scale, offset, etc) applied\r\n *\r\n * Vertex shader uniforms:\r\n * - u_resolution (vec2): Canvas resolution in pixels\r\n * - u_pixelRatio (float): Device pixel ratio\r\n * - u_originX (float): Reference point for positioning world width in the canvas (0 to 1)\r\n * - u_originY (float): Reference point for positioning world height in the canvas (0 to 1)\r\n * - u_fit (float): How to fit the rendered shader into the canvas dimensions (0 = none, 1 = contain, 2 = cover)\r\n * - u_scale (float): Overall zoom level of the graphics (0.1 to 4)\r\n * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)\r\n * - u_offsetX (float): Horizontal offset of the graphics center (-1 to 1)\r\n * - u_offsetY (float): Vertical offset of the graphics center (-1 to 1)\r\n * - u_imageAspectRatio (float): Aspect ratio of the source image\r\n *\r\n */\r\n\r\n// language=GLSL\r\nexport const flutedGlassFragmentShader: string = `#version 300 es\r\nprecision mediump float;\r\n\r\nuniform vec2 u_resolution;\r\nuniform float u_pixelRatio;\r\n\r\nuniform vec4 u_colorBack;\r\nuniform vec4 u_colorShadow;\r\nuniform vec4 u_colorHighlight;\r\n\r\nuniform sampler2D u_image;\r\nuniform float u_imageAspectRatio;\r\n\r\nuniform float u_size;\r\nuniform float u_shadows;\r\nuniform float u_angle;\r\nuniform float u_stretch;\r\nuniform float u_shape;\r\nuniform float u_distortion;\r\nuniform float u_highlights;\r\nuniform float u_distortionShape;\r\nuniform float u_shift;\r\nuniform float u_blur;\r\nuniform float u_edges;\r\nuniform float u_marginLeft;\r\nuniform float u_marginRight;\r\nuniform float u_marginTop;\r\nuniform float u_marginBottom;\r\nuniform float u_grainMixer;\r\nuniform float u_grainOverlay;\r\n\r\nin vec2 v_imageUV;\r\n\r\nout vec4 fragColor;\r\n\r\n${ declarePI }\r\n${ rotation2 }\r\n${ proceduralHash21 }\r\n\r\nfloat valueNoise(vec2 st) {\r\n  vec2 i = floor(st);\r\n  vec2 f = fract(st);\r\n  float a = hash21(i);\r\n  float b = hash21(i + vec2(1.0, 0.0));\r\n  float c = hash21(i + vec2(0.0, 1.0));\r\n  float d = hash21(i + vec2(1.0, 1.0));\r\n  vec2 u = f * f * (3.0 - 2.0 * f);\r\n  float x1 = mix(a, b, u.x);\r\n  float x2 = mix(c, d, u.x);\r\n  return mix(x1, x2, u.y);\r\n}\r\n\r\nfloat getUvFrame(vec2 uv, float softness) {\r\n  float aax = 2. * fwidth(uv.x);\r\n  float aay = 2. * fwidth(uv.y);\r\n  float left   = smoothstep(0., aax + softness, uv.x);\r\n  float right  = 1. - smoothstep(1. - softness - aax, 1., uv.x);\r\n  float bottom = smoothstep(0., aay + softness, uv.y);\r\n  float top    = 1. - smoothstep(1. - softness - aay, 1., uv.y);\r\n  return left * right * bottom * top;\r\n}\r\n\r\nconst int MAX_RADIUS = 50;\r\nvec4 samplePremultiplied(sampler2D tex, vec2 uv) {\r\n  vec4 c = texture(tex, uv);\r\n  c.rgb *= c.a;\r\n  return c;\r\n}\r\nvec4 getBlur(sampler2D tex, vec2 uv, vec2 texelSize, vec2 dir, float sigma) {\r\n  if (sigma <= .5) return texture(tex, uv);\r\n  int radius = int(min(float(MAX_RADIUS), ceil(3.0 * sigma)));\r\n\r\n  float twoSigma2 = 2.0 * sigma * sigma;\r\n  float gaussianNorm = 1.0 / sqrt(TWO_PI * sigma * sigma);\r\n\r\n  vec4 sum = samplePremultiplied(tex, uv) * gaussianNorm;\r\n  float weightSum = gaussianNorm;\r\n\r\n  for (int i = 1; i <= MAX_RADIUS; i++) {\r\n    if (i > radius) break;\r\n\r\n    float x = float(i);\r\n    float w = exp(-(x * x) / twoSigma2) * gaussianNorm;\r\n\r\n    vec2 offset = dir * texelSize * x;\r\n    vec4 s1 = samplePremultiplied(tex, uv + offset);\r\n    vec4 s2 = samplePremultiplied(tex, uv - offset);\r\n\r\n    sum += (s1 + s2) * w;\r\n    weightSum += 2.0 * w;\r\n  }\r\n\r\n  vec4 result = sum / weightSum;\r\n  if (result.a > 0.) {\r\n    result.rgb /= result.a;\r\n  }\r\n\r\n  return result;\r\n}\r\n\r\nvec2 rotateAspect(vec2 p, float a, float aspect) {\r\n  p.x *= aspect;\r\n  p = rotate(p, a);\r\n  p.x /= aspect;\r\n  return p;\r\n}\r\n\r\nfloat smoothFract(float x) {\r\n  float f = fract(x);\r\n  float w = fwidth(x);\r\n\r\n  float edge = abs(f - 0.5) - 0.5;\r\n  float band = smoothstep(-w, w, edge);\r\n\r\n  return mix(f, 1.0 - f, band);\r\n}\r\n\r\nvoid main() {\r\n\r\n  float patternRotation = -u_angle * PI / 180.;\r\n  float patternSize = mix(200., 5., u_size);\r\n\r\n  vec2 uv = v_imageUV;\r\n\r\n  vec2 uvMask = gl_FragCoord.xy / u_resolution.xy;\r\n  vec2 sw = vec2(.005);\r\n  vec4 margins = vec4(u_marginLeft, u_marginTop, u_marginRight, u_marginBottom);\r\n  float mask =\r\n  smoothstep(margins[0], margins[0] + sw.x, uvMask.x + sw.x) *\r\n  smoothstep(margins[2], margins[2] + sw.x, 1.0 - uvMask.x + sw.x) *\r\n  smoothstep(margins[1], margins[1] + sw.y, uvMask.y + sw.y) *\r\n  smoothstep(margins[3], margins[3] + sw.y, 1.0 - uvMask.y + sw.y);\r\n  float maskOuter =\r\n  smoothstep(margins[0] - sw.x, margins[0], uvMask.x + sw.x) *\r\n  smoothstep(margins[2] - sw.x, margins[2], 1.0 - uvMask.x + sw.x) *\r\n  smoothstep(margins[1] - sw.y, margins[1], uvMask.y + sw.y) *\r\n  smoothstep(margins[3] - sw.y, margins[3], 1.0 - uvMask.y + sw.y);\r\n  float maskStroke = maskOuter - mask;\r\n  float maskInner =\r\n  smoothstep(margins[0] - 2. * sw.x, margins[0], uvMask.x) *\r\n  smoothstep(margins[2] - 2. * sw.x, margins[2], 1.0 - uvMask.x) *\r\n  smoothstep(margins[1] - 2. * sw.y, margins[1], uvMask.y) *\r\n  smoothstep(margins[3] - 2. * sw.y, margins[3], 1.0 - uvMask.y);\r\n  float maskStrokeInner = maskInner - mask;\r\n\r\n  uv -= .5;\r\n  uv *= patternSize;\r\n  uv = rotateAspect(uv, patternRotation, u_imageAspectRatio);\r\n\r\n  float curve = 0.;\r\n  float patternY = uv.y / u_imageAspectRatio;\r\n  if (u_shape > 4.5) {\r\n    // pattern\r\n    curve = .5 + .5 * sin(.5 * PI * uv.x) * cos(.5 * PI * patternY);\r\n  } else if (u_shape > 3.5) {\r\n    // zigzag\r\n    curve = 10. * abs(fract(.1 * patternY) - .5);\r\n  } else if (u_shape > 2.5) {\r\n    // wave\r\n    curve = 4. * sin(.23 * patternY);\r\n  } else if (u_shape > 1.5) {\r\n    // lines irregular\r\n    curve = .5 + .5 * sin(.5 * uv.x) * sin(1.7 * uv.x);\r\n  } else {\r\n    // lines\r\n  }\r\n\r\n  vec2 UvToFract = uv + curve;\r\n  vec2 fractOrigUV = fract(uv);\r\n  vec2 floorOrigUV = floor(uv);\r\n\r\n  float x = smoothFract(UvToFract.x);\r\n  float xNonSmooth = fract(UvToFract.x) + .0001;\r\n\r\n  float highlightsWidth = 2. * max(.001, fwidth(UvToFract.x));\r\n  highlightsWidth += 2. * maskStrokeInner;\r\n  float highlights = smoothstep(0., highlightsWidth, xNonSmooth);\r\n  highlights *= smoothstep(1., 1. - highlightsWidth, xNonSmooth);\r\n  highlights = 1. - highlights;\r\n  highlights *= u_highlights;\r\n  highlights = clamp(highlights, 0., 1.);\r\n  highlights *= mask;\r\n\r\n  float shadows = pow(x, 1.3);\r\n  float distortion = 0.;\r\n  float fadeX = 1.;\r\n  float frameFade = 0.;\r\n\r\n  float aa = fwidth(xNonSmooth);\r\n  aa = max(aa, fwidth(uv.x));\r\n  aa = max(aa, fwidth(UvToFract.x));\r\n  aa = max(aa, .0001);\r\n\r\n  if (u_distortionShape == 1.) {\r\n    distortion = -pow(1.5 * x, 3.);\r\n    distortion += (.5 - u_shift);\r\n\r\n    frameFade = pow(1.5 * x, 3.);\r\n    aa = max(.2, aa);\r\n    aa += mix(.2, 0., u_size);\r\n    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);\r\n    distortion = mix(.5, distortion, fadeX);\r\n  } else if (u_distortionShape == 2.) {\r\n    distortion = 2. * pow(x, 2.);\r\n    distortion -= (.5 + u_shift);\r\n\r\n    frameFade = pow(abs(x - .5), 4.);\r\n    aa = max(.2, aa);\r\n    aa += mix(.2, 0., u_size);\r\n    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);\r\n    distortion = mix(.5, distortion, fadeX);\r\n    frameFade = mix(1., frameFade, .5 * fadeX);\r\n  } else if (u_distortionShape == 3.) {\r\n    distortion = pow(2. * (xNonSmooth - .5), 6.);\r\n    distortion -= .25;\r\n    distortion -= u_shift;\r\n\r\n    frameFade = 1. - 2. * pow(abs(x - .4), 2.);\r\n    aa = .15;\r\n    aa += mix(.1, 0., u_size);\r\n    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);\r\n    frameFade = mix(1., frameFade, fadeX);\r\n\r\n  } else if (u_distortionShape == 4.) {\r\n    x = xNonSmooth;\r\n    distortion = sin((x + .25) * TWO_PI);\r\n    shadows = .5 + .5 * asin(distortion) / (.5 * PI);\r\n    distortion *= .5;\r\n    distortion -= u_shift;\r\n    frameFade = .5 + .5 * sin(x * TWO_PI);\r\n  } else if (u_distortionShape == 5.) {\r\n    distortion -= pow(abs(x), .2) * x;\r\n    distortion += .33;\r\n    distortion -= 3. * u_shift;\r\n    distortion *= .33;\r\n\r\n    frameFade = .3 * (smoothstep(.0, 1., x));\r\n    shadows = pow(x, 2.5);\r\n\r\n    aa = max(.1, aa);\r\n    aa += mix(.1, 0., u_size);\r\n    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);\r\n    distortion *= fadeX;\r\n  }\r\n\r\n  vec2 dudx = dFdx(v_imageUV);\r\n  vec2 dudy = dFdy(v_imageUV);\r\n  vec2 grainUV = v_imageUV - .5;\r\n  grainUV *= (.8 / vec2(length(dudx), length(dudy)));\r\n  grainUV += .5;\r\n  if (u_grainMixer > 0.) {\r\n    float grain = valueNoise(grainUV);\r\n    grain = smoothstep(.4, .7, grain);\r\n    grain *= u_grainMixer;\r\n    distortion = mix(distortion, 0., grain);\r\n  }\r\n\r\n  shadows = min(shadows, 1.);\r\n  shadows += maskStrokeInner;\r\n  shadows *= mask;\r\n  shadows = min(shadows, 1.);\r\n  shadows *= pow(u_shadows, 2.);\r\n  shadows = clamp(shadows, 0., 1.);\r\n\r\n  distortion *= 3. * u_distortion;\r\n  frameFade *= u_distortion;\r\n\r\n  fractOrigUV.x += distortion;\r\n  floorOrigUV = rotateAspect(floorOrigUV, -patternRotation, u_imageAspectRatio);\r\n  fractOrigUV = rotateAspect(fractOrigUV, -patternRotation, u_imageAspectRatio);\r\n\r\n  uv = (floorOrigUV + fractOrigUV) / patternSize;\r\n  uv += pow(maskStroke, 4.);\r\n\r\n  uv += vec2(.5);\r\n\r\n  uv = mix(v_imageUV, uv, smoothstep(0., .7, mask));\r\n  float blur = mix(0., 50., u_blur);\r\n  blur = mix(0., blur, smoothstep(.5, 1., mask));\r\n\r\n  float edgeDistortion = mix(.0, .04, u_edges);\r\n  edgeDistortion += .06 * frameFade * u_edges;\r\n  edgeDistortion *= mask;\r\n  float frame = getUvFrame(uv, edgeDistortion);\r\n\r\n  float stretch = 1. - smoothstep(0., .5, xNonSmooth) * smoothstep(1., 1. - .5, xNonSmooth);\r\n  stretch = pow(stretch, 2.);\r\n  stretch *= mask;\r\n  stretch *= getUvFrame(uv, .1 + .05 * mask * frameFade);\r\n  uv.y = mix(uv.y, .5, u_stretch * stretch);\r\n\r\n  vec4 image = getBlur(u_image, uv, 1. / u_resolution / u_pixelRatio, vec2(0., 1.), blur);\r\n  image.rgb *= image.a;\r\n  vec4 backColor = u_colorBack;\r\n  backColor.rgb *= backColor.a;\r\n  vec4 highlightColor = u_colorHighlight;\r\n  highlightColor.rgb *= highlightColor.a;\r\n  vec4 shadowColor = u_colorShadow;\r\n\r\n  vec3 color = highlightColor.rgb * highlights;\r\n  float opacity = highlightColor.a * highlights;\r\n\r\n  shadows = mix(shadows * shadowColor.a, 0., highlights);\r\n  color = mix(color, shadowColor.rgb * shadowColor.a, .5 * shadows);\r\n  color += .5 * pow(shadows, .5) * shadowColor.rgb;\r\n  opacity += shadows;\r\n  color = clamp(color, vec3(0.), vec3(1.));\r\n  opacity = clamp(opacity, 0., 1.);\r\n\r\n  color += image.rgb * (1. - opacity) * frame;\r\n  opacity += image.a * (1. - opacity) * frame;\r\n\r\n  color += backColor.rgb * (1. - opacity);\r\n  opacity += backColor.a * (1. - opacity);\r\n\r\n  if (u_grainOverlay > 0.) {\r\n    float grainOverlay = valueNoise(rotate(grainUV, 1.) + vec2(3.));\r\n    grainOverlay = mix(grainOverlay, valueNoise(rotate(grainUV, 2.) + vec2(-1.)), .5);\r\n    grainOverlay = pow(grainOverlay, 1.3);\r\n\r\n    float grainOverlayV = grainOverlay * 2. - 1.;\r\n    vec3 grainOverlayColor = vec3(step(0., grainOverlayV));\r\n    float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV);\r\n    grainOverlayStrength = pow(grainOverlayStrength, .8);\r\n    grainOverlayStrength *= mask;\r\n    color = mix(color, grainOverlayColor, .35 * grainOverlayStrength);\r\n\r\n    opacity += .5 * grainOverlayStrength;\r\n  }\r\n  opacity = clamp(opacity, 0., 1.);\r\n\r\n  fragColor = vec4(color, opacity);\r\n}\r\n`;\r\n\r\nexport interface FlutedGlassUniforms extends ShaderSizingUniforms {\r\n  u_image: HTMLImageElement | string | undefined;\r\n  u_colorBack: [number, number, number, number];\r\n  u_colorShadow: [number, number, number, number];\r\n  u_colorHighlight: [number, number, number, number];\r\n  u_shadows: number;\r\n  u_size: number;\r\n  u_angle: number;\r\n  u_distortion: number;\r\n  u_shift: number;\r\n  u_blur: number;\r\n  u_edges: number;\r\n  u_marginLeft: number;\r\n  u_marginRight: number;\r\n  u_marginTop: number;\r\n  u_marginBottom: number;\r\n  u_stretch: number;\r\n  u_distortionShape: (typeof GlassDistortionShapes)[GlassDistortionShape];\r\n  u_highlights: number;\r\n  u_shape: (typeof GlassGridShapes)[GlassGridShape];\r\n  u_grainMixer: number;\r\n  u_grainOverlay: number;\r\n}\r\n\r\nexport interface FlutedGlassParams extends ShaderSizingParams, ShaderMotionParams {\r\n  image?: HTMLImageElement | string;\r\n  colorBack?: string;\r\n  colorShadow?: string;\r\n  colorHighlight?: string;\r\n  shadows?: number;\r\n  size?: number;\r\n  angle?: number;\r\n  distortion?: number;\r\n  shift?: number;\r\n  blur?: number;\r\n  edges?: number;\r\n  margin?: number;\r\n  marginLeft?: number;\r\n  marginRight?: number;\r\n  marginTop?: number;\r\n  marginBottom?: number;\r\n  stretch?: number;\r\n  distortionShape?: GlassDistortionShape;\r\n  highlights?: number;\r\n  shape?: GlassGridShape;\r\n  grainMixer?: number;\r\n  grainOverlay?: number;\r\n}\r\n\r\nexport const GlassGridShapes = {\r\n  lines: 1,\r\n  linesIrregular: 2,\r\n  wave: 3,\r\n  zigzag: 4,\r\n  pattern: 5,\r\n} as const;\r\n\r\nexport const GlassDistortionShapes = {\r\n  prism: 1,\r\n  lens: 2,\r\n  contour: 3,\r\n  cascade: 4,\r\n  flat: 5,\r\n} as const;\r\n\r\nexport type GlassDistortionShape = keyof typeof GlassDistortionShapes;\r\nexport type GlassGridShape = keyof typeof GlassGridShapes;\r\n"],
+  "mappings": ";;;;;AACA,eAAmE;AACnE,SAAS,WAAW,WAAW,wBAAwB;AAkDhD,MAAM,4BAAoC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAmC9C,SAAU;AAAA,EACV,SAAU;AAAA,EACV,gBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA2Vb,MAAM,kBAAkB;AAAA,EAC7B,OAAO;AAAA,EACP,gBAAgB;AAAA,EAChB,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,SAAS;AACX;AAEO,MAAM,wBAAwB;AAAA,EACnC,OAAO;AAAA,EACP,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,MAAM;AACR;",
+  "names": []
+}

package/dist/shaders/gem-smoke.d.ts

@@ -0,0 +1,96 @@
+import type { vec4 } from '../types.js';
+import type { ShaderMotionParams } from '../shader-mount.js';
+import type { ShaderSizingParams, ShaderSizingUniforms } from '../shader-sizing.js';
+export declare const gemSmokeMeta: {
+    readonly maxColorCount: 6;
+};
+/**
+ * Animated color fields placed over uploaded logo shape; gives the illusion of smoky noise
+ * behind the glassy shape.
+ *
+ * Fragment shader uniforms:
+ * - u_time (float): Animation time
+ * - u_image (sampler2D): Pre-processed source image texture (R = edge gradient, G = alpha)
+ * - u_colors (vec4[]): Up to 6 smoke colors in RGBA
+ * - u_colorsCount (float): Number of active colors
+ * - u_colorBack (vec4): Background color in RGBA
+ * - u_innerDistortion (float): Power of smoke distortion inside the input shape, needs innerGlow > 0 (0 to 1)
+ * - u_outerDistortion (float): Power of smoke distortion outside the input shape, needs outerGlow > 0 (0 to 1)
+ * - u_outerGlow (float): Visibility of smoke shape outside the input shape (0 to 1)
+ * - u_innerGlow (float): Visibility of smoke shape inside the input shape (0 to 1)
+ * - u_colorInner (vec4): Additional color inside the input shape, mixing with smoke (RGBA)
+ * - u_offset (float): Vertical offset of smoke inside the shape, needs innerGlow > 0 (-1 to 1)
+ * - u_angle (float): Smoke direction in degrees (0 to 360)
+ * - u_size (float): Size of smoke shape relative to the image box (0 to 1)
+ * - u_shape (float): Predefined shape mask, needs no image (0 = none, 1 = circle, 2 = daisy, 3 = diamond, 4 = metaballs)
+ * - u_isImage (bool): Whether an image mask is provided; when true, u_shape is ignored
+ *
+ * Vertex shader outputs (used in fragment shader):
+ * - v_imageUV (vec2): UV coordinates for sampling the source image, with fit, scale, rotation, and offset applied
+ * - v_objectUV (vec2): Normalized UV coordinates with scale, rotation, and offset applied
+ * - v_responsiveUV (vec2): Responsive UV coordinates that adapt to canvas aspect ratio (used by the 'none' shape)
+ * - v_responsiveBoxGivenSize (vec2): Given size of the responsive bounding box (used by the 'none' shape)
+ *
+ * Vertex shader uniforms:
+ * - u_resolution (vec2): Canvas resolution in pixels
+ * - u_pixelRatio (float): Device pixel ratio
+ * - u_originX (float): Reference point for positioning world width in the canvas (0 to 1)
+ * - u_originY (float): Reference point for positioning world height in the canvas (0 to 1)
+ * - u_worldWidth (float): Virtual width of the graphic before it's scaled to fit the canvas
+ * - u_worldHeight (float): Virtual height of the graphic before it's scaled to fit the canvas
+ * - u_fit (float): How to fit the rendered shader into the canvas dimensions (0 = none, 1 = contain, 2 = cover)
+ * - u_scale (float): Overall zoom level of the graphics (0.1 to 4)
+ * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)
+ * - u_offsetX (float): Horizontal offset of the graphics center (-1 to 1)
+ * - u_offsetY (float): Vertical offset of the graphics center (-1 to 1)
+ * - u_imageAspectRatio (float): Aspect ratio of the source image
+ *
+ */
+export declare const gemSmokeFragmentShader: string;
+export declare const POISSON_CONFIG_OPTIMIZED: {
+    measurePerformance: boolean;
+    workingSize: number;
+    iterations: number;
+};
+export declare function toProcessedGemSmoke(file: File | string): Promise<{
+    imageData: ImageData;
+    pngBlob: Blob;
+}>;
+export interface GemSmokeUniforms extends ShaderSizingUniforms {
+    u_colorBack: [number, number, number, number];
+    u_colors: vec4[];
+    u_colorsCount: number;
+    u_image: HTMLImageElement | string | undefined;
+    u_innerDistortion: number;
+    u_outerDistortion: number;
+    u_outerGlow: number;
+    u_innerGlow: number;
+    u_colorInner: [number, number, number, number];
+    u_offset: number;
+    u_angle: number;
+    u_size: number;
+    u_shape: (typeof GemSmokeShapes)[GemSmokeShape];
+    u_isImage: boolean;
+}
+export interface GemSmokeParams extends ShaderSizingParams, ShaderMotionParams {
+    colors?: string[];
+    colorBack?: string;
+    image?: HTMLImageElement | string | undefined;
+    innerDistortion?: number;
+    outerDistortion?: number;
+    outerGlow?: number;
+    innerGlow?: number;
+    colorInner?: string;
+    offset?: number;
+    angle?: number;
+    size?: number;
+    shape?: GemSmokeShape;
+}
+export declare const GemSmokeShapes: {
+    readonly none: 0;
+    readonly circle: 1;
+    readonly daisy: 2;
+    readonly diamond: 3;
+    readonly metaballs: 4;
+};
+export type GemSmokeShape = keyof typeof GemSmokeShapes;