DropShadowFilter

[Vsevolod]

Hi, why was DropShadowFilter removed in the PixiJS version 4.0? I can see https://github.com/pixijs/pixi-filters/pull/9 - so some work is in progress for dropshadow. Will those changes be included in the next release?

 

[Vsevolod]

DropShadowFilter.sharedColorMatrixFilter = new PIXI.filters.ColorMatrixFilter();
DropShadowFilter.sharedColorMatrixFilter.grayscale(0.5, false);

DropShadowFilter.sharedBlurFilter = new PIXI.filters.BlurFilter();
DropShadowFilter.sharedBlurFilter.blur = 1.0;

DropShadowFilter.sharedCopyFilter = new PIXI.Filter();

function DropShadowFilter(angle, distance, spread, color, alpha) {
    PIXI.Filter.call(this);

    this.padding = distance;
    this.angle = angle;
    this.distance = distance;
    this.blur = spread;
    this.color = color;
    this.alpha = alpha;  
    
    angle *= Math.PI / 180;
    this.shiftFilter =  new PIXI.Filter(['attribute vec2 aVertexPosition;',
        'attribute vec2 aTextureCoord;',
        'uniform vec2 offset;',
        'uniform mat3 projectionMatrix;',
        'uniform mat3 filterMatrix;',
        'varying vec2 vTextureCoord;',
        'varying vec2 vFilterCoord;',
        'void main(void){',
        '   gl_Position = vec4((projectionMatrix * vec3(aVertexPosition + offset, 1.0)).xy, 0.0, 1.0);', 
        '   vFilterCoord = ( filterMatrix * vec3( aTextureCoord, 1.0)  ).xy;', 
        '   vTextureCoord = aTextureCoord ;', 
        '}'].join('\n'),
        PIXI.Filter.defaultFragmentSrc,
        { offset: { type: '2f', value: [distance * Math.cos(angle), distance * Math.sin(angle)] } }
    );
}

DropShadowFilter.prototype = Object.create(PIXI.Filter.prototype);
DropShadowFilter.prototype.constructor = DropShadowFilter;
DropShadowFilter.prototype.apply = function (filterManager, input, output) {
    var rt = filterManager.getRenderTarget(true);
    var rt1 = filterManager.getRenderTarget(true); 

    this.shiftFilter.apply(filterManager, input, rt, true);
    DropShadowFilter.sharedColorMatrixFilter.apply(filterManager, rt, rt1, true);
    DropShadowFilter.sharedBlurFilter.apply(filterManager, rt1, output, true);

    filterManager.returnRenderTarget(rt);
    filterManager.returnRenderTarget(rt1);

    DropShadowFilter.sharedCopyFilter.apply(filterManager, input, output);
};
PIXI.filters.DropShadowFilter = DropShadowFilter;

 

Simple DropShadow for v4 - may be will be useful for someone.