diff --git a/src/filters/DotScreenFilter.js b/src/filters/DotScreenFilter.js deleted file mode 100644 index 10d922b..0000000 --- a/src/filters/DotScreenFilter.js +++ /dev/null @@ -1,95 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Mat Groves http://matgroves.com/ @Doormat23 - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/fun/dotscreen.js - */ - -/** - * This filter applies a dotscreen effect making display objects appear to be made out of - * black and white halftone dots like an old printer. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function DotScreenFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - scale: { type: '1f', value: 1 }, - angle: { type: '1f', value: 5 }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform vec4 dimensions;', - 'uniform sampler2D uSampler;', - - 'uniform float angle;', - 'uniform float scale;', - - 'float pattern()', - '{', - ' float s = sin(angle), c = cos(angle);', - ' vec2 tex = vTextureCoord * dimensions.xy;', - ' vec2 point = vec2(', - ' c * tex.x - s * tex.y,', - ' s * tex.x + c * tex.y', - ' ) * scale;', - ' return (sin(point.x) * sin(point.y)) * 4.0;', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' float average = (color.r + color.g + color.b) / 3.0;', - ' gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a);', - '}' - ]; -} - -DotScreenFilter.prototype = Object.create(AbstractFilter.prototype); -DotScreenFilter.prototype.constructor = DotScreenFilter; -module.exports = DotScreenFilter; - -Object.defineProperties(DotScreenFilter.prototype, { - /** - * The scale of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The radius of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - angle: { - get: function () - { - return this.uniforms.angle.value; - }, - set: function (value) - { - this.uniforms.angle.value = value; - } - } -}); diff --git a/src/filters/DotScreenFilter.js b/src/filters/DotScreenFilter.js deleted file mode 100644 index 10d922b..0000000 --- a/src/filters/DotScreenFilter.js +++ /dev/null @@ -1,95 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Mat Groves http://matgroves.com/ @Doormat23 - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/fun/dotscreen.js - */ - -/** - * This filter applies a dotscreen effect making display objects appear to be made out of - * black and white halftone dots like an old printer. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function DotScreenFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - scale: { type: '1f', value: 1 }, - angle: { type: '1f', value: 5 }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform vec4 dimensions;', - 'uniform sampler2D uSampler;', - - 'uniform float angle;', - 'uniform float scale;', - - 'float pattern()', - '{', - ' float s = sin(angle), c = cos(angle);', - ' vec2 tex = vTextureCoord * dimensions.xy;', - ' vec2 point = vec2(', - ' c * tex.x - s * tex.y,', - ' s * tex.x + c * tex.y', - ' ) * scale;', - ' return (sin(point.x) * sin(point.y)) * 4.0;', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' float average = (color.r + color.g + color.b) / 3.0;', - ' gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a);', - '}' - ]; -} - -DotScreenFilter.prototype = Object.create(AbstractFilter.prototype); -DotScreenFilter.prototype.constructor = DotScreenFilter; -module.exports = DotScreenFilter; - -Object.defineProperties(DotScreenFilter.prototype, { - /** - * The scale of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The radius of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - angle: { - get: function () - { - return this.uniforms.angle.value; - }, - set: function (value) - { - this.uniforms.angle.value = value; - } - } -}); diff --git a/src/filters/NoiseFilter.js b/src/filters/NoiseFilter.js deleted file mode 100644 index fdf1647..0000000 --- a/src/filters/NoiseFilter.js +++ /dev/null @@ -1,75 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Vico @vicocotea - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/adjust/noise.js - */ - -/** - * A Noise effect filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function NoiseFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - noise: { type: '1f', value: 0.5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float noise;', - 'uniform sampler2D uSampler;', - - 'float rand(vec2 co)', - '{', - ' return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453);', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - - ' float diff = (rand(vTextureCoord) - 0.5) * noise;', - ' color.r += diff;', - ' color.g += diff;', - ' color.b += diff;', - - ' gl_FragColor = color;', - '}' - ]; -} - -NoiseFilter.prototype = Object.create(AbstractFilter.prototype); -NoiseFilter.prototype.constructor = NoiseFilter; -module.exports = NoiseFilter; - -Object.defineProperties(NoiseFilter.prototype, { - /** - * The amount of noise to apply. - * - * @member {number} - * @memberof NoiseFilter# - * @default 0.5 - */ - noise: { - get: function () - { - return this.uniforms.noise.value; - }, - set: function (value) - { - this.dirty = true; - this.uniforms.noise.value = value; - } - } -}); diff --git a/src/filters/DotScreenFilter.js b/src/filters/DotScreenFilter.js deleted file mode 100644 index 10d922b..0000000 --- a/src/filters/DotScreenFilter.js +++ /dev/null @@ -1,95 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Mat Groves http://matgroves.com/ @Doormat23 - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/fun/dotscreen.js - */ - -/** - * This filter applies a dotscreen effect making display objects appear to be made out of - * black and white halftone dots like an old printer. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function DotScreenFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - scale: { type: '1f', value: 1 }, - angle: { type: '1f', value: 5 }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform vec4 dimensions;', - 'uniform sampler2D uSampler;', - - 'uniform float angle;', - 'uniform float scale;', - - 'float pattern()', - '{', - ' float s = sin(angle), c = cos(angle);', - ' vec2 tex = vTextureCoord * dimensions.xy;', - ' vec2 point = vec2(', - ' c * tex.x - s * tex.y,', - ' s * tex.x + c * tex.y', - ' ) * scale;', - ' return (sin(point.x) * sin(point.y)) * 4.0;', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' float average = (color.r + color.g + color.b) / 3.0;', - ' gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a);', - '}' - ]; -} - -DotScreenFilter.prototype = Object.create(AbstractFilter.prototype); -DotScreenFilter.prototype.constructor = DotScreenFilter; -module.exports = DotScreenFilter; - -Object.defineProperties(DotScreenFilter.prototype, { - /** - * The scale of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The radius of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - angle: { - get: function () - { - return this.uniforms.angle.value; - }, - set: function (value) - { - this.uniforms.angle.value = value; - } - } -}); diff --git a/src/filters/NoiseFilter.js b/src/filters/NoiseFilter.js deleted file mode 100644 index fdf1647..0000000 --- a/src/filters/NoiseFilter.js +++ /dev/null @@ -1,75 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Vico @vicocotea - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/adjust/noise.js - */ - -/** - * A Noise effect filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function NoiseFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - noise: { type: '1f', value: 0.5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float noise;', - 'uniform sampler2D uSampler;', - - 'float rand(vec2 co)', - '{', - ' return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453);', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - - ' float diff = (rand(vTextureCoord) - 0.5) * noise;', - ' color.r += diff;', - ' color.g += diff;', - ' color.b += diff;', - - ' gl_FragColor = color;', - '}' - ]; -} - -NoiseFilter.prototype = Object.create(AbstractFilter.prototype); -NoiseFilter.prototype.constructor = NoiseFilter; -module.exports = NoiseFilter; - -Object.defineProperties(NoiseFilter.prototype, { - /** - * The amount of noise to apply. - * - * @member {number} - * @memberof NoiseFilter# - * @default 0.5 - */ - noise: { - get: function () - { - return this.uniforms.noise.value; - }, - set: function (value) - { - this.dirty = true; - this.uniforms.noise.value = value; - } - } -}); diff --git a/src/filters/dot/DotScreenFilter.js b/src/filters/dot/DotScreenFilter.js new file mode 100644 index 0000000..7273936 --- /dev/null +++ b/src/filters/dot/DotScreenFilter.js @@ -0,0 +1,68 @@ +var core = require('../../core'); + +/** + * @author Mat Groves http://matgroves.com/ @Doormat23 + * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/fun/dotscreen.js + */ + +/** + * This filter applies a dotscreen effect making display objects appear to be made out of + * black and white halftone dots like an old printer. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function DotScreenFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/dotScreen.frag', 'utf8'), + // custom uniforms + { + scale: { type: '1f', value: 1 }, + angle: { type: '1f', value: 5 }, + dimensions: { type: '4fv', value: [0, 0, 0, 0] } + } + ); +} + +DotScreenFilter.prototype = Object.create(core.AbstractFilter.prototype); +DotScreenFilter.prototype.constructor = DotScreenFilter; +module.exports = DotScreenFilter; + +Object.defineProperties(DotScreenFilter.prototype, { + /** + * The scale of the effect. + * @member {number} + * @memberof DotScreenFilter# + */ + scale: { + get: function () + { + return this.uniforms.scale.value; + }, + set: function (value) + { + this.uniforms.scale.value = value; + } + }, + + /** + * The radius of the effect. + * @member {number} + * @memberof DotScreenFilter# + */ + angle: { + get: function () + { + return this.uniforms.angle.value; + }, + set: function (value) + { + this.uniforms.angle.value = value; + } + } +}); diff --git a/src/filters/DotScreenFilter.js b/src/filters/DotScreenFilter.js deleted file mode 100644 index 10d922b..0000000 --- a/src/filters/DotScreenFilter.js +++ /dev/null @@ -1,95 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Mat Groves http://matgroves.com/ @Doormat23 - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/fun/dotscreen.js - */ - -/** - * This filter applies a dotscreen effect making display objects appear to be made out of - * black and white halftone dots like an old printer. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function DotScreenFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - scale: { type: '1f', value: 1 }, - angle: { type: '1f', value: 5 }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform vec4 dimensions;', - 'uniform sampler2D uSampler;', - - 'uniform float angle;', - 'uniform float scale;', - - 'float pattern()', - '{', - ' float s = sin(angle), c = cos(angle);', - ' vec2 tex = vTextureCoord * dimensions.xy;', - ' vec2 point = vec2(', - ' c * tex.x - s * tex.y,', - ' s * tex.x + c * tex.y', - ' ) * scale;', - ' return (sin(point.x) * sin(point.y)) * 4.0;', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' float average = (color.r + color.g + color.b) / 3.0;', - ' gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a);', - '}' - ]; -} - -DotScreenFilter.prototype = Object.create(AbstractFilter.prototype); -DotScreenFilter.prototype.constructor = DotScreenFilter; -module.exports = DotScreenFilter; - -Object.defineProperties(DotScreenFilter.prototype, { - /** - * The scale of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The radius of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - angle: { - get: function () - { - return this.uniforms.angle.value; - }, - set: function (value) - { - this.uniforms.angle.value = value; - } - } -}); diff --git a/src/filters/NoiseFilter.js b/src/filters/NoiseFilter.js deleted file mode 100644 index fdf1647..0000000 --- a/src/filters/NoiseFilter.js +++ /dev/null @@ -1,75 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Vico @vicocotea - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/adjust/noise.js - */ - -/** - * A Noise effect filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function NoiseFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - noise: { type: '1f', value: 0.5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float noise;', - 'uniform sampler2D uSampler;', - - 'float rand(vec2 co)', - '{', - ' return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453);', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - - ' float diff = (rand(vTextureCoord) - 0.5) * noise;', - ' color.r += diff;', - ' color.g += diff;', - ' color.b += diff;', - - ' gl_FragColor = color;', - '}' - ]; -} - -NoiseFilter.prototype = Object.create(AbstractFilter.prototype); -NoiseFilter.prototype.constructor = NoiseFilter; -module.exports = NoiseFilter; - -Object.defineProperties(NoiseFilter.prototype, { - /** - * The amount of noise to apply. - * - * @member {number} - * @memberof NoiseFilter# - * @default 0.5 - */ - noise: { - get: function () - { - return this.uniforms.noise.value; - }, - set: function (value) - { - this.dirty = true; - this.uniforms.noise.value = value; - } - } -}); diff --git a/src/filters/dot/DotScreenFilter.js b/src/filters/dot/DotScreenFilter.js new file mode 100644 index 0000000..7273936 --- /dev/null +++ b/src/filters/dot/DotScreenFilter.js @@ -0,0 +1,68 @@ +var core = require('../../core'); + +/** + * @author Mat Groves http://matgroves.com/ @Doormat23 + * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/fun/dotscreen.js + */ + +/** + * This filter applies a dotscreen effect making display objects appear to be made out of + * black and white halftone dots like an old printer. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function DotScreenFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/dotScreen.frag', 'utf8'), + // custom uniforms + { + scale: { type: '1f', value: 1 }, + angle: { type: '1f', value: 5 }, + dimensions: { type: '4fv', value: [0, 0, 0, 0] } + } + ); +} + +DotScreenFilter.prototype = Object.create(core.AbstractFilter.prototype); +DotScreenFilter.prototype.constructor = DotScreenFilter; +module.exports = DotScreenFilter; + +Object.defineProperties(DotScreenFilter.prototype, { + /** + * The scale of the effect. + * @member {number} + * @memberof DotScreenFilter# + */ + scale: { + get: function () + { + return this.uniforms.scale.value; + }, + set: function (value) + { + this.uniforms.scale.value = value; + } + }, + + /** + * The radius of the effect. + * @member {number} + * @memberof DotScreenFilter# + */ + angle: { + get: function () + { + return this.uniforms.angle.value; + }, + set: function (value) + { + this.uniforms.angle.value = value; + } + } +}); diff --git a/src/filters/dot/dotScreen.frag b/src/filters/dot/dotScreen.frag new file mode 100644 index 0000000..a4a8891 --- /dev/null +++ b/src/filters/dot/dotScreen.frag @@ -0,0 +1,28 @@ +precision mediump float; + +varying vec2 vTextureCoord; +varying vec4 vColor; + +uniform vec4 dimensions; +uniform sampler2D uSampler; + +uniform float angle; +uniform float scale; + +float pattern() +{ + float s = sin(angle), c = cos(angle); + vec2 tex = vTextureCoord * dimensions.xy; + vec2 point = vec2( + c * tex.x - s * tex.y, + s * tex.x + c * tex.y + ) * scale; + return (sin(point.x) * sin(point.y)) * 4.0; +} + +void main() +{ + vec4 color = texture2D(uSampler, vTextureCoord); + float average = (color.r + color.g + color.b) / 3.0; + gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a); +} diff --git a/src/filters/DotScreenFilter.js b/src/filters/DotScreenFilter.js deleted file mode 100644 index 10d922b..0000000 --- a/src/filters/DotScreenFilter.js +++ /dev/null @@ -1,95 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Mat Groves http://matgroves.com/ @Doormat23 - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/fun/dotscreen.js - */ - -/** - * This filter applies a dotscreen effect making display objects appear to be made out of - * black and white halftone dots like an old printer. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function DotScreenFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - scale: { type: '1f', value: 1 }, - angle: { type: '1f', value: 5 }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform vec4 dimensions;', - 'uniform sampler2D uSampler;', - - 'uniform float angle;', - 'uniform float scale;', - - 'float pattern()', - '{', - ' float s = sin(angle), c = cos(angle);', - ' vec2 tex = vTextureCoord * dimensions.xy;', - ' vec2 point = vec2(', - ' c * tex.x - s * tex.y,', - ' s * tex.x + c * tex.y', - ' ) * scale;', - ' return (sin(point.x) * sin(point.y)) * 4.0;', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' float average = (color.r + color.g + color.b) / 3.0;', - ' gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a);', - '}' - ]; -} - -DotScreenFilter.prototype = Object.create(AbstractFilter.prototype); -DotScreenFilter.prototype.constructor = DotScreenFilter; -module.exports = DotScreenFilter; - -Object.defineProperties(DotScreenFilter.prototype, { - /** - * The scale of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The radius of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - angle: { - get: function () - { - return this.uniforms.angle.value; - }, - set: function (value) - { - this.uniforms.angle.value = value; - } - } -}); diff --git a/src/filters/NoiseFilter.js b/src/filters/NoiseFilter.js deleted file mode 100644 index fdf1647..0000000 --- a/src/filters/NoiseFilter.js +++ /dev/null @@ -1,75 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Vico @vicocotea - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/adjust/noise.js - */ - -/** - * A Noise effect filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function NoiseFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - noise: { type: '1f', value: 0.5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float noise;', - 'uniform sampler2D uSampler;', - - 'float rand(vec2 co)', - '{', - ' return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453);', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - - ' float diff = (rand(vTextureCoord) - 0.5) * noise;', - ' color.r += diff;', - ' color.g += diff;', - ' color.b += diff;', - - ' gl_FragColor = color;', - '}' - ]; -} - -NoiseFilter.prototype = Object.create(AbstractFilter.prototype); -NoiseFilter.prototype.constructor = NoiseFilter; -module.exports = NoiseFilter; - -Object.defineProperties(NoiseFilter.prototype, { - /** - * The amount of noise to apply. - * - * @member {number} - * @memberof NoiseFilter# - * @default 0.5 - */ - noise: { - get: function () - { - return this.uniforms.noise.value; - }, - set: function (value) - { - this.dirty = true; - this.uniforms.noise.value = value; - } - } -}); diff --git a/src/filters/dot/DotScreenFilter.js b/src/filters/dot/DotScreenFilter.js new file mode 100644 index 0000000..7273936 --- /dev/null +++ b/src/filters/dot/DotScreenFilter.js @@ -0,0 +1,68 @@ +var core = require('../../core'); + +/** + * @author Mat Groves http://matgroves.com/ @Doormat23 + * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/fun/dotscreen.js + */ + +/** + * This filter applies a dotscreen effect making display objects appear to be made out of + * black and white halftone dots like an old printer. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function DotScreenFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/dotScreen.frag', 'utf8'), + // custom uniforms + { + scale: { type: '1f', value: 1 }, + angle: { type: '1f', value: 5 }, + dimensions: { type: '4fv', value: [0, 0, 0, 0] } + } + ); +} + +DotScreenFilter.prototype = Object.create(core.AbstractFilter.prototype); +DotScreenFilter.prototype.constructor = DotScreenFilter; +module.exports = DotScreenFilter; + +Object.defineProperties(DotScreenFilter.prototype, { + /** + * The scale of the effect. + * @member {number} + * @memberof DotScreenFilter# + */ + scale: { + get: function () + { + return this.uniforms.scale.value; + }, + set: function (value) + { + this.uniforms.scale.value = value; + } + }, + + /** + * The radius of the effect. + * @member {number} + * @memberof DotScreenFilter# + */ + angle: { + get: function () + { + return this.uniforms.angle.value; + }, + set: function (value) + { + this.uniforms.angle.value = value; + } + } +}); diff --git a/src/filters/dot/dotScreen.frag b/src/filters/dot/dotScreen.frag new file mode 100644 index 0000000..a4a8891 --- /dev/null +++ b/src/filters/dot/dotScreen.frag @@ -0,0 +1,28 @@ +precision mediump float; + +varying vec2 vTextureCoord; +varying vec4 vColor; + +uniform vec4 dimensions; +uniform sampler2D uSampler; + +uniform float angle; +uniform float scale; + +float pattern() +{ + float s = sin(angle), c = cos(angle); + vec2 tex = vTextureCoord * dimensions.xy; + vec2 point = vec2( + c * tex.x - s * tex.y, + s * tex.x + c * tex.y + ) * scale; + return (sin(point.x) * sin(point.y)) * 4.0; +} + +void main() +{ + vec4 color = texture2D(uSampler, vTextureCoord); + float average = (color.r + color.g + color.b) / 3.0; + gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a); +} diff --git a/src/filters/index.js b/src/filters/index.js index e5c7e9c..8500a11 100644 --- a/src/filters/index.js +++ b/src/filters/index.js @@ -19,10 +19,10 @@ // ConvolutionFilter: require('./ConvolutionFilter'), // CrossHatchFilter: require('./CrossHatchFilter'), // DisplacementFilter: require('./DisplacementFilter'), - // DotScreenFilter: require('./DotScreenFilter'), - GrayFilter: require('./gray/GrayFilter') + DotScreenFilter: require('./dot/DotScreenFilter'), + GrayFilter: require('./gray/GrayFilter'), // InvertFilter: require('./InvertFilter'), - // NoiseFilter: require('./NoiseFilter'), + NoiseFilter: require('./noise/NoiseFilter'), // NormalMapFilter: require('./NormalMapFilter'), // PixelateFilter: require('./PixelateFilter'), // RGBSplitFilter: require('./RGBSplitFilter'), diff --git a/src/filters/DotScreenFilter.js b/src/filters/DotScreenFilter.js deleted file mode 100644 index 10d922b..0000000 --- a/src/filters/DotScreenFilter.js +++ /dev/null @@ -1,95 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Mat Groves http://matgroves.com/ @Doormat23 - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/fun/dotscreen.js - */ - -/** - * This filter applies a dotscreen effect making display objects appear to be made out of - * black and white halftone dots like an old printer. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function DotScreenFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - scale: { type: '1f', value: 1 }, - angle: { type: '1f', value: 5 }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform vec4 dimensions;', - 'uniform sampler2D uSampler;', - - 'uniform float angle;', - 'uniform float scale;', - - 'float pattern()', - '{', - ' float s = sin(angle), c = cos(angle);', - ' vec2 tex = vTextureCoord * dimensions.xy;', - ' vec2 point = vec2(', - ' c * tex.x - s * tex.y,', - ' s * tex.x + c * tex.y', - ' ) * scale;', - ' return (sin(point.x) * sin(point.y)) * 4.0;', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' float average = (color.r + color.g + color.b) / 3.0;', - ' gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a);', - '}' - ]; -} - -DotScreenFilter.prototype = Object.create(AbstractFilter.prototype); -DotScreenFilter.prototype.constructor = DotScreenFilter; -module.exports = DotScreenFilter; - -Object.defineProperties(DotScreenFilter.prototype, { - /** - * The scale of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The radius of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - angle: { - get: function () - { - return this.uniforms.angle.value; - }, - set: function (value) - { - this.uniforms.angle.value = value; - } - } -}); diff --git a/src/filters/NoiseFilter.js b/src/filters/NoiseFilter.js deleted file mode 100644 index fdf1647..0000000 --- a/src/filters/NoiseFilter.js +++ /dev/null @@ -1,75 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Vico @vicocotea - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/adjust/noise.js - */ - -/** - * A Noise effect filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function NoiseFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - noise: { type: '1f', value: 0.5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float noise;', - 'uniform sampler2D uSampler;', - - 'float rand(vec2 co)', - '{', - ' return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453);', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - - ' float diff = (rand(vTextureCoord) - 0.5) * noise;', - ' color.r += diff;', - ' color.g += diff;', - ' color.b += diff;', - - ' gl_FragColor = color;', - '}' - ]; -} - -NoiseFilter.prototype = Object.create(AbstractFilter.prototype); -NoiseFilter.prototype.constructor = NoiseFilter; -module.exports = NoiseFilter; - -Object.defineProperties(NoiseFilter.prototype, { - /** - * The amount of noise to apply. - * - * @member {number} - * @memberof NoiseFilter# - * @default 0.5 - */ - noise: { - get: function () - { - return this.uniforms.noise.value; - }, - set: function (value) - { - this.dirty = true; - this.uniforms.noise.value = value; - } - } -}); diff --git a/src/filters/dot/DotScreenFilter.js b/src/filters/dot/DotScreenFilter.js new file mode 100644 index 0000000..7273936 --- /dev/null +++ b/src/filters/dot/DotScreenFilter.js @@ -0,0 +1,68 @@ +var core = require('../../core'); + +/** + * @author Mat Groves http://matgroves.com/ @Doormat23 + * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/fun/dotscreen.js + */ + +/** + * This filter applies a dotscreen effect making display objects appear to be made out of + * black and white halftone dots like an old printer. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function DotScreenFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/dotScreen.frag', 'utf8'), + // custom uniforms + { + scale: { type: '1f', value: 1 }, + angle: { type: '1f', value: 5 }, + dimensions: { type: '4fv', value: [0, 0, 0, 0] } + } + ); +} + +DotScreenFilter.prototype = Object.create(core.AbstractFilter.prototype); +DotScreenFilter.prototype.constructor = DotScreenFilter; +module.exports = DotScreenFilter; + +Object.defineProperties(DotScreenFilter.prototype, { + /** + * The scale of the effect. + * @member {number} + * @memberof DotScreenFilter# + */ + scale: { + get: function () + { + return this.uniforms.scale.value; + }, + set: function (value) + { + this.uniforms.scale.value = value; + } + }, + + /** + * The radius of the effect. + * @member {number} + * @memberof DotScreenFilter# + */ + angle: { + get: function () + { + return this.uniforms.angle.value; + }, + set: function (value) + { + this.uniforms.angle.value = value; + } + } +}); diff --git a/src/filters/dot/dotScreen.frag b/src/filters/dot/dotScreen.frag new file mode 100644 index 0000000..a4a8891 --- /dev/null +++ b/src/filters/dot/dotScreen.frag @@ -0,0 +1,28 @@ +precision mediump float; + +varying vec2 vTextureCoord; +varying vec4 vColor; + +uniform vec4 dimensions; +uniform sampler2D uSampler; + +uniform float angle; +uniform float scale; + +float pattern() +{ + float s = sin(angle), c = cos(angle); + vec2 tex = vTextureCoord * dimensions.xy; + vec2 point = vec2( + c * tex.x - s * tex.y, + s * tex.x + c * tex.y + ) * scale; + return (sin(point.x) * sin(point.y)) * 4.0; +} + +void main() +{ + vec4 color = texture2D(uSampler, vTextureCoord); + float average = (color.r + color.g + color.b) / 3.0; + gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a); +} diff --git a/src/filters/index.js b/src/filters/index.js index e5c7e9c..8500a11 100644 --- a/src/filters/index.js +++ b/src/filters/index.js @@ -19,10 +19,10 @@ // ConvolutionFilter: require('./ConvolutionFilter'), // CrossHatchFilter: require('./CrossHatchFilter'), // DisplacementFilter: require('./DisplacementFilter'), - // DotScreenFilter: require('./DotScreenFilter'), - GrayFilter: require('./gray/GrayFilter') + DotScreenFilter: require('./dot/DotScreenFilter'), + GrayFilter: require('./gray/GrayFilter'), // InvertFilter: require('./InvertFilter'), - // NoiseFilter: require('./NoiseFilter'), + NoiseFilter: require('./noise/NoiseFilter'), // NormalMapFilter: require('./NormalMapFilter'), // PixelateFilter: require('./PixelateFilter'), // RGBSplitFilter: require('./RGBSplitFilter'), diff --git a/src/filters/noise/NoiseFilter.js b/src/filters/noise/NoiseFilter.js new file mode 100644 index 0000000..7121d09 --- /dev/null +++ b/src/filters/noise/NoiseFilter.js @@ -0,0 +1,51 @@ +var core = require('../../core'); + +/** + * @author Vico @vicocotea + * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/adjust/noise.js + */ + +/** + * A Noise effect filter. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function NoiseFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/noise.frag', 'utf8'), + // custom uniforms + { + noise: { type: '1f', value: 0.5 } + } + ); +} + +NoiseFilter.prototype = Object.create(core.AbstractFilter.prototype); +NoiseFilter.prototype.constructor = NoiseFilter; +module.exports = NoiseFilter; + +Object.defineProperties(NoiseFilter.prototype, { + /** + * The amount of noise to apply. + * + * @member {number} + * @memberof NoiseFilter# + * @default 0.5 + */ + noise: { + get: function () + { + return this.uniforms.noise.value; + }, + set: function (value) + { + this.uniforms.noise.value = value; + } + } +}); diff --git a/src/filters/DotScreenFilter.js b/src/filters/DotScreenFilter.js deleted file mode 100644 index 10d922b..0000000 --- a/src/filters/DotScreenFilter.js +++ /dev/null @@ -1,95 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Mat Groves http://matgroves.com/ @Doormat23 - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/fun/dotscreen.js - */ - -/** - * This filter applies a dotscreen effect making display objects appear to be made out of - * black and white halftone dots like an old printer. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function DotScreenFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - scale: { type: '1f', value: 1 }, - angle: { type: '1f', value: 5 }, - dimensions: { type: '4fv', value: [0, 0, 0, 0] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform vec4 dimensions;', - 'uniform sampler2D uSampler;', - - 'uniform float angle;', - 'uniform float scale;', - - 'float pattern()', - '{', - ' float s = sin(angle), c = cos(angle);', - ' vec2 tex = vTextureCoord * dimensions.xy;', - ' vec2 point = vec2(', - ' c * tex.x - s * tex.y,', - ' s * tex.x + c * tex.y', - ' ) * scale;', - ' return (sin(point.x) * sin(point.y)) * 4.0;', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' float average = (color.r + color.g + color.b) / 3.0;', - ' gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a);', - '}' - ]; -} - -DotScreenFilter.prototype = Object.create(AbstractFilter.prototype); -DotScreenFilter.prototype.constructor = DotScreenFilter; -module.exports = DotScreenFilter; - -Object.defineProperties(DotScreenFilter.prototype, { - /** - * The scale of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - scale: { - get: function () - { - return this.uniforms.scale.value; - }, - set: function (value) - { - this.uniforms.scale.value = value; - } - }, - - /** - * The radius of the effect. - * @member {number} - * @memberof DotScreenFilter# - */ - angle: { - get: function () - { - return this.uniforms.angle.value; - }, - set: function (value) - { - this.uniforms.angle.value = value; - } - } -}); diff --git a/src/filters/NoiseFilter.js b/src/filters/NoiseFilter.js deleted file mode 100644 index fdf1647..0000000 --- a/src/filters/NoiseFilter.js +++ /dev/null @@ -1,75 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * @author Vico @vicocotea - * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/adjust/noise.js - */ - -/** - * A Noise effect filter. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function NoiseFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - noise: { type: '1f', value: 0.5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float noise;', - 'uniform sampler2D uSampler;', - - 'float rand(vec2 co)', - '{', - ' return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453);', - '}', - - 'void main()', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - - ' float diff = (rand(vTextureCoord) - 0.5) * noise;', - ' color.r += diff;', - ' color.g += diff;', - ' color.b += diff;', - - ' gl_FragColor = color;', - '}' - ]; -} - -NoiseFilter.prototype = Object.create(AbstractFilter.prototype); -NoiseFilter.prototype.constructor = NoiseFilter; -module.exports = NoiseFilter; - -Object.defineProperties(NoiseFilter.prototype, { - /** - * The amount of noise to apply. - * - * @member {number} - * @memberof NoiseFilter# - * @default 0.5 - */ - noise: { - get: function () - { - return this.uniforms.noise.value; - }, - set: function (value) - { - this.dirty = true; - this.uniforms.noise.value = value; - } - } -}); diff --git a/src/filters/dot/DotScreenFilter.js b/src/filters/dot/DotScreenFilter.js new file mode 100644 index 0000000..7273936 --- /dev/null +++ b/src/filters/dot/DotScreenFilter.js @@ -0,0 +1,68 @@ +var core = require('../../core'); + +/** + * @author Mat Groves http://matgroves.com/ @Doormat23 + * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/fun/dotscreen.js + */ + +/** + * This filter applies a dotscreen effect making display objects appear to be made out of + * black and white halftone dots like an old printer. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function DotScreenFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/dotScreen.frag', 'utf8'), + // custom uniforms + { + scale: { type: '1f', value: 1 }, + angle: { type: '1f', value: 5 }, + dimensions: { type: '4fv', value: [0, 0, 0, 0] } + } + ); +} + +DotScreenFilter.prototype = Object.create(core.AbstractFilter.prototype); +DotScreenFilter.prototype.constructor = DotScreenFilter; +module.exports = DotScreenFilter; + +Object.defineProperties(DotScreenFilter.prototype, { + /** + * The scale of the effect. + * @member {number} + * @memberof DotScreenFilter# + */ + scale: { + get: function () + { + return this.uniforms.scale.value; + }, + set: function (value) + { + this.uniforms.scale.value = value; + } + }, + + /** + * The radius of the effect. + * @member {number} + * @memberof DotScreenFilter# + */ + angle: { + get: function () + { + return this.uniforms.angle.value; + }, + set: function (value) + { + this.uniforms.angle.value = value; + } + } +}); diff --git a/src/filters/dot/dotScreen.frag b/src/filters/dot/dotScreen.frag new file mode 100644 index 0000000..a4a8891 --- /dev/null +++ b/src/filters/dot/dotScreen.frag @@ -0,0 +1,28 @@ +precision mediump float; + +varying vec2 vTextureCoord; +varying vec4 vColor; + +uniform vec4 dimensions; +uniform sampler2D uSampler; + +uniform float angle; +uniform float scale; + +float pattern() +{ + float s = sin(angle), c = cos(angle); + vec2 tex = vTextureCoord * dimensions.xy; + vec2 point = vec2( + c * tex.x - s * tex.y, + s * tex.x + c * tex.y + ) * scale; + return (sin(point.x) * sin(point.y)) * 4.0; +} + +void main() +{ + vec4 color = texture2D(uSampler, vTextureCoord); + float average = (color.r + color.g + color.b) / 3.0; + gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a); +} diff --git a/src/filters/index.js b/src/filters/index.js index e5c7e9c..8500a11 100644 --- a/src/filters/index.js +++ b/src/filters/index.js @@ -19,10 +19,10 @@ // ConvolutionFilter: require('./ConvolutionFilter'), // CrossHatchFilter: require('./CrossHatchFilter'), // DisplacementFilter: require('./DisplacementFilter'), - // DotScreenFilter: require('./DotScreenFilter'), - GrayFilter: require('./gray/GrayFilter') + DotScreenFilter: require('./dot/DotScreenFilter'), + GrayFilter: require('./gray/GrayFilter'), // InvertFilter: require('./InvertFilter'), - // NoiseFilter: require('./NoiseFilter'), + NoiseFilter: require('./noise/NoiseFilter'), // NormalMapFilter: require('./NormalMapFilter'), // PixelateFilter: require('./PixelateFilter'), // RGBSplitFilter: require('./RGBSplitFilter'), diff --git a/src/filters/noise/NoiseFilter.js b/src/filters/noise/NoiseFilter.js new file mode 100644 index 0000000..7121d09 --- /dev/null +++ b/src/filters/noise/NoiseFilter.js @@ -0,0 +1,51 @@ +var core = require('../../core'); + +/** + * @author Vico @vicocotea + * original filter: https://github.com/evanw/glfx.js/blob/master/src/filters/adjust/noise.js + */ + +/** + * A Noise effect filter. + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function NoiseFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/noise.frag', 'utf8'), + // custom uniforms + { + noise: { type: '1f', value: 0.5 } + } + ); +} + +NoiseFilter.prototype = Object.create(core.AbstractFilter.prototype); +NoiseFilter.prototype.constructor = NoiseFilter; +module.exports = NoiseFilter; + +Object.defineProperties(NoiseFilter.prototype, { + /** + * The amount of noise to apply. + * + * @member {number} + * @memberof NoiseFilter# + * @default 0.5 + */ + noise: { + get: function () + { + return this.uniforms.noise.value; + }, + set: function (value) + { + this.uniforms.noise.value = value; + } + } +}); diff --git a/src/filters/noise/noise.frag b/src/filters/noise/noise.frag new file mode 100644 index 0000000..4364cdd --- /dev/null +++ b/src/filters/noise/noise.frag @@ -0,0 +1,25 @@ +precision mediump float; + +varying vec2 vTextureCoord; +varying vec4 vColor; + +uniform float noise; +uniform sampler2D uSampler; + +float rand(vec2 co) +{ + return fract(sin(dot(co.xy, vec2(12.9898, 78.233))) * 43758.5453); +} + +void main() +{ + vec4 color = texture2D(uSampler, vTextureCoord); + + float diff = (rand(vTextureCoord) - 0.5) * noise; + + color.r += diff; + color.g += diff; + color.b += diff; + + gl_FragColor = color; +}