pixospritz-core 0.10.1 → 1.0.1

package/src/engine/shaders/skybox/sky/fs.js

@@ -0,0 +1,114 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine   	       **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+\*                                                 */
+export default function fs() {
+  return `
+  precision mediump float;
+ 
+  uniform samplerCube uSkybox;
+  uniform mat4 uViewDirectionProjectionInverse;
+  uniform float uTime;
+  
+  varying vec4 vPosition;
+  
+  // Hash function
+  float hash(vec2 p) {
+    return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453);
+  }
+  
+  // Value noise
+  float noise(vec2 p) {
+    vec2 i = floor(p);
+    vec2 f = fract(p);
+    f = f * f * (3.0 - 2.0 * f);
+    
+    float a = hash(i);
+    float b = hash(i + vec2(1.0, 0.0));
+    float c = hash(i + vec2(0.0, 1.0));
+    float d = hash(i + vec2(1.0, 1.0));
+    
+    return mix(mix(a, b, f.x), mix(c, d, f.x), f.y);
+  }
+  
+  // FBM for clouds
+  float fbm(vec2 p) {
+    float value = 0.0;
+    float amplitude = 0.5;
+    for (int i = 0; i < 5; i++) {
+      value += amplitude * noise(p);
+      amplitude *= 0.5;
+      p *= 2.0;
+    }
+    return value;
+  }
+  
+  void main() {
+    vec4 t = uViewDirectionProjectionInverse * vPosition;
+    vec3 dir = normalize(t.xyz / t.w);
+    float time = uTime;
+    
+    // Height-based gradient for daytime sky
+    float y = dir.y * 0.5 + 0.5;
+    
+    // Sun position (high in sky)
+    vec3 sunDir = normalize(vec3(0.3, 0.8, 0.5));
+    float sunDot = dot(dir, sunDir);
+    
+    // Daytime sky colors
+    vec3 zenithColor = vec3(0.2, 0.4, 0.85);      // Deep blue at top
+    vec3 horizonColor = vec3(0.6, 0.75, 0.95);    // Light blue at horizon
+    vec3 sunColor = vec3(1.0, 1.0, 0.95);         // Bright white sun
+    
+    // Sky gradient using realistic Rayleigh scattering approximation
+    vec3 color = mix(horizonColor, zenithColor, pow(y, 0.5));
+    
+    // Sun atmospheric scattering
+    float scatter = pow(max(0.0, sunDot), 2.0);
+    color = mix(color, vec3(0.9, 0.95, 1.0), scatter * 0.2);
+    
+    // Bright sun disc with soft edge
+    float sun = smoothstep(0.9995, 1.0, sunDot);
+    color = mix(color, sunColor, sun);
+    
+    // Sun glare
+    float glare = pow(max(0.0, sunDot), 32.0) * 0.5;
+    color += sunColor * glare;
+    
+    // Animated cumulus clouds
+    vec2 cloudUV = dir.xz / (abs(dir.y) + 0.2) + time * 0.01;
+    
+    // Multiple cloud layers
+    float clouds1 = fbm(cloudUV * 1.5);
+    float clouds2 = fbm(cloudUV * 3.0 + vec2(100.0, 0.0));
+    
+    // Shape clouds
+    clouds1 = smoothstep(0.4, 0.7, clouds1);
+    clouds2 = smoothstep(0.5, 0.75, clouds2) * 0.5;
+    float clouds = max(clouds1, clouds2);
+    
+    // Cloud color with some shading
+    vec3 cloudLight = vec3(1.0, 1.0, 1.0);
+    vec3 cloudShadow = vec3(0.7, 0.75, 0.85);
+    vec3 cloudColor = mix(cloudShadow, cloudLight, fbm(cloudUV * 4.0));
+    
+    // Apply clouds more in middle sky
+    float cloudMask = smoothstep(0.15, 0.5, y) * smoothstep(1.0, 0.6, y);
+    color = mix(color, cloudColor, clouds * cloudMask * 0.85);
+    
+    // Atmospheric perspective (haze near horizon)
+    float haze = exp(-y * 5.0);
+    color = mix(color, horizonColor * 1.1, haze * 0.3);
+    
+    gl_FragColor = vec4(color, 1.0);
+  }
+`;
+}

