- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
import { vertex } from '@tools/fragments';
import fragment from './tilt-shift.frag';
import { Filter } from '@pixi/core';
import { Point } from '@pixi/math';
// @author Vico @vicocotea
// original filter https://github.com/evanw/glfx.js/blob/master/src/filters/blur/tiltshift.js
// by Evan Wallace : http://madebyevan.com/
/**
* A TiltShiftAxisFilter.
*
* @class
* @extends PIXI.Filter
* @memberof PIXI.filters
* @private
*/
class TiltShiftAxisFilter extends Filter
{
constructor(blur = 100, gradientBlur = 600, start?: Point, end?: Point)
{
super(vertex, fragment);
this.uniforms.blur = blur;
this.uniforms.gradientBlur = gradientBlur;
this.uniforms.start = start || new Point(0, window.innerHeight / 2);
this.uniforms.end = end || new Point(600, window.innerHeight / 2);
this.uniforms.delta = new Point(30, 30);
this.uniforms.texSize = new Point(window.innerWidth, window.innerHeight);
this.updateDelta();
}
/**
* Updates the filter delta values.
* This is overridden in the X and Y filters, does nothing for this class.
*
*/
protected updateDelta(): void
{
this.uniforms.delta.x = 0;
this.uniforms.delta.y = 0;
}
/**
* The strength of the blur.
*
* @memberof PIXI.filters.TiltShiftAxisFilter#
*/
get blur(): number
{
return this.uniforms.blur;
}
set blur(value: number)
{
this.uniforms.blur = value;
}
/**
* The strength of the gradient blur.
*
* @memberof PIXI.filters.TiltShiftAxisFilter#
*/
get gradientBlur(): number
{
return this.uniforms.gradientBlur;
}
set gradientBlur(value: number)
{
this.uniforms.gradientBlur = value;
}
/**
* The X value to start the effect at.
*
* @member {PIXI.Point}
* @memberof PIXI.filters.TiltShiftAxisFilter#
*/
get start(): Point
{
return this.uniforms.start;
}
set start(value: Point)
{
this.uniforms.start = value;
this.updateDelta();
}
/**
* The X value to end the effect at.
*
* @member {PIXI.Point}
* @memberof PIXI.filters.TiltShiftAxisFilter#
*/
get end(): Point
{
return this.uniforms.end;
}
set end(value: Point)
{
this.uniforms.end = value;
this.updateDelta();
}
}
export { TiltShiftAxisFilter };