diff --git a/src/filters/index.js b/src/filters/index.js index 2f16710..1681c69 100644 --- a/src/filters/index.js +++ b/src/filters/index.js @@ -20,7 +20,7 @@ // InvertFilter: require('./invert/InvertFilter'), // NoiseFilter: require('./noise/NoiseFilter'), PixelateFilter: require('./pixelate/PixelateFilter'), - // RGBSplitFilter: require('./rgb/RGBSplitFilter'), + RGBSplitFilter: require('./rgb/RGBSplitFilter'), // ShockwaveFilter: require('./shockwave/ShockwaveFilter'), // SepiaFilter: require('./sepia/SepiaFilter'), // SmartBlurFilter: require('./blur/SmartBlurFilter'), diff --git a/src/filters/index.js b/src/filters/index.js index 2f16710..1681c69 100644 --- a/src/filters/index.js +++ b/src/filters/index.js @@ -20,7 +20,7 @@ // InvertFilter: require('./invert/InvertFilter'), // NoiseFilter: require('./noise/NoiseFilter'), PixelateFilter: require('./pixelate/PixelateFilter'), - // RGBSplitFilter: require('./rgb/RGBSplitFilter'), + RGBSplitFilter: require('./rgb/RGBSplitFilter'), // ShockwaveFilter: require('./shockwave/ShockwaveFilter'), // SepiaFilter: require('./sepia/SepiaFilter'), // SmartBlurFilter: require('./blur/SmartBlurFilter'), diff --git a/src/filters/rgb/RGBSplitFilter.js b/src/filters/rgb/RGBSplitFilter.js new file mode 100644 index 0000000..9609514 --- /dev/null +++ b/src/filters/rgb/RGBSplitFilter.js @@ -0,0 +1,80 @@ +var core = require('../../core'); +var glslify = require('glslify'); + +/** + * An RGB Split Filter. + * + * @class + * @extends PIXI.Filter + * @memberof PIXI.filters + */ +function RGBSplitFilter() +{ + core.Filter.call(this, + // vertex shader + glslify('../fragments/default.vert'), + // fragment shader + glslify('./rgb-split.frag') + ); + + this.red = [-10, 0]; + this.green = [0, 10]; + this.blue = [0, 0]; +} + +RGBSplitFilter.prototype = Object.create(core.Filter.prototype); +RGBSplitFilter.prototype.constructor = RGBSplitFilter; +module.exports = RGBSplitFilter; + +Object.defineProperties(RGBSplitFilter.prototype, { + /** + * Red channel offset. + * + * @member {PIXI.Point} + * @memberof PIXI.filters.RGBSplitFilter# + */ + red: { + get: function () + { + return this.uniforms.red; + }, + set: function (value) + { + this.uniforms.red = value; + } + }, + + /** + * Green channel offset. + * + * @member {PIXI.Point} + * @memberof PIXI.filters.RGBSplitFilter# + */ + green: { + get: function () + { + return this.uniforms.green; + }, + set: function (value) + { + this.uniforms.green = value; + } + }, + + /** + * Blue offset. + * + * @member {PIXI.Point} + * @memberof PIXI.filters.RGBSplitFilter# + */ + blue: { + get: function () + { + return this.uniforms.blue.value; + }, + set: function (value) + { + this.uniforms.blue.value = value; + } + } +}); diff --git a/src/filters/index.js b/src/filters/index.js index 2f16710..1681c69 100644 --- a/src/filters/index.js +++ b/src/filters/index.js @@ -20,7 +20,7 @@ // InvertFilter: require('./invert/InvertFilter'), // NoiseFilter: require('./noise/NoiseFilter'), PixelateFilter: require('./pixelate/PixelateFilter'), - // RGBSplitFilter: require('./rgb/RGBSplitFilter'), + RGBSplitFilter: require('./rgb/RGBSplitFilter'), // ShockwaveFilter: require('./shockwave/ShockwaveFilter'), // SepiaFilter: require('./sepia/SepiaFilter'), // SmartBlurFilter: require('./blur/SmartBlurFilter'), diff --git a/src/filters/rgb/RGBSplitFilter.js b/src/filters/rgb/RGBSplitFilter.js new file mode 100644 index 0000000..9609514 --- /dev/null +++ b/src/filters/rgb/RGBSplitFilter.js @@ -0,0 +1,80 @@ +var core = require('../../core'); +var glslify = require('glslify'); + +/** + * An RGB Split Filter. + * + * @class + * @extends PIXI.Filter + * @memberof PIXI.filters + */ +function RGBSplitFilter() +{ + core.Filter.call(this, + // vertex shader + glslify('../fragments/default.vert'), + // fragment shader + glslify('./rgb-split.frag') + ); + + this.red = [-10, 0]; + this.green = [0, 10]; + this.blue = [0, 0]; +} + +RGBSplitFilter.prototype = Object.create(core.Filter.prototype); +RGBSplitFilter.prototype.constructor = RGBSplitFilter; +module.exports = RGBSplitFilter; + +Object.defineProperties(RGBSplitFilter.prototype, { + /** + * Red channel offset. + * + * @member {PIXI.Point} + * @memberof PIXI.filters.RGBSplitFilter# + */ + red: { + get: function () + { + return this.uniforms.red; + }, + set: function (value) + { + this.uniforms.red = value; + } + }, + + /** + * Green channel offset. + * + * @member {PIXI.Point} + * @memberof PIXI.filters.RGBSplitFilter# + */ + green: { + get: function () + { + return this.uniforms.green; + }, + set: function (value) + { + this.uniforms.green = value; + } + }, + + /** + * Blue offset. + * + * @member {PIXI.Point} + * @memberof PIXI.filters.RGBSplitFilter# + */ + blue: { + get: function () + { + return this.uniforms.blue.value; + }, + set: function (value) + { + this.uniforms.blue.value = value; + } + } +}); diff --git a/src/filters/rgb/rgb-split.frag b/src/filters/rgb/rgb-split.frag new file mode 100644 index 0000000..46fed0f --- /dev/null +++ b/src/filters/rgb/rgb-split.frag @@ -0,0 +1,17 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +uniform vec4 filterArea; +uniform vec2 red; +uniform vec2 green; +uniform vec2 blue; + +void main(void) +{ + gl_FragColor.r = texture2D(uSampler, vTextureCoord + red/filterArea.xy).r; + gl_FragColor.g = texture2D(uSampler, vTextureCoord + green/filterArea.xy).g; + gl_FragColor.b = texture2D(uSampler, vTextureCoord + blue/filterArea.xy).b; + gl_FragColor.a = texture2D(uSampler, vTextureCoord).a; +}