package/src/engine/shaders/skybox/sky/vs.js

@@ -0,0 +1,23 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine   	       **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+\*                                                 */
+
+export default function vs() {
+  return `
+  attribute vec4 aPosition;
+  varying vec4 vPosition;
+  void main() {
+    vPosition = aPosition;
+    gl_Position = aPosition;
+  }
+`;
+}

package/src/engine/shaders/skybox/sunset/fs.js

@@ -0,0 +1,101 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine   	       **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+\*                                                 */
+
+export default function fs() {
+  return `
+  precision mediump float;
+ 
+  uniform samplerCube uSkybox;
+  uniform mat4 uViewDirectionProjectionInverse;
+  uniform float uTime;
+  
+  varying vec4 vPosition;
+  
+  // Hash function for clouds
+  float hash(vec2 p) {
+    return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453);
+  }
+  
+  // Value noise for clouds
+  float noise(vec2 p) {
+    vec2 i = floor(p);
+    vec2 f = fract(p);
+    f = f * f * (3.0 - 2.0 * f);
+    
+    float a = hash(i);
+    float b = hash(i + vec2(1.0, 0.0));
+    float c = hash(i + vec2(0.0, 1.0));
+    float d = hash(i + vec2(1.0, 1.0));
+    
+    return mix(mix(a, b, f.x), mix(c, d, f.x), f.y);
+  }
+  
+  // Fractal brownian motion for realistic clouds
+  float fbm(vec2 p) {
+    float value = 0.0;
+    float amplitude = 0.5;
+    float frequency = 1.0;
+    for (int i = 0; i < 4; i++) {
+      value += amplitude * noise(p * frequency);
+      amplitude *= 0.5;
+      frequency *= 2.0;
+    }
+    return value;
+  }
+  
+  void main() {
+    vec4 t = uViewDirectionProjectionInverse * vPosition;
+    vec3 dir = normalize(t.xyz / t.w);
+    
+    // Height-based gradient for sunset colors
+    float y = dir.y * 0.5 + 0.5; // Normalize to 0-1
+    
+    // Sun position (just above horizon)
+    vec3 sunDir = normalize(vec3(0.0, 0.1, -1.0));
+    float sunDot = dot(dir, sunDir);
+    
+    // Sunset color palette
+    vec3 horizonColor = vec3(1.0, 0.3, 0.1);    // Orange-red at horizon
+    vec3 skyColor = vec3(0.2, 0.1, 0.4);        // Deep purple up high
+    vec3 sunColor = vec3(1.0, 0.9, 0.5);        // Bright yellow-white sun
+    vec3 glowColor = vec3(1.0, 0.5, 0.2);       // Orange glow
+    
+    // Base sky gradient
+    vec3 color = mix(horizonColor, skyColor, pow(y, 0.8));
+    
+    // Sun glow (larger soft glow)
+    float glow = pow(max(0.0, sunDot), 4.0) * 1.5;
+    color = mix(color, glowColor, glow);
+    
+    // Bright sun disc
+    float sun = pow(max(0.0, sunDot), 256.0) * 2.0;
+    color = mix(color, sunColor, min(1.0, sun));
+    
+    // Animated clouds (move slowly)
+    float time = uTime * 0.02;
+    vec2 cloudUV = dir.xz / (dir.y + 0.5) * 2.0 + time;
+    float clouds = fbm(cloudUV * 3.0);
+    clouds = smoothstep(0.4, 0.7, clouds);
+    
+    // Cloud color based on sun angle
+    vec3 cloudColor = mix(vec3(0.3, 0.1, 0.15), vec3(1.0, 0.6, 0.3), glow + y * 0.5);
+    color = mix(color, cloudColor, clouds * (1.0 - y) * 0.6);
+    
+    // Add atmospheric scattering near horizon
+    float scatter = exp(-y * 3.0);
+    color = mix(color, horizonColor, scatter * 0.3);
+    
+    gl_FragColor = vec4(color, 1.0);
+  }
+`;
+}

