{"version":3,"file":"ImageBlockify.BpmyK-xY.mjs","names":[],"sources":["https:/framerusercontent.com/modules/dAq3g99ZgeCHsuAFGGBc/u28CkAplhOkZ6C2w9LKe/ImageBlockify.js"],"sourcesContent":["// Lego Studs Shader\nimport{defineShader,ControlType}from\"framer\";export default defineShader({title:\"Blockify\",fragment:`\nfloat random(vec2 st) {\n    return fract(sin(dot(st.xy, vec2(12.9898, 78.233))) * 43758.5453123);\n}\n\nvec3 rgbToHsv(vec3 c) {\n    vec4 K = vec4(0.0, -1.0/3.0, 2.0/3.0, -1.0);\n    vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));\n    vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));\n    float d = q.x - min(q.w, q.y);\n    float e = 1.0e-10;\n    return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\n\nvec3 hsvToRgb(vec3 c) {\n    vec4 K = vec4(1.0, 2.0/3.0, 1.0/3.0, 3.0);\n    vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n    return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);\n}\n\nvoid main() {\n    float aspect = u_resolution.x / u_resolution.y;\n    \n    ivec2 texSizeI = textureSize(u_texture, 0);\n    vec2 texSize = vec2(texSizeI);\n    float textureAspect = texSize.x / texSize.y;\n    \n    vec2 coverScale = vec2(1.0);\n    vec2 coverOffset = vec2(0.0);\n    \n    if (aspect > textureAspect) {\n        float scale = aspect / textureAspect;\n        coverScale = vec2(1.0, 1.0 / scale);\n        coverOffset = vec2(0.0, (1.0 - coverScale.y) * 0.5);\n    } else {\n        float scale = textureAspect / aspect;\n        coverScale = vec2(1.0 / scale, 1.0);\n        coverOffset = vec2((1.0 - coverScale.x) * 0.5, 0.0);\n    }\n    \n    float cellsY = u_quantize;\n    vec2 cellCount = vec2(cellsY * aspect, cellsY);\n    \n    vec2 gridUV = v_uv * cellCount;\n    \n    vec2 cellID;\n    vec2 p;\n    \n    if (u_gridMode > 0.5) {\n        float row = floor(gridUV.y);\n        float xOffset = mod(row, 2.0) * 0.5;\n        float col = floor(gridUV.x + xOffset);\n        \n        cellID = vec2(col, row);\n        p = vec2(gridUV.x + xOffset - col, gridUV.y - row) - 0.5;\n    } else {\n        cellID = floor(gridUV);\n        p = gridUV - cellID - 0.5;\n    }\n    \n    // Texture coordinate\n    vec2 texCoord;\n    if (u_gridMode > 0.5) {\n        float row = cellID.y;\n        float xOffset = mod(row, 2.0) * 0.5;\n        texCoord = vec2((cellID.x - xOffset + 0.5) / cellCount.x, (cellID.y + 0.5) / cellCount.y);\n    } else {\n        texCoord = (cellID + 0.5) / cellCount;\n    }\n    texCoord = texCoord * coverScale + coverOffset;\n    texCoord.y = 1.0 - texCoord.y;\n    \n    vec2 texelCoordF = texCoord * texSize;\n    ivec2 texel = ivec2(texelCoordF);\n    texel = clamp(texel, ivec2(0), texSizeI - 1);\n    \n    vec4 sampled = texelFetch(u_texture, texel, 0);\n    \n    // Color quantization\n    if (u_enableQuantization > 0.5 && u_colorLevels > 1.0) {\n        float levels = u_colorLevels - 1.0;\n        sampled.r = floor(sampled.r * levels + 0.5) / levels;\n        sampled.g = floor(sampled.g * levels + 0.5) / levels;\n        sampled.b = floor(sampled.b * levels + 0.5) / levels;\n        sampled.rgb = clamp(sampled.rgb, 0.01, 0.95);\n    }\n    \n    // Apply hue shift per brick\n    float hueShift = random(cellID) * u_hueShift;\n    vec3 hsv = rgbToHsv(sampled.rgb);\n    hsv.x += hueShift;\n    sampled.rgb = hsvToRgb(hsv);\n    \n    vec4 col = vec4(sampled.rgb, sampled.a);\n    \n    // Light\n    float angle = u_lightAngle * 3.14159265 / 180.0;\n    vec2 lightDir = vec2(cos(angle), sin(angle));\n    \n    // Stud with AA\n    float l = dot(p, p) * u_studFactor;\n    float fw = fwidth(l);\n    float studMask = smoothstep(0.3 + fw, 0.2 - fw, max(l, 0.45 - l));\n    col *= 1.0 + studMask * tanh(dot(p, lightDir) * u_lightIntensity);\n    \n    // Brick outlines with AA\n    float edgeStart = 0.47;\n    vec2 ap = abs(p);\n    float maxP = max(ap.x, ap.y);\n    float edgeFw = fwidth(maxP);\n    float edgeMask = smoothstep(edgeStart - edgeFw, edgeStart + edgeFw, maxP);\n    col *= mix(1.0, 0.9, edgeMask);\n    \n    fragColor = vec4(col.rgb, sampled.a); //or originally 1.0 with no transparency handling\n}\n`,propertyControls:{texture:{type:ControlType.ResponsiveImage,title:\"Image\",defaultValue:\"data:framer/asset-reference,iePjwFmmdOppWQd5iQSbr8O4UQI.png?originalFilename=P48.png&width=2560&height=1440\"},gridMode:{type:ControlType.Enum,title:\"Grid\",options:[0,1],optionTitles:[\"Square\",\"Hex\"],defaultValue:0,displaySegmentedControl:true},quantize:{type:ControlType.Number,title:\"Tiles\",defaultValue:16,min:8,max:64,step:1},studFactor:{type:ControlType.Number,title:\"Rounding\",defaultValue:3,min:0,max:4,step:.01},lightIntensity:{type:ControlType.Number,title:\"Light\",defaultValue:1.4,min:.5,max:2,step:.1},lightAngle:{type:ControlType.Number,title:\"Light Angle\",defaultValue:90,min:0,max:360,step:15,displayStepper:true},enableQuantization:{type:ControlType.Boolean,title:\"Posterize\",defaultValue:false,enabledTitle:\"Yes\",disabledTitle:\"No\",section:\"Filters\"},colorLevels:{type:ControlType.Number,title:\"Colors\",defaultValue:4,min:2,max:16,step:1,hidden:props=>!props.enableQuantization,section:\"Filters\"},hueShift:{type:ControlType.Number,title:\"Hue Shift\",defaultValue:0,min:0,max:.1,step:.005,hiddenWhenUnset:true}}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"shader\",\"name\":null,\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ImageBlockify.map"],"mappings":"yHAC4C,IAAgB,EAAa,CAAC,MAAM,WAAW,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmHlG,iBAAiB,CAAC,QAAQ,CAAC,KAAK,EAAY,gBAAgB,MAAM,QAAQ,aAAa,6GAA6G,EAAE,SAAS,CAAC,KAAK,EAAY,KAAK,MAAM,OAAO,QAAQ,CAAC,EAAE,CAAC,EAAE,aAAa,CAAC,SAAS,KAAK,EAAE,aAAa,EAAE,wBAAwB,EAAI,EAAE,SAAS,CAAC,KAAK,EAAY,OAAO,MAAM,QAAQ,aAAa,GAAG,IAAI,EAAE,IAAI,GAAG,KAAK,CAAC,EAAE,WAAW,CAAC,KAAK,EAAY,OAAO,MAAM,WAAW,aAAa,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,GAAG,EAAE,eAAe,CAAC,KAAK,EAAY,OAAO,MAAM,QAAQ,aAAa,IAAI,IAAI,GAAG,IAAI,EAAE,KAAK,EAAE,EAAE,WAAW,CAAC,KAAK,EAAY,OAAO,MAAM,cAAc,aAAa,GAAG,IAAI,EAAE,IAAI,IAAI,KAAK,GAAG,eAAe,EAAI,EAAE,mBAAmB,CAAC,KAAK,EAAY,QAAQ,MAAM,YAAY,aAAa,GAAM,aAAa,MAAM,cAAc,KAAK,QAAQ,SAAS,EAAE,YAAY,CAAC,KAAK,EAAY,OAAO,MAAM,SAAS,aAAa,EAAE,IAAI,EAAE,IAAI,GAAG,KAAK,EAAE,OAAO,GAAO,CAAC,EAAM,mBAAmB,QAAQ,SAAS,EAAE,SAAS,CAAC,KAAK,EAAY,OAAO,MAAM,YAAY,aAAa,EAAE,IAAI,EAAE,IAAI,GAAG,KAAK,KAAK,gBAAgB,EAAI,CAAC,CAAC,CAAC"}