Fix mirroring of coords (#60)

* Fixed mirroring to not flip media * Updated CHANGELOG * 0.14.5
wix-incubator · Dec 18, 2024 · e24aa6c · e24aa6c
1 parent 952ab85
commit e24aa6c
Show file tree

Hide file tree

Showing 8 changed files with 17 additions and 11 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,9 @@
+### 0.14.5 (2024-12-18)
+
+_Fixed:_
+
+-   Fixed mirroring of source coordinates in `kaleidoscope` and `slitScan` effects.
+
 ### 0.14.4 (2024-12-17)
 
 _New:_

diff --git a/dist/index.cjs b/dist/index.cjs
@@ -1275,7 +1275,7 @@ function kaleidoscope ({ segments = 6, offset, rotation = 0 } = {}) {
         vec2 newCoords = r * vec2(cos(theta), sin(theta)) + 0.5;
         sourceCoord = newCoords - u_offset;
         // mirrored repeat
-        sourceCoord = mod(-sourceCoord, 1.0) * (mod(sourceCoord - 1.0, 2.0) - mod(sourceCoord, 1.0)) + mod(sourceCoord, 1.0) * (mod(sourceCoord, 2.0) - mod(sourceCoord, 1.0));
+        sourceCoord = mod(sourceCoord, 1.0) * (mod(sourceCoord - 1.0, 2.0) - mod(sourceCoord, 1.0)) + mod(-sourceCoord, 1.0) * (mod(sourceCoord, 2.0) - mod(sourceCoord, 1.0));
     }`,
         },
         get segments() {
@@ -1378,7 +1378,7 @@ function slitScan ({
     if (u_slitScanEnabled) {
         float noiseValue = noise(vec2(${isHorizontal ? noiseFragPart : noiseTimePart}, ${isHorizontal ? noiseTimePart : noiseFragPart}));
         float source_ = sourceCoord.${direction} + noiseValue * u_intensity;
-        float mirrored_ = mod(-source_, 1.0) * (mod(source_ - 1.0, 2.0) - mod(source_, 1.0)) + mod(source_, 1.0) * (mod(source_, 2.0) - mod(source_, 1.0));
+        float mirrored_ = mod(source_, 1.0) * (mod(source_ - 1.0, 2.0) - mod(source_, 1.0)) + mod(-source_, 1.0) * (mod(source_, 2.0) - mod(source_, 1.0));
         sourceCoord = ${isHorizontal ? 'vec2(mirrored_, sourceCoord.y)' : 'vec2(sourceCoord.x, mirrored_)'};
     }`,
         },

diff --git a/docs/index.html b/docs/index.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
   <meta charset='utf-8'>
-  <title>kampos 0.14.3 | Documentation</title>
+  <title>kampos 0.14.4 | Documentation</title>
   <meta name='description' content='Tiny and fast effects compositor on WebGL'>
   <meta name='viewport' content='width=device-width,initial-scale=1'>
   <link href='assets/bass.css' rel='stylesheet'>
@@ -15,7 +15,7 @@
       <div id='split-left' class='overflow-auto fs0 height-viewport-100'>
         <div class='py1 px2'>
           <h3 class='mb0 no-anchor'>kampos</h3>
-          <div class='mb1'><code>0.14.3</code></div>
+          <div class='mb1'><code>0.14.4</code></div>
           <input
             placeholder='Filter'
             id='filter-input'

diff --git a/index.umd.js b/index.umd.js
@@ -1279,7 +1279,7 @@ const mat3 satmat = mat3(
         vec2 newCoords = r * vec2(cos(theta), sin(theta)) + 0.5;
         sourceCoord = newCoords - u_offset;
         // mirrored repeat
-        sourceCoord = mod(-sourceCoord, 1.0) * (mod(sourceCoord - 1.0, 2.0) - mod(sourceCoord, 1.0)) + mod(sourceCoord, 1.0) * (mod(sourceCoord, 2.0) - mod(sourceCoord, 1.0));
+        sourceCoord = mod(sourceCoord, 1.0) * (mod(sourceCoord - 1.0, 2.0) - mod(sourceCoord, 1.0)) + mod(-sourceCoord, 1.0) * (mod(sourceCoord, 2.0) - mod(sourceCoord, 1.0));
     }`,
             },
             get segments() {
@@ -1382,7 +1382,7 @@ const mat3 satmat = mat3(
     if (u_slitScanEnabled) {
         float noiseValue = noise(vec2(${isHorizontal ? noiseFragPart : noiseTimePart}, ${isHorizontal ? noiseTimePart : noiseFragPart}));
         float source_ = sourceCoord.${direction} + noiseValue * u_intensity;
-        float mirrored_ = mod(-source_, 1.0) * (mod(source_ - 1.0, 2.0) - mod(source_, 1.0)) + mod(source_, 1.0) * (mod(source_, 2.0) - mod(source_, 1.0));
+        float mirrored_ = mod(source_, 1.0) * (mod(source_ - 1.0, 2.0) - mod(source_, 1.0)) + mod(-source_, 1.0) * (mod(source_, 2.0) - mod(source_, 1.0));
         sourceCoord = ${isHorizontal ? 'vec2(mirrored_, sourceCoord.y)' : 'vec2(sourceCoord.x, mirrored_)'};
     }`,
             },

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "kampos",
-    "version": "0.14.4",
+    "version": "0.14.5",
     "description": "Tiny and fast effects compositor on WebGL",
     "registry": "https://registry.npmjs.org/",
     "main": "dist/index.cjs",

diff --git a/src/effects/kaleidoscope.js b/src/effects/kaleidoscope.js
@@ -40,7 +40,7 @@ export default function ({ segments = 6, offset, rotation = 0 } = {}) {
         vec2 newCoords = r * vec2(cos(theta), sin(theta)) + 0.5;
         sourceCoord = newCoords - u_offset;
         // mirrored repeat
-        sourceCoord = mod(-sourceCoord, 1.0) * (mod(sourceCoord - 1.0, 2.0) - mod(sourceCoord, 1.0)) + mod(sourceCoord, 1.0) * (mod(sourceCoord, 2.0) - mod(sourceCoord, 1.0));
+        sourceCoord = mod(sourceCoord, 1.0) * (mod(sourceCoord - 1.0, 2.0) - mod(sourceCoord, 1.0)) + mod(-sourceCoord, 1.0) * (mod(sourceCoord, 2.0) - mod(sourceCoord, 1.0));
     }`,
         },
         get segments() {

diff --git a/src/effects/slit-scan.js b/src/effects/slit-scan.js
@@ -47,7 +47,7 @@ export default function ({
     if (u_slitScanEnabled) {
         float noiseValue = noise(vec2(${isHorizontal ? noiseFragPart : noiseTimePart}, ${isHorizontal ? noiseTimePart : noiseFragPart}));
         float source_ = sourceCoord.${direction} + noiseValue * u_intensity;
-        float mirrored_ = mod(-source_, 1.0) * (mod(source_ - 1.0, 2.0) - mod(source_, 1.0)) + mod(source_, 1.0) * (mod(source_, 2.0) - mod(source_, 1.0));
+        float mirrored_ = mod(source_, 1.0) * (mod(source_ - 1.0, 2.0) - mod(source_, 1.0)) + mod(-source_, 1.0) * (mod(source_, 2.0) - mod(source_, 1.0));
         sourceCoord = ${isHorizontal ? 'vec2(mirrored_, sourceCoord.y)' : 'vec2(sourceCoord.x, mirrored_)'};
     }`,
         },