@lightningjs/renderer
Version:
Lightning 3 Renderer
80 lines • 2.35 kB
JavaScript
import { updateWebSafeRadius, validateArrayLength4 } from './EffectUtils.js';
import { ShaderEffect, } from './ShaderEffect.js';
/**
* Masks the current maskcolor a holepunch effect with rounded corners similar to {@link RoundedRectangle}
*/
export class HolePunchEffect extends ShaderEffect {
static z$__type__Props;
name = 'holePunch';
static getEffectKey() {
return `holePunch`;
}
static uniforms = {
x: {
value: 0,
method: 'uniform1f',
type: 'float',
},
y: {
value: 0,
method: 'uniform1f',
type: 'float',
},
width: {
value: 0,
method: 'uniform1f',
type: 'float',
},
height: {
value: 0,
method: 'uniform1f',
type: 'float',
},
radius: {
value: 0,
method: 'uniform4fv',
type: 'vec4',
updateOnBind: true,
validator: validateArrayLength4,
updateProgramValue: updateWebSafeRadius,
},
};
static resolveDefaults(props) {
return {
x: props.x || 0,
y: props.y || 0,
width: props.width || 50,
height: props.height || 50,
radius: props.radius ?? 0,
};
}
static methods = {
fillMask: `
float function(float dist) {
return clamp(-dist, 0.0, 1.0);
}
`,
boxDist: `
float function(vec2 p, vec2 size, float radius) {
size -= vec2(radius);
vec2 d = abs(p) - size;
return min(max(d.x, d.y), 0.0) + length(max(d, 0.0)) - radius;
}
`,
};
static onShaderMask = `
vec2 halfDimensions = u_dimensions * 0.5;
vec2 size = vec2(width, height) * 0.5;
vec2 basePos = v_nodeCoordinate.xy * u_dimensions.xy - vec2(x, y);
vec2 pos = basePos - size;
float r = radius[0] * step(pos.x, 0.5) * step(pos.y, 0.5);
r = r + radius[1] * step(0.5, pos.x) * step(pos.y, 0.5);
r = r + radius[2] * step(0.5, pos.x) * step(0.5, pos.y);
r = r + radius[3] * step(pos.x, 0.5) * step(0.5, pos.y);
return $boxDist(pos, size, r);
`;
static onEffectMask = `
return mix(maskColor, vec4(0.0), $fillMask(shaderMask));
`;
}
//# sourceMappingURL=HolePunchEffect.js.map