package/src/engine/shaders/skybox/sunset/vs.js

@@ -0,0 +1,23 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine   	       **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+\*                                                 */
+
+export default function vs() {
+  return `
+  attribute vec4 aPosition;
+  varying vec4 vPosition;
+  void main() {
+    vPosition = aPosition;
+    gl_Position = aPosition;
+  }
+`;
+}

package/src/engine/shaders/transition/blur/fs.js

@@ -0,0 +1,42 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine           **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+*                                                 */
+
+// Fragment shader for a radial blur‑mask transition. The edge is softened
+// with smoothstep. uDirection > 0.5 = IN (mask shrinks), else OUT (mask grows).
+
+export default function fs() {
+  return `
+  precision mediump float;
+  varying vec2 vUV;
+  uniform float uProgress;
+  uniform float uDirection;
+
+  void main() {
+      vec2 center = vec2(0.5, 0.5);
+      float dist = distance(vUV, center);
+
+      // Radius grows [0..1] for OUT, shrinks for IN
+      float radius = (uDirection > 0.5) ? (1.0 - uProgress) : uProgress;
+
+      // Blur width relative to screen; tweak for softer/harder edge
+      float feather = 0.20; // 20% of radius as feather
+      float edge0 = radius - feather * 0.5;
+      float edge1 = radius + feather * 0.5;
+
+      float mask = smoothstep(edge0, edge1, dist);
+
+      // Black overlay with soft edge
+      gl_FragColor = vec4(0.0, 0.0, 0.0, mask);
+  }
+  `;
+}

package/src/engine/shaders/transition/blur/vs.js

@@ -0,0 +1,26 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine           **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+*                                                 */
+
+// Vertex shader for cross‑wipe transition. Shares the same logic as
+// other transitions: compute UVs and forward the clip‑space position.
+
+export default function vs() {
+  return `
+  attribute vec2 aPosition;
+  varying vec2 vUV;
+  void main() {
+      vUV = (aPosition + 1.0) * 0.5;
+      gl_Position = vec4(aPosition, 0.0, 1.0);
+  }
+  `;
+}

package/src/engine/shaders/transition/cross/fs.js

@@ -0,0 +1,36 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine           **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+*                                                 */
+
+// Fragment shader for a horizontal cross‑wipe transition. A black
+// rectangle slides across the screen. The direction uniform controls
+// whether the wipe grows from the left (out) or shrinks from the right (in).
+
+export default function fs() {
+  return `
+  precision mediump float;
+  varying vec2 vUV;
+  uniform float uProgress;
+  uniform float uDirection;
+  void main() {
+      float mask;
+      // When uDirection == 1.0 (transition in), the black area shrinks
+      // from right to left. Otherwise, it grows from left to right.
+      if (uDirection > 0.5) {
+          mask = step(1.0 - uProgress, vUV.x);
+      } else {
+          mask = step(vUV.x, uProgress);
+      }
+      gl_FragColor = vec4(0.0, 0.0, 0.0, mask);
+  }
+  `;
+}

package/src/engine/shaders/transition/cross/vs.js

@@ -0,0 +1,26 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine           **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+*                                                 */
+
+// Vertex shader for cross‑wipe transition. Shares the same logic as
+// other transitions: compute UVs and forward the clip‑space position.
+
+export default function vs() {
+  return `
+  attribute vec2 aPosition;
+  varying vec2 vUV;
+  void main() {
+      vUV = (aPosition + 1.0) * 0.5;
+      gl_Position = vec4(aPosition, 0.0, 1.0);
+  }
+  `;
+}

