kinetic-slider/dist/cjs/filters/backdropBlurFilter.cjs.map

A WebGL-powered kinetic slider component using PIXI.js

{"version":3,"file":"backdropBlurFilter.cjs","sources":["../../../src/filters/backdropBlurFilter.ts"],"sourcesContent":["import { BackdropBlurFilter } from 'pixi-filters';\nimport { type BackdropBlurFilterConfig, type FilterResult } from './types';\nimport { ShaderResourceManager } from '../managers/ShaderResourceManager';\n\n/**\n * Creates a BackdropBlur filter that applies a Gaussian blur to everything behind an object,\n * and then draws the object on top of it.\n *\n * This filter is useful for creating depth effects where objects appear to have a blurred background\n * behind them, similar to a depth-of-field effect.\n * Uses shader pooling for better performance.\n *\n * @param config - Configuration for the BackdropBlur filter\n * @returns FilterResult with the filter instance and control functions\n */\nexport function createBackdropBlurFilter(config: BackdropBlurFilterConfig): FilterResult {\n    // Get shader manager instance\n    const shaderManager = ShaderResourceManager.getInstance();\n\n    // Create a unique key for this filter configuration\n    const shaderKey = `backdrop-blur-filter-q${config.quality || 4}-k${config.kernelSize || 5}`;\n\n    // Create the filter with options\n    const filter = new BackdropBlurFilter({\n        strength: config.intensity ? config.intensity * 10 : 8,\n        quality: config.quality ?? 4,\n        kernelSize: config.kernelSize ?? 5,\n        resolution: config.resolution ?? 1\n    });\n\n    // Register filter with shader manager\n    try {\n        shaderManager.registerFilter(filter, shaderKey);\n    } catch (error) {\n        console.warn('Error registering backdrop blur filter with shader manager:', error);\n    }\n\n    // Set any additional properties if provided\n    if (config.repeatEdgePixels !== undefined) {\n        filter.repeatEdgePixels = config.repeatEdgePixels;\n    }\n\n    /**\n     * Update the filter's blur intensity\n     *\n     * @param intensity - New intensity value (maps to blur strength)\n     */\n    const updateIntensity = (intensity: number): void => {\n        // Map intensity to strength (0-10 scale to appropriate blur strength)\n        // Blur strength can range from 0-100, so we multiply intensity by 10\n        filter.strength = intensity * 10;\n    };\n\n    // Set initial intensity\n    updateIntensity(config.intensity);\n\n    /**\n     * Reset the filter to initial configuration values or defaults\n     */\n    const reset = (): void => {\n        // Reset strength to config value if provided, otherwise use default\n        const defaultStrength = config.intensity !== undefined ? config.intensity * 10 : 8;\n        filter.strength = defaultStrength;\n\n        // Reset quality if it was configured and property exists\n        if (config.quality !== undefined && 'quality' in filter) {\n            filter.quality = config.quality;\n        }\n\n        // Reset kernelSize if it was configured and property exists\n        if (config.kernelSize !== undefined && 'kernelSize' in filter) {\n            (filter as any).kernelSize = config.kernelSize;\n        }\n\n        // Reset resolution if it was configured and property exists\n        if (config.resolution !== undefined && 'resolution' in filter) {\n            (filter as any).resolution = config.resolution;\n        }\n\n        // Reset repeatEdgePixels if it was configured and property exists\n        if (config.repeatEdgePixels !== undefined && 'repeatEdgePixels' in filter) {\n            filter.repeatEdgePixels = config.repeatEdgePixels;\n        }\n\n        // If intensity was explicitly provided in config, use updateIntensity\n        if (config.intensity !== undefined) {\n            updateIntensity(config.intensity);\n        }\n    };\n\n    /**\n     * Release any WebGL resources used by this filter\n     */\n    const dispose = (): void => {\n        try {\n            shaderManager.releaseFilter(filter, shaderKey);\n        } catch (error) {\n            console.warn('Error releasing backdrop blur filter shader:', error);\n        }\n        filter.destroy();\n    };\n\n    return { filter, updateIntensity, reset, dispose };\n}"],"names":["ShaderResourceManager","BackdropBlurFilter"],"mappings":";;;;;AAeO,SAAS,yBAAyB,MAAgD,EAAA;AAErF,EAAM,MAAA,aAAA,GAAgBA,4CAAsB,WAAY,EAAA;AAGxD,EAAM,MAAA,SAAA,GAAY,yBAAyB,MAAO,CAAA,OAAA,IAAW,CAAC,CAAK,EAAA,EAAA,MAAA,CAAO,cAAc,CAAC,CAAA,CAAA;AAGzF,EAAM,MAAA,MAAA,GAAS,IAAIC,8BAAmB,CAAA;AAAA,IAClC,QAAU,EAAA,MAAA,CAAO,SAAY,GAAA,MAAA,CAAO,YAAY,EAAK,GAAA,CAAA;AAAA,IACrD,OAAA,EAAS,OAAO,OAAW,IAAA,CAAA;AAAA,IAC3B,UAAA,EAAY,OAAO,UAAc,IAAA,CAAA;AAAA,IACjC,UAAA,EAAY,OAAO,UAAc,IAAA;AAAA,GACpC,CAAA;AAGD,EAAI,IAAA;AACA,IAAc,aAAA,CAAA,cAAA,CAAe,QAAQ,SAAS,CAAA;AAAA,WACzC,KAAO,EAAA;AACZ,IAAQ,OAAA,CAAA,IAAA,CAAK,+DAA+D,KAAK,CAAA;AAAA;AAIrF,EAAI,IAAA,MAAA,CAAO,qBAAqB,MAAW,EAAA;AACvC,IAAA,MAAA,CAAO,mBAAmB,MAAO,CAAA,gBAAA;AAAA;AAQrC,EAAM,MAAA,eAAA,GAAkB,CAAC,SAA4B,KAAA;AAGjD,IAAA,MAAA,CAAO,WAAW,SAAY,GAAA,EAAA;AAAA,GAClC;AAGA,EAAA,eAAA,CAAgB,OAAO,SAAS,CAAA;AAKhC,EAAA,MAAM,QAAQ,MAAY;AAEtB,IAAA,MAAM,kBAAkB,MAAO,CAAA,SAAA,KAAc,MAAY,GAAA,MAAA,CAAO,YAAY,EAAK,GAAA,CAAA;AACjF,IAAA,MAAA,CAAO,QAAW,GAAA,eAAA;AAGlB,IAAA,IAAI,MAAO,CAAA,OAAA,KAAY,MAAa,IAAA,SAAA,IAAa,MAAQ,EAAA;AACrD,MAAA,MAAA,CAAO,UAAU,MAAO,CAAA,OAAA;AAAA;AAI5B,IAAA,IAAI,MAAO,CAAA,UAAA,KAAe,MAAa,IAAA,YAAA,IAAgB,MAAQ,EAAA;AAC3D,MAAC,MAAA,CAAe,aAAa,MAAO,CAAA,UAAA;AAAA;AAIxC,IAAA,IAAI,MAAO,CAAA,UAAA,KAAe,MAAa,IAAA,YAAA,IAAgB,MAAQ,EAAA;AAC3D,MAAC,MAAA,CAAe,aAAa,MAAO,CAAA,UAAA;AAAA;AAIxC,IAAA,IAAI,MAAO,CAAA,gBAAA,KAAqB,MAAa,IAAA,kBAAA,IAAsB,MAAQ,EAAA;AACvE,MAAA,MAAA,CAAO,mBAAmB,MAAO,CAAA,gBAAA;AAAA;AAIrC,IAAI,IAAA,MAAA,CAAO,cAAc,MAAW,EAAA;AAChC,MAAA,eAAA,CAAgB,OAAO,SAAS,CAAA;AAAA;AACpC,GACJ;AAKA,EAAA,MAAM,UAAU,MAAY;AACxB,IAAI,IAAA;AACA,MAAc,aAAA,CAAA,aAAA,CAAc,QAAQ,SAAS,CAAA;AAAA,aACxC,KAAO,EAAA;AACZ,MAAQ,OAAA,CAAA,IAAA,CAAK,gDAAgD,KAAK,CAAA;AAAA;AAEtE,IAAA,MAAA,CAAO,OAAQ,EAAA;AAAA,GACnB;AAEA,EAAA,OAAO,EAAE,MAAA,EAAQ,eAAiB,EAAA,KAAA,EAAO,OAAQ,EAAA;AACrD;;;;"}