kinetic-slider/dist/cjs/filters/reflectionFilter.cjs

A WebGL-powered kinetic slider component using PIXI.js

'use strict';

var pixiFilters = require('pixi-filters');
var ShaderResourceManager = require('../managers/ShaderResourceManager.cjs');

function createReflectionFilter(config) {
  const shaderManager = ShaderResourceManager.ShaderResourceManager.getInstance();
  const options = {};
  if (config.alpha !== void 0) options.alpha = config.alpha;
  if (config.amplitude !== void 0) options.amplitude = config.amplitude;
  if (config.boundary !== void 0) options.boundary = config.boundary;
  if (config.mirror !== void 0) options.mirror = config.mirror;
  if (config.waveLength !== void 0) options.waveLength = config.waveLength;
  if (config.time !== void 0) options.time = config.time;
  const mirrorStr = options.mirror === false ? "nomirror" : "mirror";
  const shaderKey = `reflection-filter-${mirrorStr}`;
  const filter = new pixiFilters.ReflectionFilter(options);
  try {
    shaderManager.registerFilter(filter, shaderKey);
  } catch (error) {
    console.warn("Error registering reflection filter with shader manager:", error);
  }
  let animationActive = false;
  let animationFrameId = null;
  let lastTime = 0;
  const updateIntensity = (intensity) => {
    const normalizedIntensity = Math.max(0, Math.min(10, intensity));
    if (config.primaryProperty) {
      switch (config.primaryProperty) {
        case "amplitude":
          if (typeof filter.amplitude === "object") {
            filter.amplitude[0] = 0;
            filter.amplitude[1] = normalizedIntensity * 3;
          } else {
            filter.amplitudeEnd = normalizedIntensity * 3;
          }
          break;
        case "waveLength":
          if (typeof filter.waveLength === "object") {
            const start = 30;
            const end = 30 + normalizedIntensity * 7;
            filter.waveLength[0] = start;
            filter.waveLength[1] = end;
          } else {
            filter.wavelengthEnd = 30 + normalizedIntensity * 7;
          }
          break;
        case "boundary":
          filter.boundary = 1 - normalizedIntensity / 10;
          break;
        case "alpha":
          if (typeof filter.alpha === "object") {
            filter.alpha[0] = normalizedIntensity / 10;
            filter.alpha[1] = normalizedIntensity / 10;
          } else {
            filter.alphaStart = normalizedIntensity / 10;
            filter.alphaEnd = normalizedIntensity / 10;
          }
          break;
        default:
          if (typeof filter.amplitude === "object") {
            filter.amplitude = [0, normalizedIntensity * 3];
          } else {
            filter.amplitudeEnd = normalizedIntensity * 3;
          }
      }
    } else {
      if (typeof filter.amplitude === "object") {
        filter.amplitude[0] = 0;
        filter.amplitude[1] = normalizedIntensity * 3;
      } else {
        filter.amplitudeEnd = normalizedIntensity * 3;
      }
    }
    if (config.animate) {
      if (normalizedIntensity > 0 && !animationActive) {
        startAnimation();
      } else if (normalizedIntensity === 0 && animationActive) {
        stopAnimation();
      }
    }
  };
  const startAnimation = () => {
    if (animationActive) return;
    animationActive = true;
    lastTime = Date.now();
    const animate = () => {
      const now = Date.now();
      const delta = (now - lastTime) / 1e3;
      lastTime = now;
      const animationSpeed = config.animationSpeed || 0.1;
      filter.time += delta * animationSpeed;
      animationFrameId = requestAnimationFrame(animate);
    };
    animate();
  };
  const stopAnimation = () => {
    if (!animationActive) return;
    animationActive = false;
    if (animationFrameId !== null) {
      cancelAnimationFrame(animationFrameId);
      animationFrameId = null;
    }
  };
  updateIntensity(config.intensity);
  if (config.animate && config.intensity > 0) {
    startAnimation();
  }
  const reset = () => {
    stopAnimation();
    if (typeof filter.alpha === "object") {
      if (config.alpha && Array.isArray(config.alpha)) {
        filter.alpha[0] = config.alpha[0];
        filter.alpha[1] = config.alpha[1];
      } else {
        filter.alpha[0] = 1;
        filter.alpha[1] = 1;
      }
    } else {
      filter.alphaStart = config.alphaStart ?? 1;
      filter.alphaEnd = config.alphaEnd ?? 1;
    }
    if (typeof filter.amplitude === "object") {
      if (config.amplitude && Array.isArray(config.amplitude)) {
        filter.amplitude[0] = config.amplitude[0];
        filter.amplitude[1] = config.amplitude[1];
      } else {
        filter.amplitude[0] = 0;
        filter.amplitude[1] = 20;
      }
    } else {
      filter.amplitudeStart = config.amplitudeStart ?? 0;
      filter.amplitudeEnd = config.amplitudeEnd ?? 20;
    }
    if (typeof filter.waveLength === "object") {
      if (config.waveLength && Array.isArray(config.waveLength)) {
        filter.waveLength[0] = config.waveLength[0];
        filter.waveLength[1] = config.waveLength[1];
      } else {
        filter.waveLength[0] = 30;
        filter.waveLength[1] = 100;
      }
    } else {
      filter.wavelengthStart = config.wavelengthStart ?? 30;
      filter.wavelengthEnd = config.wavelengthEnd ?? 100;
    }
    filter.boundary = config.boundary ?? 0.5;
    filter.mirror = config.mirror ?? true;
    filter.time = 0;
  };
  const dispose = () => {
    stopAnimation();
    try {
      shaderManager.releaseFilter(filter, shaderKey);
    } catch (error) {
      console.warn("Error releasing reflection filter shader:", error);
    }
    filter.destroy();
  };
  return { filter, updateIntensity, reset, dispose };
}

exports.createReflectionFilter = createReflectionFilter;
//# sourceMappingURL=reflectionFilter.cjs.map