package/src/engine/shaders/transition/crossBlur/fs.js

@@ -0,0 +1,41 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine           **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+*                                                 */
+
+// Fragment shader for a horizontal cross‑blur wipe. Progress moves the edge
+// across X; we soften with smoothstep. uDirection > 0.5 = IN (wipe recedes).
+
+export default function fs() {
+  return `
+  precision mediump float;
+  varying vec2 vUV;
+  uniform float uProgress;
+  uniform float uDirection;
+
+  void main() {
+      // Determine wipe center position depending on direction
+      float pos = (uDirection > 0.5) ? (1.0 - uProgress) : uProgress;
+
+      // Feather width in UV space
+      float feather = 0.12;
+
+      // Distance from the moving edge (vertical line at x=pos)
+      float d = vUV.x - pos;
+
+      // Soft mask around the edge using smoothstep
+      float mask = smoothstep(-feather, feather, d);
+
+      // Black overlay with soft edge
+      gl_FragColor = vec4(0.0, 0.0, 0.0, mask);
+  }
+  `;
+}

package/src/engine/shaders/transition/crossBlur/vs.js

@@ -0,0 +1,25 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine           **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+*                                                 */
+
+// Vertex shader for full‑screen transitions (used by fade/blur/cross/crossBlur).
+
+export default function vs() {
+  return `
+  attribute vec2 aPosition;
+  varying vec2 vUV;
+  void main() {
+      vUV = (aPosition + 1.0) * 0.5;
+      gl_Position = vec4(aPosition, 0.0, 1.0);
+  }
+  `;
+}

package/src/engine/shaders/transition/dissolve/fs.js

@@ -0,0 +1,78 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine           **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+*                                                 */
+
+// Fragment shader for dissolve/noise transition effect.
+// Uses procedural noise to create a dissolving particle effect.
+
+export default function fs() {
+  return `
+  precision mediump float;
+  varying vec2 vUV;
+  uniform float uProgress;
+  uniform float uDirection;
+  uniform float uTime;
+
+  // Simple hash function for noise
+  float hash(vec2 p) {
+      return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453123);
+  }
+
+  // Value noise
+  float noise(vec2 p) {
+      vec2 i = floor(p);
+      vec2 f = fract(p);
+      f = f * f * (3.0 - 2.0 * f); // Smooth interpolation
+      
+      float a = hash(i);
+      float b = hash(i + vec2(1.0, 0.0));
+      float c = hash(i + vec2(0.0, 1.0));
+      float d = hash(i + vec2(1.0, 1.0));
+      
+      return mix(mix(a, b, f.x), mix(c, d, f.x), f.y);
+  }
+
+  // Fractal noise for more organic look
+  float fbm(vec2 p) {
+      float sum = 0.0;
+      float amp = 0.5;
+      float freq = 1.0;
+      for (int i = 0; i < 4; i++) {
+          sum += noise(p * freq) * amp;
+          amp *= 0.5;
+          freq *= 2.0;
+      }
+      return sum;
+  }
+
+  void main() {
+      float progress = uDirection > 0.5 ? (1.0 - uProgress) : uProgress;
+      
+      // Generate noise pattern
+      vec2 noiseCoord = vUV * 10.0;
+      float n = fbm(noiseCoord);
+      
+      // Add some time-based animation for sparkle effect
+      float sparkle = noise(vUV * 50.0 + uTime * 0.001) * 0.1;
+      n += sparkle;
+      
+      // Threshold based on progress
+      float threshold = progress * 1.2; // Slightly overshoot for full coverage
+      float alpha = smoothstep(threshold - 0.1, threshold + 0.1, n);
+      
+      // Invert for dissolve-in effect
+      alpha = 1.0 - alpha;
+      
+      gl_FragColor = vec4(0.0, 0.0, 0.0, alpha);
+  }
+  `;
+}

