kampos
-
0.14.10
+
0.14.11
+
+ params.boundsOffsetFactor function?
+ |
+ function that takes name of variable for channel offset and returns a float value as string. Defaults to returning
+'1.0
+'.
+ |
+
+
+
+
diff --git a/index.umd.js b/index.umd.js
index fb64366..5e4b1da 100644
--- a/index.umd.js
+++ b/index.umd.js
@@ -1152,6 +1152,7 @@ const mat3 satmat = mat3(
* @param {string} [params.offsetInputR] code to use as input for the red offset. Defaults to `u_channelOffsetR`.
* @param {string} [params.offsetInputG] code to use as input for the green offset. Defaults to `u_channelOffsetG`.
* @param {string} [params.offsetInputB] code to use as input for the blue offset. Defaults to `u_channelOffsetB`.
+ * @param {function} [params.boundsOffsetFactor] function that takes name of variable for channel offset and returns a float value as string. Defaults to returning `'1.0`'.
* @returns {channelSplitEffect}
*
* @example channelSplit({offsetRed: {x: 0.02, y: 0.0}})
@@ -1163,8 +1164,8 @@ const mat3 satmat = mat3(
offsetInputR = 'u_channelOffsetR',
offsetInputG = 'u_channelOffsetG',
offsetInputB = 'u_channelOffsetB',
+ boundsOffsetFactor = (boundsOffset) => '1.0',
} = {}) {
-
/**
* @typedef {Object} channelSplitEffect
* @property {boolean} disabled
@@ -1188,9 +1189,21 @@ const mat3 satmat = mat3(
vec2 _splitOffsetR = ${offsetInputR};
vec2 _splitOffsetG = ${offsetInputG};
vec2 _splitOffsetB = ${offsetInputB};
- float redSplit = texture2D(u_source, sourceCoord + _splitOffsetR).r;
- float greenSplit = texture2D(u_source, sourceCoord + _splitOffsetG).g;
- float blueSplit = texture2D(u_source, sourceCoord + _splitOffsetB).b;
+ vec2 redSample = sourceCoord + _splitOffsetR;
+ vec2 greenSample = sourceCoord + _splitOffsetG;
+ vec2 blueSample = sourceCoord + _splitOffsetB;
+ float redBoundsOffset = min(0.0, min(min(redSample.x, redSample.y), min(1.0 - redSample.x, 1.0 - redSample.y)));
+ float greenBoundsOffset = min(0.0, min(min(greenSample.x, greenSample.y), min(1.0 - greenSample.x, 1.0 - greenSample.y)));
+ float blueBoundsOffset = min(0.0, min(min(blueSample.x, blueSample.y), min(1.0 - blueSample.x, 1.0 - blueSample.y)));
+ float redSplit = texture2D(u_source, sourceCoord + _splitOffsetR).r * ${boundsOffsetFactor(
+ 'redBoundsOffset'
+ )};
+ float greenSplit = texture2D(u_source, sourceCoord + _splitOffsetG).g * ${boundsOffsetFactor(
+ 'greenBoundsOffset'
+ )};
+ float blueSplit = texture2D(u_source, sourceCoord + _splitOffsetB).b * ${boundsOffsetFactor(
+ 'blueBoundsOffset'
+ )};
color = vec3(redSplit, greenSplit, blueSplit);
}`,
},
diff --git a/package-lock.json b/package-lock.json
index eccf907..39d3722 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
{
"name": "kampos",
- "version": "0.14.11",
+ "version": "0.14.12",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "kampos",
- "version": "0.14.11",
+ "version": "0.14.12",
"license": "MIT",
"devDependencies": {
"@babel/core": "^7.26.0",
diff --git a/package.json b/package.json
index 900e5b7..60d5275 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "kampos",
- "version": "0.14.11",
+ "version": "0.14.12",
"description": "Tiny and fast effects compositor on WebGL",
"registry": "https://registry.npmjs.org/",
"main": "dist/index.cjs",
diff --git a/src/effects/channel-split.js b/src/effects/channel-split.js
index bb8a49d..981fb08 100644
--- a/src/effects/channel-split.js
+++ b/src/effects/channel-split.js
@@ -7,6 +7,7 @@
* @param {string} [params.offsetInputR] code to use as input for the red offset. Defaults to `u_channelOffsetR`.
* @param {string} [params.offsetInputG] code to use as input for the green offset. Defaults to `u_channelOffsetG`.
* @param {string} [params.offsetInputB] code to use as input for the blue offset. Defaults to `u_channelOffsetB`.
+ * @param {function} [params.boundsOffsetFactor] function that takes name of variable for channel offset and returns a float value as string. Defaults to returning `'1.0`'.
* @returns {channelSplitEffect}
*
* @example channelSplit({offsetRed: {x: 0.02, y: 0.0}})
@@ -18,8 +19,8 @@ export default function channelSplit({
offsetInputR = 'u_channelOffsetR',
offsetInputG = 'u_channelOffsetG',
offsetInputB = 'u_channelOffsetB',
+ boundsOffsetFactor = (boundsOffset) => '1.0',
} = {}) {
-
/**
* @typedef {Object} channelSplitEffect
* @property {boolean} disabled
@@ -43,9 +44,21 @@ export default function channelSplit({
vec2 _splitOffsetR = ${offsetInputR};
vec2 _splitOffsetG = ${offsetInputG};
vec2 _splitOffsetB = ${offsetInputB};
- float redSplit = texture2D(u_source, sourceCoord + _splitOffsetR).r;
- float greenSplit = texture2D(u_source, sourceCoord + _splitOffsetG).g;
- float blueSplit = texture2D(u_source, sourceCoord + _splitOffsetB).b;
+ vec2 redSample = sourceCoord + _splitOffsetR;
+ vec2 greenSample = sourceCoord + _splitOffsetG;
+ vec2 blueSample = sourceCoord + _splitOffsetB;
+ float redBoundsOffset = min(0.0, min(min(redSample.x, redSample.y), min(1.0 - redSample.x, 1.0 - redSample.y)));
+ float greenBoundsOffset = min(0.0, min(min(greenSample.x, greenSample.y), min(1.0 - greenSample.x, 1.0 - greenSample.y)));
+ float blueBoundsOffset = min(0.0, min(min(blueSample.x, blueSample.y), min(1.0 - blueSample.x, 1.0 - blueSample.y)));
+ float redSplit = texture2D(u_source, sourceCoord + _splitOffsetR).r * ${boundsOffsetFactor(
+ 'redBoundsOffset'
+ )};
+ float greenSplit = texture2D(u_source, sourceCoord + _splitOffsetG).g * ${boundsOffsetFactor(
+ 'greenBoundsOffset'
+ )};
+ float blueSplit = texture2D(u_source, sourceCoord + _splitOffsetB).b * ${boundsOffsetFactor(
+ 'blueBoundsOffset'
+ )};
color = vec3(redSplit, greenSplit, blueSplit);
}`,
},