Base Structure Changes

filters/adjustment/src/AdjustmentFilter.ts

@@ -55,7 +55,7 @@ export interface AdjustmentFilterOptions
  * ![original](../tools/screenshots/dist/original.png)![filter](../tools/screenshots/dist/adjustment.png)
  *
  * @class
- * @extends PIXI.Filter
+ * @extends Filter
  * @see {@link https://www.npmjs.com/package/@pixi/filter-adjustment|@pixi/filter-adjustment}
  * @see {@link https://www.npmjs.com/package/pixi-filters|pixi-filters}
  */
@@ -184,8 +184,5 @@ export class AdjustmentFilter extends Filter
      * @default 1
      */
     get alpha(): number { return this.resources.adjustmentUniforms.uniforms.uColor[3]; }
-    set alpha(value: number)
-    {
-        this.resources.adjustmentUniforms.uniforms.uColor[3] = value; console.log(this.resources, this._uniformBindMap);
-    }
+    set alpha(value: number) { this.resources.adjustmentUniforms.uniforms.uColor[3] = value; }
 }

filters/adjustment/src/adjustment.frag

@@ -1,7 +1,7 @@
 in vec2 vTextureCoord;
 out vec4 finalColor;
 
-uniform sampler2D uTexture;
+uniform sampler2D uSampler;
 uniform float uGamma;
 uniform float uContrast;
 uniform float uSaturation;
@@ -10,7 +10,7 @@ uniform vec4 uColor;
 
 void main()
 {
-    vec4 c = texture(uTexture, vTextureCoord);
+    vec4 c = texture(uSampler, vTextureCoord);
 
     if (c.a > 0.0) {
         c.rgb /= c.a;

filters/adjustment/src/adjustment.wgsl

@@ -16,7 +16,7 @@ struct AdjustmentUniforms {
 };
 
 @group(0) @binding(0) var<uniform> gfu: GlobalFilterUniforms;
-@group(0) @binding(1) var uTexture: texture_2d<f32>;
+@group(0) @binding(1) var uSampler: texture_2d<f32>;
 
 @group(1) @binding(0) var<uniform> adjustmentUniforms : AdjustmentUniforms;
 
@@ -65,7 +65,7 @@ fn mainFragment(
   @location(0) uv: vec2<f32>,
   @builtin(position) position: vec4<f32>
 ) -> @location(0) vec4<f32> {
-  var sample = textureSample(uTexture, uSampler, uv);
+  var sample = textureSample(uSampler, uSampler, uv);
   let color = adjustmentUniforms.uColor;
 
   if (sample.a > 0.0) 

filters/advanced-bloom/src/AdvancedBloomFilter.ts

@@ -2,8 +2,8 @@ import { ExtractBrightnessFilter } from './ExtractBrightnessFilter';
 import { KawaseBlurFilter } from '@pixi/filter-kawase-blur';
 import { vertex } from '@tools/fragments';
 import fragment from './advanced-bloom.frag';
-import { Filter } from '@pixi/core';
-import type { FilterSystem, FilterState, RenderTexture, CLEAR_MODES } from '@pixi/core';
+import { Filter, GlProgram } from 'pixi.js';
+import type { FilterSystem, RenderSurface, Texture } from 'pixi.js';
 import type { PixelSizeValue } from '@pixi/filter-kawase-blur';
 
 interface AdvancedBloomFilterOptions
@@ -25,11 +25,11 @@ interface AdvancedBloomFilterOptions
  * ![original](../tools/screenshots/dist/original.png)![filter](../tools/screenshots/dist/advanced-bloom.png)
  *
  * @class
- * @extends PIXI.Filter
+ * @extends Filter
  * @see {@link https://www.npmjs.com/package/@pixi/filter-advanced-bloom|@pixi/filter-advanced-bloom}
  * @see {@link https://www.npmjs.com/package/pixi-filters|pixi-filters}
  */
-class AdvancedBloomFilter extends Filter
+export class AdvancedBloomFilter extends Filter
 {
     /** Default construction options. */
     public static readonly defaults: AdvancedBloomFilterOptions = {
@@ -64,12 +64,21 @@ class AdvancedBloomFilter extends Filter
      * @param {number} [options.blur=8] - Sets the strength of the Blur properties simultaneously
      * @param {number} [options.quality=4] - The quality of the Blur filter.
      * @param {number[]} [options.kernels=null] - The kernels of the Blur filter.
-     * @param {number|number[]|PIXI.Point} [options.pixelSize=1] - the pixelSize of the Blur filter.
+     * @param {number|number[]|Point} [options.pixelSize=1] - the pixelSize of the Blur filter.
      * @param {number} [options.resolution=1] - The resolution of the Blur filter.
      */
     constructor(options?: Partial<AdvancedBloomFilterOptions>)
     {
-        super(vertex, fragment);
+        const glProgram = new GlProgram({
+            vertex,
+            fragment,
+            name: 'advanced-bloom-filter',
+        });
+
+        super({
+            glProgram,
+            resources: {},
+        });
 
         if (typeof options === 'number')
         {
@@ -93,56 +102,51 @@ class AdvancedBloomFilter extends Filter
     }
 
     /**
-     * Override existing apply method in PIXI.Filter
+     * Override existing apply method in Filter
      *
      * @private
      */
-    apply(
-        filterManager: FilterSystem,
-        input: RenderTexture,
-        output: RenderTexture,
-        clear: CLEAR_MODES,
-        currentState?: FilterState): void
+    apply(filterManager: FilterSystem, input: Texture, output: RenderSurface, clear: boolean): void
     {
-        const brightTarget = filterManager.getFilterTexture();
+        // const brightTarget = filterManager.getFilterTexture();
 
-        this._extractFilter.apply(filterManager, input, brightTarget, 1, currentState);
+        // this._extractFilter.apply(filterManager, input, brightTarget, 1, currentState);
 
-        const bloomTarget = filterManager.getFilterTexture();
+        // const bloomTarget = filterManager.getFilterTexture();
 
-        this._blurFilter.apply(filterManager, brightTarget, bloomTarget, 1);
+        // this._blurFilter.apply(filterManager, brightTarget, bloomTarget, 1);
 
-        this.uniforms.bloomScale = this.bloomScale;
-        this.uniforms.brightness = this.brightness;
-        this.uniforms.bloomTexture = bloomTarget;
+        // this.uniforms.bloomScale = this.bloomScale;
+        // this.uniforms.brightness = this.brightness;
+        // this.uniforms.bloomTexture = bloomTarget;
 
-        filterManager.applyFilter(this, input, output, clear);
+        // filterManager.applyFilter(this, input, output, clear);
 
-        filterManager.returnFilterTexture(bloomTarget);
-        filterManager.returnFilterTexture(brightTarget);
+        // filterManager.returnFilterTexture(bloomTarget);
+        // filterManager.returnFilterTexture(brightTarget);
     }
 
     /**
      * The resolution of the filter.
      * @ignore
      */
-    get resolution(): number
-    {
-        return this._resolution;
-    }
-    set resolution(value: number)
-    {
-        this._resolution = value;
-
-        if (this._extractFilter)
-        {
-            this._extractFilter.resolution = value;
-        }
-        if (this._blurFilter)
-        {
-            this._blurFilter.resolution = value;
-        }
-    }
+    // get resolution(): number
+    // {
+    //     return this._resolution;
+    // }
+    // set resolution(value: number)
+    // {
+    //     this._resolution = value;
+
+    //     if (this._extractFilter)
+    //     {
+    //         this._extractFilter.resolution = value;
+    //     }
+    //     if (this._blurFilter)
+    //     {
+    //         this._blurFilter.resolution = value;
+    //     }
+    // }
 
     /**
      * Defines how bright a color needs to be to affect bloom.
@@ -201,7 +205,7 @@ class AdvancedBloomFilter extends Filter
     /**
      * Sets the pixelSize of the Kawase Blur filter
      *
-     * @member {number|number[]|PIXI.Point}
+     * @member {number|number[]|Point}
      * @default 1
      */
     get pixelSize(): PixelSizeValue
@@ -213,6 +217,3 @@ class AdvancedBloomFilter extends Filter
         this._blurFilter.pixelSize = value;
     }
 }
-
-export { AdvancedBloomFilter };
-export type { AdvancedBloomFilterOptions };

filters/advanced-bloom/src/ExtractBrightnessFilter.ts

@@ -1,38 +1,44 @@
 import { vertex } from '@tools/fragments';
 import fragment from './extract-brightness.frag';
-import { Filter } from '@pixi/core';
+import { Filter, GlProgram } from 'pixi.js';
 
 /**
  * Internal filter for AdvancedBloomFilter to get brightness.
  * @class
  * @private
  */
-class ExtractBrightnessFilter extends Filter
+export class ExtractBrightnessFilter extends Filter
 {
     /**
      * @param {number} [threshold] - Defines how bright a color needs to be extracted.
      */
     constructor(threshold = 0.5)
     {
-        super(vertex, fragment);
+        const glProgram = new GlProgram({
+            vertex,
+            fragment,
+            name: 'extract-brightness-filter',
+        });
 
-        this.threshold = threshold;
+        super({
+            glProgram,
+            resources: {},
+        });
+
+        // this.threshold = threshold;
     }
 
     /**
      * Defines how bright a color needs to be extracted.
      *
      * @default 0.5
      */
-    get threshold(): number
-    {
-        return this.uniforms.threshold;
-    }
-    set threshold(value: number)
-    {
-        this.uniforms.threshold = value;
-    }
+    // get threshold(): number
+    // {
+    //     return this.uniforms.threshold;
+    // }
+    // set threshold(value: number)
+    // {
+    //     this.uniforms.threshold = value;
+    // }
 }
-
-export { ExtractBrightnessFilter };
-

filters/ascii/src/AsciiFilter.ts

@@ -1,6 +1,6 @@
 import { vertex } from '@tools/fragments';
 import fragment from './ascii.frag';
-import { Filter } from '@pixi/core';
+import { Filter, GlProgram } from 'pixi.js';
 
 // TODO (cengler) - The Y is flipped in this shader for some reason.
 
@@ -12,33 +12,39 @@ import { Filter } from '@pixi/core';
  * ![original](../tools/screenshots/dist/original.png)![filter](../tools/screenshots/dist/ascii.png)
  *
  * @class
- * @extends PIXI.Filter
+ * @extends Filter
  * @see {@link https://www.npmjs.com/package/@pixi/filter-ascii|@pixi/filter-ascii}
  * @see {@link https://www.npmjs.com/package/pixi-filters|pixi-filters}
  */
-class AsciiFilter extends Filter
+export class AsciiFilter extends Filter
 {
     /**
      * @param {number} [size=8] - Size of the font
      */
     constructor(size = 8)
     {
-        super(vertex, fragment);
-        this.size = size;
+        const glProgram = new GlProgram({
+            vertex,
+            fragment,
+            name: 'ascii-filter',
+        });
+
+        super({
+            glProgram,
+            resources: {},
+        });
+        // this.size = size;
     }
 
     /**
      * The pixel size used by the filter.
      */
-    get size(): number
-    {
-        return this.uniforms.pixelSize;
-    }
-    set size(value: number)
-    {
-        this.uniforms.pixelSize = value;
-    }
+    // get size(): number
+    // {
+    //     return this.uniforms.pixelSize;
+    // }
+    // set size(value: number)
+    // {
+    //     this.uniforms.pixelSize = value;
+    // }
 }
-
-export { AsciiFilter };
-