package/src/engine/shaders/transition/dissolve/vs.js

@@ -0,0 +1,24 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine           **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+*                                                 */
+
+// Vertex shader for dissolve transition
+export default function vs() {
+  return `
+  attribute vec2 aPosition;
+  varying vec2 vUV;
+  void main() {
+      vUV = (aPosition + 1.0) * 0.5;
+      gl_Position = vec4(aPosition, 0.0, 1.0);
+  }
+  `;
+}

package/src/engine/shaders/transition/fade/fs.js

@@ -0,0 +1,31 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine           **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+*                                                 */
+
+// Fragment shader for a simple fade transition. The entire screen is
+// covered by a black overlay whose alpha is controlled by `uProgress`
+// and `uDirection`. When `uDirection` is 0.0 (out), the alpha increases
+// from 0 to 1 as progress goes from 0 to 1. When `uDirection` is 1.0 (in),
+// the alpha decreases from 1 to 0.
+
+export default function fs() {
+  return `
+  precision mediump float;
+  varying vec2 vUV;
+  uniform float uProgress;
+  uniform float uDirection;
+  void main() {
+      float alpha = uDirection > 0.5 ? (1.0 - uProgress) : uProgress;
+      gl_FragColor = vec4(0.0, 0.0, 0.0, alpha);
+  }
+  `;
+}

package/src/engine/shaders/transition/fade/vs.js

@@ -0,0 +1,27 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine           **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+*                                                 */
+
+// Vertex shader for full‑screen transitions. It passes the clip‑space
+// position directly and computes UV coordinates from the position. This
+// shader is used by all transition effects.
+
+export default function vs() {
+  return `
+  attribute vec2 aPosition;
+  varying vec2 vUV;
+  void main() {
+      vUV = (aPosition + 1.0) * 0.5;
+      gl_Position = vec4(aPosition, 0.0, 1.0);
+  }
+  `;
+}

package/src/engine/shaders/transition/iris/fs.js

@@ -0,0 +1,52 @@
+/*                                                 *\
+** ----------------------------------------------- **
+**          Calliope - Pixos Game Engine           **
+** ----------------------------------------------- **
+**  Copyright (c) 2020-2025 - Kyle Derby MacInnis  **
+**                                                 **
+**    Any unauthorized distribution or transfer    **
+**       of this work is strictly prohibited.      **
+**                                                 **
+**               All Rights Reserved.              **
+** ----------------------------------------------- **
+*                                                 */
+
+// Fragment shader for iris/circle transition effect.
+// Creates a circular iris wipe effect, common in classic films and games.
+
+export default function fs() {
+  return `
+  precision mediump float;
+  varying vec2 vUV;
+  uniform float uProgress;
+  uniform float uDirection;
+  uniform vec2 uCenter; // Center point of iris (default 0.5, 0.5)
+  uniform float uAspect; // Aspect ratio for circular shape
+
+  void main() {
+      float progress = uDirection > 0.5 ? (1.0 - uProgress) : uProgress;
+      
+      // Adjust UV for aspect ratio
+      vec2 center = uCenter;
+      if (center.x == 0.0 && center.y == 0.0) {
+          center = vec2(0.5, 0.5);
+      }
+      
+      vec2 uv = vUV - center;
+      uv.x *= max(uAspect, 1.0);
+      
+      // Calculate distance from center
+      float dist = length(uv);
+      
+      // Max radius to cover screen corners
+      float maxRadius = 1.5;
+      float radius = (1.0 - progress) * maxRadius;
+      
+      // Soft edge for smoother transition
+      float edge = 0.02;
+      float alpha = 1.0 - smoothstep(radius - edge, radius + edge, dist);
+      
+      gl_FragColor = vec4(0.0, 0.0, 0.0, alpha);
+  }
+  `;
+}