diff --git a/src/filters/DisplacementFilter.js b/src/filters/DisplacementFilter.js deleted file mode 100644 index cb6b788..0000000 --- a/src/filters/DisplacementFilter.js +++ /dev/null @@ -1,141 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. - * You can use this filter to apply all manor of crazy warping effects - * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - * @param texture {Texture} The texture used for the displacement map * must be power of 2 texture at the moment - */ -function DisplacementFilter(texture) -{ - AbstractFilter.call(this); - - texture.baseTexture._powerOf2 = true; - - // set the uniforms - this.uniforms = { - displacementMap: { type: 'sampler2D', value: texture }, - scale: { type: '2f', value: { x: 30, y: 30 } }, - offset: { type: '2f', value: { x: 0, y: 0 } }, - mapDimensions: { type: '2f', value: { x: 1, y: 5112 } }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - if (texture.baseTexture.hasLoaded) - { - this.onTextureLoaded(); - } - else - { - this.boundLoadedFunction = this.onTextureLoaded.bind(this); - - texture.baseTexture.on('loaded', this.boundLoadedFunction); - } - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform sampler2D displacementMap;', - 'uniform sampler2D uSampler;', - 'uniform vec2 scale;', - 'uniform vec2 offset;', - 'uniform vec4 dimensions;', - 'uniform vec2 mapDimensions;',// = vec2(256.0, 256.0);', - // 'const vec2 textureDimensions = vec2(750.0, 750.0);', - - 'void main(void)', - '{', - ' vec2 mapCords = vTextureCoord.xy;', - ' mapCords += (dimensions.zw + offset)/ dimensions.xy ;', - ' mapCords.y *= -1.0;', - ' mapCords.y += 1.0;', - - ' vec2 matSample = texture2D(displacementMap, mapCords).xy;', - ' matSample -= 0.5;', - ' matSample *= scale;', - ' matSample /= mapDimensions;', - - ' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y));', - - //TODO: Is this needed? - ' gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb, 1.0);', - '}' - ]; -} - -DisplacementFilter.prototype = Object.create(AbstractFilter.prototype); -DisplacementFilter.prototype.constructor = DisplacementFilter; -module.exports = DisplacementFilter; - -/** - * Sets the map dimensions uniforms when the texture becomes available. - * - * @private - */ -DisplacementFilter.prototype.onTextureLoaded = function () -{ - this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; - this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; - - this.uniforms.displacementMap.value.baseTexture.off('loaded', this.boundLoadedFunction); -}; - -Object.defineProperties(DisplacementFilter.prototype, { - /** - * The texture used for the displacement map. Must be power of 2 texture. - * - * @member {Texture} - * @memberof DisplacementFilter# - */ - map: { - get: function () - { - return this.uniforms.displacementMap.value; - }, - set: function (value) - { - this.uniforms.displacementMap.value = value; - } - }, - - /** - * The multiplier used to scale the displacement result from the map calculation. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The offset used to move the displacement map. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - offset: { - get: function () - { - return this.uniforms.offset.value; - }, - set: function (value) - { - this.uniforms.offset.value = value; - } - } -}); diff --git a/src/filters/DisplacementFilter.js b/src/filters/DisplacementFilter.js deleted file mode 100644 index cb6b788..0000000 --- a/src/filters/DisplacementFilter.js +++ /dev/null @@ -1,141 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. - * You can use this filter to apply all manor of crazy warping effects - * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - * @param texture {Texture} The texture used for the displacement map * must be power of 2 texture at the moment - */ -function DisplacementFilter(texture) -{ - AbstractFilter.call(this); - - texture.baseTexture._powerOf2 = true; - - // set the uniforms - this.uniforms = { - displacementMap: { type: 'sampler2D', value: texture }, - scale: { type: '2f', value: { x: 30, y: 30 } }, - offset: { type: '2f', value: { x: 0, y: 0 } }, - mapDimensions: { type: '2f', value: { x: 1, y: 5112 } }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - if (texture.baseTexture.hasLoaded) - { - this.onTextureLoaded(); - } - else - { - this.boundLoadedFunction = this.onTextureLoaded.bind(this); - - texture.baseTexture.on('loaded', this.boundLoadedFunction); - } - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform sampler2D displacementMap;', - 'uniform sampler2D uSampler;', - 'uniform vec2 scale;', - 'uniform vec2 offset;', - 'uniform vec4 dimensions;', - 'uniform vec2 mapDimensions;',// = vec2(256.0, 256.0);', - // 'const vec2 textureDimensions = vec2(750.0, 750.0);', - - 'void main(void)', - '{', - ' vec2 mapCords = vTextureCoord.xy;', - ' mapCords += (dimensions.zw + offset)/ dimensions.xy ;', - ' mapCords.y *= -1.0;', - ' mapCords.y += 1.0;', - - ' vec2 matSample = texture2D(displacementMap, mapCords).xy;', - ' matSample -= 0.5;', - ' matSample *= scale;', - ' matSample /= mapDimensions;', - - ' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y));', - - //TODO: Is this needed? - ' gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb, 1.0);', - '}' - ]; -} - -DisplacementFilter.prototype = Object.create(AbstractFilter.prototype); -DisplacementFilter.prototype.constructor = DisplacementFilter; -module.exports = DisplacementFilter; - -/** - * Sets the map dimensions uniforms when the texture becomes available. - * - * @private - */ -DisplacementFilter.prototype.onTextureLoaded = function () -{ - this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; - this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; - - this.uniforms.displacementMap.value.baseTexture.off('loaded', this.boundLoadedFunction); -}; - -Object.defineProperties(DisplacementFilter.prototype, { - /** - * The texture used for the displacement map. Must be power of 2 texture. - * - * @member {Texture} - * @memberof DisplacementFilter# - */ - map: { - get: function () - { - return this.uniforms.displacementMap.value; - }, - set: function (value) - { - this.uniforms.displacementMap.value = value; - } - }, - - /** - * The multiplier used to scale the displacement result from the map calculation. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The offset used to move the displacement map. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - offset: { - get: function () - { - return this.uniforms.offset.value; - }, - set: function (value) - { - this.uniforms.offset.value = value; - } - } -}); diff --git a/src/filters/SmartBlurFilter.js b/src/filters/SmartBlurFilter.js deleted file mode 100644 index 7fe5216..0000000 --- a/src/filters/SmartBlurFilter.js +++ /dev/null @@ -1,53 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * A Smart Blur Filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function SmartBlurFilter() -{ - AbstractFilter.call(this); - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - - 'uniform sampler2D uSampler;', - 'const vec2 delta = vec2(1.0/10.0, 0.0);', - - 'float random(vec3 scale, float seed)', - '{', - ' return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);', - '}', - - - 'void main(void)', - '{', - ' vec4 color = vec4(0.0);', - ' float total = 0.0;', - - ' float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);', - - ' for (float t = -30.0; t <= 30.0; t++)', - ' {', - ' float percent = (t + offset - 0.5) / 30.0;', - ' float weight = 1.0 - abs(percent);', - ' vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent);', - ' sample.rgb *= sample.a;', - ' color += sample * weight;', - ' total += weight;', - ' }', - - ' gl_FragColor = color / total;', - ' gl_FragColor.rgb /= gl_FragColor.a + 0.00001;', - '}' - ]; -} - -SmartBlurFilter.prototype = Object.create(AbstractFilter.prototype); -SmartBlurFilter.prototype.constructor = SmartBlurFilter; -module.exports = SmartBlurFilter; diff --git a/src/filters/DisplacementFilter.js b/src/filters/DisplacementFilter.js deleted file mode 100644 index cb6b788..0000000 --- a/src/filters/DisplacementFilter.js +++ /dev/null @@ -1,141 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. - * You can use this filter to apply all manor of crazy warping effects - * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - * @param texture {Texture} The texture used for the displacement map * must be power of 2 texture at the moment - */ -function DisplacementFilter(texture) -{ - AbstractFilter.call(this); - - texture.baseTexture._powerOf2 = true; - - // set the uniforms - this.uniforms = { - displacementMap: { type: 'sampler2D', value: texture }, - scale: { type: '2f', value: { x: 30, y: 30 } }, - offset: { type: '2f', value: { x: 0, y: 0 } }, - mapDimensions: { type: '2f', value: { x: 1, y: 5112 } }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - if (texture.baseTexture.hasLoaded) - { - this.onTextureLoaded(); - } - else - { - this.boundLoadedFunction = this.onTextureLoaded.bind(this); - - texture.baseTexture.on('loaded', this.boundLoadedFunction); - } - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform sampler2D displacementMap;', - 'uniform sampler2D uSampler;', - 'uniform vec2 scale;', - 'uniform vec2 offset;', - 'uniform vec4 dimensions;', - 'uniform vec2 mapDimensions;',// = vec2(256.0, 256.0);', - // 'const vec2 textureDimensions = vec2(750.0, 750.0);', - - 'void main(void)', - '{', - ' vec2 mapCords = vTextureCoord.xy;', - ' mapCords += (dimensions.zw + offset)/ dimensions.xy ;', - ' mapCords.y *= -1.0;', - ' mapCords.y += 1.0;', - - ' vec2 matSample = texture2D(displacementMap, mapCords).xy;', - ' matSample -= 0.5;', - ' matSample *= scale;', - ' matSample /= mapDimensions;', - - ' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y));', - - //TODO: Is this needed? - ' gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb, 1.0);', - '}' - ]; -} - -DisplacementFilter.prototype = Object.create(AbstractFilter.prototype); -DisplacementFilter.prototype.constructor = DisplacementFilter; -module.exports = DisplacementFilter; - -/** - * Sets the map dimensions uniforms when the texture becomes available. - * - * @private - */ -DisplacementFilter.prototype.onTextureLoaded = function () -{ - this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; - this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; - - this.uniforms.displacementMap.value.baseTexture.off('loaded', this.boundLoadedFunction); -}; - -Object.defineProperties(DisplacementFilter.prototype, { - /** - * The texture used for the displacement map. Must be power of 2 texture. - * - * @member {Texture} - * @memberof DisplacementFilter# - */ - map: { - get: function () - { - return this.uniforms.displacementMap.value; - }, - set: function (value) - { - this.uniforms.displacementMap.value = value; - } - }, - - /** - * The multiplier used to scale the displacement result from the map calculation. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The offset used to move the displacement map. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - offset: { - get: function () - { - return this.uniforms.offset.value; - }, - set: function (value) - { - this.uniforms.offset.value = value; - } - } -}); diff --git a/src/filters/SmartBlurFilter.js b/src/filters/SmartBlurFilter.js deleted file mode 100644 index 7fe5216..0000000 --- a/src/filters/SmartBlurFilter.js +++ /dev/null @@ -1,53 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * A Smart Blur Filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function SmartBlurFilter() -{ - AbstractFilter.call(this); - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - - 'uniform sampler2D uSampler;', - 'const vec2 delta = vec2(1.0/10.0, 0.0);', - - 'float random(vec3 scale, float seed)', - '{', - ' return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);', - '}', - - - 'void main(void)', - '{', - ' vec4 color = vec4(0.0);', - ' float total = 0.0;', - - ' float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);', - - ' for (float t = -30.0; t <= 30.0; t++)', - ' {', - ' float percent = (t + offset - 0.5) / 30.0;', - ' float weight = 1.0 - abs(percent);', - ' vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent);', - ' sample.rgb *= sample.a;', - ' color += sample * weight;', - ' total += weight;', - ' }', - - ' gl_FragColor = color / total;', - ' gl_FragColor.rgb /= gl_FragColor.a + 0.00001;', - '}' - ]; -} - -SmartBlurFilter.prototype = Object.create(AbstractFilter.prototype); -SmartBlurFilter.prototype.constructor = SmartBlurFilter; -module.exports = SmartBlurFilter; diff --git a/src/filters/blur/SmartBlurFilter.js b/src/filters/blur/SmartBlurFilter.js new file mode 100644 index 0000000..7948ac1 --- /dev/null +++ b/src/filters/blur/SmartBlurFilter.js @@ -0,0 +1,22 @@ +var core = require('../../core'); + +/** + * A Smart Blur Filter. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function SmartBlurFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/smartBlur.frag', 'utf8') + ); +} + +SmartBlurFilter.prototype = Object.create(core.AbstractFilter.prototype); +SmartBlurFilter.prototype.constructor = SmartBlurFilter; +module.exports = SmartBlurFilter; diff --git a/src/filters/DisplacementFilter.js b/src/filters/DisplacementFilter.js deleted file mode 100644 index cb6b788..0000000 --- a/src/filters/DisplacementFilter.js +++ /dev/null @@ -1,141 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. - * You can use this filter to apply all manor of crazy warping effects - * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - * @param texture {Texture} The texture used for the displacement map * must be power of 2 texture at the moment - */ -function DisplacementFilter(texture) -{ - AbstractFilter.call(this); - - texture.baseTexture._powerOf2 = true; - - // set the uniforms - this.uniforms = { - displacementMap: { type: 'sampler2D', value: texture }, - scale: { type: '2f', value: { x: 30, y: 30 } }, - offset: { type: '2f', value: { x: 0, y: 0 } }, - mapDimensions: { type: '2f', value: { x: 1, y: 5112 } }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - if (texture.baseTexture.hasLoaded) - { - this.onTextureLoaded(); - } - else - { - this.boundLoadedFunction = this.onTextureLoaded.bind(this); - - texture.baseTexture.on('loaded', this.boundLoadedFunction); - } - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform sampler2D displacementMap;', - 'uniform sampler2D uSampler;', - 'uniform vec2 scale;', - 'uniform vec2 offset;', - 'uniform vec4 dimensions;', - 'uniform vec2 mapDimensions;',// = vec2(256.0, 256.0);', - // 'const vec2 textureDimensions = vec2(750.0, 750.0);', - - 'void main(void)', - '{', - ' vec2 mapCords = vTextureCoord.xy;', - ' mapCords += (dimensions.zw + offset)/ dimensions.xy ;', - ' mapCords.y *= -1.0;', - ' mapCords.y += 1.0;', - - ' vec2 matSample = texture2D(displacementMap, mapCords).xy;', - ' matSample -= 0.5;', - ' matSample *= scale;', - ' matSample /= mapDimensions;', - - ' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y));', - - //TODO: Is this needed? - ' gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb, 1.0);', - '}' - ]; -} - -DisplacementFilter.prototype = Object.create(AbstractFilter.prototype); -DisplacementFilter.prototype.constructor = DisplacementFilter; -module.exports = DisplacementFilter; - -/** - * Sets the map dimensions uniforms when the texture becomes available. - * - * @private - */ -DisplacementFilter.prototype.onTextureLoaded = function () -{ - this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; - this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; - - this.uniforms.displacementMap.value.baseTexture.off('loaded', this.boundLoadedFunction); -}; - -Object.defineProperties(DisplacementFilter.prototype, { - /** - * The texture used for the displacement map. Must be power of 2 texture. - * - * @member {Texture} - * @memberof DisplacementFilter# - */ - map: { - get: function () - { - return this.uniforms.displacementMap.value; - }, - set: function (value) - { - this.uniforms.displacementMap.value = value; - } - }, - - /** - * The multiplier used to scale the displacement result from the map calculation. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The offset used to move the displacement map. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - offset: { - get: function () - { - return this.uniforms.offset.value; - }, - set: function (value) - { - this.uniforms.offset.value = value; - } - } -}); diff --git a/src/filters/SmartBlurFilter.js b/src/filters/SmartBlurFilter.js deleted file mode 100644 index 7fe5216..0000000 --- a/src/filters/SmartBlurFilter.js +++ /dev/null @@ -1,53 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * A Smart Blur Filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function SmartBlurFilter() -{ - AbstractFilter.call(this); - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - - 'uniform sampler2D uSampler;', - 'const vec2 delta = vec2(1.0/10.0, 0.0);', - - 'float random(vec3 scale, float seed)', - '{', - ' return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);', - '}', - - - 'void main(void)', - '{', - ' vec4 color = vec4(0.0);', - ' float total = 0.0;', - - ' float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);', - - ' for (float t = -30.0; t <= 30.0; t++)', - ' {', - ' float percent = (t + offset - 0.5) / 30.0;', - ' float weight = 1.0 - abs(percent);', - ' vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent);', - ' sample.rgb *= sample.a;', - ' color += sample * weight;', - ' total += weight;', - ' }', - - ' gl_FragColor = color / total;', - ' gl_FragColor.rgb /= gl_FragColor.a + 0.00001;', - '}' - ]; -} - -SmartBlurFilter.prototype = Object.create(AbstractFilter.prototype); -SmartBlurFilter.prototype.constructor = SmartBlurFilter; -module.exports = SmartBlurFilter; diff --git a/src/filters/blur/SmartBlurFilter.js b/src/filters/blur/SmartBlurFilter.js new file mode 100644 index 0000000..7948ac1 --- /dev/null +++ b/src/filters/blur/SmartBlurFilter.js @@ -0,0 +1,22 @@ +var core = require('../../core'); + +/** + * A Smart Blur Filter. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function SmartBlurFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/smartBlur.frag', 'utf8') + ); +} + +SmartBlurFilter.prototype = Object.create(core.AbstractFilter.prototype); +SmartBlurFilter.prototype.constructor = SmartBlurFilter; +module.exports = SmartBlurFilter; diff --git a/src/filters/blur/smartBlur.frag b/src/filters/blur/smartBlur.frag new file mode 100644 index 0000000..625039e --- /dev/null +++ b/src/filters/blur/smartBlur.frag @@ -0,0 +1,32 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +const vec2 delta = vec2(1.0/10.0, 0.0); + +float random(vec3 scale, float seed) +{ + return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed); +} + +void main(void) +{ + vec4 color = vec4(0.0); + float total = 0.0; + + float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0); + + for (float t = -30.0; t <= 30.0; t++) + { + float percent = (t + offset - 0.5) / 30.0; + float weight = 1.0 - abs(percent); + vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent); + sample.rgb *= sample.a; + color += sample * weight; + total += weight; + } + + gl_FragColor = color / total; + gl_FragColor.rgb /= gl_FragColor.a + 0.00001; +} diff --git a/src/filters/DisplacementFilter.js b/src/filters/DisplacementFilter.js deleted file mode 100644 index cb6b788..0000000 --- a/src/filters/DisplacementFilter.js +++ /dev/null @@ -1,141 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. - * You can use this filter to apply all manor of crazy warping effects - * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - * @param texture {Texture} The texture used for the displacement map * must be power of 2 texture at the moment - */ -function DisplacementFilter(texture) -{ - AbstractFilter.call(this); - - texture.baseTexture._powerOf2 = true; - - // set the uniforms - this.uniforms = { - displacementMap: { type: 'sampler2D', value: texture }, - scale: { type: '2f', value: { x: 30, y: 30 } }, - offset: { type: '2f', value: { x: 0, y: 0 } }, - mapDimensions: { type: '2f', value: { x: 1, y: 5112 } }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - if (texture.baseTexture.hasLoaded) - { - this.onTextureLoaded(); - } - else - { - this.boundLoadedFunction = this.onTextureLoaded.bind(this); - - texture.baseTexture.on('loaded', this.boundLoadedFunction); - } - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform sampler2D displacementMap;', - 'uniform sampler2D uSampler;', - 'uniform vec2 scale;', - 'uniform vec2 offset;', - 'uniform vec4 dimensions;', - 'uniform vec2 mapDimensions;',// = vec2(256.0, 256.0);', - // 'const vec2 textureDimensions = vec2(750.0, 750.0);', - - 'void main(void)', - '{', - ' vec2 mapCords = vTextureCoord.xy;', - ' mapCords += (dimensions.zw + offset)/ dimensions.xy ;', - ' mapCords.y *= -1.0;', - ' mapCords.y += 1.0;', - - ' vec2 matSample = texture2D(displacementMap, mapCords).xy;', - ' matSample -= 0.5;', - ' matSample *= scale;', - ' matSample /= mapDimensions;', - - ' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y));', - - //TODO: Is this needed? - ' gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb, 1.0);', - '}' - ]; -} - -DisplacementFilter.prototype = Object.create(AbstractFilter.prototype); -DisplacementFilter.prototype.constructor = DisplacementFilter; -module.exports = DisplacementFilter; - -/** - * Sets the map dimensions uniforms when the texture becomes available. - * - * @private - */ -DisplacementFilter.prototype.onTextureLoaded = function () -{ - this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; - this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; - - this.uniforms.displacementMap.value.baseTexture.off('loaded', this.boundLoadedFunction); -}; - -Object.defineProperties(DisplacementFilter.prototype, { - /** - * The texture used for the displacement map. Must be power of 2 texture. - * - * @member {Texture} - * @memberof DisplacementFilter# - */ - map: { - get: function () - { - return this.uniforms.displacementMap.value; - }, - set: function (value) - { - this.uniforms.displacementMap.value = value; - } - }, - - /** - * The multiplier used to scale the displacement result from the map calculation. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The offset used to move the displacement map. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - offset: { - get: function () - { - return this.uniforms.offset.value; - }, - set: function (value) - { - this.uniforms.offset.value = value; - } - } -}); diff --git a/src/filters/SmartBlurFilter.js b/src/filters/SmartBlurFilter.js deleted file mode 100644 index 7fe5216..0000000 --- a/src/filters/SmartBlurFilter.js +++ /dev/null @@ -1,53 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * A Smart Blur Filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function SmartBlurFilter() -{ - AbstractFilter.call(this); - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - - 'uniform sampler2D uSampler;', - 'const vec2 delta = vec2(1.0/10.0, 0.0);', - - 'float random(vec3 scale, float seed)', - '{', - ' return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);', - '}', - - - 'void main(void)', - '{', - ' vec4 color = vec4(0.0);', - ' float total = 0.0;', - - ' float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);', - - ' for (float t = -30.0; t <= 30.0; t++)', - ' {', - ' float percent = (t + offset - 0.5) / 30.0;', - ' float weight = 1.0 - abs(percent);', - ' vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent);', - ' sample.rgb *= sample.a;', - ' color += sample * weight;', - ' total += weight;', - ' }', - - ' gl_FragColor = color / total;', - ' gl_FragColor.rgb /= gl_FragColor.a + 0.00001;', - '}' - ]; -} - -SmartBlurFilter.prototype = Object.create(AbstractFilter.prototype); -SmartBlurFilter.prototype.constructor = SmartBlurFilter; -module.exports = SmartBlurFilter; diff --git a/src/filters/blur/SmartBlurFilter.js b/src/filters/blur/SmartBlurFilter.js new file mode 100644 index 0000000..7948ac1 --- /dev/null +++ b/src/filters/blur/SmartBlurFilter.js @@ -0,0 +1,22 @@ +var core = require('../../core'); + +/** + * A Smart Blur Filter. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function SmartBlurFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/smartBlur.frag', 'utf8') + ); +} + +SmartBlurFilter.prototype = Object.create(core.AbstractFilter.prototype); +SmartBlurFilter.prototype.constructor = SmartBlurFilter; +module.exports = SmartBlurFilter; diff --git a/src/filters/blur/smartBlur.frag b/src/filters/blur/smartBlur.frag new file mode 100644 index 0000000..625039e --- /dev/null +++ b/src/filters/blur/smartBlur.frag @@ -0,0 +1,32 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +const vec2 delta = vec2(1.0/10.0, 0.0); + +float random(vec3 scale, float seed) +{ + return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed); +} + +void main(void) +{ + vec4 color = vec4(0.0); + float total = 0.0; + + float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0); + + for (float t = -30.0; t <= 30.0; t++) + { + float percent = (t + offset - 0.5) / 30.0; + float weight = 1.0 - abs(percent); + vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent); + sample.rgb *= sample.a; + color += sample * weight; + total += weight; + } + + gl_FragColor = color / total; + gl_FragColor.rgb /= gl_FragColor.a + 0.00001; +} diff --git a/src/filters/color/ColorStepFilter.js b/src/filters/color/ColorStepFilter.js index b505ef3..8faf794 100644 --- a/src/filters/color/ColorStepFilter.js +++ b/src/filters/color/ColorStepFilter.js @@ -5,7 +5,7 @@ * * @class * @extends AbstractFilter - * @namespace PIXI + * @namespace PIXI.filters */ function ColorStepFilter() { diff --git a/src/filters/DisplacementFilter.js b/src/filters/DisplacementFilter.js deleted file mode 100644 index cb6b788..0000000 --- a/src/filters/DisplacementFilter.js +++ /dev/null @@ -1,141 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. - * You can use this filter to apply all manor of crazy warping effects - * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - * @param texture {Texture} The texture used for the displacement map * must be power of 2 texture at the moment - */ -function DisplacementFilter(texture) -{ - AbstractFilter.call(this); - - texture.baseTexture._powerOf2 = true; - - // set the uniforms - this.uniforms = { - displacementMap: { type: 'sampler2D', value: texture }, - scale: { type: '2f', value: { x: 30, y: 30 } }, - offset: { type: '2f', value: { x: 0, y: 0 } }, - mapDimensions: { type: '2f', value: { x: 1, y: 5112 } }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - if (texture.baseTexture.hasLoaded) - { - this.onTextureLoaded(); - } - else - { - this.boundLoadedFunction = this.onTextureLoaded.bind(this); - - texture.baseTexture.on('loaded', this.boundLoadedFunction); - } - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform sampler2D displacementMap;', - 'uniform sampler2D uSampler;', - 'uniform vec2 scale;', - 'uniform vec2 offset;', - 'uniform vec4 dimensions;', - 'uniform vec2 mapDimensions;',// = vec2(256.0, 256.0);', - // 'const vec2 textureDimensions = vec2(750.0, 750.0);', - - 'void main(void)', - '{', - ' vec2 mapCords = vTextureCoord.xy;', - ' mapCords += (dimensions.zw + offset)/ dimensions.xy ;', - ' mapCords.y *= -1.0;', - ' mapCords.y += 1.0;', - - ' vec2 matSample = texture2D(displacementMap, mapCords).xy;', - ' matSample -= 0.5;', - ' matSample *= scale;', - ' matSample /= mapDimensions;', - - ' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y));', - - //TODO: Is this needed? - ' gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb, 1.0);', - '}' - ]; -} - -DisplacementFilter.prototype = Object.create(AbstractFilter.prototype); -DisplacementFilter.prototype.constructor = DisplacementFilter; -module.exports = DisplacementFilter; - -/** - * Sets the map dimensions uniforms when the texture becomes available. - * - * @private - */ -DisplacementFilter.prototype.onTextureLoaded = function () -{ - this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; - this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; - - this.uniforms.displacementMap.value.baseTexture.off('loaded', this.boundLoadedFunction); -}; - -Object.defineProperties(DisplacementFilter.prototype, { - /** - * The texture used for the displacement map. Must be power of 2 texture. - * - * @member {Texture} - * @memberof DisplacementFilter# - */ - map: { - get: function () - { - return this.uniforms.displacementMap.value; - }, - set: function (value) - { - this.uniforms.displacementMap.value = value; - } - }, - - /** - * The multiplier used to scale the displacement result from the map calculation. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The offset used to move the displacement map. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - offset: { - get: function () - { - return this.uniforms.offset.value; - }, - set: function (value) - { - this.uniforms.offset.value = value; - } - } -}); diff --git a/src/filters/SmartBlurFilter.js b/src/filters/SmartBlurFilter.js deleted file mode 100644 index 7fe5216..0000000 --- a/src/filters/SmartBlurFilter.js +++ /dev/null @@ -1,53 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * A Smart Blur Filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function SmartBlurFilter() -{ - AbstractFilter.call(this); - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - - 'uniform sampler2D uSampler;', - 'const vec2 delta = vec2(1.0/10.0, 0.0);', - - 'float random(vec3 scale, float seed)', - '{', - ' return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);', - '}', - - - 'void main(void)', - '{', - ' vec4 color = vec4(0.0);', - ' float total = 0.0;', - - ' float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);', - - ' for (float t = -30.0; t <= 30.0; t++)', - ' {', - ' float percent = (t + offset - 0.5) / 30.0;', - ' float weight = 1.0 - abs(percent);', - ' vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent);', - ' sample.rgb *= sample.a;', - ' color += sample * weight;', - ' total += weight;', - ' }', - - ' gl_FragColor = color / total;', - ' gl_FragColor.rgb /= gl_FragColor.a + 0.00001;', - '}' - ]; -} - -SmartBlurFilter.prototype = Object.create(AbstractFilter.prototype); -SmartBlurFilter.prototype.constructor = SmartBlurFilter; -module.exports = SmartBlurFilter; diff --git a/src/filters/blur/SmartBlurFilter.js b/src/filters/blur/SmartBlurFilter.js new file mode 100644 index 0000000..7948ac1 --- /dev/null +++ b/src/filters/blur/SmartBlurFilter.js @@ -0,0 +1,22 @@ +var core = require('../../core'); + +/** + * A Smart Blur Filter. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function SmartBlurFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/smartBlur.frag', 'utf8') + ); +} + +SmartBlurFilter.prototype = Object.create(core.AbstractFilter.prototype); +SmartBlurFilter.prototype.constructor = SmartBlurFilter; +module.exports = SmartBlurFilter; diff --git a/src/filters/blur/smartBlur.frag b/src/filters/blur/smartBlur.frag new file mode 100644 index 0000000..625039e --- /dev/null +++ b/src/filters/blur/smartBlur.frag @@ -0,0 +1,32 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +const vec2 delta = vec2(1.0/10.0, 0.0); + +float random(vec3 scale, float seed) +{ + return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed); +} + +void main(void) +{ + vec4 color = vec4(0.0); + float total = 0.0; + + float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0); + + for (float t = -30.0; t <= 30.0; t++) + { + float percent = (t + offset - 0.5) / 30.0; + float weight = 1.0 - abs(percent); + vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent); + sample.rgb *= sample.a; + color += sample * weight; + total += weight; + } + + gl_FragColor = color / total; + gl_FragColor.rgb /= gl_FragColor.a + 0.00001; +} diff --git a/src/filters/color/ColorStepFilter.js b/src/filters/color/ColorStepFilter.js index b505ef3..8faf794 100644 --- a/src/filters/color/ColorStepFilter.js +++ b/src/filters/color/ColorStepFilter.js @@ -5,7 +5,7 @@ * * @class * @extends AbstractFilter - * @namespace PIXI + * @namespace PIXI.filters */ function ColorStepFilter() { diff --git a/src/filters/displacement/DisplacementFilter.js b/src/filters/displacement/DisplacementFilter.js new file mode 100644 index 0000000..f6ccd3a --- /dev/null +++ b/src/filters/displacement/DisplacementFilter.js @@ -0,0 +1,108 @@ +var core = require('../../core'); + +/** + * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. + * You can use this filter to apply all manor of crazy warping effects + * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + * @param texture {Texture} The texture used for the displacement map, must be power of 2 texture at the moment + */ +function DisplacementFilter(texture) +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/displacement.frag', 'utf8'), + // custom uniforms + { + displacementMap: { type: 'sampler2D', value: texture }, + scale: { type: 'v2', value: { x: 30, y: 30 } }, + offset: { type: 'v2', value: { x: 0, y: 0 } }, + mapDimensions: { type: 'v2', value: { x: 1, y: 5112 } }, + dimensions: { type: '4fv', value: [0, 0, 0, 0] } + } + ); + + texture.baseTexture._powerOf2 = true; + + if (texture.baseTexture.hasLoaded) + { + this.onTextureLoaded(); + } + else + { + texture.baseTexture.once('loaded', this.onTextureLoaded.bind(this)); + } +} + +DisplacementFilter.prototype = Object.create(core.AbstractFilter.prototype); +DisplacementFilter.prototype.constructor = DisplacementFilter; +module.exports = DisplacementFilter; + +/** + * Sets the map dimensions uniforms when the texture becomes available. + * + * @private + */ +DisplacementFilter.prototype.onTextureLoaded = function () +{ + this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; + this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; +}; + +Object.defineProperties(DisplacementFilter.prototype, { + /** + * The texture used for the displacement map. Must be power of 2 texture. + * + * @member {Texture} + * @memberof DisplacementFilter# + */ + map: { + get: function () + { + return this.uniforms.displacementMap.value; + }, + set: function (value) + { + this.uniforms.displacementMap.value = value; + } + }, + + /** + * The multiplier used to scale the displacement result from the map calculation. + * + * @member {Point} + * @memberof DisplacementFilter# + */ + scale: { + get: function () + { + return this.uniforms.scale.value; + }, + set: function (value) + { + this.uniforms.scale.value = value; + } + }, + + /** + * The offset used to move the displacement map. + * + * @member {Point} + * @memberof DisplacementFilter# + */ + offset: { + get: function () + { + return this.uniforms.offset.value; + }, + set: function (value) + { + this.uniforms.offset.value = value; + } + } +}); diff --git a/src/filters/DisplacementFilter.js b/src/filters/DisplacementFilter.js deleted file mode 100644 index cb6b788..0000000 --- a/src/filters/DisplacementFilter.js +++ /dev/null @@ -1,141 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. - * You can use this filter to apply all manor of crazy warping effects - * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - * @param texture {Texture} The texture used for the displacement map * must be power of 2 texture at the moment - */ -function DisplacementFilter(texture) -{ - AbstractFilter.call(this); - - texture.baseTexture._powerOf2 = true; - - // set the uniforms - this.uniforms = { - displacementMap: { type: 'sampler2D', value: texture }, - scale: { type: '2f', value: { x: 30, y: 30 } }, - offset: { type: '2f', value: { x: 0, y: 0 } }, - mapDimensions: { type: '2f', value: { x: 1, y: 5112 } }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - if (texture.baseTexture.hasLoaded) - { - this.onTextureLoaded(); - } - else - { - this.boundLoadedFunction = this.onTextureLoaded.bind(this); - - texture.baseTexture.on('loaded', this.boundLoadedFunction); - } - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform sampler2D displacementMap;', - 'uniform sampler2D uSampler;', - 'uniform vec2 scale;', - 'uniform vec2 offset;', - 'uniform vec4 dimensions;', - 'uniform vec2 mapDimensions;',// = vec2(256.0, 256.0);', - // 'const vec2 textureDimensions = vec2(750.0, 750.0);', - - 'void main(void)', - '{', - ' vec2 mapCords = vTextureCoord.xy;', - ' mapCords += (dimensions.zw + offset)/ dimensions.xy ;', - ' mapCords.y *= -1.0;', - ' mapCords.y += 1.0;', - - ' vec2 matSample = texture2D(displacementMap, mapCords).xy;', - ' matSample -= 0.5;', - ' matSample *= scale;', - ' matSample /= mapDimensions;', - - ' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y));', - - //TODO: Is this needed? - ' gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb, 1.0);', - '}' - ]; -} - -DisplacementFilter.prototype = Object.create(AbstractFilter.prototype); -DisplacementFilter.prototype.constructor = DisplacementFilter; -module.exports = DisplacementFilter; - -/** - * Sets the map dimensions uniforms when the texture becomes available. - * - * @private - */ -DisplacementFilter.prototype.onTextureLoaded = function () -{ - this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; - this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; - - this.uniforms.displacementMap.value.baseTexture.off('loaded', this.boundLoadedFunction); -}; - -Object.defineProperties(DisplacementFilter.prototype, { - /** - * The texture used for the displacement map. Must be power of 2 texture. - * - * @member {Texture} - * @memberof DisplacementFilter# - */ - map: { - get: function () - { - return this.uniforms.displacementMap.value; - }, - set: function (value) - { - this.uniforms.displacementMap.value = value; - } - }, - - /** - * The multiplier used to scale the displacement result from the map calculation. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The offset used to move the displacement map. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - offset: { - get: function () - { - return this.uniforms.offset.value; - }, - set: function (value) - { - this.uniforms.offset.value = value; - } - } -}); diff --git a/src/filters/SmartBlurFilter.js b/src/filters/SmartBlurFilter.js deleted file mode 100644 index 7fe5216..0000000 --- a/src/filters/SmartBlurFilter.js +++ /dev/null @@ -1,53 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * A Smart Blur Filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function SmartBlurFilter() -{ - AbstractFilter.call(this); - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - - 'uniform sampler2D uSampler;', - 'const vec2 delta = vec2(1.0/10.0, 0.0);', - - 'float random(vec3 scale, float seed)', - '{', - ' return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);', - '}', - - - 'void main(void)', - '{', - ' vec4 color = vec4(0.0);', - ' float total = 0.0;', - - ' float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);', - - ' for (float t = -30.0; t <= 30.0; t++)', - ' {', - ' float percent = (t + offset - 0.5) / 30.0;', - ' float weight = 1.0 - abs(percent);', - ' vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent);', - ' sample.rgb *= sample.a;', - ' color += sample * weight;', - ' total += weight;', - ' }', - - ' gl_FragColor = color / total;', - ' gl_FragColor.rgb /= gl_FragColor.a + 0.00001;', - '}' - ]; -} - -SmartBlurFilter.prototype = Object.create(AbstractFilter.prototype); -SmartBlurFilter.prototype.constructor = SmartBlurFilter; -module.exports = SmartBlurFilter; diff --git a/src/filters/blur/SmartBlurFilter.js b/src/filters/blur/SmartBlurFilter.js new file mode 100644 index 0000000..7948ac1 --- /dev/null +++ b/src/filters/blur/SmartBlurFilter.js @@ -0,0 +1,22 @@ +var core = require('../../core'); + +/** + * A Smart Blur Filter. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function SmartBlurFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/smartBlur.frag', 'utf8') + ); +} + +SmartBlurFilter.prototype = Object.create(core.AbstractFilter.prototype); +SmartBlurFilter.prototype.constructor = SmartBlurFilter; +module.exports = SmartBlurFilter; diff --git a/src/filters/blur/smartBlur.frag b/src/filters/blur/smartBlur.frag new file mode 100644 index 0000000..625039e --- /dev/null +++ b/src/filters/blur/smartBlur.frag @@ -0,0 +1,32 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +const vec2 delta = vec2(1.0/10.0, 0.0); + +float random(vec3 scale, float seed) +{ + return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed); +} + +void main(void) +{ + vec4 color = vec4(0.0); + float total = 0.0; + + float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0); + + for (float t = -30.0; t <= 30.0; t++) + { + float percent = (t + offset - 0.5) / 30.0; + float weight = 1.0 - abs(percent); + vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent); + sample.rgb *= sample.a; + color += sample * weight; + total += weight; + } + + gl_FragColor = color / total; + gl_FragColor.rgb /= gl_FragColor.a + 0.00001; +} diff --git a/src/filters/color/ColorStepFilter.js b/src/filters/color/ColorStepFilter.js index b505ef3..8faf794 100644 --- a/src/filters/color/ColorStepFilter.js +++ b/src/filters/color/ColorStepFilter.js @@ -5,7 +5,7 @@ * * @class * @extends AbstractFilter - * @namespace PIXI + * @namespace PIXI.filters */ function ColorStepFilter() { diff --git a/src/filters/displacement/DisplacementFilter.js b/src/filters/displacement/DisplacementFilter.js new file mode 100644 index 0000000..f6ccd3a --- /dev/null +++ b/src/filters/displacement/DisplacementFilter.js @@ -0,0 +1,108 @@ +var core = require('../../core'); + +/** + * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. + * You can use this filter to apply all manor of crazy warping effects + * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + * @param texture {Texture} The texture used for the displacement map, must be power of 2 texture at the moment + */ +function DisplacementFilter(texture) +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/displacement.frag', 'utf8'), + // custom uniforms + { + displacementMap: { type: 'sampler2D', value: texture }, + scale: { type: 'v2', value: { x: 30, y: 30 } }, + offset: { type: 'v2', value: { x: 0, y: 0 } }, + mapDimensions: { type: 'v2', value: { x: 1, y: 5112 } }, + dimensions: { type: '4fv', value: [0, 0, 0, 0] } + } + ); + + texture.baseTexture._powerOf2 = true; + + if (texture.baseTexture.hasLoaded) + { + this.onTextureLoaded(); + } + else + { + texture.baseTexture.once('loaded', this.onTextureLoaded.bind(this)); + } +} + +DisplacementFilter.prototype = Object.create(core.AbstractFilter.prototype); +DisplacementFilter.prototype.constructor = DisplacementFilter; +module.exports = DisplacementFilter; + +/** + * Sets the map dimensions uniforms when the texture becomes available. + * + * @private + */ +DisplacementFilter.prototype.onTextureLoaded = function () +{ + this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; + this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; +}; + +Object.defineProperties(DisplacementFilter.prototype, { + /** + * The texture used for the displacement map. Must be power of 2 texture. + * + * @member {Texture} + * @memberof DisplacementFilter# + */ + map: { + get: function () + { + return this.uniforms.displacementMap.value; + }, + set: function (value) + { + this.uniforms.displacementMap.value = value; + } + }, + + /** + * The multiplier used to scale the displacement result from the map calculation. + * + * @member {Point} + * @memberof DisplacementFilter# + */ + scale: { + get: function () + { + return this.uniforms.scale.value; + }, + set: function (value) + { + this.uniforms.scale.value = value; + } + }, + + /** + * The offset used to move the displacement map. + * + * @member {Point} + * @memberof DisplacementFilter# + */ + offset: { + get: function () + { + return this.uniforms.offset.value; + }, + set: function (value) + { + this.uniforms.offset.value = value; + } + } +}); diff --git a/src/filters/displacement/displacement.frag b/src/filters/displacement/displacement.frag new file mode 100644 index 0000000..d877a3a --- /dev/null +++ b/src/filters/displacement/displacement.frag @@ -0,0 +1,30 @@ +precision mediump float; + +varying vec2 vTextureCoord; +varying vec4 vColor; + +uniform sampler2D displacementMap; +uniform sampler2D uSampler; +uniform vec2 scale; +uniform vec2 offset; +uniform vec4 dimensions; +uniform vec2 mapDimensions; // = vec2(256.0, 256.0); +// const vec2 textureDimensions = vec2(750.0, 750.0); + +void main(void) +{ + vec2 mapCords = vTextureCoord; + mapCords += (dimensions.zw + offset)/ dimensions.xy ; + mapCords.y *= -1.0; + mapCords.y += 1.0; + + vec2 matSample = texture2D(displacementMap, mapCords).xy; + matSample -= 0.5; + matSample *= scale; + matSample /= mapDimensions; + + gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y)); + + // TODO: Is this needed? + // gl_FragColor.rgb = mix(gl_FragColor.rgb, gl_FragColor.rgb, 1.0); +} diff --git a/src/filters/DisplacementFilter.js b/src/filters/DisplacementFilter.js deleted file mode 100644 index cb6b788..0000000 --- a/src/filters/DisplacementFilter.js +++ /dev/null @@ -1,141 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. - * You can use this filter to apply all manor of crazy warping effects - * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - * @param texture {Texture} The texture used for the displacement map * must be power of 2 texture at the moment - */ -function DisplacementFilter(texture) -{ - AbstractFilter.call(this); - - texture.baseTexture._powerOf2 = true; - - // set the uniforms - this.uniforms = { - displacementMap: { type: 'sampler2D', value: texture }, - scale: { type: '2f', value: { x: 30, y: 30 } }, - offset: { type: '2f', value: { x: 0, y: 0 } }, - mapDimensions: { type: '2f', value: { x: 1, y: 5112 } }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - if (texture.baseTexture.hasLoaded) - { - this.onTextureLoaded(); - } - else - { - this.boundLoadedFunction = this.onTextureLoaded.bind(this); - - texture.baseTexture.on('loaded', this.boundLoadedFunction); - } - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform sampler2D displacementMap;', - 'uniform sampler2D uSampler;', - 'uniform vec2 scale;', - 'uniform vec2 offset;', - 'uniform vec4 dimensions;', - 'uniform vec2 mapDimensions;',// = vec2(256.0, 256.0);', - // 'const vec2 textureDimensions = vec2(750.0, 750.0);', - - 'void main(void)', - '{', - ' vec2 mapCords = vTextureCoord.xy;', - ' mapCords += (dimensions.zw + offset)/ dimensions.xy ;', - ' mapCords.y *= -1.0;', - ' mapCords.y += 1.0;', - - ' vec2 matSample = texture2D(displacementMap, mapCords).xy;', - ' matSample -= 0.5;', - ' matSample *= scale;', - ' matSample /= mapDimensions;', - - ' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y));', - - //TODO: Is this needed? - ' gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb, 1.0);', - '}' - ]; -} - -DisplacementFilter.prototype = Object.create(AbstractFilter.prototype); -DisplacementFilter.prototype.constructor = DisplacementFilter; -module.exports = DisplacementFilter; - -/** - * Sets the map dimensions uniforms when the texture becomes available. - * - * @private - */ -DisplacementFilter.prototype.onTextureLoaded = function () -{ - this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; - this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; - - this.uniforms.displacementMap.value.baseTexture.off('loaded', this.boundLoadedFunction); -}; - -Object.defineProperties(DisplacementFilter.prototype, { - /** - * The texture used for the displacement map. Must be power of 2 texture. - * - * @member {Texture} - * @memberof DisplacementFilter# - */ - map: { - get: function () - { - return this.uniforms.displacementMap.value; - }, - set: function (value) - { - this.uniforms.displacementMap.value = value; - } - }, - - /** - * The multiplier used to scale the displacement result from the map calculation. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The offset used to move the displacement map. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - offset: { - get: function () - { - return this.uniforms.offset.value; - }, - set: function (value) - { - this.uniforms.offset.value = value; - } - } -}); diff --git a/src/filters/SmartBlurFilter.js b/src/filters/SmartBlurFilter.js deleted file mode 100644 index 7fe5216..0000000 --- a/src/filters/SmartBlurFilter.js +++ /dev/null @@ -1,53 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * A Smart Blur Filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function SmartBlurFilter() -{ - AbstractFilter.call(this); - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - - 'uniform sampler2D uSampler;', - 'const vec2 delta = vec2(1.0/10.0, 0.0);', - - 'float random(vec3 scale, float seed)', - '{', - ' return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);', - '}', - - - 'void main(void)', - '{', - ' vec4 color = vec4(0.0);', - ' float total = 0.0;', - - ' float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);', - - ' for (float t = -30.0; t <= 30.0; t++)', - ' {', - ' float percent = (t + offset - 0.5) / 30.0;', - ' float weight = 1.0 - abs(percent);', - ' vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent);', - ' sample.rgb *= sample.a;', - ' color += sample * weight;', - ' total += weight;', - ' }', - - ' gl_FragColor = color / total;', - ' gl_FragColor.rgb /= gl_FragColor.a + 0.00001;', - '}' - ]; -} - -SmartBlurFilter.prototype = Object.create(AbstractFilter.prototype); -SmartBlurFilter.prototype.constructor = SmartBlurFilter; -module.exports = SmartBlurFilter; diff --git a/src/filters/blur/SmartBlurFilter.js b/src/filters/blur/SmartBlurFilter.js new file mode 100644 index 0000000..7948ac1 --- /dev/null +++ b/src/filters/blur/SmartBlurFilter.js @@ -0,0 +1,22 @@ +var core = require('../../core'); + +/** + * A Smart Blur Filter. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function SmartBlurFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/smartBlur.frag', 'utf8') + ); +} + +SmartBlurFilter.prototype = Object.create(core.AbstractFilter.prototype); +SmartBlurFilter.prototype.constructor = SmartBlurFilter; +module.exports = SmartBlurFilter; diff --git a/src/filters/blur/smartBlur.frag b/src/filters/blur/smartBlur.frag new file mode 100644 index 0000000..625039e --- /dev/null +++ b/src/filters/blur/smartBlur.frag @@ -0,0 +1,32 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +const vec2 delta = vec2(1.0/10.0, 0.0); + +float random(vec3 scale, float seed) +{ + return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed); +} + +void main(void) +{ + vec4 color = vec4(0.0); + float total = 0.0; + + float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0); + + for (float t = -30.0; t <= 30.0; t++) + { + float percent = (t + offset - 0.5) / 30.0; + float weight = 1.0 - abs(percent); + vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent); + sample.rgb *= sample.a; + color += sample * weight; + total += weight; + } + + gl_FragColor = color / total; + gl_FragColor.rgb /= gl_FragColor.a + 0.00001; +} diff --git a/src/filters/color/ColorStepFilter.js b/src/filters/color/ColorStepFilter.js index b505ef3..8faf794 100644 --- a/src/filters/color/ColorStepFilter.js +++ b/src/filters/color/ColorStepFilter.js @@ -5,7 +5,7 @@ * * @class * @extends AbstractFilter - * @namespace PIXI + * @namespace PIXI.filters */ function ColorStepFilter() { diff --git a/src/filters/displacement/DisplacementFilter.js b/src/filters/displacement/DisplacementFilter.js new file mode 100644 index 0000000..f6ccd3a --- /dev/null +++ b/src/filters/displacement/DisplacementFilter.js @@ -0,0 +1,108 @@ +var core = require('../../core'); + +/** + * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. + * You can use this filter to apply all manor of crazy warping effects + * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + * @param texture {Texture} The texture used for the displacement map, must be power of 2 texture at the moment + */ +function DisplacementFilter(texture) +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/displacement.frag', 'utf8'), + // custom uniforms + { + displacementMap: { type: 'sampler2D', value: texture }, + scale: { type: 'v2', value: { x: 30, y: 30 } }, + offset: { type: 'v2', value: { x: 0, y: 0 } }, + mapDimensions: { type: 'v2', value: { x: 1, y: 5112 } }, + dimensions: { type: '4fv', value: [0, 0, 0, 0] } + } + ); + + texture.baseTexture._powerOf2 = true; + + if (texture.baseTexture.hasLoaded) + { + this.onTextureLoaded(); + } + else + { + texture.baseTexture.once('loaded', this.onTextureLoaded.bind(this)); + } +} + +DisplacementFilter.prototype = Object.create(core.AbstractFilter.prototype); +DisplacementFilter.prototype.constructor = DisplacementFilter; +module.exports = DisplacementFilter; + +/** + * Sets the map dimensions uniforms when the texture becomes available. + * + * @private + */ +DisplacementFilter.prototype.onTextureLoaded = function () +{ + this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; + this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; +}; + +Object.defineProperties(DisplacementFilter.prototype, { + /** + * The texture used for the displacement map. Must be power of 2 texture. + * + * @member {Texture} + * @memberof DisplacementFilter# + */ + map: { + get: function () + { + return this.uniforms.displacementMap.value; + }, + set: function (value) + { + this.uniforms.displacementMap.value = value; + } + }, + + /** + * The multiplier used to scale the displacement result from the map calculation. + * + * @member {Point} + * @memberof DisplacementFilter# + */ + scale: { + get: function () + { + return this.uniforms.scale.value; + }, + set: function (value) + { + this.uniforms.scale.value = value; + } + }, + + /** + * The offset used to move the displacement map. + * + * @member {Point} + * @memberof DisplacementFilter# + */ + offset: { + get: function () + { + return this.uniforms.offset.value; + }, + set: function (value) + { + this.uniforms.offset.value = value; + } + } +}); diff --git a/src/filters/displacement/displacement.frag b/src/filters/displacement/displacement.frag new file mode 100644 index 0000000..d877a3a --- /dev/null +++ b/src/filters/displacement/displacement.frag @@ -0,0 +1,30 @@ +precision mediump float; + +varying vec2 vTextureCoord; +varying vec4 vColor; + +uniform sampler2D displacementMap; +uniform sampler2D uSampler; +uniform vec2 scale; +uniform vec2 offset; +uniform vec4 dimensions; +uniform vec2 mapDimensions; // = vec2(256.0, 256.0); +// const vec2 textureDimensions = vec2(750.0, 750.0); + +void main(void) +{ + vec2 mapCords = vTextureCoord; + mapCords += (dimensions.zw + offset)/ dimensions.xy ; + mapCords.y *= -1.0; + mapCords.y += 1.0; + + vec2 matSample = texture2D(displacementMap, mapCords).xy; + matSample -= 0.5; + matSample *= scale; + matSample /= mapDimensions; + + gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y)); + + // TODO: Is this needed? + // gl_FragColor.rgb = mix(gl_FragColor.rgb, gl_FragColor.rgb, 1.0); +} diff --git a/src/filters/index.js b/src/filters/index.js index 0c26742..a207db7 100644 --- a/src/filters/index.js +++ b/src/filters/index.js @@ -18,7 +18,7 @@ ColorStepFilter: require('./color/ColorStepFilter'), // ConvolutionFilter: require('./ConvolutionFilter'), // CrossHatchFilter: require('./CrossHatchFilter'), - // DisplacementFilter: require('./DisplacementFilter'), + DisplacementFilter: require('./displacement/DisplacementFilter'), DotScreenFilter: require('./dot/DotScreenFilter'), GrayFilter: require('./gray/GrayFilter'), InvertFilter: require('./invert/InvertFilter'), @@ -28,7 +28,7 @@ // RGBSplitFilter: require('./RGBSplitFilter'), ShockwaveFilter: require('./shockwave/ShockwaveFilter'), // SepiaFilter: require('./SepiaFilter'), - // SmartBlurFilter: require('./SmartBlurFilter'), + SmartBlurFilter: require('./blur/SmartBlurFilter'), // TiltShiftFilter: require('./TiltShiftFilter'), // TiltShiftXFilter: require('./TiltShiftXFilter'), // TiltShiftYFilter: require('./TiltShiftYFilter'), diff --git a/src/filters/DisplacementFilter.js b/src/filters/DisplacementFilter.js deleted file mode 100644 index cb6b788..0000000 --- a/src/filters/DisplacementFilter.js +++ /dev/null @@ -1,141 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. - * You can use this filter to apply all manor of crazy warping effects - * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - * @param texture {Texture} The texture used for the displacement map * must be power of 2 texture at the moment - */ -function DisplacementFilter(texture) -{ - AbstractFilter.call(this); - - texture.baseTexture._powerOf2 = true; - - // set the uniforms - this.uniforms = { - displacementMap: { type: 'sampler2D', value: texture }, - scale: { type: '2f', value: { x: 30, y: 30 } }, - offset: { type: '2f', value: { x: 0, y: 0 } }, - mapDimensions: { type: '2f', value: { x: 1, y: 5112 } }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - if (texture.baseTexture.hasLoaded) - { - this.onTextureLoaded(); - } - else - { - this.boundLoadedFunction = this.onTextureLoaded.bind(this); - - texture.baseTexture.on('loaded', this.boundLoadedFunction); - } - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform sampler2D displacementMap;', - 'uniform sampler2D uSampler;', - 'uniform vec2 scale;', - 'uniform vec2 offset;', - 'uniform vec4 dimensions;', - 'uniform vec2 mapDimensions;',// = vec2(256.0, 256.0);', - // 'const vec2 textureDimensions = vec2(750.0, 750.0);', - - 'void main(void)', - '{', - ' vec2 mapCords = vTextureCoord.xy;', - ' mapCords += (dimensions.zw + offset)/ dimensions.xy ;', - ' mapCords.y *= -1.0;', - ' mapCords.y += 1.0;', - - ' vec2 matSample = texture2D(displacementMap, mapCords).xy;', - ' matSample -= 0.5;', - ' matSample *= scale;', - ' matSample /= mapDimensions;', - - ' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y));', - - //TODO: Is this needed? - ' gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb, 1.0);', - '}' - ]; -} - -DisplacementFilter.prototype = Object.create(AbstractFilter.prototype); -DisplacementFilter.prototype.constructor = DisplacementFilter; -module.exports = DisplacementFilter; - -/** - * Sets the map dimensions uniforms when the texture becomes available. - * - * @private - */ -DisplacementFilter.prototype.onTextureLoaded = function () -{ - this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; - this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; - - this.uniforms.displacementMap.value.baseTexture.off('loaded', this.boundLoadedFunction); -}; - -Object.defineProperties(DisplacementFilter.prototype, { - /** - * The texture used for the displacement map. Must be power of 2 texture. - * - * @member {Texture} - * @memberof DisplacementFilter# - */ - map: { - get: function () - { - return this.uniforms.displacementMap.value; - }, - set: function (value) - { - this.uniforms.displacementMap.value = value; - } - }, - - /** - * The multiplier used to scale the displacement result from the map calculation. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The offset used to move the displacement map. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - offset: { - get: function () - { - return this.uniforms.offset.value; - }, - set: function (value) - { - this.uniforms.offset.value = value; - } - } -}); diff --git a/src/filters/SmartBlurFilter.js b/src/filters/SmartBlurFilter.js deleted file mode 100644 index 7fe5216..0000000 --- a/src/filters/SmartBlurFilter.js +++ /dev/null @@ -1,53 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * A Smart Blur Filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function SmartBlurFilter() -{ - AbstractFilter.call(this); - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - - 'uniform sampler2D uSampler;', - 'const vec2 delta = vec2(1.0/10.0, 0.0);', - - 'float random(vec3 scale, float seed)', - '{', - ' return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);', - '}', - - - 'void main(void)', - '{', - ' vec4 color = vec4(0.0);', - ' float total = 0.0;', - - ' float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);', - - ' for (float t = -30.0; t <= 30.0; t++)', - ' {', - ' float percent = (t + offset - 0.5) / 30.0;', - ' float weight = 1.0 - abs(percent);', - ' vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent);', - ' sample.rgb *= sample.a;', - ' color += sample * weight;', - ' total += weight;', - ' }', - - ' gl_FragColor = color / total;', - ' gl_FragColor.rgb /= gl_FragColor.a + 0.00001;', - '}' - ]; -} - -SmartBlurFilter.prototype = Object.create(AbstractFilter.prototype); -SmartBlurFilter.prototype.constructor = SmartBlurFilter; -module.exports = SmartBlurFilter; diff --git a/src/filters/blur/SmartBlurFilter.js b/src/filters/blur/SmartBlurFilter.js new file mode 100644 index 0000000..7948ac1 --- /dev/null +++ b/src/filters/blur/SmartBlurFilter.js @@ -0,0 +1,22 @@ +var core = require('../../core'); + +/** + * A Smart Blur Filter. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function SmartBlurFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/smartBlur.frag', 'utf8') + ); +} + +SmartBlurFilter.prototype = Object.create(core.AbstractFilter.prototype); +SmartBlurFilter.prototype.constructor = SmartBlurFilter; +module.exports = SmartBlurFilter; diff --git a/src/filters/blur/smartBlur.frag b/src/filters/blur/smartBlur.frag new file mode 100644 index 0000000..625039e --- /dev/null +++ b/src/filters/blur/smartBlur.frag @@ -0,0 +1,32 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +const vec2 delta = vec2(1.0/10.0, 0.0); + +float random(vec3 scale, float seed) +{ + return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed); +} + +void main(void) +{ + vec4 color = vec4(0.0); + float total = 0.0; + + float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0); + + for (float t = -30.0; t <= 30.0; t++) + { + float percent = (t + offset - 0.5) / 30.0; + float weight = 1.0 - abs(percent); + vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent); + sample.rgb *= sample.a; + color += sample * weight; + total += weight; + } + + gl_FragColor = color / total; + gl_FragColor.rgb /= gl_FragColor.a + 0.00001; +} diff --git a/src/filters/color/ColorStepFilter.js b/src/filters/color/ColorStepFilter.js index b505ef3..8faf794 100644 --- a/src/filters/color/ColorStepFilter.js +++ b/src/filters/color/ColorStepFilter.js @@ -5,7 +5,7 @@ * * @class * @extends AbstractFilter - * @namespace PIXI + * @namespace PIXI.filters */ function ColorStepFilter() { diff --git a/src/filters/displacement/DisplacementFilter.js b/src/filters/displacement/DisplacementFilter.js new file mode 100644 index 0000000..f6ccd3a --- /dev/null +++ b/src/filters/displacement/DisplacementFilter.js @@ -0,0 +1,108 @@ +var core = require('../../core'); + +/** + * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. + * You can use this filter to apply all manor of crazy warping effects + * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + * @param texture {Texture} The texture used for the displacement map, must be power of 2 texture at the moment + */ +function DisplacementFilter(texture) +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/displacement.frag', 'utf8'), + // custom uniforms + { + displacementMap: { type: 'sampler2D', value: texture }, + scale: { type: 'v2', value: { x: 30, y: 30 } }, + offset: { type: 'v2', value: { x: 0, y: 0 } }, + mapDimensions: { type: 'v2', value: { x: 1, y: 5112 } }, + dimensions: { type: '4fv', value: [0, 0, 0, 0] } + } + ); + + texture.baseTexture._powerOf2 = true; + + if (texture.baseTexture.hasLoaded) + { + this.onTextureLoaded(); + } + else + { + texture.baseTexture.once('loaded', this.onTextureLoaded.bind(this)); + } +} + +DisplacementFilter.prototype = Object.create(core.AbstractFilter.prototype); +DisplacementFilter.prototype.constructor = DisplacementFilter; +module.exports = DisplacementFilter; + +/** + * Sets the map dimensions uniforms when the texture becomes available. + * + * @private + */ +DisplacementFilter.prototype.onTextureLoaded = function () +{ + this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; + this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; +}; + +Object.defineProperties(DisplacementFilter.prototype, { + /** + * The texture used for the displacement map. Must be power of 2 texture. + * + * @member {Texture} + * @memberof DisplacementFilter# + */ + map: { + get: function () + { + return this.uniforms.displacementMap.value; + }, + set: function (value) + { + this.uniforms.displacementMap.value = value; + } + }, + + /** + * The multiplier used to scale the displacement result from the map calculation. + * + * @member {Point} + * @memberof DisplacementFilter# + */ + scale: { + get: function () + { + return this.uniforms.scale.value; + }, + set: function (value) + { + this.uniforms.scale.value = value; + } + }, + + /** + * The offset used to move the displacement map. + * + * @member {Point} + * @memberof DisplacementFilter# + */ + offset: { + get: function () + { + return this.uniforms.offset.value; + }, + set: function (value) + { + this.uniforms.offset.value = value; + } + } +}); diff --git a/src/filters/displacement/displacement.frag b/src/filters/displacement/displacement.frag new file mode 100644 index 0000000..d877a3a --- /dev/null +++ b/src/filters/displacement/displacement.frag @@ -0,0 +1,30 @@ +precision mediump float; + +varying vec2 vTextureCoord; +varying vec4 vColor; + +uniform sampler2D displacementMap; +uniform sampler2D uSampler; +uniform vec2 scale; +uniform vec2 offset; +uniform vec4 dimensions; +uniform vec2 mapDimensions; // = vec2(256.0, 256.0); +// const vec2 textureDimensions = vec2(750.0, 750.0); + +void main(void) +{ + vec2 mapCords = vTextureCoord; + mapCords += (dimensions.zw + offset)/ dimensions.xy ; + mapCords.y *= -1.0; + mapCords.y += 1.0; + + vec2 matSample = texture2D(displacementMap, mapCords).xy; + matSample -= 0.5; + matSample *= scale; + matSample /= mapDimensions; + + gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y)); + + // TODO: Is this needed? + // gl_FragColor.rgb = mix(gl_FragColor.rgb, gl_FragColor.rgb, 1.0); +} diff --git a/src/filters/index.js b/src/filters/index.js index 0c26742..a207db7 100644 --- a/src/filters/index.js +++ b/src/filters/index.js @@ -18,7 +18,7 @@ ColorStepFilter: require('./color/ColorStepFilter'), // ConvolutionFilter: require('./ConvolutionFilter'), // CrossHatchFilter: require('./CrossHatchFilter'), - // DisplacementFilter: require('./DisplacementFilter'), + DisplacementFilter: require('./displacement/DisplacementFilter'), DotScreenFilter: require('./dot/DotScreenFilter'), GrayFilter: require('./gray/GrayFilter'), InvertFilter: require('./invert/InvertFilter'), @@ -28,7 +28,7 @@ // RGBSplitFilter: require('./RGBSplitFilter'), ShockwaveFilter: require('./shockwave/ShockwaveFilter'), // SepiaFilter: require('./SepiaFilter'), - // SmartBlurFilter: require('./SmartBlurFilter'), + SmartBlurFilter: require('./blur/SmartBlurFilter'), // TiltShiftFilter: require('./TiltShiftFilter'), // TiltShiftXFilter: require('./TiltShiftXFilter'), // TiltShiftYFilter: require('./TiltShiftYFilter'), diff --git a/src/filters/invert/InvertFilter.js b/src/filters/invert/InvertFilter.js index 7ac47bf..0db32a2 100644 --- a/src/filters/invert/InvertFilter.js +++ b/src/filters/invert/InvertFilter.js @@ -5,7 +5,7 @@ * * @class * @extends AbstractFilter - * @namespace PIXI + * @namespace PIXI.filters */ function InvertFilter() { diff --git a/src/filters/DisplacementFilter.js b/src/filters/DisplacementFilter.js deleted file mode 100644 index cb6b788..0000000 --- a/src/filters/DisplacementFilter.js +++ /dev/null @@ -1,141 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. - * You can use this filter to apply all manor of crazy warping effects - * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - * @param texture {Texture} The texture used for the displacement map * must be power of 2 texture at the moment - */ -function DisplacementFilter(texture) -{ - AbstractFilter.call(this); - - texture.baseTexture._powerOf2 = true; - - // set the uniforms - this.uniforms = { - displacementMap: { type: 'sampler2D', value: texture }, - scale: { type: '2f', value: { x: 30, y: 30 } }, - offset: { type: '2f', value: { x: 0, y: 0 } }, - mapDimensions: { type: '2f', value: { x: 1, y: 5112 } }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - if (texture.baseTexture.hasLoaded) - { - this.onTextureLoaded(); - } - else - { - this.boundLoadedFunction = this.onTextureLoaded.bind(this); - - texture.baseTexture.on('loaded', this.boundLoadedFunction); - } - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform sampler2D displacementMap;', - 'uniform sampler2D uSampler;', - 'uniform vec2 scale;', - 'uniform vec2 offset;', - 'uniform vec4 dimensions;', - 'uniform vec2 mapDimensions;',// = vec2(256.0, 256.0);', - // 'const vec2 textureDimensions = vec2(750.0, 750.0);', - - 'void main(void)', - '{', - ' vec2 mapCords = vTextureCoord.xy;', - ' mapCords += (dimensions.zw + offset)/ dimensions.xy ;', - ' mapCords.y *= -1.0;', - ' mapCords.y += 1.0;', - - ' vec2 matSample = texture2D(displacementMap, mapCords).xy;', - ' matSample -= 0.5;', - ' matSample *= scale;', - ' matSample /= mapDimensions;', - - ' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y));', - - //TODO: Is this needed? - ' gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb, 1.0);', - '}' - ]; -} - -DisplacementFilter.prototype = Object.create(AbstractFilter.prototype); -DisplacementFilter.prototype.constructor = DisplacementFilter; -module.exports = DisplacementFilter; - -/** - * Sets the map dimensions uniforms when the texture becomes available. - * - * @private - */ -DisplacementFilter.prototype.onTextureLoaded = function () -{ - this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; - this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; - - this.uniforms.displacementMap.value.baseTexture.off('loaded', this.boundLoadedFunction); -}; - -Object.defineProperties(DisplacementFilter.prototype, { - /** - * The texture used for the displacement map. Must be power of 2 texture. - * - * @member {Texture} - * @memberof DisplacementFilter# - */ - map: { - get: function () - { - return this.uniforms.displacementMap.value; - }, - set: function (value) - { - this.uniforms.displacementMap.value = value; - } - }, - - /** - * The multiplier used to scale the displacement result from the map calculation. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The offset used to move the displacement map. - * - * @member {Point} - * @memberof DisplacementFilter# - */ - offset: { - get: function () - { - return this.uniforms.offset.value; - }, - set: function (value) - { - this.uniforms.offset.value = value; - } - } -}); diff --git a/src/filters/SmartBlurFilter.js b/src/filters/SmartBlurFilter.js deleted file mode 100644 index 7fe5216..0000000 --- a/src/filters/SmartBlurFilter.js +++ /dev/null @@ -1,53 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * A Smart Blur Filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function SmartBlurFilter() -{ - AbstractFilter.call(this); - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - - 'uniform sampler2D uSampler;', - 'const vec2 delta = vec2(1.0/10.0, 0.0);', - - 'float random(vec3 scale, float seed)', - '{', - ' return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);', - '}', - - - 'void main(void)', - '{', - ' vec4 color = vec4(0.0);', - ' float total = 0.0;', - - ' float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);', - - ' for (float t = -30.0; t <= 30.0; t++)', - ' {', - ' float percent = (t + offset - 0.5) / 30.0;', - ' float weight = 1.0 - abs(percent);', - ' vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent);', - ' sample.rgb *= sample.a;', - ' color += sample * weight;', - ' total += weight;', - ' }', - - ' gl_FragColor = color / total;', - ' gl_FragColor.rgb /= gl_FragColor.a + 0.00001;', - '}' - ]; -} - -SmartBlurFilter.prototype = Object.create(AbstractFilter.prototype); -SmartBlurFilter.prototype.constructor = SmartBlurFilter; -module.exports = SmartBlurFilter; diff --git a/src/filters/blur/SmartBlurFilter.js b/src/filters/blur/SmartBlurFilter.js new file mode 100644 index 0000000..7948ac1 --- /dev/null +++ b/src/filters/blur/SmartBlurFilter.js @@ -0,0 +1,22 @@ +var core = require('../../core'); + +/** + * A Smart Blur Filter. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function SmartBlurFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/smartBlur.frag', 'utf8') + ); +} + +SmartBlurFilter.prototype = Object.create(core.AbstractFilter.prototype); +SmartBlurFilter.prototype.constructor = SmartBlurFilter; +module.exports = SmartBlurFilter; diff --git a/src/filters/blur/smartBlur.frag b/src/filters/blur/smartBlur.frag new file mode 100644 index 0000000..625039e --- /dev/null +++ b/src/filters/blur/smartBlur.frag @@ -0,0 +1,32 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +const vec2 delta = vec2(1.0/10.0, 0.0); + +float random(vec3 scale, float seed) +{ + return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed); +} + +void main(void) +{ + vec4 color = vec4(0.0); + float total = 0.0; + + float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0); + + for (float t = -30.0; t <= 30.0; t++) + { + float percent = (t + offset - 0.5) / 30.0; + float weight = 1.0 - abs(percent); + vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent); + sample.rgb *= sample.a; + color += sample * weight; + total += weight; + } + + gl_FragColor = color / total; + gl_FragColor.rgb /= gl_FragColor.a + 0.00001; +} diff --git a/src/filters/color/ColorStepFilter.js b/src/filters/color/ColorStepFilter.js index b505ef3..8faf794 100644 --- a/src/filters/color/ColorStepFilter.js +++ b/src/filters/color/ColorStepFilter.js @@ -5,7 +5,7 @@ * * @class * @extends AbstractFilter - * @namespace PIXI + * @namespace PIXI.filters */ function ColorStepFilter() { diff --git a/src/filters/displacement/DisplacementFilter.js b/src/filters/displacement/DisplacementFilter.js new file mode 100644 index 0000000..f6ccd3a --- /dev/null +++ b/src/filters/displacement/DisplacementFilter.js @@ -0,0 +1,108 @@ +var core = require('../../core'); + +/** + * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. + * You can use this filter to apply all manor of crazy warping effects + * Currently the r property of the texture is used offset the x and the g property of the texture is used to offset the y. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + * @param texture {Texture} The texture used for the displacement map, must be power of 2 texture at the moment + */ +function DisplacementFilter(texture) +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/displacement.frag', 'utf8'), + // custom uniforms + { + displacementMap: { type: 'sampler2D', value: texture }, + scale: { type: 'v2', value: { x: 30, y: 30 } }, + offset: { type: 'v2', value: { x: 0, y: 0 } }, + mapDimensions: { type: 'v2', value: { x: 1, y: 5112 } }, + dimensions: { type: '4fv', value: [0, 0, 0, 0] } + } + ); + + texture.baseTexture._powerOf2 = true; + + if (texture.baseTexture.hasLoaded) + { + this.onTextureLoaded(); + } + else + { + texture.baseTexture.once('loaded', this.onTextureLoaded.bind(this)); + } +} + +DisplacementFilter.prototype = Object.create(core.AbstractFilter.prototype); +DisplacementFilter.prototype.constructor = DisplacementFilter; +module.exports = DisplacementFilter; + +/** + * Sets the map dimensions uniforms when the texture becomes available. + * + * @private + */ +DisplacementFilter.prototype.onTextureLoaded = function () +{ + this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; + this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; +}; + +Object.defineProperties(DisplacementFilter.prototype, { + /** + * The texture used for the displacement map. Must be power of 2 texture. + * + * @member {Texture} + * @memberof DisplacementFilter# + */ + map: { + get: function () + { + return this.uniforms.displacementMap.value; + }, + set: function (value) + { + this.uniforms.displacementMap.value = value; + } + }, + + /** + * The multiplier used to scale the displacement result from the map calculation. + * + * @member {Point} + * @memberof DisplacementFilter# + */ + scale: { + get: function () + { + return this.uniforms.scale.value; + }, + set: function (value) + { + this.uniforms.scale.value = value; + } + }, + + /** + * The offset used to move the displacement map. + * + * @member {Point} + * @memberof DisplacementFilter# + */ + offset: { + get: function () + { + return this.uniforms.offset.value; + }, + set: function (value) + { + this.uniforms.offset.value = value; + } + } +}); diff --git a/src/filters/displacement/displacement.frag b/src/filters/displacement/displacement.frag new file mode 100644 index 0000000..d877a3a --- /dev/null +++ b/src/filters/displacement/displacement.frag @@ -0,0 +1,30 @@ +precision mediump float; + +varying vec2 vTextureCoord; +varying vec4 vColor; + +uniform sampler2D displacementMap; +uniform sampler2D uSampler; +uniform vec2 scale; +uniform vec2 offset; +uniform vec4 dimensions; +uniform vec2 mapDimensions; // = vec2(256.0, 256.0); +// const vec2 textureDimensions = vec2(750.0, 750.0); + +void main(void) +{ + vec2 mapCords = vTextureCoord; + mapCords += (dimensions.zw + offset)/ dimensions.xy ; + mapCords.y *= -1.0; + mapCords.y += 1.0; + + vec2 matSample = texture2D(displacementMap, mapCords).xy; + matSample -= 0.5; + matSample *= scale; + matSample /= mapDimensions; + + gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y)); + + // TODO: Is this needed? + // gl_FragColor.rgb = mix(gl_FragColor.rgb, gl_FragColor.rgb, 1.0); +} diff --git a/src/filters/index.js b/src/filters/index.js index 0c26742..a207db7 100644 --- a/src/filters/index.js +++ b/src/filters/index.js @@ -18,7 +18,7 @@ ColorStepFilter: require('./color/ColorStepFilter'), // ConvolutionFilter: require('./ConvolutionFilter'), // CrossHatchFilter: require('./CrossHatchFilter'), - // DisplacementFilter: require('./DisplacementFilter'), + DisplacementFilter: require('./displacement/DisplacementFilter'), DotScreenFilter: require('./dot/DotScreenFilter'), GrayFilter: require('./gray/GrayFilter'), InvertFilter: require('./invert/InvertFilter'), @@ -28,7 +28,7 @@ // RGBSplitFilter: require('./RGBSplitFilter'), ShockwaveFilter: require('./shockwave/ShockwaveFilter'), // SepiaFilter: require('./SepiaFilter'), - // SmartBlurFilter: require('./SmartBlurFilter'), + SmartBlurFilter: require('./blur/SmartBlurFilter'), // TiltShiftFilter: require('./TiltShiftFilter'), // TiltShiftXFilter: require('./TiltShiftXFilter'), // TiltShiftYFilter: require('./TiltShiftYFilter'), diff --git a/src/filters/invert/InvertFilter.js b/src/filters/invert/InvertFilter.js index 7ac47bf..0db32a2 100644 --- a/src/filters/invert/InvertFilter.js +++ b/src/filters/invert/InvertFilter.js @@ -5,7 +5,7 @@ * * @class * @extends AbstractFilter - * @namespace PIXI + * @namespace PIXI.filters */ function InvertFilter() { diff --git a/src/filters/pixelate/PixelateFilter.js b/src/filters/pixelate/PixelateFilter.js index 69c85f2..d80e35c 100644 --- a/src/filters/pixelate/PixelateFilter.js +++ b/src/filters/pixelate/PixelateFilter.js @@ -5,7 +5,7 @@ * * @class * @extends AbstractFilter - * @namespace PIXI + * @namespace PIXI.filters */ function PixelateFilter() {