AT-based link agregator. Mirror of https://github.com/likeandscribe/frontpage

Formatting

tom.sherman.is c28e2358 8ffab509

verified
+287 -42
+4 -3
.github/ISSUE_TEMPLATE/bug_report.md
··· 1 1 --- 2 2 name: Bug report 3 3 about: Create a report to help us improve 4 - title: '' 5 - labels: '' 6 - assignees: '' 4 + title: "" 5 + labels: "" 6 + assignees: "" 7 7 type: Bug 8 8 --- 9 9 ··· 12 12 13 13 **To Reproduce** 14 14 Steps to reproduce the behavior: 15 + 15 16 1. Go to '...' 16 17 2. Click on '....' 17 18
+7 -9
.github/labeler.yml
··· 1 1 atproto-browser: 2 2 - changed-files: 3 - - any-glob-to-any-file: packages/atproto-browser/** 3 + - any-glob-to-any-file: packages/atproto-browser/** 4 4 5 5 frontpage: 6 6 - changed-files: 7 - - any-glob-to-any-file: packages/frontpage/** 7 + - any-glob-to-any-file: packages/frontpage/** 8 8 9 9 drainpipe: 10 10 - changed-files: 11 - - any-glob-to-any-file: packages-rs/** 11 + - any-glob-to-any-file: packages-rs/** 12 12 13 - # Add 'documentation' label to any change to .md files within the entire repository 13 + # Add 'documentation' label to any change to .md files within the entire repository 14 14 documentation: 15 15 - changed-files: 16 - - any-glob-to-any-file: '**/*.md' 16 + - any-glob-to-any-file: "**/*.md" 17 17 18 18 enhancement: 19 - - head-branch: ['^feature', 'feature', '^feat', 'feat'] 19 + - head-branch: ["^feature", "feature", "^feat", "feat"] 20 20 21 21 fix: 22 - - head-branch: ['^fix', 'fix'] 23 - 24 - 22 + - head-branch: ["^fix", "fix"]
+6 -6
.github/workflows/label.yml
··· 8 8 pull-requests: write 9 9 runs-on: ubuntu-latest 10 10 steps: 11 - - uses: actions/checkout@v4 12 - with: 13 - fetch-depth: 2 14 - - uses: actions/labeler@v5 15 - with: 16 - sync-labels: true 11 + - uses: actions/checkout@v4 12 + with: 13 + fetch-depth: 2 14 + - uses: actions/labeler@v5 15 + with: 16 + sync-labels: true
+3
.prettierignore
··· 1 + pnpm-lock.yaml 2 + packages/frontpage/drizzle/meta 3 + **/dist/**
+1 -1
.vscode/launch.json
··· 15 15 }, 16 16 "args": [], 17 17 "cwd": "${workspaceFolder}/packages-rs/drainpipe", 18 - "envFile": "${workspaceFolder}/packages-rs/drainpipe/.env" 18 + "envFile": "${workspaceFolder}/packages-rs/drainpipe/.env" 19 19 }, 20 20 { 21 21 "type": "lldb",
+11 -11
CODE_OF_CONDUCT.md
··· 17 17 Examples of behavior that contributes to a positive environment for our 18 18 community include: 19 19 20 - * Demonstrating empathy and kindness toward other people 21 - * Being respectful of differing opinions, viewpoints, and experiences 22 - * Giving and gracefully accepting constructive feedback 23 - * Accepting responsibility and apologizing to those affected by our mistakes, 20 + - Demonstrating empathy and kindness toward other people 21 + - Being respectful of differing opinions, viewpoints, and experiences 22 + - Giving and gracefully accepting constructive feedback 23 + - Accepting responsibility and apologizing to those affected by our mistakes, 24 24 and learning from the experience 25 - * Focusing on what is best not just for us as individuals, but for the 25 + - Focusing on what is best not just for us as individuals, but for the 26 26 overall community 27 27 28 28 Examples of unacceptable behavior include: 29 29 30 - * The use of sexualized language or imagery, and sexual attention or 30 + - The use of sexualized language or imagery, and sexual attention or 31 31 advances of any kind 32 - * Trolling, insulting or derogatory comments, and personal or political attacks 33 - * Public or private harassment 34 - * Publishing others' private information, such as a physical or email 32 + - Trolling, insulting or derogatory comments, and personal or political attacks 33 + - Public or private harassment 34 + - Publishing others' private information, such as a physical or email 35 35 address, without their explicit permission 36 - * Other conduct which could reasonably be considered inappropriate in a 36 + - Other conduct which could reasonably be considered inappropriate in a 37 37 professional setting 38 38 39 39 ## Enforcement Responsibilities ··· 106 106 ### 4. Permanent Ban 107 107 108 108 **Community Impact**: Demonstrating a pattern of violation of community 109 - standards, including sustained inappropriate behavior, harassment of an 109 + standards, including sustained inappropriate behavior, harassment of an 110 110 individual, or aggression toward or disparagement of classes of individuals. 111 111 112 112 **Consequence**: A permanent ban from any sort of public interaction within
-1
SECURITY.md
··· 3 3 ## Reporting a Vulnerability 4 4 5 5 If you believe you have found a security vulnrability in any of the code within this repo, please report it privately at https://github.com/likeandscribe/frontpage/security or email team@frontpage.fyi (pgp public key at https://frontpage.fyi/pgp) 6 -
+1 -1
packages/atproto-browser/app/at/_lib/uri-bar.tsx
··· 15 15 16 16 const uri = 17 17 pathname === "/at" 18 - ? searchParams.get("u") ?? undefined 18 + ? (searchParams.get("u") ?? undefined) 19 19 : `at://${[params.identifier, params.collection, params.rkey] 20 20 .map((c) => c && decodeURIComponent(c)) 21 21 .filter(Boolean)
-1
packages/frontpage/drizzle.config.ts
··· 17 17 throw new Error("TURSO_AUTH_TOKEN must be set when connecting to turso.io"); 18 18 } 19 19 20 - 21 20 export default defineConfig({ 22 21 dialect: "turso", 23 22 schema: "./lib/schema.ts",
+1 -1
packages/frontpage/lib/auth-sign-in.ts
··· 170 170 await db.insert(schema.OauthAuthRequest).values({ 171 171 did: 172 172 "identifier" in input 173 - ? (await getDidFromHandleOrDid(input.identifier)) ?? "" 173 + ? ((await getDidFromHandleOrDid(input.identifier)) ?? "") 174 174 : "", 175 175 iss: authServer.issuer, 176 176 username: "identifier" in input ? input.identifier : "",
+5 -1
packages/frontpage/lib/components/ui/toast.tsx
··· 5 5 import { cva, type VariantProps } from "class-variance-authority"; 6 6 7 7 import { cn } from "@/lib/utils"; 8 - import type { ComponentProps, ComponentPropsWithoutRef, ReactElement } from "react"; 8 + import type { 9 + ComponentProps, 10 + ComponentPropsWithoutRef, 11 + ReactElement, 12 + } from "react"; 9 13 10 14 const ToastProvider = ToastPrimitives.Provider; 11 15
+4 -4
packages/frontpage/local-infra/docker-compose.yml
··· 22 22 image: ghcr.io/bluesky-social/pds:0.4 23 23 restart: unless-stopped 24 24 ports: 25 - - '4001:3000' 25 + - "4001:3000" 26 26 volumes: 27 27 - pds:/pds 28 28 env_file: ··· 33 33 container_name: plc 34 34 restart: unless-stopped 35 35 ports: 36 - - '4000:8080' 36 + - "4000:8080" 37 37 depends_on: 38 38 - plc_db 39 39 environment: ··· 53 53 - POSTGRES_USER=pg 54 54 - POSTGRES_PASSWORD=password 55 55 ports: 56 - - '5433:5432' 56 + - "5433:5432" 57 57 volumes: 58 58 - plc:/var/lib/postgresql/data 59 59 ··· 77 77 container_name: turso_dev 78 78 build: ./turso 79 79 ports: 80 - - '4002:8080' 80 + - "4002:8080" 81 81 volumes: 82 82 - turso:/var/lib/sqld 83 83
-1
packages/unravel/.prettierignore
··· 1 - pnpm-lock.yaml
+244 -2
packages/unravel/app/unravel-unicorn/[hash]/unravel-unicorn.json
··· 1 - 2 - {"history":[{"visible":true,"aspectRatio":1,"layerType":"effect","type":"gradient","speed":0.52,"mouseMomentum":0,"texture":false,"animating":false,"isMask":0,"compiledFragmentShaders":["#version 300 es\nprecision highp float;in vec2 vTextureCoord;const vec3 uColors[1] = vec3[]( vec3(1.000000, 0.819608, 0.596078) );uniform float uTime;uniform sampler2D uMaskTexture; uniform float uAspectRatio; uniform vec2 uMousePos; uniform vec2 uResolution;vec2 rotate(vec2 coord, float angle) { float s = sin(angle); float c = cos(angle); return vec2( coord.x * c - coord.y * s, coord.x * s + coord.y * c ); }float rand(vec2 co) { return fract(sin(dot(co.xy, vec2(12.9898, 78.233))) * 43758.5453); }vec3 linear_from_srgb(vec3 rgb) { return pow(rgb, vec3(2.2)); }vec3 srgb_from_linear(vec3 lin) { return pow(lin, vec3(1.0/2.2)); }vec3 oklab_mix(vec3 lin1, vec3 lin2, float a) { const mat3 kCONEtoLMS = mat3( 0.4121656120, 0.2118591070, 0.0883097947, 0.5362752080, 0.6807189584, 0.2818474174, 0.0514575653, 0.1074065790, 0.6302613616); const mat3 kLMStoCONE = mat3( 4.0767245293, -1.2681437731, -0.0041119885, -3.3072168827, 2.6093323231, -0.7034763098, 0.2307590544, -0.3411344290, 1.7068625689); vec3 lms1 = pow( kCONEtoLMS*lin1, vec3(1.0/3.0) ); vec3 lms2 = pow( kCONEtoLMS*lin2, vec3(1.0/3.0) ); vec3 lms = mix( lms1, lms2, a ); lms *= 1.0+0.025*a*(1.0-a); return kLMStoCONE*(lms*lms*lms); }vec3 getGradientColor(float position) { for (int i = 0; i < 1; i++) { float colorPosition = float(i) / float(1); float nextColorPosition = float(i + 1) / float(1); if (position <= nextColorPosition) { float mixFactor = (position - colorPosition) / (nextColorPosition - colorPosition); vec3 linStart = linear_from_srgb(uColors[i]); vec3 linEnd = linear_from_srgb(uColors[i + 1]); vec3 mixedLin = oklab_mix(linStart, linEnd, mixFactor); return srgb_from_linear(mixedLin); } } return srgb_from_linear(uColors[1-1]); }vec3 Tonemap_ACES(vec3 x) { const float a = 2.51; const float b = 0.03; const float c = 2.43; const float d = 0.59; const float e = 0.14; return (x * (a * x + b)) / (x * (c * x + d) + e); }out vec4 fragColor;void main() { vec2 uv = vTextureCoord; vec2 pos = vec2(0.5, 0.5) + mix(vec2(0), (uMousePos-0.5), 0.00); uv -= pos; uv /= (0.52*2.); uv = rotate(uv, (0.20 - 0.5) * 2. * 3.14159265);vec4 color = vec4(0,0,0,1);float position; if(1 == 1) { color.rgb = uColors[0]; } else if (0 == 0) { position = (uv.x+0.5);} else if (0 == 1) { position = length(uv); } else if (0 == 2) { float angle = atan(uv.y, uv.x); float normalizedAngle = angle / (2.0 * 3.14159265359) + 0.5; float doubledAngle = 2.0 * normalizedAngle; doubledAngle = doubledAngle > 1. ? 2.0 - doubledAngle : doubledAngle; position = clamp(doubledAngle, 0.0, 1.0); } else if (0 == 3) { } if(1 > 1) { position -= (uTime*0.01 + 0.00); float cycle = floor(position); bool reverse = int(cycle) % 2 == 0; float animatedPos = reverse ? fract(-position) : fract(position); animatedPos = reverse ? animatedPos - 1./float(1) : animatedPos - 1./float(1);color.rgb = getGradientColor(animatedPos); float dither = rand(gl_FragCoord.xy) * 0.005; color.rgb += dither; }fragColor = color; }"],"compiledVertexShaders":["#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = aTextureCoord; }"],"data":{"depth":false}},{"visible":true,"aspectRatio":1,"layerType":"effect","type":"mouse","texture":false,"parentLayer":"0f00febc-947c-4b79-b122-33fb81bd772d","animating":true,"mouseMomentum":0,"isMask":0,"compiledFragmentShaders":["#version 300 es\nprecision mediump float;in vec2 vTextureCoord; in vec3 vVertexPosition;uniform sampler2D uTexture; uniform sampler2D uPingPongTexture; uniform vec2 uResolution;uniform float uTime;const float PI = 3.1415926; const float ITERATIONS = 24.0; const float kernel[24] = float[]( 0.7978845608028654, 0.795118932516684, 0.7868794322038799, 0.7733362336056986, 0.7547664553859864, 0.7315447328280048, 0.704130653528599, 0.6730536454899063, 0.6388960110447045, 0.6022748643096089, 0.5638237508206051, 0.5241747061566029, 0.48394144903828673, 0.443704309411472, 0.40399737110811773, 0.36529817077804383, 0.3280201493519873, 0.29250790855907144, 0.2590351913317835, 0.2278053882403838, 0.19895427758549736, 0.17255463765302306, 0.1486223271179862, 0.12712341303392466 );out vec4 fragColor;vec4 permute(vec4 t) { return t * (t * 34.0 + 133.0); } vec3 grad(float hash) { vec3 cube = mod(floor(hash / vec3(1.0, 2.0, 4.0)), 2.0) * 2.0 - 1.0; vec3 cuboct = cube; cuboct[int(hash / 16.0)] = 0.0; float type = mod(floor(hash / 8.0), 2.0); vec3 rhomb = (1.0 - type) * cube + type * (cuboct + cross(cube, cuboct)); vec3 grad = cuboct * 1.22474487139 + rhomb; grad *= (1.0 - 0.042942436724648037 * type) * 3.5946317686139184; return grad; } vec4 bccNoiseDerivativesPart(vec3 X) { vec3 b = floor(X); vec4 i4 = vec4(X - b, 2.5); vec3 v1 = b + floor(dot(i4, vec4(.25))); vec3 v2 = b + vec3(1, 0, 0) + vec3(-1, 1, 1) * floor(dot(i4, vec4(-.25, .25, .25, .35))); vec3 v3 = b + vec3(0, 1, 0) + vec3(1, -1, 1) * floor(dot(i4, vec4(.25, -.25, .25, .35))); vec3 v4 = b + vec3(0, 0, 1) + vec3(1, 1, -1) * floor(dot(i4, vec4(.25, .25, -.25, .35))); vec4 hashes = permute(mod(vec4(v1.x, v2.x, v3.x, v4.x), 289.0)); hashes = permute(mod(hashes + vec4(v1.y, v2.y, v3.y, v4.y), 289.0)); hashes = mod(permute(mod(hashes + vec4(v1.z, v2.z, v3.z, v4.z), 289.0)), 48.0); vec3 d1 = X - v1; vec3 d2 = X - v2; vec3 d3 = X - v3; vec3 d4 = X - v4; vec4 a = max(0.75 - vec4(dot(d1, d1), dot(d2, d2), dot(d3, d3), dot(d4, d4)), 0.0); vec4 aa = a * a; vec4 aaaa = aa * aa; vec3 g1 = grad(hashes.x); vec3 g2 = grad(hashes.y); vec3 g3 = grad(hashes.z); vec3 g4 = grad(hashes.w); vec4 extrapolations = vec4(dot(d1, g1), dot(d2, g2), dot(d3, g3), dot(d4, g4)); vec3 derivative = -8.0 * mat4x3(d1, d2, d3, d4) * (aa * a * extrapolations) + mat4x3(g1, g2, g3, g4) * aaaa; return vec4(derivative, dot(aaaa, extrapolations)); } vec4 bccNoiseDerivatives_XYBeforeZ(vec3 X) { mat3 orthonormalMap = mat3( 0.788675134594813, -0.211324865405187, -0.577350269189626, -0.211324865405187, 0.788675134594813, -0.577350269189626, 0.577350269189626, 0.577350269189626, 0.577350269189626); X = orthonormalMap * X; vec4 result = bccNoiseDerivativesPart(X) + bccNoiseDerivativesPart(X + 144.5); return vec4(result.xyz * orthonormalMap, result.w); }vec2 random2(vec2 p) { return fract(sin(vec2(dot(p, vec2(127.1, 311.7)), dot(p, vec2(269.5, 183.3)))) * 43758.5453); }vec3 rgb2hsv(vec3 c) { vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0); vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g)); vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));float d = q.x - min(q.w, q.y); float e = 1.0e-10; return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x); }vec3 chromatic_aberration(vec3 color, vec2 uv, vec2 offset) { vec4 left = texture(uTexture, uv - offset); vec4 right = texture(uTexture, uv + offset);color.r = left.r; color.b = right.b;return color; }vec2 pixelate(vec2 uv) { float aspectRatio = uResolution.x / uResolution.y; float scale = 0.50 / 2.0; vec2 modulate = mod(vec2(uv.x * aspectRatio, uv.y) - 0.5, (scale + 0.01) / 12.0); return vec2( uv.x - modulate.x / aspectRatio + (0.08333 * scale) / 2.0, uv.y - modulate.y + (0.08333 * scale) / 2.0 ); }vec2 angleToDir(float angle) { float rad = angle * 2.0 * PI; return vec2(cos(rad), sin(rad)); }vec4 blurTrail(vec2 uv, vec2 mouseDir) { vec2 distorted = mouseDir * 0.4; float total_weight = 0.0; vec4 color = vec4(0);for (int i = 0; i <= 24; i++) { float scale = 0.0001 + 0.50 * 0.5; float weight = kernel[i]; vec2 offset = distorted * (1.5 + scale) * mix(1.0, float(i) / ITERATIONS, scale); vec4 samp = texture(uTexture, uv - offset); samp.rgb = chromatic_aberration(samp.rgb, uv - offset, offset * 0.43 * 0.12); color += weight * samp; total_weight += weight; } return color / total_weight; }vec4 noiseTrail(vec2 uv, vec2 mouseDir, float strength, float aspectRatio) { vec4 color = vec4(0); vec2 noise = bccNoiseDerivatives_XYBeforeZ(vec3((uv * vec2(aspectRatio, 1) - mouseDir / 8.0 - 0.5) * 250.0 * 0.50, strength)).xy * strength * 0.25; vec2 distorted = (mouseDir + noise) * 0.4; color = texture(uTexture, uv - distorted); color.rgb = chromatic_aberration(color.rgb, uv - distorted, distorted * 0.43 * 0.12); return color; }vec4 pixelTrail(vec2 uv, vec2 mouseDir, float strength) { vec4 color = vec4(0); vec2 distorted = mouseDir * 0.4; vec2 pixelated = uv - distorted; color = texture(uTexture, pixelated); color.rgb = chromatic_aberration(color.rgb, pixelated, distorted * 0.43 * 0.12); return color; }vec4 revealTrail(vec2 uv, vec2 mouseDir, float strength) { vec4 color = vec4(0); float zMix = strength; vec2 distorted = mouseDir * 0.4 * 0.50; color = texture(uTexture, uv - distorted); color.rgb = chromatic_aberration(color.rgb, uv - distorted, distorted * 0.43 * 0.12); color = mix(vec4(vec3(0, 0, 0), 1.00), color, zMix); return color; }vec4 inverTrail(vec2 uv, vec2 mouseDir, float strength) { vec4 color = vec4(0); vec2 distorted = mouseDir * 0.4 * 0.50; float sMix = step(0.3, strength); color = texture(uTexture, uv - distorted); color.rgb = chromatic_aberration(color.rgb, uv - distorted, distorted * 0.43 * 0.12); color.rgb = mix(color.rgb, 1.0 - color.rgb, sMix); return color; }vec4 defaultTrail(vec2 uv, vec2 mouseDir) { vec4 color = vec4(0); vec2 distorted = mouseDir * 0.4; color = texture(uTexture, uv - distorted); color.rgb = chromatic_aberration(color.rgb, uv - distorted, distorted * 0.43 * 0.12); return color; }vec4 shatterTrail(vec2 uv, vec2 mouseDir, float strength, float aspectRatio) { vec2 st = uv * vec2(aspectRatio, 1) * 80.0 * 0.50; vec2 i_st = floor(st); vec2 f_st = fract(st);float m_dist = 15.0; vec2 m_point; vec2 d;for (int j = -1; j <= 1; j++) { for (int i = -1; i <= 1; i++) { vec2 neighbor = vec2(float(i), float(j)); vec2 point = random2(i_st + neighbor);vec2 diff = neighbor + point - f_st; float dist = length(diff);if (dist < m_dist) { m_dist = dist; m_point = point; d = diff; } } }vec2 distorted = mouseDir * 0.4; vec2 offset = (m_point * 0.2 * 1.0 * 2.0) - (1.0 * 0.2) - distorted; return texture(uTexture, uv + offset * strength); }vec4 getTrailColor(vec2 uv, vec2 mouseDir, float strength) { vec4 color = vec4(0); float aspectRatio = uResolution.x / uResolution.y;switch (0) { case 1: return blurTrail(uv, mouseDir); case 2: return noiseTrail(uv, mouseDir, strength, aspectRatio); case 3: return pixelTrail(uv, mouseDir, strength); case 4: return revealTrail(uv, mouseDir, strength); case 5: return inverTrail(uv, mouseDir, strength); case 6: return shatterTrail(uv, mouseDir, strength, aspectRatio); default: return defaultTrail(uv, mouseDir); } }void main() { vec2 uv = vTextureCoord; vec2 pingpongUv = uv;if (0 == 3) { pingpongUv = pixelate(pingpongUv); }vec3 mouseRgb = texture(uPingPongTexture, pingpongUv).rgb; vec3 mouseTrail = rgb2hsv(mouseRgb);float angle = mouseTrail.x; float strength = mouseTrail.z * (0.03 * 2.0); vec2 direction = angleToDir(angle); vec2 mouseDir = direction * strength;vec4 color = getTrailColor(uv, mouseDir, strength);fragColor = color; }","#version 300 es\nprecision lowp float;in vec3 vVertexPosition; in vec2 vTextureCoord;uniform sampler2D uTexture; uniform sampler2D uPingPongTexture; uniform vec2 uMousePos; uniform vec2 uPreviousMousePos; uniform vec2 uResolution; uniform float uTime;const float PI = 3.1415926; const float TWOPI = 6.2831852;out vec4 fragColor;vec3 hsv2rgb(vec3 c) { vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0); vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www); return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y); }mat2 rot(float a) { return mat2(cos(a), -sin(a), sin(a), cos(a)); }vec2 liquify(vec2 st, float angle) { float aspectRatio = uResolution.x / uResolution.y; st.x *= aspectRatio; st = st * rot(angle * TWOPI); float amplitude = 0.003; for (float i = 1.0; i <= 5.0; i++) { st = st * rot(i / 5.0 * PI * 2.0); st += vec2( amplitude * cos(i * 5.0 * st.y + uTime * 0.02), amplitude * sin(i * 5.0 * st.x + uTime * 0.02) ); } st = st * rot(-angle * TWOPI); st.x /= aspectRatio; return st; }void main() { float aspectRatio = uResolution.x / uResolution.y; vec2 uv = vTextureCoord; vec2 correctedUv = uv * vec2(aspectRatio, 1.0);vec2 dir = (uMousePos - uPreviousMousePos) * vec2(aspectRatio, 1.0); float dist = length(dir); dir = normalize(dir);float rad = 0.41 * 0.4 * mix(aspectRatio, 1.0, 0.5); float angle = atan(dir.y, dir.x); if (angle < 0.0) angle += TWOPI;if(0.18 > 0.) { uv = mix(uv, liquify(uv, smoothstep(0.0, 1.0, angle)), 0.18); }float t = clamp(dot(correctedUv - uPreviousMousePos * vec2(aspectRatio, 1.0), dir) / dist, 0.0, 1.0); vec2 closestPoint = mix(uPreviousMousePos, uMousePos, t) * vec2(aspectRatio, 1.0); float distanceToLine = distance(correctedUv, closestPoint);float s = smoothstep(rad, rad * 0.41, distanceToLine);vec3 color = vec3(angle / TWOPI, 1.0, 1.0); vec3 mouseColor = hsv2rgb(color);vec3 lastFrameColor = texture(uPingPongTexture, mix(uv, uv / 1.03 + 0.015, 0.65)).rgb; vec3 draw = mix(lastFrameColor, mouseColor, min(1.0, dist * s));fragColor = vec4(draw * pow(0.44, 0.1), 1.0); }"],"compiledVertexShaders":["#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix;uniform sampler2D uPingPongTexture;out vec3 vVertexPosition; out vec2 vTextureCoord;vec3 rgb2hsv(vec3 c) { vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0); vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g)); vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));float d = q.x - min(q.w, q.y); float e = 1.0e-10; return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x); }const float PI = 3.1415926;void main() {vec3 vertexPosition = aVertexPosition;gl_Position = uPMatrix * uMVMatrix * vec4(vertexPosition, 1.0); vTextureCoord = aTextureCoord; }","#version 300 es\nprecision lowp float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix;out vec3 vVertexPosition; out vec2 vTextureCoord;void main() {vec3 vertexPosition = aVertexPosition;gl_Position = uPMatrix * uMVMatrix * vec4(vertexPosition, 1.0); vTextureCoord = aTextureCoord; vVertexPosition = vertexPosition; }"],"data":{"depth":false}},{"local":{"id":"d8f72fb5-849a-4c6d-ae50-37149aa273ef","canvas":{},"ctx":{}},"visible":true,"locked":false,"aspectRatio":1,"isElement":true,"opacity":0.81,"displace":0,"trackMouse":0,"mouseMomentum":0,"blendMode":"NORMAL","bgDisplace":0,"mask":0,"maskBackground":{"type":"Vec3","_x":0,"_y":0,"_z":0},"maskAlpha":0,"dispersion":0,"axisTilt":0,"layerType":"image","imageLoaded":false,"effects":[],"size":0.66,"rotation":0,"height":129,"repeat":0,"fitToCanvas":1,"scaleX":1,"scaleY":1,"src":"https://assets.unicorn.studio/images/nYceGF4tzMX8WjSRSNzpUt1o4812/papashrek-2x.png","speed":0.5,"thumb":"https://assets.unicorn.studio/images/nYceGF4tzMX8WjSRSNzpUt1o4812/papashrek-2x_@thumbnail.png?authuser=0","translateX":-5,"translateY":-61,"width":128,"compiledFragmentShaders":["#version 300 es\nprecision mediump float; in vec2 vTextureCoord; in vec3 vVertexPosition;uniform sampler2D uBgTexture; uniform sampler2D uTexture; uniform vec2 uMousePos; uniform vec2 uResolution; uniform int uSampleBg;vec2 perspectiveUV(vec2 uv) { float aspectRatio = uResolution.x/uResolution.y; vec2 centeredUV = uv - 0.5; centeredUV.x *= aspectRatio; float strength = 1.0 + (vVertexPosition.z * 0.00); vec2 perspectiveUV = centeredUV / strength; perspectiveUV.x /= aspectRatio; perspectiveUV += 0.5; return perspectiveUV; }out vec4 fragColor;void main() { vec2 uv = vTextureCoord; vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); uv = perspectiveUV(uv) - pos; vec4 color = texture(uTexture, uv); vec4 background = uSampleBg == 1 ? texture(uBgTexture, vTextureCoord) : vec4(0);color = mix(background, color/(color.a + 0.00000001), color.a * 0.81);fragColor = color; }"],"compiledVertexShaders":["#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix; uniform vec2 uMousePos;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { float angleX = uMousePos.y * 0.5 - 0.25; float angleY = (1.-uMousePos.x) * 0.5 - 0.25; mat4 rotateX = mat4(1.0, 0.0, 0.0, 0.0, 0.0, cos(angleX), -sin(angleX), 0.0, 0.0, sin(angleX), cos(angleX), 0.0, 0.0, 0.0, 0.0, 1.0); mat4 rotateY = mat4(cos(angleY), 0.0, sin(angleY), 0.0, 0.0, 1.0, 0.0, 0.0, -sin(angleY), 0.0, cos(angleY), 0.0, 0.0, 0.0, 0.0, 1.0);mat4 rotationMatrix = rotateX * rotateY; gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vVertexPosition = (rotationMatrix * vec4(aVertexPosition, 1.0)).xyz; vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }"]},{"visible":true,"aspectRatio":1,"layerType":"effect","type":"spotlight","mouseMomentum":0.47,"texture":false,"animating":false,"isMask":0,"compiledFragmentShaders":["#version 300 es\nprecision mediump float;in vec2 vTextureCoord;uniform sampler2D uTexture; uniform sampler2D uBgTexture;uniform sampler2D uMaskTexture; uniform float uAspectRatio; uniform vec2 uMousePos; uniform vec2 uResolution;out vec4 fragColor;const int kernelSize = 36; const float gaussianWeights[kernelSize] = float[](0.00094768, 0.00151965, 0.00237008, 0.00359517, 0.0053041, 0.00761097, 0.01062197, 0.01441804, 0.01903459, 0.0244409, 0.03052299, 0.03707432, 0.04379813, 0.05032389, 0.05623791, 0.06112521, 0.06461716, 0.06643724, 0.06643724, 0.06461716, 0.06112521, 0.05623791, 0.05032389, 0.04379813, 0.03707432, 0.03052299, 0.0244409, 0.01903459, 0.01441804, 0.01062197, 0.00761097, 0.0053041, 0.00359517, 0.00237008, 0.00151965, 0.00094768);vec4 GaussianBlur(sampler2D tex, vec2 uv, vec2 direction) { vec4 color = vec4(0.0); float weightSum = 0.0;float amount = (0.53 + 0.1) * 2.; float aspectRatio = uResolution.x/uResolution.y;direction.x /= aspectRatio;color += texture(tex, uv) * gaussianWeights[0]; for (int i = 0; i < kernelSize; i++) { float x = float(i - kernelSize / 2) * amount; color += texture(tex, uv + vec2(x/1000.) * direction) * gaussianWeights[i]; } return color; }float getHeight(vec2 uv) { vec4 col = texture(uTexture, uv); return col.r; }vec4 computeNoise(vec2 uv) { vec2 ste = (1. / uResolution); float height = getHeight(uv); vec2 dxy = height - vec2(getHeight(uv + vec2(ste.x, 0.)), getHeight(uv + vec2(0., ste.y)));return vec4(normalize(vec3(dxy * (0.02 + 0.04 * 0.53) / ste, 2.)), height); }float random(vec2 seed) { return fract(sin(dot(seed.xy, vec2(12.9898, 78.233))) * 43758.5453); }vec3 Tonemap_tanh(vec3 x) { x = clamp(x, -40.0, 40.0); return (exp(x) - exp(-x)) / (exp(x) + exp(-x)); }float light(vec3 p, vec3 normal, vec3 lightPos) { vec3 direction = normalize(lightPos - p); float specular = 0.5 * pow(max(dot(direction, reflect(-direction, normal)), 0.0), 2.0); return max(0.1, dot(normal, direction) * 1.2 - specular); }void main() { vec2 uv = vTextureCoord; vec4 color;if(0.00 == 0.) { color = GaussianBlur(uTexture, uv, vec2(uResolution.y/uResolution.x, 0)); } else if(0.00 == 1.) { color = GaussianBlur(uTexture, uv, vec2(0, 1)); color.rgb += (random(gl_FragCoord.xy) - 0.1) / 255.0; } else { vec2 pos = vec2(-0.030507136338683048, 1.092850915271533) + mix(vec2(0), (uMousePos-0.5), 0.23); vec2 aspectRatio = vec2(uResolution.x/uResolution.y, 1); color = texture(uBgTexture, uv); float luma = color.r; float dist = distance(uv * aspectRatio, pos * aspectRatio) / (1.00 + 0.5); float hightlighDist = distance(uv * aspectRatio, pos * aspectRatio) / (1.00 + 0.5)/2.; float spot = max(0., max(0., (1.-dist)) * max(0., (1.-dist))); float highlightSpot = max(0., max(0., (1.-hightlighDist)) * max(0., (1.-hightlighDist))); vec3 normal = computeNoise(uv).rgb*luma; vec2 lightDir = pos * aspectRatio - uv * aspectRatio; float lightDistance = 1.-length(lightDir); lightDir = normalize(lightDir); vec3 diff = vec3(max(dot(normal, vec3(lightDir, 0.5)), 0.0));float specular = light(vec3(uv, 1.), normal, vec3(pos, 1.)); specular = smoothstep(0., 1., specular) * 2.; float intensity = 1.00 * 3.; vec3 base = color.rgb * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot) * intensity; color.rgb = color.rgb * 0.48 + base * diff * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot) * intensity; color.rgb += specular * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot * 4.) * 0.53; color.rgb = Tonemap_tanh(color.rgb); float dither = (random(gl_FragCoord.xy) - 0.5) / 255.0; color.rgb += dither; } if(0 == 1) { vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); vec4 maskColor = texture(uMaskTexture, vTextureCoord - pos); fragColor = color * (maskColor.a * maskColor.a); } else { fragColor = color; }}","#version 300 es\nprecision mediump float;in vec2 vTextureCoord;uniform sampler2D uTexture; uniform sampler2D uBgTexture;uniform sampler2D uMaskTexture; uniform float uAspectRatio; uniform vec2 uMousePos; uniform vec2 uResolution;out vec4 fragColor;const int kernelSize = 36; const float gaussianWeights[kernelSize] = float[](0.00094768, 0.00151965, 0.00237008, 0.00359517, 0.0053041, 0.00761097, 0.01062197, 0.01441804, 0.01903459, 0.0244409, 0.03052299, 0.03707432, 0.04379813, 0.05032389, 0.05623791, 0.06112521, 0.06461716, 0.06643724, 0.06643724, 0.06461716, 0.06112521, 0.05623791, 0.05032389, 0.04379813, 0.03707432, 0.03052299, 0.0244409, 0.01903459, 0.01441804, 0.01062197, 0.00761097, 0.0053041, 0.00359517, 0.00237008, 0.00151965, 0.00094768);vec4 GaussianBlur(sampler2D tex, vec2 uv, vec2 direction) { vec4 color = vec4(0.0); float weightSum = 0.0;float amount = (0.53 + 0.1) * 2.; float aspectRatio = uResolution.x/uResolution.y;direction.x /= aspectRatio;color += texture(tex, uv) * gaussianWeights[0]; for (int i = 0; i < kernelSize; i++) { float x = float(i - kernelSize / 2) * amount; color += texture(tex, uv + vec2(x/1000.) * direction) * gaussianWeights[i]; } return color; }float getHeight(vec2 uv) { vec4 col = texture(uTexture, uv); return col.r; }vec4 computeNoise(vec2 uv) { vec2 ste = (1. / uResolution); float height = getHeight(uv); vec2 dxy = height - vec2(getHeight(uv + vec2(ste.x, 0.)), getHeight(uv + vec2(0., ste.y)));return vec4(normalize(vec3(dxy * (0.02 + 0.04 * 0.53) / ste, 2.)), height); }float random(vec2 seed) { return fract(sin(dot(seed.xy, vec2(12.9898, 78.233))) * 43758.5453); }vec3 Tonemap_tanh(vec3 x) { x = clamp(x, -40.0, 40.0); return (exp(x) - exp(-x)) / (exp(x) + exp(-x)); }float light(vec3 p, vec3 normal, vec3 lightPos) { vec3 direction = normalize(lightPos - p); float specular = 0.5 * pow(max(dot(direction, reflect(-direction, normal)), 0.0), 2.0); return max(0.1, dot(normal, direction) * 1.2 - specular); }void main() { vec2 uv = vTextureCoord; vec4 color;if(1.00 == 0.) { color = GaussianBlur(uTexture, uv, vec2(uResolution.y/uResolution.x, 0)); } else if(1.00 == 1.) { color = GaussianBlur(uTexture, uv, vec2(0, 1)); color.rgb += (random(gl_FragCoord.xy) - 0.1) / 255.0; } else { vec2 pos = vec2(-0.030507136338683048, 1.092850915271533) + mix(vec2(0), (uMousePos-0.5), 0.23); vec2 aspectRatio = vec2(uResolution.x/uResolution.y, 1); color = texture(uBgTexture, uv); float luma = color.r; float dist = distance(uv * aspectRatio, pos * aspectRatio) / (1.00 + 0.5); float hightlighDist = distance(uv * aspectRatio, pos * aspectRatio) / (1.00 + 0.5)/2.; float spot = max(0., max(0., (1.-dist)) * max(0., (1.-dist))); float highlightSpot = max(0., max(0., (1.-hightlighDist)) * max(0., (1.-hightlighDist))); vec3 normal = computeNoise(uv).rgb*luma; vec2 lightDir = pos * aspectRatio - uv * aspectRatio; float lightDistance = 1.-length(lightDir); lightDir = normalize(lightDir); vec3 diff = vec3(max(dot(normal, vec3(lightDir, 0.5)), 0.0));float specular = light(vec3(uv, 1.), normal, vec3(pos, 1.)); specular = smoothstep(0., 1., specular) * 2.; float intensity = 1.00 * 3.; vec3 base = color.rgb * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot) * intensity; color.rgb = color.rgb * 0.48 + base * diff * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot) * intensity; color.rgb += specular * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot * 4.) * 0.53; color.rgb = Tonemap_tanh(color.rgb); float dither = (random(gl_FragCoord.xy) - 0.5) / 255.0; color.rgb += dither; } if(0 == 1) { vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); vec4 maskColor = texture(uMaskTexture, vTextureCoord - pos); fragColor = color * (maskColor.a * maskColor.a); } else { fragColor = color; }}","#version 300 es\nprecision mediump float;in vec2 vTextureCoord;uniform sampler2D uTexture; uniform sampler2D uBgTexture;uniform sampler2D uMaskTexture; uniform float uAspectRatio; uniform vec2 uMousePos; uniform vec2 uResolution;out vec4 fragColor;const int kernelSize = 36; const float gaussianWeights[kernelSize] = float[](0.00094768, 0.00151965, 0.00237008, 0.00359517, 0.0053041, 0.00761097, 0.01062197, 0.01441804, 0.01903459, 0.0244409, 0.03052299, 0.03707432, 0.04379813, 0.05032389, 0.05623791, 0.06112521, 0.06461716, 0.06643724, 0.06643724, 0.06461716, 0.06112521, 0.05623791, 0.05032389, 0.04379813, 0.03707432, 0.03052299, 0.0244409, 0.01903459, 0.01441804, 0.01062197, 0.00761097, 0.0053041, 0.00359517, 0.00237008, 0.00151965, 0.00094768);vec4 GaussianBlur(sampler2D tex, vec2 uv, vec2 direction) { vec4 color = vec4(0.0); float weightSum = 0.0;float amount = (0.53 + 0.1) * 2.; float aspectRatio = uResolution.x/uResolution.y;direction.x /= aspectRatio;color += texture(tex, uv) * gaussianWeights[0]; for (int i = 0; i < kernelSize; i++) { float x = float(i - kernelSize / 2) * amount; color += texture(tex, uv + vec2(x/1000.) * direction) * gaussianWeights[i]; } return color; }float getHeight(vec2 uv) { vec4 col = texture(uTexture, uv); return col.r; }vec4 computeNoise(vec2 uv) { vec2 ste = (1. / uResolution); float height = getHeight(uv); vec2 dxy = height - vec2(getHeight(uv + vec2(ste.x, 0.)), getHeight(uv + vec2(0., ste.y)));return vec4(normalize(vec3(dxy * (0.02 + 0.04 * 0.53) / ste, 2.)), height); }float random(vec2 seed) { return fract(sin(dot(seed.xy, vec2(12.9898, 78.233))) * 43758.5453); }vec3 Tonemap_tanh(vec3 x) { x = clamp(x, -40.0, 40.0); return (exp(x) - exp(-x)) / (exp(x) + exp(-x)); }float light(vec3 p, vec3 normal, vec3 lightPos) { vec3 direction = normalize(lightPos - p); float specular = 0.5 * pow(max(dot(direction, reflect(-direction, normal)), 0.0), 2.0); return max(0.1, dot(normal, direction) * 1.2 - specular); }void main() { vec2 uv = vTextureCoord; vec4 color;if(2.00 == 0.) { color = GaussianBlur(uTexture, uv, vec2(uResolution.y/uResolution.x, 0)); } else if(2.00 == 1.) { color = GaussianBlur(uTexture, uv, vec2(0, 1)); color.rgb += (random(gl_FragCoord.xy) - 0.1) / 255.0; } else { vec2 pos = vec2(-0.030507136338683048, 1.092850915271533) + mix(vec2(0), (uMousePos-0.5), 0.23); vec2 aspectRatio = vec2(uResolution.x/uResolution.y, 1); color = texture(uBgTexture, uv); float luma = color.r; float dist = distance(uv * aspectRatio, pos * aspectRatio) / (1.00 + 0.5); float hightlighDist = distance(uv * aspectRatio, pos * aspectRatio) / (1.00 + 0.5)/2.; float spot = max(0., max(0., (1.-dist)) * max(0., (1.-dist))); float highlightSpot = max(0., max(0., (1.-hightlighDist)) * max(0., (1.-hightlighDist))); vec3 normal = computeNoise(uv).rgb*luma; vec2 lightDir = pos * aspectRatio - uv * aspectRatio; float lightDistance = 1.-length(lightDir); lightDir = normalize(lightDir); vec3 diff = vec3(max(dot(normal, vec3(lightDir, 0.5)), 0.0));float specular = light(vec3(uv, 1.), normal, vec3(pos, 1.)); specular = smoothstep(0., 1., specular) * 2.; float intensity = 1.00 * 3.; vec3 base = color.rgb * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot) * intensity; color.rgb = color.rgb * 0.48 + base * diff * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot) * intensity; color.rgb += specular * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot * 4.) * 0.53; color.rgb = Tonemap_tanh(color.rgb); float dither = (random(gl_FragCoord.xy) - 0.5) / 255.0; color.rgb += dither; } if(0 == 1) { vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); vec4 maskColor = texture(uMaskTexture, vTextureCoord - pos); fragColor = color * (maskColor.a * maskColor.a); } else { fragColor = color; }}"],"compiledVertexShaders":["#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }"],"data":{"depth":false,"passes":[{"prop":"pass","value":1},{"prop":"pass","value":2,"includeBg":true}]}},{"local":{"id":"20e575d8-3ec1-4358-bafb-80f41e61c84f","canvas":{},"ctx":{}},"visible":true,"locked":false,"aspectRatio":1,"isElement":true,"opacity":1,"displace":0,"trackMouse":0,"mouseMomentum":0,"blendMode":"NORMAL","bgDisplace":0,"mask":0,"maskBackground":{"type":"Vec3","_x":0,"_y":0,"_z":0},"maskAlpha":0,"dispersion":0,"axisTilt":0,"layerType":"text","justCreated":false,"effects":["3c344a98-bd2f-46e2-ae2a-855724224722","0f00febc-947c-4b79-b122-33fb81bd772d"],"fill":["#FFFFFF"],"highlight":["transparent"],"fontSize":100,"fontCSS":{"family":"DM Serif Display","src":"https://assets.unicorn.studio/fonts/google_fonts/-nFnOHM81r4j6k0gjAW3mujVU2B2K_d709jy92k.ttf"},"lineHeight":153.63267957308966,"letterSpacing":3,"fontFamily":"DM Serif Display","fontStyle":"regular","fontWeight":"400","textAlign":"center","textContent":"UNRAVEL","gradientAngle":0,"gradientType":"linear","coords":[[0,0],[680,0],[680,153.63267957308966],[0,153.63267957308966]],"rotation":0,"translateX":-65.73883917348076,"translateY":169,"width":680,"height":153.63267957308966,"isSafari":false,"compiledFragmentShaders":["#version 300 es\nprecision mediump float; in vec2 vTextureCoord; in vec3 vVertexPosition;uniform sampler2D uBgTexture; uniform sampler2D uTexture; uniform vec2 uMousePos; uniform vec2 uResolution; uniform int uSampleBg;vec2 perspectiveUV(vec2 uv) { float aspectRatio = uResolution.x/uResolution.y; vec2 centeredUV = uv - 0.5; centeredUV.x *= aspectRatio; float strength = 1.0 + (vVertexPosition.z * 0.00); vec2 perspectiveUV = centeredUV / strength; perspectiveUV.x /= aspectRatio; perspectiveUV += 0.5; return perspectiveUV; }out vec4 fragColor;void main() { vec2 uv = vTextureCoord; vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); uv = perspectiveUV(uv) - pos; vec4 color = texture(uTexture, uv); vec4 background = uSampleBg == 1 ? texture(uBgTexture, vTextureCoord) : vec4(0);color = mix(background, color/(color.a + 0.00000001), color.a * 1.00);fragColor = color; }"],"compiledVertexShaders":["#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix; uniform vec2 uMousePos;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { float angleX = uMousePos.y * 0.5 - 0.25; float angleY = (1.-uMousePos.x) * 0.5 - 0.25; mat4 rotateX = mat4(1.0, 0.0, 0.0, 0.0, 0.0, cos(angleX), -sin(angleX), 0.0, 0.0, sin(angleX), cos(angleX), 0.0, 0.0, 0.0, 0.0, 1.0); mat4 rotateY = mat4(cos(angleY), 0.0, sin(angleY), 0.0, 0.0, 1.0, 0.0, 0.0, -sin(angleY), 0.0, cos(angleY), 0.0, 0.0, 0.0, 0.0, 1.0);mat4 rotationMatrix = rotateX * rotateY; gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vVertexPosition = (rotationMatrix * vec4(aVertexPosition, 1.0)).xyz; vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }"]},{"visible":true,"aspectRatio":1,"layerType":"effect","type":"blinds","speed":0.26,"mouseMomentum":0,"texture":false,"animating":true,"isMask":0,"compiledFragmentShaders":["#version 300 es\nprecision mediump float; in vec2 vTextureCoord;uniform sampler2D uTexture; uniform float uTime;uniform sampler2D uMaskTexture; uniform float uAspectRatio; uniform vec2 uMousePos; uniform vec2 uResolution;float ease (int easingFunc, float t) { return t; }const float STEPS = 10.0;const float PI = 3.14159265359;mat2 rot(float a) { return mat2(cos(a), -sin(a), sin(a), cos(a)); }vec3 chromatic_abberation(vec2 st, vec2 aberrated) { vec4 red = vec4(0); vec4 blue = vec4(0); vec4 green = vec4(0);float invSteps = 1.0 / STEPS; float invStepsHalf = invSteps * 0.5;for(float i = 1.0; i <= STEPS; i++) { vec2 offset = aberrated * (i * invSteps); red += texture(uTexture, st - offset) * invSteps; blue += texture(uTexture, st + offset) * invSteps; green += texture(uTexture, st - offset * 0.5) * invStepsHalf; green += texture(uTexture, st + offset * 0.5) * invStepsHalf; }return vec3(red.r, green.g, blue.b); }vec2 scaleAspect(vec2 st, float aspectRatio) { return st * vec2(aspectRatio, 1.0); }vec2 unscaleAspect(vec2 st, float aspectRatio) { return st * vec2(1.0/aspectRatio, 1.0); }vec2 rotate(vec2 st, float angle) { float s = sin(angle); float c = cos(angle); mat2 rot = mat2(c, -s, s, c); return rot * st; }vec4 blinds(vec2 st, float mDist) { float aspectRatio = uResolution.x/uResolution.y; vec2 pos = vec2(0.5, 0.5) + mix(vec2(0), (uMousePos-0.5), 0.00) * floor(1.00); pos = scaleAspect(pos, aspectRatio); st = scaleAspect(st, aspectRatio); st = rotate(st - pos, -0.00 * 2.0 * PI) + pos;vec3 distort = vec3(0); float divisions = 2. + 0.09 * 30.; float dist = 0.50 * 4. + 1.; float segment = 0.;float amount = 0.32 * mDist;vec3 first = vec3(1,0,0); vec3 second = vec3(0,1,0); vec3 third = vec3(0,0,1); if(0 == 0) { segment = fract((st.y + 1. - pos.y - 1. + uTime*0.01) * divisions); distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st.y -= pow(distort.r, dist)/10. * amount; st.y += pow(distort.b, dist)/10. * amount; } else if(0 == 1) { segment = fract((st.x + 1. - pos.x - 1. + uTime*0.01) * divisions); distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st.x -= pow(distort.r, dist)/10. * amount; st.x += pow(distort.b, dist)/10. * amount; } else if(0 == 2) { segment = fract((st.x + 1. - pos.x - 1. + uTime*0.01) * divisions); distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st.x -= pow(distort.r, dist)/10. * amount; st.x += pow(distort.b, dist)/10. * amount;segment = fract((st.y + 1. - pos.y - 1. + uTime*0.01) * divisions); distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st.y -= pow(distort.r, dist)/10. * amount; st.y += pow(distort.b, dist)/10. * amount; } else if(0 == 3) { vec2 diff = st - pos; float angle = atan(diff.y, diff.x); segment = fract((angle + uTime*0.01 + PI) / (2. * PI) * divisions);distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st -= pow(distort.r, dist)/10. * amount * normalize(diff); st += pow(distort.b, dist)/10. * amount * normalize(diff); } else if(0 == 4) { vec2 diff = st - pos; float radius = length(diff); segment = fract(radius * divisions - uTime*0.01);distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st -= pow(distort.r, dist)/10. * amount * normalize(diff); st += pow(distort.b, dist)/10. * amount * normalize(diff); } else if(0 == 5) { vec2 diff = st - pos; float angle = -PI/4.; vec2 rotatedDiff = vec2( diff.x * cos(angle) - diff.y * sin(angle), diff.x * sin(angle) + diff.y * cos(angle) );float manhattanDist = abs(rotatedDiff.x) + abs(rotatedDiff.y); segment = fract(manhattanDist * divisions - uTime*0.01); distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st -= pow(distort.r, dist)/10. * amount * normalize(diff); st += pow(distort.b, dist)/10. * amount * normalize(diff); }st = rot(0.00 * 2. * PI) * (st - pos) + pos; st = unscaleAspect(st, aspectRatio); vec4 col = texture(uTexture, st);if(0.00 > 0.) { vec2 offset = vec2(pow(distort.r, dist), pow(distort.b, dist)) * vec2(0.1) * amount * 0.50; col.rgb = chromatic_abberation(st, offset * 0.00); } return col; }out vec4 fragColor;void main() { vec2 uv = vTextureCoord; float aspectRatio = uResolution.x/uResolution.y;vec2 mPos = vec2(0.5, 0.5) + mix(vec2(0), (uMousePos-0.5), 0.00); vec2 pos = mPos; float mDist = ease(0, max(0.,1.-distance(uv * vec2(aspectRatio, 1), mPos * vec2(aspectRatio, 1)) * 4. * (1. - 1.00)));if(0 == 1) { mDist = max(0., (0.5 - mDist)); } else if(mDist < distance(uv, mPos)) { discard; }vec4 col = blinds(uv, mDist); if(0 == 1) { vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); vec4 maskColor = texture(uMaskTexture, vTextureCoord - pos); fragColor = col * (maskColor.a * maskColor.a); } else { fragColor = col; }}"],"compiledVertexShaders":["#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }"],"data":{"depth":false}},{"visible":true,"aspectRatio":1,"layerType":"effect","type":"ascii","scale":0.24,"texture":false,"animating":false,"mouseMomentum":0,"isMask":0,"states":{"appear":[{"type":"appear","id":"237cf198-155e-47ed-88d0-9ca6d65ded33","prop":"scale","value":0,"transition":{"ease":"easeInOutQuart","duration":1000,"delay":0},"complete":false,"progress":0,"initialStateSet":false,"uniformData":{"type":"1f","name":"uScale"}}],"scroll":[]},"compiledFragmentShaders":["#version 300 es\nprecision mediump float;in vec3 vVertexPosition; in vec2 vTextureCoord; uniform sampler2D uTexture; uniform sampler2D uSprite; uniform float uScale; uniform int uShowBg; uniform sampler2D uMaskTexture; uniform float uAspectRatio; uniform vec2 uMousePos; uniform vec2 uResolution;out vec4 fragColor; void main() { vec2 uv = vTextureCoord; float aspectRatio = uResolution.x / uResolution.y;float gridSize = (uScale + 0.01) * 0.05;vec2 pixelatedCoord = vec2( floor(uv.x * aspectRatio / gridSize) * gridSize, floor(uv.y / gridSize) * gridSize ); pixelatedCoord.x /= aspectRatio;vec4 color = texture(uTexture, pixelatedCoord);float luminance = dot(color.rgb, vec3(0.2126, 0.7152, 0.0722)); luminance = mix(luminance, 1. - luminance, float(0));float scaleFactor = gridSize * 1./40.;float numSprites = 10.; float numGlyphRows = 6.; float spriteIndex = floor(luminance * numSprites); float glyphIndex = 5. - float(0);float normalizedSpriteSizeX = 1. / numSprites; float normalizedSpriteSizeY = 1. / numGlyphRows;vec2 spriteSheetUV = vec2( mod(min(9., spriteIndex), numSprites) * normalizedSpriteSizeX, glyphIndex / numGlyphRows );vec2 spriteSize = vec2(40. / aspectRatio, 40.) * scaleFactor; vec2 localOffset = mod(uv, spriteSize) / spriteSize;spriteSheetUV += vec2( localOffset.x * normalizedSpriteSizeX, localOffset.y * normalizedSpriteSizeY );vec4 spriteColor = texture(uSprite, spriteSheetUV);vec3 cc = (color.rgb - spriteIndex * 0.04) * 1.4; vec3 col = mix(cc, vec3(0, 1, 1), float(0)); vec3 dithered = mix(mix(vec3(0), vec3(1), float(0)), col, step(0.5, spriteColor.r)); color.rgb = dithered; if(0 == 1) { vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); vec4 maskColor = texture(uMaskTexture, vTextureCoord - pos); fragColor = color * (maskColor.a * maskColor.a); } else { fragColor = color; }}"],"compiledVertexShaders":["#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }"],"data":{"depth":false,"texture":{"src":"https://assets.unicorn.studio/media/ascii_spritesheet_larger.png","sampler":"uSprite"}}}],"options":{"name":"Hero section","fps":60,"dpi":2,"scale":1,"includeLogo":false,"version":"1.2.6"},"version":"1.2.6"} 1 + { 2 + "history": [ 3 + { 4 + "visible": true, 5 + "aspectRatio": 1, 6 + "layerType": "effect", 7 + "type": "gradient", 8 + "speed": 0.52, 9 + "mouseMomentum": 0, 10 + "texture": false, 11 + "animating": false, 12 + "isMask": 0, 13 + "compiledFragmentShaders": [ 14 + "#version 300 es\nprecision highp float;in vec2 vTextureCoord;const vec3 uColors[1] = vec3[]( vec3(1.000000, 0.819608, 0.596078) );uniform float uTime;uniform sampler2D uMaskTexture; uniform float uAspectRatio; uniform vec2 uMousePos; uniform vec2 uResolution;vec2 rotate(vec2 coord, float angle) { float s = sin(angle); float c = cos(angle); return vec2( coord.x * c - coord.y * s, coord.x * s + coord.y * c ); }float rand(vec2 co) { return fract(sin(dot(co.xy, vec2(12.9898, 78.233))) * 43758.5453); }vec3 linear_from_srgb(vec3 rgb) { return pow(rgb, vec3(2.2)); }vec3 srgb_from_linear(vec3 lin) { return pow(lin, vec3(1.0/2.2)); }vec3 oklab_mix(vec3 lin1, vec3 lin2, float a) { const mat3 kCONEtoLMS = mat3( 0.4121656120, 0.2118591070, 0.0883097947, 0.5362752080, 0.6807189584, 0.2818474174, 0.0514575653, 0.1074065790, 0.6302613616); const mat3 kLMStoCONE = mat3( 4.0767245293, -1.2681437731, -0.0041119885, -3.3072168827, 2.6093323231, -0.7034763098, 0.2307590544, -0.3411344290, 1.7068625689); vec3 lms1 = pow( kCONEtoLMS*lin1, vec3(1.0/3.0) ); vec3 lms2 = pow( kCONEtoLMS*lin2, vec3(1.0/3.0) ); vec3 lms = mix( lms1, lms2, a ); lms *= 1.0+0.025*a*(1.0-a); return kLMStoCONE*(lms*lms*lms); }vec3 getGradientColor(float position) { for (int i = 0; i < 1; i++) { float colorPosition = float(i) / float(1); float nextColorPosition = float(i + 1) / float(1); if (position <= nextColorPosition) { float mixFactor = (position - colorPosition) / (nextColorPosition - colorPosition); vec3 linStart = linear_from_srgb(uColors[i]); vec3 linEnd = linear_from_srgb(uColors[i + 1]); vec3 mixedLin = oklab_mix(linStart, linEnd, mixFactor); return srgb_from_linear(mixedLin); } } return srgb_from_linear(uColors[1-1]); }vec3 Tonemap_ACES(vec3 x) { const float a = 2.51; const float b = 0.03; const float c = 2.43; const float d = 0.59; const float e = 0.14; return (x * (a * x + b)) / (x * (c * x + d) + e); }out vec4 fragColor;void main() { vec2 uv = vTextureCoord; vec2 pos = vec2(0.5, 0.5) + mix(vec2(0), (uMousePos-0.5), 0.00); uv -= pos; uv /= (0.52*2.); uv = rotate(uv, (0.20 - 0.5) * 2. * 3.14159265);vec4 color = vec4(0,0,0,1);float position; if(1 == 1) { color.rgb = uColors[0]; } else if (0 == 0) { position = (uv.x+0.5);} else if (0 == 1) { position = length(uv); } else if (0 == 2) { float angle = atan(uv.y, uv.x); float normalizedAngle = angle / (2.0 * 3.14159265359) + 0.5; float doubledAngle = 2.0 * normalizedAngle; doubledAngle = doubledAngle > 1. ? 2.0 - doubledAngle : doubledAngle; position = clamp(doubledAngle, 0.0, 1.0); } else if (0 == 3) { } if(1 > 1) { position -= (uTime*0.01 + 0.00); float cycle = floor(position); bool reverse = int(cycle) % 2 == 0; float animatedPos = reverse ? fract(-position) : fract(position); animatedPos = reverse ? animatedPos - 1./float(1) : animatedPos - 1./float(1);color.rgb = getGradientColor(animatedPos); float dither = rand(gl_FragCoord.xy) * 0.005; color.rgb += dither; }fragColor = color; }" 15 + ], 16 + "compiledVertexShaders": [ 17 + "#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = aTextureCoord; }" 18 + ], 19 + "data": { "depth": false } 20 + }, 21 + { 22 + "visible": true, 23 + "aspectRatio": 1, 24 + "layerType": "effect", 25 + "type": "mouse", 26 + "texture": false, 27 + "parentLayer": "0f00febc-947c-4b79-b122-33fb81bd772d", 28 + "animating": true, 29 + "mouseMomentum": 0, 30 + "isMask": 0, 31 + "compiledFragmentShaders": [ 32 + "#version 300 es\nprecision mediump float;in vec2 vTextureCoord; in vec3 vVertexPosition;uniform sampler2D uTexture; uniform sampler2D uPingPongTexture; uniform vec2 uResolution;uniform float uTime;const float PI = 3.1415926; const float ITERATIONS = 24.0; const float kernel[24] = float[]( 0.7978845608028654, 0.795118932516684, 0.7868794322038799, 0.7733362336056986, 0.7547664553859864, 0.7315447328280048, 0.704130653528599, 0.6730536454899063, 0.6388960110447045, 0.6022748643096089, 0.5638237508206051, 0.5241747061566029, 0.48394144903828673, 0.443704309411472, 0.40399737110811773, 0.36529817077804383, 0.3280201493519873, 0.29250790855907144, 0.2590351913317835, 0.2278053882403838, 0.19895427758549736, 0.17255463765302306, 0.1486223271179862, 0.12712341303392466 );out vec4 fragColor;vec4 permute(vec4 t) { return t * (t * 34.0 + 133.0); } vec3 grad(float hash) { vec3 cube = mod(floor(hash / vec3(1.0, 2.0, 4.0)), 2.0) * 2.0 - 1.0; vec3 cuboct = cube; cuboct[int(hash / 16.0)] = 0.0; float type = mod(floor(hash / 8.0), 2.0); vec3 rhomb = (1.0 - type) * cube + type * (cuboct + cross(cube, cuboct)); vec3 grad = cuboct * 1.22474487139 + rhomb; grad *= (1.0 - 0.042942436724648037 * type) * 3.5946317686139184; return grad; } vec4 bccNoiseDerivativesPart(vec3 X) { vec3 b = floor(X); vec4 i4 = vec4(X - b, 2.5); vec3 v1 = b + floor(dot(i4, vec4(.25))); vec3 v2 = b + vec3(1, 0, 0) + vec3(-1, 1, 1) * floor(dot(i4, vec4(-.25, .25, .25, .35))); vec3 v3 = b + vec3(0, 1, 0) + vec3(1, -1, 1) * floor(dot(i4, vec4(.25, -.25, .25, .35))); vec3 v4 = b + vec3(0, 0, 1) + vec3(1, 1, -1) * floor(dot(i4, vec4(.25, .25, -.25, .35))); vec4 hashes = permute(mod(vec4(v1.x, v2.x, v3.x, v4.x), 289.0)); hashes = permute(mod(hashes + vec4(v1.y, v2.y, v3.y, v4.y), 289.0)); hashes = mod(permute(mod(hashes + vec4(v1.z, v2.z, v3.z, v4.z), 289.0)), 48.0); vec3 d1 = X - v1; vec3 d2 = X - v2; vec3 d3 = X - v3; vec3 d4 = X - v4; vec4 a = max(0.75 - vec4(dot(d1, d1), dot(d2, d2), dot(d3, d3), dot(d4, d4)), 0.0); vec4 aa = a * a; vec4 aaaa = aa * aa; vec3 g1 = grad(hashes.x); vec3 g2 = grad(hashes.y); vec3 g3 = grad(hashes.z); vec3 g4 = grad(hashes.w); vec4 extrapolations = vec4(dot(d1, g1), dot(d2, g2), dot(d3, g3), dot(d4, g4)); vec3 derivative = -8.0 * mat4x3(d1, d2, d3, d4) * (aa * a * extrapolations) + mat4x3(g1, g2, g3, g4) * aaaa; return vec4(derivative, dot(aaaa, extrapolations)); } vec4 bccNoiseDerivatives_XYBeforeZ(vec3 X) { mat3 orthonormalMap = mat3( 0.788675134594813, -0.211324865405187, -0.577350269189626, -0.211324865405187, 0.788675134594813, -0.577350269189626, 0.577350269189626, 0.577350269189626, 0.577350269189626); X = orthonormalMap * X; vec4 result = bccNoiseDerivativesPart(X) + bccNoiseDerivativesPart(X + 144.5); return vec4(result.xyz * orthonormalMap, result.w); }vec2 random2(vec2 p) { return fract(sin(vec2(dot(p, vec2(127.1, 311.7)), dot(p, vec2(269.5, 183.3)))) * 43758.5453); }vec3 rgb2hsv(vec3 c) { vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0); vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g)); vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));float d = q.x - min(q.w, q.y); float e = 1.0e-10; return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x); }vec3 chromatic_aberration(vec3 color, vec2 uv, vec2 offset) { vec4 left = texture(uTexture, uv - offset); vec4 right = texture(uTexture, uv + offset);color.r = left.r; color.b = right.b;return color; }vec2 pixelate(vec2 uv) { float aspectRatio = uResolution.x / uResolution.y; float scale = 0.50 / 2.0; vec2 modulate = mod(vec2(uv.x * aspectRatio, uv.y) - 0.5, (scale + 0.01) / 12.0); return vec2( uv.x - modulate.x / aspectRatio + (0.08333 * scale) / 2.0, uv.y - modulate.y + (0.08333 * scale) / 2.0 ); }vec2 angleToDir(float angle) { float rad = angle * 2.0 * PI; return vec2(cos(rad), sin(rad)); }vec4 blurTrail(vec2 uv, vec2 mouseDir) { vec2 distorted = mouseDir * 0.4; float total_weight = 0.0; vec4 color = vec4(0);for (int i = 0; i <= 24; i++) { float scale = 0.0001 + 0.50 * 0.5; float weight = kernel[i]; vec2 offset = distorted * (1.5 + scale) * mix(1.0, float(i) / ITERATIONS, scale); vec4 samp = texture(uTexture, uv - offset); samp.rgb = chromatic_aberration(samp.rgb, uv - offset, offset * 0.43 * 0.12); color += weight * samp; total_weight += weight; } return color / total_weight; }vec4 noiseTrail(vec2 uv, vec2 mouseDir, float strength, float aspectRatio) { vec4 color = vec4(0); vec2 noise = bccNoiseDerivatives_XYBeforeZ(vec3((uv * vec2(aspectRatio, 1) - mouseDir / 8.0 - 0.5) * 250.0 * 0.50, strength)).xy * strength * 0.25; vec2 distorted = (mouseDir + noise) * 0.4; color = texture(uTexture, uv - distorted); color.rgb = chromatic_aberration(color.rgb, uv - distorted, distorted * 0.43 * 0.12); return color; }vec4 pixelTrail(vec2 uv, vec2 mouseDir, float strength) { vec4 color = vec4(0); vec2 distorted = mouseDir * 0.4; vec2 pixelated = uv - distorted; color = texture(uTexture, pixelated); color.rgb = chromatic_aberration(color.rgb, pixelated, distorted * 0.43 * 0.12); return color; }vec4 revealTrail(vec2 uv, vec2 mouseDir, float strength) { vec4 color = vec4(0); float zMix = strength; vec2 distorted = mouseDir * 0.4 * 0.50; color = texture(uTexture, uv - distorted); color.rgb = chromatic_aberration(color.rgb, uv - distorted, distorted * 0.43 * 0.12); color = mix(vec4(vec3(0, 0, 0), 1.00), color, zMix); return color; }vec4 inverTrail(vec2 uv, vec2 mouseDir, float strength) { vec4 color = vec4(0); vec2 distorted = mouseDir * 0.4 * 0.50; float sMix = step(0.3, strength); color = texture(uTexture, uv - distorted); color.rgb = chromatic_aberration(color.rgb, uv - distorted, distorted * 0.43 * 0.12); color.rgb = mix(color.rgb, 1.0 - color.rgb, sMix); return color; }vec4 defaultTrail(vec2 uv, vec2 mouseDir) { vec4 color = vec4(0); vec2 distorted = mouseDir * 0.4; color = texture(uTexture, uv - distorted); color.rgb = chromatic_aberration(color.rgb, uv - distorted, distorted * 0.43 * 0.12); return color; }vec4 shatterTrail(vec2 uv, vec2 mouseDir, float strength, float aspectRatio) { vec2 st = uv * vec2(aspectRatio, 1) * 80.0 * 0.50; vec2 i_st = floor(st); vec2 f_st = fract(st);float m_dist = 15.0; vec2 m_point; vec2 d;for (int j = -1; j <= 1; j++) { for (int i = -1; i <= 1; i++) { vec2 neighbor = vec2(float(i), float(j)); vec2 point = random2(i_st + neighbor);vec2 diff = neighbor + point - f_st; float dist = length(diff);if (dist < m_dist) { m_dist = dist; m_point = point; d = diff; } } }vec2 distorted = mouseDir * 0.4; vec2 offset = (m_point * 0.2 * 1.0 * 2.0) - (1.0 * 0.2) - distorted; return texture(uTexture, uv + offset * strength); }vec4 getTrailColor(vec2 uv, vec2 mouseDir, float strength) { vec4 color = vec4(0); float aspectRatio = uResolution.x / uResolution.y;switch (0) { case 1: return blurTrail(uv, mouseDir); case 2: return noiseTrail(uv, mouseDir, strength, aspectRatio); case 3: return pixelTrail(uv, mouseDir, strength); case 4: return revealTrail(uv, mouseDir, strength); case 5: return inverTrail(uv, mouseDir, strength); case 6: return shatterTrail(uv, mouseDir, strength, aspectRatio); default: return defaultTrail(uv, mouseDir); } }void main() { vec2 uv = vTextureCoord; vec2 pingpongUv = uv;if (0 == 3) { pingpongUv = pixelate(pingpongUv); }vec3 mouseRgb = texture(uPingPongTexture, pingpongUv).rgb; vec3 mouseTrail = rgb2hsv(mouseRgb);float angle = mouseTrail.x; float strength = mouseTrail.z * (0.03 * 2.0); vec2 direction = angleToDir(angle); vec2 mouseDir = direction * strength;vec4 color = getTrailColor(uv, mouseDir, strength);fragColor = color; }", 33 + "#version 300 es\nprecision lowp float;in vec3 vVertexPosition; in vec2 vTextureCoord;uniform sampler2D uTexture; uniform sampler2D uPingPongTexture; uniform vec2 uMousePos; uniform vec2 uPreviousMousePos; uniform vec2 uResolution; uniform float uTime;const float PI = 3.1415926; const float TWOPI = 6.2831852;out vec4 fragColor;vec3 hsv2rgb(vec3 c) { vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0); vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www); return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y); }mat2 rot(float a) { return mat2(cos(a), -sin(a), sin(a), cos(a)); }vec2 liquify(vec2 st, float angle) { float aspectRatio = uResolution.x / uResolution.y; st.x *= aspectRatio; st = st * rot(angle * TWOPI); float amplitude = 0.003; for (float i = 1.0; i <= 5.0; i++) { st = st * rot(i / 5.0 * PI * 2.0); st += vec2( amplitude * cos(i * 5.0 * st.y + uTime * 0.02), amplitude * sin(i * 5.0 * st.x + uTime * 0.02) ); } st = st * rot(-angle * TWOPI); st.x /= aspectRatio; return st; }void main() { float aspectRatio = uResolution.x / uResolution.y; vec2 uv = vTextureCoord; vec2 correctedUv = uv * vec2(aspectRatio, 1.0);vec2 dir = (uMousePos - uPreviousMousePos) * vec2(aspectRatio, 1.0); float dist = length(dir); dir = normalize(dir);float rad = 0.41 * 0.4 * mix(aspectRatio, 1.0, 0.5); float angle = atan(dir.y, dir.x); if (angle < 0.0) angle += TWOPI;if(0.18 > 0.) { uv = mix(uv, liquify(uv, smoothstep(0.0, 1.0, angle)), 0.18); }float t = clamp(dot(correctedUv - uPreviousMousePos * vec2(aspectRatio, 1.0), dir) / dist, 0.0, 1.0); vec2 closestPoint = mix(uPreviousMousePos, uMousePos, t) * vec2(aspectRatio, 1.0); float distanceToLine = distance(correctedUv, closestPoint);float s = smoothstep(rad, rad * 0.41, distanceToLine);vec3 color = vec3(angle / TWOPI, 1.0, 1.0); vec3 mouseColor = hsv2rgb(color);vec3 lastFrameColor = texture(uPingPongTexture, mix(uv, uv / 1.03 + 0.015, 0.65)).rgb; vec3 draw = mix(lastFrameColor, mouseColor, min(1.0, dist * s));fragColor = vec4(draw * pow(0.44, 0.1), 1.0); }" 34 + ], 35 + "compiledVertexShaders": [ 36 + "#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix;uniform sampler2D uPingPongTexture;out vec3 vVertexPosition; out vec2 vTextureCoord;vec3 rgb2hsv(vec3 c) { vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0); vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g)); vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));float d = q.x - min(q.w, q.y); float e = 1.0e-10; return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x); }const float PI = 3.1415926;void main() {vec3 vertexPosition = aVertexPosition;gl_Position = uPMatrix * uMVMatrix * vec4(vertexPosition, 1.0); vTextureCoord = aTextureCoord; }", 37 + "#version 300 es\nprecision lowp float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix;out vec3 vVertexPosition; out vec2 vTextureCoord;void main() {vec3 vertexPosition = aVertexPosition;gl_Position = uPMatrix * uMVMatrix * vec4(vertexPosition, 1.0); vTextureCoord = aTextureCoord; vVertexPosition = vertexPosition; }" 38 + ], 39 + "data": { "depth": false } 40 + }, 41 + { 42 + "local": { 43 + "id": "d8f72fb5-849a-4c6d-ae50-37149aa273ef", 44 + "canvas": {}, 45 + "ctx": {} 46 + }, 47 + "visible": true, 48 + "locked": false, 49 + "aspectRatio": 1, 50 + "isElement": true, 51 + "opacity": 0.81, 52 + "displace": 0, 53 + "trackMouse": 0, 54 + "mouseMomentum": 0, 55 + "blendMode": "NORMAL", 56 + "bgDisplace": 0, 57 + "mask": 0, 58 + "maskBackground": { "type": "Vec3", "_x": 0, "_y": 0, "_z": 0 }, 59 + "maskAlpha": 0, 60 + "dispersion": 0, 61 + "axisTilt": 0, 62 + "layerType": "image", 63 + "imageLoaded": false, 64 + "effects": [], 65 + "size": 0.66, 66 + "rotation": 0, 67 + "height": 129, 68 + "repeat": 0, 69 + "fitToCanvas": 1, 70 + "scaleX": 1, 71 + "scaleY": 1, 72 + "src": "https://assets.unicorn.studio/images/nYceGF4tzMX8WjSRSNzpUt1o4812/papashrek-2x.png", 73 + "speed": 0.5, 74 + "thumb": "https://assets.unicorn.studio/images/nYceGF4tzMX8WjSRSNzpUt1o4812/papashrek-2x_@thumbnail.png?authuser=0", 75 + "translateX": -5, 76 + "translateY": -61, 77 + "width": 128, 78 + "compiledFragmentShaders": [ 79 + "#version 300 es\nprecision mediump float; in vec2 vTextureCoord; in vec3 vVertexPosition;uniform sampler2D uBgTexture; uniform sampler2D uTexture; uniform vec2 uMousePos; uniform vec2 uResolution; uniform int uSampleBg;vec2 perspectiveUV(vec2 uv) { float aspectRatio = uResolution.x/uResolution.y; vec2 centeredUV = uv - 0.5; centeredUV.x *= aspectRatio; float strength = 1.0 + (vVertexPosition.z * 0.00); vec2 perspectiveUV = centeredUV / strength; perspectiveUV.x /= aspectRatio; perspectiveUV += 0.5; return perspectiveUV; }out vec4 fragColor;void main() { vec2 uv = vTextureCoord; vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); uv = perspectiveUV(uv) - pos; vec4 color = texture(uTexture, uv); vec4 background = uSampleBg == 1 ? texture(uBgTexture, vTextureCoord) : vec4(0);color = mix(background, color/(color.a + 0.00000001), color.a * 0.81);fragColor = color; }" 80 + ], 81 + "compiledVertexShaders": [ 82 + "#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix; uniform vec2 uMousePos;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { float angleX = uMousePos.y * 0.5 - 0.25; float angleY = (1.-uMousePos.x) * 0.5 - 0.25; mat4 rotateX = mat4(1.0, 0.0, 0.0, 0.0, 0.0, cos(angleX), -sin(angleX), 0.0, 0.0, sin(angleX), cos(angleX), 0.0, 0.0, 0.0, 0.0, 1.0); mat4 rotateY = mat4(cos(angleY), 0.0, sin(angleY), 0.0, 0.0, 1.0, 0.0, 0.0, -sin(angleY), 0.0, cos(angleY), 0.0, 0.0, 0.0, 0.0, 1.0);mat4 rotationMatrix = rotateX * rotateY; gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vVertexPosition = (rotationMatrix * vec4(aVertexPosition, 1.0)).xyz; vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }" 83 + ] 84 + }, 85 + { 86 + "visible": true, 87 + "aspectRatio": 1, 88 + "layerType": "effect", 89 + "type": "spotlight", 90 + "mouseMomentum": 0.47, 91 + "texture": false, 92 + "animating": false, 93 + "isMask": 0, 94 + "compiledFragmentShaders": [ 95 + "#version 300 es\nprecision mediump float;in vec2 vTextureCoord;uniform sampler2D uTexture; uniform sampler2D uBgTexture;uniform sampler2D uMaskTexture; uniform float uAspectRatio; uniform vec2 uMousePos; uniform vec2 uResolution;out vec4 fragColor;const int kernelSize = 36; const float gaussianWeights[kernelSize] = float[](0.00094768, 0.00151965, 0.00237008, 0.00359517, 0.0053041, 0.00761097, 0.01062197, 0.01441804, 0.01903459, 0.0244409, 0.03052299, 0.03707432, 0.04379813, 0.05032389, 0.05623791, 0.06112521, 0.06461716, 0.06643724, 0.06643724, 0.06461716, 0.06112521, 0.05623791, 0.05032389, 0.04379813, 0.03707432, 0.03052299, 0.0244409, 0.01903459, 0.01441804, 0.01062197, 0.00761097, 0.0053041, 0.00359517, 0.00237008, 0.00151965, 0.00094768);vec4 GaussianBlur(sampler2D tex, vec2 uv, vec2 direction) { vec4 color = vec4(0.0); float weightSum = 0.0;float amount = (0.53 + 0.1) * 2.; float aspectRatio = uResolution.x/uResolution.y;direction.x /= aspectRatio;color += texture(tex, uv) * gaussianWeights[0]; for (int i = 0; i < kernelSize; i++) { float x = float(i - kernelSize / 2) * amount; color += texture(tex, uv + vec2(x/1000.) * direction) * gaussianWeights[i]; } return color; }float getHeight(vec2 uv) { vec4 col = texture(uTexture, uv); return col.r; }vec4 computeNoise(vec2 uv) { vec2 ste = (1. / uResolution); float height = getHeight(uv); vec2 dxy = height - vec2(getHeight(uv + vec2(ste.x, 0.)), getHeight(uv + vec2(0., ste.y)));return vec4(normalize(vec3(dxy * (0.02 + 0.04 * 0.53) / ste, 2.)), height); }float random(vec2 seed) { return fract(sin(dot(seed.xy, vec2(12.9898, 78.233))) * 43758.5453); }vec3 Tonemap_tanh(vec3 x) { x = clamp(x, -40.0, 40.0); return (exp(x) - exp(-x)) / (exp(x) + exp(-x)); }float light(vec3 p, vec3 normal, vec3 lightPos) { vec3 direction = normalize(lightPos - p); float specular = 0.5 * pow(max(dot(direction, reflect(-direction, normal)), 0.0), 2.0); return max(0.1, dot(normal, direction) * 1.2 - specular); }void main() { vec2 uv = vTextureCoord; vec4 color;if(0.00 == 0.) { color = GaussianBlur(uTexture, uv, vec2(uResolution.y/uResolution.x, 0)); } else if(0.00 == 1.) { color = GaussianBlur(uTexture, uv, vec2(0, 1)); color.rgb += (random(gl_FragCoord.xy) - 0.1) / 255.0; } else { vec2 pos = vec2(-0.030507136338683048, 1.092850915271533) + mix(vec2(0), (uMousePos-0.5), 0.23); vec2 aspectRatio = vec2(uResolution.x/uResolution.y, 1); color = texture(uBgTexture, uv); float luma = color.r; float dist = distance(uv * aspectRatio, pos * aspectRatio) / (1.00 + 0.5); float hightlighDist = distance(uv * aspectRatio, pos * aspectRatio) / (1.00 + 0.5)/2.; float spot = max(0., max(0., (1.-dist)) * max(0., (1.-dist))); float highlightSpot = max(0., max(0., (1.-hightlighDist)) * max(0., (1.-hightlighDist))); vec3 normal = computeNoise(uv).rgb*luma; vec2 lightDir = pos * aspectRatio - uv * aspectRatio; float lightDistance = 1.-length(lightDir); lightDir = normalize(lightDir); vec3 diff = vec3(max(dot(normal, vec3(lightDir, 0.5)), 0.0));float specular = light(vec3(uv, 1.), normal, vec3(pos, 1.)); specular = smoothstep(0., 1., specular) * 2.; float intensity = 1.00 * 3.; vec3 base = color.rgb * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot) * intensity; color.rgb = color.rgb * 0.48 + base * diff * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot) * intensity; color.rgb += specular * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot * 4.) * 0.53; color.rgb = Tonemap_tanh(color.rgb); float dither = (random(gl_FragCoord.xy) - 0.5) / 255.0; color.rgb += dither; } if(0 == 1) { vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); vec4 maskColor = texture(uMaskTexture, vTextureCoord - pos); fragColor = color * (maskColor.a * maskColor.a); } else { fragColor = color; }}", 96 + "#version 300 es\nprecision mediump float;in vec2 vTextureCoord;uniform sampler2D uTexture; uniform sampler2D uBgTexture;uniform sampler2D uMaskTexture; uniform float uAspectRatio; uniform vec2 uMousePos; uniform vec2 uResolution;out vec4 fragColor;const int kernelSize = 36; const float gaussianWeights[kernelSize] = float[](0.00094768, 0.00151965, 0.00237008, 0.00359517, 0.0053041, 0.00761097, 0.01062197, 0.01441804, 0.01903459, 0.0244409, 0.03052299, 0.03707432, 0.04379813, 0.05032389, 0.05623791, 0.06112521, 0.06461716, 0.06643724, 0.06643724, 0.06461716, 0.06112521, 0.05623791, 0.05032389, 0.04379813, 0.03707432, 0.03052299, 0.0244409, 0.01903459, 0.01441804, 0.01062197, 0.00761097, 0.0053041, 0.00359517, 0.00237008, 0.00151965, 0.00094768);vec4 GaussianBlur(sampler2D tex, vec2 uv, vec2 direction) { vec4 color = vec4(0.0); float weightSum = 0.0;float amount = (0.53 + 0.1) * 2.; float aspectRatio = uResolution.x/uResolution.y;direction.x /= aspectRatio;color += texture(tex, uv) * gaussianWeights[0]; for (int i = 0; i < kernelSize; i++) { float x = float(i - kernelSize / 2) * amount; color += texture(tex, uv + vec2(x/1000.) * direction) * gaussianWeights[i]; } return color; }float getHeight(vec2 uv) { vec4 col = texture(uTexture, uv); return col.r; }vec4 computeNoise(vec2 uv) { vec2 ste = (1. / uResolution); float height = getHeight(uv); vec2 dxy = height - vec2(getHeight(uv + vec2(ste.x, 0.)), getHeight(uv + vec2(0., ste.y)));return vec4(normalize(vec3(dxy * (0.02 + 0.04 * 0.53) / ste, 2.)), height); }float random(vec2 seed) { return fract(sin(dot(seed.xy, vec2(12.9898, 78.233))) * 43758.5453); }vec3 Tonemap_tanh(vec3 x) { x = clamp(x, -40.0, 40.0); return (exp(x) - exp(-x)) / (exp(x) + exp(-x)); }float light(vec3 p, vec3 normal, vec3 lightPos) { vec3 direction = normalize(lightPos - p); float specular = 0.5 * pow(max(dot(direction, reflect(-direction, normal)), 0.0), 2.0); return max(0.1, dot(normal, direction) * 1.2 - specular); }void main() { vec2 uv = vTextureCoord; vec4 color;if(1.00 == 0.) { color = GaussianBlur(uTexture, uv, vec2(uResolution.y/uResolution.x, 0)); } else if(1.00 == 1.) { color = GaussianBlur(uTexture, uv, vec2(0, 1)); color.rgb += (random(gl_FragCoord.xy) - 0.1) / 255.0; } else { vec2 pos = vec2(-0.030507136338683048, 1.092850915271533) + mix(vec2(0), (uMousePos-0.5), 0.23); vec2 aspectRatio = vec2(uResolution.x/uResolution.y, 1); color = texture(uBgTexture, uv); float luma = color.r; float dist = distance(uv * aspectRatio, pos * aspectRatio) / (1.00 + 0.5); float hightlighDist = distance(uv * aspectRatio, pos * aspectRatio) / (1.00 + 0.5)/2.; float spot = max(0., max(0., (1.-dist)) * max(0., (1.-dist))); float highlightSpot = max(0., max(0., (1.-hightlighDist)) * max(0., (1.-hightlighDist))); vec3 normal = computeNoise(uv).rgb*luma; vec2 lightDir = pos * aspectRatio - uv * aspectRatio; float lightDistance = 1.-length(lightDir); lightDir = normalize(lightDir); vec3 diff = vec3(max(dot(normal, vec3(lightDir, 0.5)), 0.0));float specular = light(vec3(uv, 1.), normal, vec3(pos, 1.)); specular = smoothstep(0., 1., specular) * 2.; float intensity = 1.00 * 3.; vec3 base = color.rgb * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot) * intensity; color.rgb = color.rgb * 0.48 + base * diff * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot) * intensity; color.rgb += specular * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot * 4.) * 0.53; color.rgb = Tonemap_tanh(color.rgb); float dither = (random(gl_FragCoord.xy) - 0.5) / 255.0; color.rgb += dither; } if(0 == 1) { vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); vec4 maskColor = texture(uMaskTexture, vTextureCoord - pos); fragColor = color * (maskColor.a * maskColor.a); } else { fragColor = color; }}", 97 + "#version 300 es\nprecision mediump float;in vec2 vTextureCoord;uniform sampler2D uTexture; uniform sampler2D uBgTexture;uniform sampler2D uMaskTexture; uniform float uAspectRatio; uniform vec2 uMousePos; uniform vec2 uResolution;out vec4 fragColor;const int kernelSize = 36; const float gaussianWeights[kernelSize] = float[](0.00094768, 0.00151965, 0.00237008, 0.00359517, 0.0053041, 0.00761097, 0.01062197, 0.01441804, 0.01903459, 0.0244409, 0.03052299, 0.03707432, 0.04379813, 0.05032389, 0.05623791, 0.06112521, 0.06461716, 0.06643724, 0.06643724, 0.06461716, 0.06112521, 0.05623791, 0.05032389, 0.04379813, 0.03707432, 0.03052299, 0.0244409, 0.01903459, 0.01441804, 0.01062197, 0.00761097, 0.0053041, 0.00359517, 0.00237008, 0.00151965, 0.00094768);vec4 GaussianBlur(sampler2D tex, vec2 uv, vec2 direction) { vec4 color = vec4(0.0); float weightSum = 0.0;float amount = (0.53 + 0.1) * 2.; float aspectRatio = uResolution.x/uResolution.y;direction.x /= aspectRatio;color += texture(tex, uv) * gaussianWeights[0]; for (int i = 0; i < kernelSize; i++) { float x = float(i - kernelSize / 2) * amount; color += texture(tex, uv + vec2(x/1000.) * direction) * gaussianWeights[i]; } return color; }float getHeight(vec2 uv) { vec4 col = texture(uTexture, uv); return col.r; }vec4 computeNoise(vec2 uv) { vec2 ste = (1. / uResolution); float height = getHeight(uv); vec2 dxy = height - vec2(getHeight(uv + vec2(ste.x, 0.)), getHeight(uv + vec2(0., ste.y)));return vec4(normalize(vec3(dxy * (0.02 + 0.04 * 0.53) / ste, 2.)), height); }float random(vec2 seed) { return fract(sin(dot(seed.xy, vec2(12.9898, 78.233))) * 43758.5453); }vec3 Tonemap_tanh(vec3 x) { x = clamp(x, -40.0, 40.0); return (exp(x) - exp(-x)) / (exp(x) + exp(-x)); }float light(vec3 p, vec3 normal, vec3 lightPos) { vec3 direction = normalize(lightPos - p); float specular = 0.5 * pow(max(dot(direction, reflect(-direction, normal)), 0.0), 2.0); return max(0.1, dot(normal, direction) * 1.2 - specular); }void main() { vec2 uv = vTextureCoord; vec4 color;if(2.00 == 0.) { color = GaussianBlur(uTexture, uv, vec2(uResolution.y/uResolution.x, 0)); } else if(2.00 == 1.) { color = GaussianBlur(uTexture, uv, vec2(0, 1)); color.rgb += (random(gl_FragCoord.xy) - 0.1) / 255.0; } else { vec2 pos = vec2(-0.030507136338683048, 1.092850915271533) + mix(vec2(0), (uMousePos-0.5), 0.23); vec2 aspectRatio = vec2(uResolution.x/uResolution.y, 1); color = texture(uBgTexture, uv); float luma = color.r; float dist = distance(uv * aspectRatio, pos * aspectRatio) / (1.00 + 0.5); float hightlighDist = distance(uv * aspectRatio, pos * aspectRatio) / (1.00 + 0.5)/2.; float spot = max(0., max(0., (1.-dist)) * max(0., (1.-dist))); float highlightSpot = max(0., max(0., (1.-hightlighDist)) * max(0., (1.-hightlighDist))); vec3 normal = computeNoise(uv).rgb*luma; vec2 lightDir = pos * aspectRatio - uv * aspectRatio; float lightDistance = 1.-length(lightDir); lightDir = normalize(lightDir); vec3 diff = vec3(max(dot(normal, vec3(lightDir, 0.5)), 0.0));float specular = light(vec3(uv, 1.), normal, vec3(pos, 1.)); specular = smoothstep(0., 1., specular) * 2.; float intensity = 1.00 * 3.; vec3 base = color.rgb * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot) * intensity; color.rgb = color.rgb * 0.48 + base * diff * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot) * intensity; color.rgb += specular * vec3(0, 0.9803921568627451, 0.9333333333333333) * max(0., spot * 4.) * 0.53; color.rgb = Tonemap_tanh(color.rgb); float dither = (random(gl_FragCoord.xy) - 0.5) / 255.0; color.rgb += dither; } if(0 == 1) { vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); vec4 maskColor = texture(uMaskTexture, vTextureCoord - pos); fragColor = color * (maskColor.a * maskColor.a); } else { fragColor = color; }}" 98 + ], 99 + "compiledVertexShaders": [ 100 + "#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }" 101 + ], 102 + "data": { 103 + "depth": false, 104 + "passes": [ 105 + { "prop": "pass", "value": 1 }, 106 + { "prop": "pass", "value": 2, "includeBg": true } 107 + ] 108 + } 109 + }, 110 + { 111 + "local": { 112 + "id": "20e575d8-3ec1-4358-bafb-80f41e61c84f", 113 + "canvas": {}, 114 + "ctx": {} 115 + }, 116 + "visible": true, 117 + "locked": false, 118 + "aspectRatio": 1, 119 + "isElement": true, 120 + "opacity": 1, 121 + "displace": 0, 122 + "trackMouse": 0, 123 + "mouseMomentum": 0, 124 + "blendMode": "NORMAL", 125 + "bgDisplace": 0, 126 + "mask": 0, 127 + "maskBackground": { "type": "Vec3", "_x": 0, "_y": 0, "_z": 0 }, 128 + "maskAlpha": 0, 129 + "dispersion": 0, 130 + "axisTilt": 0, 131 + "layerType": "text", 132 + "justCreated": false, 133 + "effects": [ 134 + "3c344a98-bd2f-46e2-ae2a-855724224722", 135 + "0f00febc-947c-4b79-b122-33fb81bd772d" 136 + ], 137 + "fill": ["#FFFFFF"], 138 + "highlight": ["transparent"], 139 + "fontSize": 100, 140 + "fontCSS": { 141 + "family": "DM Serif Display", 142 + "src": "https://assets.unicorn.studio/fonts/google_fonts/-nFnOHM81r4j6k0gjAW3mujVU2B2K_d709jy92k.ttf" 143 + }, 144 + "lineHeight": 153.63267957308966, 145 + "letterSpacing": 3, 146 + "fontFamily": "DM Serif Display", 147 + "fontStyle": "regular", 148 + "fontWeight": "400", 149 + "textAlign": "center", 150 + "textContent": "UNRAVEL", 151 + "gradientAngle": 0, 152 + "gradientType": "linear", 153 + "coords": [ 154 + [0, 0], 155 + [680, 0], 156 + [680, 153.63267957308966], 157 + [0, 153.63267957308966] 158 + ], 159 + "rotation": 0, 160 + "translateX": -65.73883917348076, 161 + "translateY": 169, 162 + "width": 680, 163 + "height": 153.63267957308966, 164 + "isSafari": false, 165 + "compiledFragmentShaders": [ 166 + "#version 300 es\nprecision mediump float; in vec2 vTextureCoord; in vec3 vVertexPosition;uniform sampler2D uBgTexture; uniform sampler2D uTexture; uniform vec2 uMousePos; uniform vec2 uResolution; uniform int uSampleBg;vec2 perspectiveUV(vec2 uv) { float aspectRatio = uResolution.x/uResolution.y; vec2 centeredUV = uv - 0.5; centeredUV.x *= aspectRatio; float strength = 1.0 + (vVertexPosition.z * 0.00); vec2 perspectiveUV = centeredUV / strength; perspectiveUV.x /= aspectRatio; perspectiveUV += 0.5; return perspectiveUV; }out vec4 fragColor;void main() { vec2 uv = vTextureCoord; vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); uv = perspectiveUV(uv) - pos; vec4 color = texture(uTexture, uv); vec4 background = uSampleBg == 1 ? texture(uBgTexture, vTextureCoord) : vec4(0);color = mix(background, color/(color.a + 0.00000001), color.a * 1.00);fragColor = color; }" 167 + ], 168 + "compiledVertexShaders": [ 169 + "#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix; uniform vec2 uMousePos;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { float angleX = uMousePos.y * 0.5 - 0.25; float angleY = (1.-uMousePos.x) * 0.5 - 0.25; mat4 rotateX = mat4(1.0, 0.0, 0.0, 0.0, 0.0, cos(angleX), -sin(angleX), 0.0, 0.0, sin(angleX), cos(angleX), 0.0, 0.0, 0.0, 0.0, 1.0); mat4 rotateY = mat4(cos(angleY), 0.0, sin(angleY), 0.0, 0.0, 1.0, 0.0, 0.0, -sin(angleY), 0.0, cos(angleY), 0.0, 0.0, 0.0, 0.0, 1.0);mat4 rotationMatrix = rotateX * rotateY; gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vVertexPosition = (rotationMatrix * vec4(aVertexPosition, 1.0)).xyz; vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }" 170 + ] 171 + }, 172 + { 173 + "visible": true, 174 + "aspectRatio": 1, 175 + "layerType": "effect", 176 + "type": "blinds", 177 + "speed": 0.26, 178 + "mouseMomentum": 0, 179 + "texture": false, 180 + "animating": true, 181 + "isMask": 0, 182 + "compiledFragmentShaders": [ 183 + "#version 300 es\nprecision mediump float; in vec2 vTextureCoord;uniform sampler2D uTexture; uniform float uTime;uniform sampler2D uMaskTexture; uniform float uAspectRatio; uniform vec2 uMousePos; uniform vec2 uResolution;float ease (int easingFunc, float t) { return t; }const float STEPS = 10.0;const float PI = 3.14159265359;mat2 rot(float a) { return mat2(cos(a), -sin(a), sin(a), cos(a)); }vec3 chromatic_abberation(vec2 st, vec2 aberrated) { vec4 red = vec4(0); vec4 blue = vec4(0); vec4 green = vec4(0);float invSteps = 1.0 / STEPS; float invStepsHalf = invSteps * 0.5;for(float i = 1.0; i <= STEPS; i++) { vec2 offset = aberrated * (i * invSteps); red += texture(uTexture, st - offset) * invSteps; blue += texture(uTexture, st + offset) * invSteps; green += texture(uTexture, st - offset * 0.5) * invStepsHalf; green += texture(uTexture, st + offset * 0.5) * invStepsHalf; }return vec3(red.r, green.g, blue.b); }vec2 scaleAspect(vec2 st, float aspectRatio) { return st * vec2(aspectRatio, 1.0); }vec2 unscaleAspect(vec2 st, float aspectRatio) { return st * vec2(1.0/aspectRatio, 1.0); }vec2 rotate(vec2 st, float angle) { float s = sin(angle); float c = cos(angle); mat2 rot = mat2(c, -s, s, c); return rot * st; }vec4 blinds(vec2 st, float mDist) { float aspectRatio = uResolution.x/uResolution.y; vec2 pos = vec2(0.5, 0.5) + mix(vec2(0), (uMousePos-0.5), 0.00) * floor(1.00); pos = scaleAspect(pos, aspectRatio); st = scaleAspect(st, aspectRatio); st = rotate(st - pos, -0.00 * 2.0 * PI) + pos;vec3 distort = vec3(0); float divisions = 2. + 0.09 * 30.; float dist = 0.50 * 4. + 1.; float segment = 0.;float amount = 0.32 * mDist;vec3 first = vec3(1,0,0); vec3 second = vec3(0,1,0); vec3 third = vec3(0,0,1); if(0 == 0) { segment = fract((st.y + 1. - pos.y - 1. + uTime*0.01) * divisions); distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st.y -= pow(distort.r, dist)/10. * amount; st.y += pow(distort.b, dist)/10. * amount; } else if(0 == 1) { segment = fract((st.x + 1. - pos.x - 1. + uTime*0.01) * divisions); distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st.x -= pow(distort.r, dist)/10. * amount; st.x += pow(distort.b, dist)/10. * amount; } else if(0 == 2) { segment = fract((st.x + 1. - pos.x - 1. + uTime*0.01) * divisions); distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st.x -= pow(distort.r, dist)/10. * amount; st.x += pow(distort.b, dist)/10. * amount;segment = fract((st.y + 1. - pos.y - 1. + uTime*0.01) * divisions); distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st.y -= pow(distort.r, dist)/10. * amount; st.y += pow(distort.b, dist)/10. * amount; } else if(0 == 3) { vec2 diff = st - pos; float angle = atan(diff.y, diff.x); segment = fract((angle + uTime*0.01 + PI) / (2. * PI) * divisions);distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st -= pow(distort.r, dist)/10. * amount * normalize(diff); st += pow(distort.b, dist)/10. * amount * normalize(diff); } else if(0 == 4) { vec2 diff = st - pos; float radius = length(diff); segment = fract(radius * divisions - uTime*0.01);distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st -= pow(distort.r, dist)/10. * amount * normalize(diff); st += pow(distort.b, dist)/10. * amount * normalize(diff); } else if(0 == 5) { vec2 diff = st - pos; float angle = -PI/4.; vec2 rotatedDiff = vec2( diff.x * cos(angle) - diff.y * sin(angle), diff.x * sin(angle) + diff.y * cos(angle) );float manhattanDist = abs(rotatedDiff.x) + abs(rotatedDiff.y); segment = fract(manhattanDist * divisions - uTime*0.01); distort = mix(mix(first, second, segment*2.), mix(second, third, (segment - 0.5)/(1. - 0.5)), step(0.5, segment)); st -= pow(distort.r, dist)/10. * amount * normalize(diff); st += pow(distort.b, dist)/10. * amount * normalize(diff); }st = rot(0.00 * 2. * PI) * (st - pos) + pos; st = unscaleAspect(st, aspectRatio); vec4 col = texture(uTexture, st);if(0.00 > 0.) { vec2 offset = vec2(pow(distort.r, dist), pow(distort.b, dist)) * vec2(0.1) * amount * 0.50; col.rgb = chromatic_abberation(st, offset * 0.00); } return col; }out vec4 fragColor;void main() { vec2 uv = vTextureCoord; float aspectRatio = uResolution.x/uResolution.y;vec2 mPos = vec2(0.5, 0.5) + mix(vec2(0), (uMousePos-0.5), 0.00); vec2 pos = mPos; float mDist = ease(0, max(0.,1.-distance(uv * vec2(aspectRatio, 1), mPos * vec2(aspectRatio, 1)) * 4. * (1. - 1.00)));if(0 == 1) { mDist = max(0., (0.5 - mDist)); } else if(mDist < distance(uv, mPos)) { discard; }vec4 col = blinds(uv, mDist); if(0 == 1) { vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); vec4 maskColor = texture(uMaskTexture, vTextureCoord - pos); fragColor = col * (maskColor.a * maskColor.a); } else { fragColor = col; }}" 184 + ], 185 + "compiledVertexShaders": [ 186 + "#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }" 187 + ], 188 + "data": { "depth": false } 189 + }, 190 + { 191 + "visible": true, 192 + "aspectRatio": 1, 193 + "layerType": "effect", 194 + "type": "ascii", 195 + "scale": 0.24, 196 + "texture": false, 197 + "animating": false, 198 + "mouseMomentum": 0, 199 + "isMask": 0, 200 + "states": { 201 + "appear": [ 202 + { 203 + "type": "appear", 204 + "id": "237cf198-155e-47ed-88d0-9ca6d65ded33", 205 + "prop": "scale", 206 + "value": 0, 207 + "transition": { 208 + "ease": "easeInOutQuart", 209 + "duration": 1000, 210 + "delay": 0 211 + }, 212 + "complete": false, 213 + "progress": 0, 214 + "initialStateSet": false, 215 + "uniformData": { "type": "1f", "name": "uScale" } 216 + } 217 + ], 218 + "scroll": [] 219 + }, 220 + "compiledFragmentShaders": [ 221 + "#version 300 es\nprecision mediump float;in vec3 vVertexPosition; in vec2 vTextureCoord; uniform sampler2D uTexture; uniform sampler2D uSprite; uniform float uScale; uniform int uShowBg; uniform sampler2D uMaskTexture; uniform float uAspectRatio; uniform vec2 uMousePos; uniform vec2 uResolution;out vec4 fragColor; void main() { vec2 uv = vTextureCoord; float aspectRatio = uResolution.x / uResolution.y;float gridSize = (uScale + 0.01) * 0.05;vec2 pixelatedCoord = vec2( floor(uv.x * aspectRatio / gridSize) * gridSize, floor(uv.y / gridSize) * gridSize ); pixelatedCoord.x /= aspectRatio;vec4 color = texture(uTexture, pixelatedCoord);float luminance = dot(color.rgb, vec3(0.2126, 0.7152, 0.0722)); luminance = mix(luminance, 1. - luminance, float(0));float scaleFactor = gridSize * 1./40.;float numSprites = 10.; float numGlyphRows = 6.; float spriteIndex = floor(luminance * numSprites); float glyphIndex = 5. - float(0);float normalizedSpriteSizeX = 1. / numSprites; float normalizedSpriteSizeY = 1. / numGlyphRows;vec2 spriteSheetUV = vec2( mod(min(9., spriteIndex), numSprites) * normalizedSpriteSizeX, glyphIndex / numGlyphRows );vec2 spriteSize = vec2(40. / aspectRatio, 40.) * scaleFactor; vec2 localOffset = mod(uv, spriteSize) / spriteSize;spriteSheetUV += vec2( localOffset.x * normalizedSpriteSizeX, localOffset.y * normalizedSpriteSizeY );vec4 spriteColor = texture(uSprite, spriteSheetUV);vec3 cc = (color.rgb - spriteIndex * 0.04) * 1.4; vec3 col = mix(cc, vec3(0, 1, 1), float(0)); vec3 dithered = mix(mix(vec3(0), vec3(1), float(0)), col, step(0.5, spriteColor.r)); color.rgb = dithered; if(0 == 1) { vec2 pos = mix(vec2(0), (uMousePos - 0.5), 0.00); vec4 maskColor = texture(uMaskTexture, vTextureCoord - pos); fragColor = color * (maskColor.a * maskColor.a); } else { fragColor = color; }}" 222 + ], 223 + "compiledVertexShaders": [ 224 + "#version 300 es\nprecision mediump float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }" 225 + ], 226 + "data": { 227 + "depth": false, 228 + "texture": { 229 + "src": "https://assets.unicorn.studio/media/ascii_spritesheet_larger.png", 230 + "sampler": "uSprite" 231 + } 232 + } 233 + } 234 + ], 235 + "options": { 236 + "name": "Hero section", 237 + "fps": 60, 238 + "dpi": 2, 239 + "scale": 1, 240 + "includeLogo": false, 241 + "version": "1.2.6" 242 + }, 243 + "version": "1.2.6" 244 + }