diff --git a/src/filters/ColorMatrixFilter.js b/src/filters/ColorMatrixFilter.js deleted file mode 100644 index 462dea1..0000000 --- a/src/filters/ColorMatrixFilter.js +++ /dev/null @@ -1,65 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA - * color and alpha values of every pixel on your displayObject to produce a result - * with a new set of RGBA color and alpha values. It's pretty powerful! - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorMatrixFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - matrix: { type: 'mat4', value: [1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float invert;', - 'uniform mat4 matrix;', - 'uniform sampler2D uSampler;', - - 'void main(void)', - '{', - ' gl_FragColor = texture2D(uSampler, vTextureCoord) * 1.0;', - // ' gl_FragColor *= gl_FragCoord.x;', -// ' gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);',//texture2D(uSampler, vTextureCoord) * matrix;', - '}' - ].join('\n'); -} - -ColorMatrixFilter.prototype = Object.create(AbstractFilter.prototype); -ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; -module.exports = ColorMatrixFilter; - -Object.defineProperties(ColorMatrixFilter.prototype, { - /** - * Sets the matrix of the color matrix filter - * - * @member {number[]} - * @memberof ColorMatrixFilter# - * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] - */ - matrix: { - get: function () - { - return this.uniforms.matrix.value; - }, - set: function (value) - { - this.uniforms.matrix.value = value; - } - } -}); diff --git a/src/filters/ColorMatrixFilter.js b/src/filters/ColorMatrixFilter.js deleted file mode 100644 index 462dea1..0000000 --- a/src/filters/ColorMatrixFilter.js +++ /dev/null @@ -1,65 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA - * color and alpha values of every pixel on your displayObject to produce a result - * with a new set of RGBA color and alpha values. It's pretty powerful! - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorMatrixFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - matrix: { type: 'mat4', value: [1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float invert;', - 'uniform mat4 matrix;', - 'uniform sampler2D uSampler;', - - 'void main(void)', - '{', - ' gl_FragColor = texture2D(uSampler, vTextureCoord) * 1.0;', - // ' gl_FragColor *= gl_FragCoord.x;', -// ' gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);',//texture2D(uSampler, vTextureCoord) * matrix;', - '}' - ].join('\n'); -} - -ColorMatrixFilter.prototype = Object.create(AbstractFilter.prototype); -ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; -module.exports = ColorMatrixFilter; - -Object.defineProperties(ColorMatrixFilter.prototype, { - /** - * Sets the matrix of the color matrix filter - * - * @member {number[]} - * @memberof ColorMatrixFilter# - * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] - */ - matrix: { - get: function () - { - return this.uniforms.matrix.value; - }, - set: function (value) - { - this.uniforms.matrix.value = value; - } - } -}); diff --git a/src/filters/ColorStepFilter.js b/src/filters/ColorStepFilter.js deleted file mode 100644 index 4675215..0000000 --- a/src/filters/ColorStepFilter.js +++ /dev/null @@ -1,56 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * This lowers the color depth of your image by the given amount, producing an image with a smaller palette. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorStepFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - step: { type: '1f', value: 5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - 'uniform sampler2D uSampler;', - 'uniform float step;', - - 'void main(void)', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' color = floor(color * step) / step;', - ' gl_FragColor = color;', - '}' - ]; -} - -ColorStepFilter.prototype = Object.create(AbstractFilter.prototype); -ColorStepFilter.prototype.constructor = ColorStepFilter; -module.exports = ColorStepFilter; - -Object.defineProperties(ColorStepFilter.prototype, { - /** - * The number of steps to reduce the palette by. - * - * @member {number} - * @memberof ColorStepFilter# - */ - step: { - get: function () - { - return this.uniforms.step.value; - }, - set: function (value) - { - this.uniforms.step.value = value; - } - } -}); diff --git a/src/filters/ColorMatrixFilter.js b/src/filters/ColorMatrixFilter.js deleted file mode 100644 index 462dea1..0000000 --- a/src/filters/ColorMatrixFilter.js +++ /dev/null @@ -1,65 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA - * color and alpha values of every pixel on your displayObject to produce a result - * with a new set of RGBA color and alpha values. It's pretty powerful! - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorMatrixFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - matrix: { type: 'mat4', value: [1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float invert;', - 'uniform mat4 matrix;', - 'uniform sampler2D uSampler;', - - 'void main(void)', - '{', - ' gl_FragColor = texture2D(uSampler, vTextureCoord) * 1.0;', - // ' gl_FragColor *= gl_FragCoord.x;', -// ' gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);',//texture2D(uSampler, vTextureCoord) * matrix;', - '}' - ].join('\n'); -} - -ColorMatrixFilter.prototype = Object.create(AbstractFilter.prototype); -ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; -module.exports = ColorMatrixFilter; - -Object.defineProperties(ColorMatrixFilter.prototype, { - /** - * Sets the matrix of the color matrix filter - * - * @member {number[]} - * @memberof ColorMatrixFilter# - * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] - */ - matrix: { - get: function () - { - return this.uniforms.matrix.value; - }, - set: function (value) - { - this.uniforms.matrix.value = value; - } - } -}); diff --git a/src/filters/ColorStepFilter.js b/src/filters/ColorStepFilter.js deleted file mode 100644 index 4675215..0000000 --- a/src/filters/ColorStepFilter.js +++ /dev/null @@ -1,56 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * This lowers the color depth of your image by the given amount, producing an image with a smaller palette. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorStepFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - step: { type: '1f', value: 5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - 'uniform sampler2D uSampler;', - 'uniform float step;', - - 'void main(void)', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' color = floor(color * step) / step;', - ' gl_FragColor = color;', - '}' - ]; -} - -ColorStepFilter.prototype = Object.create(AbstractFilter.prototype); -ColorStepFilter.prototype.constructor = ColorStepFilter; -module.exports = ColorStepFilter; - -Object.defineProperties(ColorStepFilter.prototype, { - /** - * The number of steps to reduce the palette by. - * - * @member {number} - * @memberof ColorStepFilter# - */ - step: { - get: function () - { - return this.uniforms.step.value; - }, - set: function (value) - { - this.uniforms.step.value = value; - } - } -}); diff --git a/src/filters/blur/blurX.frag b/src/filters/blur/blurX.frag index d173e9f..26f2041 100644 --- a/src/filters/blur/blurX.frag +++ b/src/filters/blur/blurX.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/ColorMatrixFilter.js b/src/filters/ColorMatrixFilter.js deleted file mode 100644 index 462dea1..0000000 --- a/src/filters/ColorMatrixFilter.js +++ /dev/null @@ -1,65 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA - * color and alpha values of every pixel on your displayObject to produce a result - * with a new set of RGBA color and alpha values. It's pretty powerful! - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorMatrixFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - matrix: { type: 'mat4', value: [1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float invert;', - 'uniform mat4 matrix;', - 'uniform sampler2D uSampler;', - - 'void main(void)', - '{', - ' gl_FragColor = texture2D(uSampler, vTextureCoord) * 1.0;', - // ' gl_FragColor *= gl_FragCoord.x;', -// ' gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);',//texture2D(uSampler, vTextureCoord) * matrix;', - '}' - ].join('\n'); -} - -ColorMatrixFilter.prototype = Object.create(AbstractFilter.prototype); -ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; -module.exports = ColorMatrixFilter; - -Object.defineProperties(ColorMatrixFilter.prototype, { - /** - * Sets the matrix of the color matrix filter - * - * @member {number[]} - * @memberof ColorMatrixFilter# - * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] - */ - matrix: { - get: function () - { - return this.uniforms.matrix.value; - }, - set: function (value) - { - this.uniforms.matrix.value = value; - } - } -}); diff --git a/src/filters/ColorStepFilter.js b/src/filters/ColorStepFilter.js deleted file mode 100644 index 4675215..0000000 --- a/src/filters/ColorStepFilter.js +++ /dev/null @@ -1,56 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * This lowers the color depth of your image by the given amount, producing an image with a smaller palette. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorStepFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - step: { type: '1f', value: 5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - 'uniform sampler2D uSampler;', - 'uniform float step;', - - 'void main(void)', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' color = floor(color * step) / step;', - ' gl_FragColor = color;', - '}' - ]; -} - -ColorStepFilter.prototype = Object.create(AbstractFilter.prototype); -ColorStepFilter.prototype.constructor = ColorStepFilter; -module.exports = ColorStepFilter; - -Object.defineProperties(ColorStepFilter.prototype, { - /** - * The number of steps to reduce the palette by. - * - * @member {number} - * @memberof ColorStepFilter# - */ - step: { - get: function () - { - return this.uniforms.step.value; - }, - set: function (value) - { - this.uniforms.step.value = value; - } - } -}); diff --git a/src/filters/blur/blurX.frag b/src/filters/blur/blurX.frag index d173e9f..26f2041 100644 --- a/src/filters/blur/blurX.frag +++ b/src/filters/blur/blurX.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/blur/blurY.frag b/src/filters/blur/blurY.frag index 4bed2d2..994685d 100644 --- a/src/filters/blur/blurY.frag +++ b/src/filters/blur/blurY.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/ColorMatrixFilter.js b/src/filters/ColorMatrixFilter.js deleted file mode 100644 index 462dea1..0000000 --- a/src/filters/ColorMatrixFilter.js +++ /dev/null @@ -1,65 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA - * color and alpha values of every pixel on your displayObject to produce a result - * with a new set of RGBA color and alpha values. It's pretty powerful! - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorMatrixFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - matrix: { type: 'mat4', value: [1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float invert;', - 'uniform mat4 matrix;', - 'uniform sampler2D uSampler;', - - 'void main(void)', - '{', - ' gl_FragColor = texture2D(uSampler, vTextureCoord) * 1.0;', - // ' gl_FragColor *= gl_FragCoord.x;', -// ' gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);',//texture2D(uSampler, vTextureCoord) * matrix;', - '}' - ].join('\n'); -} - -ColorMatrixFilter.prototype = Object.create(AbstractFilter.prototype); -ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; -module.exports = ColorMatrixFilter; - -Object.defineProperties(ColorMatrixFilter.prototype, { - /** - * Sets the matrix of the color matrix filter - * - * @member {number[]} - * @memberof ColorMatrixFilter# - * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] - */ - matrix: { - get: function () - { - return this.uniforms.matrix.value; - }, - set: function (value) - { - this.uniforms.matrix.value = value; - } - } -}); diff --git a/src/filters/ColorStepFilter.js b/src/filters/ColorStepFilter.js deleted file mode 100644 index 4675215..0000000 --- a/src/filters/ColorStepFilter.js +++ /dev/null @@ -1,56 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * This lowers the color depth of your image by the given amount, producing an image with a smaller palette. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorStepFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - step: { type: '1f', value: 5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - 'uniform sampler2D uSampler;', - 'uniform float step;', - - 'void main(void)', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' color = floor(color * step) / step;', - ' gl_FragColor = color;', - '}' - ]; -} - -ColorStepFilter.prototype = Object.create(AbstractFilter.prototype); -ColorStepFilter.prototype.constructor = ColorStepFilter; -module.exports = ColorStepFilter; - -Object.defineProperties(ColorStepFilter.prototype, { - /** - * The number of steps to reduce the palette by. - * - * @member {number} - * @memberof ColorStepFilter# - */ - step: { - get: function () - { - return this.uniforms.step.value; - }, - set: function (value) - { - this.uniforms.step.value = value; - } - } -}); diff --git a/src/filters/blur/blurX.frag b/src/filters/blur/blurX.frag index d173e9f..26f2041 100644 --- a/src/filters/blur/blurX.frag +++ b/src/filters/blur/blurX.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/blur/blurY.frag b/src/filters/blur/blurY.frag index 4bed2d2..994685d 100644 --- a/src/filters/blur/blurY.frag +++ b/src/filters/blur/blurY.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/color/ColorMatrixFilter.js b/src/filters/color/ColorMatrixFilter.js new file mode 100644 index 0000000..330730f --- /dev/null +++ b/src/filters/color/ColorMatrixFilter.js @@ -0,0 +1,51 @@ +var core = require('../../core'); + +/** + * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA + * color and alpha values of every pixel on your displayObject to produce a result + * with a new set of RGBA color and alpha values. It's pretty powerful! + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function ColorMatrixFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/colorMatrix.frag', 'utf8'), + // custom uniforms + { + matrix: { type: 'mat4', value: [1, 0, 0, 0, + 0, 1, 0, 0, + 0, 0, 1, 0, + 0, 0, 0, 1] } + } + ); +} + +ColorMatrixFilter.prototype = Object.create(core.AbstractFilter.prototype); +ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; +module.exports = ColorMatrixFilter; + +Object.defineProperties(ColorMatrixFilter.prototype, { + /** + * Sets the matrix of the color matrix filter + * + * @member {number[]} + * @memberof ColorMatrixFilter# + * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] + */ + matrix: { + get: function () + { + return this.uniforms.matrix.value; + }, + set: function (value) + { + this.uniforms.matrix.value = value; + } + } +}); diff --git a/src/filters/ColorMatrixFilter.js b/src/filters/ColorMatrixFilter.js deleted file mode 100644 index 462dea1..0000000 --- a/src/filters/ColorMatrixFilter.js +++ /dev/null @@ -1,65 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA - * color and alpha values of every pixel on your displayObject to produce a result - * with a new set of RGBA color and alpha values. It's pretty powerful! - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorMatrixFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - matrix: { type: 'mat4', value: [1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float invert;', - 'uniform mat4 matrix;', - 'uniform sampler2D uSampler;', - - 'void main(void)', - '{', - ' gl_FragColor = texture2D(uSampler, vTextureCoord) * 1.0;', - // ' gl_FragColor *= gl_FragCoord.x;', -// ' gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);',//texture2D(uSampler, vTextureCoord) * matrix;', - '}' - ].join('\n'); -} - -ColorMatrixFilter.prototype = Object.create(AbstractFilter.prototype); -ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; -module.exports = ColorMatrixFilter; - -Object.defineProperties(ColorMatrixFilter.prototype, { - /** - * Sets the matrix of the color matrix filter - * - * @member {number[]} - * @memberof ColorMatrixFilter# - * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] - */ - matrix: { - get: function () - { - return this.uniforms.matrix.value; - }, - set: function (value) - { - this.uniforms.matrix.value = value; - } - } -}); diff --git a/src/filters/ColorStepFilter.js b/src/filters/ColorStepFilter.js deleted file mode 100644 index 4675215..0000000 --- a/src/filters/ColorStepFilter.js +++ /dev/null @@ -1,56 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * This lowers the color depth of your image by the given amount, producing an image with a smaller palette. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorStepFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - step: { type: '1f', value: 5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - 'uniform sampler2D uSampler;', - 'uniform float step;', - - 'void main(void)', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' color = floor(color * step) / step;', - ' gl_FragColor = color;', - '}' - ]; -} - -ColorStepFilter.prototype = Object.create(AbstractFilter.prototype); -ColorStepFilter.prototype.constructor = ColorStepFilter; -module.exports = ColorStepFilter; - -Object.defineProperties(ColorStepFilter.prototype, { - /** - * The number of steps to reduce the palette by. - * - * @member {number} - * @memberof ColorStepFilter# - */ - step: { - get: function () - { - return this.uniforms.step.value; - }, - set: function (value) - { - this.uniforms.step.value = value; - } - } -}); diff --git a/src/filters/blur/blurX.frag b/src/filters/blur/blurX.frag index d173e9f..26f2041 100644 --- a/src/filters/blur/blurX.frag +++ b/src/filters/blur/blurX.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/blur/blurY.frag b/src/filters/blur/blurY.frag index 4bed2d2..994685d 100644 --- a/src/filters/blur/blurY.frag +++ b/src/filters/blur/blurY.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/color/ColorMatrixFilter.js b/src/filters/color/ColorMatrixFilter.js new file mode 100644 index 0000000..330730f --- /dev/null +++ b/src/filters/color/ColorMatrixFilter.js @@ -0,0 +1,51 @@ +var core = require('../../core'); + +/** + * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA + * color and alpha values of every pixel on your displayObject to produce a result + * with a new set of RGBA color and alpha values. It's pretty powerful! + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function ColorMatrixFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/colorMatrix.frag', 'utf8'), + // custom uniforms + { + matrix: { type: 'mat4', value: [1, 0, 0, 0, + 0, 1, 0, 0, + 0, 0, 1, 0, + 0, 0, 0, 1] } + } + ); +} + +ColorMatrixFilter.prototype = Object.create(core.AbstractFilter.prototype); +ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; +module.exports = ColorMatrixFilter; + +Object.defineProperties(ColorMatrixFilter.prototype, { + /** + * Sets the matrix of the color matrix filter + * + * @member {number[]} + * @memberof ColorMatrixFilter# + * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] + */ + matrix: { + get: function () + { + return this.uniforms.matrix.value; + }, + set: function (value) + { + this.uniforms.matrix.value = value; + } + } +}); diff --git a/src/filters/color/ColorStepFilter.js b/src/filters/color/ColorStepFilter.js new file mode 100644 index 0000000..b505ef3 --- /dev/null +++ b/src/filters/color/ColorStepFilter.js @@ -0,0 +1,45 @@ +var core = require('../../core'); + +/** + * This lowers the color depth of your image by the given amount, producing an image with a smaller palette. + * + * @class + * @extends AbstractFilter + * @namespace PIXI + */ +function ColorStepFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/colorStep.frag', 'utf8'), + // custom uniforms + { + step: { type: '1f', value: 5 } + } + ); +} + +ColorStepFilter.prototype = Object.create(core.AbstractFilter.prototype); +ColorStepFilter.prototype.constructor = ColorStepFilter; +module.exports = ColorStepFilter; + +Object.defineProperties(ColorStepFilter.prototype, { + /** + * The number of steps to reduce the palette by. + * + * @member {number} + * @memberof ColorStepFilter# + */ + step: { + get: function () + { + return this.uniforms.step.value; + }, + set: function (value) + { + this.uniforms.step.value = value; + } + } +}); diff --git a/src/filters/ColorMatrixFilter.js b/src/filters/ColorMatrixFilter.js deleted file mode 100644 index 462dea1..0000000 --- a/src/filters/ColorMatrixFilter.js +++ /dev/null @@ -1,65 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA - * color and alpha values of every pixel on your displayObject to produce a result - * with a new set of RGBA color and alpha values. It's pretty powerful! - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorMatrixFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - matrix: { type: 'mat4', value: [1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float invert;', - 'uniform mat4 matrix;', - 'uniform sampler2D uSampler;', - - 'void main(void)', - '{', - ' gl_FragColor = texture2D(uSampler, vTextureCoord) * 1.0;', - // ' gl_FragColor *= gl_FragCoord.x;', -// ' gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);',//texture2D(uSampler, vTextureCoord) * matrix;', - '}' - ].join('\n'); -} - -ColorMatrixFilter.prototype = Object.create(AbstractFilter.prototype); -ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; -module.exports = ColorMatrixFilter; - -Object.defineProperties(ColorMatrixFilter.prototype, { - /** - * Sets the matrix of the color matrix filter - * - * @member {number[]} - * @memberof ColorMatrixFilter# - * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] - */ - matrix: { - get: function () - { - return this.uniforms.matrix.value; - }, - set: function (value) - { - this.uniforms.matrix.value = value; - } - } -}); diff --git a/src/filters/ColorStepFilter.js b/src/filters/ColorStepFilter.js deleted file mode 100644 index 4675215..0000000 --- a/src/filters/ColorStepFilter.js +++ /dev/null @@ -1,56 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * This lowers the color depth of your image by the given amount, producing an image with a smaller palette. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorStepFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - step: { type: '1f', value: 5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - 'uniform sampler2D uSampler;', - 'uniform float step;', - - 'void main(void)', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' color = floor(color * step) / step;', - ' gl_FragColor = color;', - '}' - ]; -} - -ColorStepFilter.prototype = Object.create(AbstractFilter.prototype); -ColorStepFilter.prototype.constructor = ColorStepFilter; -module.exports = ColorStepFilter; - -Object.defineProperties(ColorStepFilter.prototype, { - /** - * The number of steps to reduce the palette by. - * - * @member {number} - * @memberof ColorStepFilter# - */ - step: { - get: function () - { - return this.uniforms.step.value; - }, - set: function (value) - { - this.uniforms.step.value = value; - } - } -}); diff --git a/src/filters/blur/blurX.frag b/src/filters/blur/blurX.frag index d173e9f..26f2041 100644 --- a/src/filters/blur/blurX.frag +++ b/src/filters/blur/blurX.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/blur/blurY.frag b/src/filters/blur/blurY.frag index 4bed2d2..994685d 100644 --- a/src/filters/blur/blurY.frag +++ b/src/filters/blur/blurY.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/color/ColorMatrixFilter.js b/src/filters/color/ColorMatrixFilter.js new file mode 100644 index 0000000..330730f --- /dev/null +++ b/src/filters/color/ColorMatrixFilter.js @@ -0,0 +1,51 @@ +var core = require('../../core'); + +/** + * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA + * color and alpha values of every pixel on your displayObject to produce a result + * with a new set of RGBA color and alpha values. It's pretty powerful! + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function ColorMatrixFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/colorMatrix.frag', 'utf8'), + // custom uniforms + { + matrix: { type: 'mat4', value: [1, 0, 0, 0, + 0, 1, 0, 0, + 0, 0, 1, 0, + 0, 0, 0, 1] } + } + ); +} + +ColorMatrixFilter.prototype = Object.create(core.AbstractFilter.prototype); +ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; +module.exports = ColorMatrixFilter; + +Object.defineProperties(ColorMatrixFilter.prototype, { + /** + * Sets the matrix of the color matrix filter + * + * @member {number[]} + * @memberof ColorMatrixFilter# + * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] + */ + matrix: { + get: function () + { + return this.uniforms.matrix.value; + }, + set: function (value) + { + this.uniforms.matrix.value = value; + } + } +}); diff --git a/src/filters/color/ColorStepFilter.js b/src/filters/color/ColorStepFilter.js new file mode 100644 index 0000000..b505ef3 --- /dev/null +++ b/src/filters/color/ColorStepFilter.js @@ -0,0 +1,45 @@ +var core = require('../../core'); + +/** + * This lowers the color depth of your image by the given amount, producing an image with a smaller palette. + * + * @class + * @extends AbstractFilter + * @namespace PIXI + */ +function ColorStepFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/colorStep.frag', 'utf8'), + // custom uniforms + { + step: { type: '1f', value: 5 } + } + ); +} + +ColorStepFilter.prototype = Object.create(core.AbstractFilter.prototype); +ColorStepFilter.prototype.constructor = ColorStepFilter; +module.exports = ColorStepFilter; + +Object.defineProperties(ColorStepFilter.prototype, { + /** + * The number of steps to reduce the palette by. + * + * @member {number} + * @memberof ColorStepFilter# + */ + step: { + get: function () + { + return this.uniforms.step.value; + }, + set: function (value) + { + this.uniforms.step.value = value; + } + } +}); diff --git a/src/filters/color/colorMatrix.frag b/src/filters/color/colorMatrix.frag new file mode 100644 index 0000000..d17a420 --- /dev/null +++ b/src/filters/color/colorMatrix.frag @@ -0,0 +1,11 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +uniform mat4 matrix; + +void main(void) +{ + gl_FragColor = texture2D(uSampler, vTextureCoord) * matrix; +} diff --git a/src/filters/ColorMatrixFilter.js b/src/filters/ColorMatrixFilter.js deleted file mode 100644 index 462dea1..0000000 --- a/src/filters/ColorMatrixFilter.js +++ /dev/null @@ -1,65 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA - * color and alpha values of every pixel on your displayObject to produce a result - * with a new set of RGBA color and alpha values. It's pretty powerful! - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorMatrixFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - matrix: { type: 'mat4', value: [1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float invert;', - 'uniform mat4 matrix;', - 'uniform sampler2D uSampler;', - - 'void main(void)', - '{', - ' gl_FragColor = texture2D(uSampler, vTextureCoord) * 1.0;', - // ' gl_FragColor *= gl_FragCoord.x;', -// ' gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);',//texture2D(uSampler, vTextureCoord) * matrix;', - '}' - ].join('\n'); -} - -ColorMatrixFilter.prototype = Object.create(AbstractFilter.prototype); -ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; -module.exports = ColorMatrixFilter; - -Object.defineProperties(ColorMatrixFilter.prototype, { - /** - * Sets the matrix of the color matrix filter - * - * @member {number[]} - * @memberof ColorMatrixFilter# - * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] - */ - matrix: { - get: function () - { - return this.uniforms.matrix.value; - }, - set: function (value) - { - this.uniforms.matrix.value = value; - } - } -}); diff --git a/src/filters/ColorStepFilter.js b/src/filters/ColorStepFilter.js deleted file mode 100644 index 4675215..0000000 --- a/src/filters/ColorStepFilter.js +++ /dev/null @@ -1,56 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * This lowers the color depth of your image by the given amount, producing an image with a smaller palette. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorStepFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - step: { type: '1f', value: 5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - 'uniform sampler2D uSampler;', - 'uniform float step;', - - 'void main(void)', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' color = floor(color * step) / step;', - ' gl_FragColor = color;', - '}' - ]; -} - -ColorStepFilter.prototype = Object.create(AbstractFilter.prototype); -ColorStepFilter.prototype.constructor = ColorStepFilter; -module.exports = ColorStepFilter; - -Object.defineProperties(ColorStepFilter.prototype, { - /** - * The number of steps to reduce the palette by. - * - * @member {number} - * @memberof ColorStepFilter# - */ - step: { - get: function () - { - return this.uniforms.step.value; - }, - set: function (value) - { - this.uniforms.step.value = value; - } - } -}); diff --git a/src/filters/blur/blurX.frag b/src/filters/blur/blurX.frag index d173e9f..26f2041 100644 --- a/src/filters/blur/blurX.frag +++ b/src/filters/blur/blurX.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/blur/blurY.frag b/src/filters/blur/blurY.frag index 4bed2d2..994685d 100644 --- a/src/filters/blur/blurY.frag +++ b/src/filters/blur/blurY.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/color/ColorMatrixFilter.js b/src/filters/color/ColorMatrixFilter.js new file mode 100644 index 0000000..330730f --- /dev/null +++ b/src/filters/color/ColorMatrixFilter.js @@ -0,0 +1,51 @@ +var core = require('../../core'); + +/** + * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA + * color and alpha values of every pixel on your displayObject to produce a result + * with a new set of RGBA color and alpha values. It's pretty powerful! + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function ColorMatrixFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/colorMatrix.frag', 'utf8'), + // custom uniforms + { + matrix: { type: 'mat4', value: [1, 0, 0, 0, + 0, 1, 0, 0, + 0, 0, 1, 0, + 0, 0, 0, 1] } + } + ); +} + +ColorMatrixFilter.prototype = Object.create(core.AbstractFilter.prototype); +ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; +module.exports = ColorMatrixFilter; + +Object.defineProperties(ColorMatrixFilter.prototype, { + /** + * Sets the matrix of the color matrix filter + * + * @member {number[]} + * @memberof ColorMatrixFilter# + * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] + */ + matrix: { + get: function () + { + return this.uniforms.matrix.value; + }, + set: function (value) + { + this.uniforms.matrix.value = value; + } + } +}); diff --git a/src/filters/color/ColorStepFilter.js b/src/filters/color/ColorStepFilter.js new file mode 100644 index 0000000..b505ef3 --- /dev/null +++ b/src/filters/color/ColorStepFilter.js @@ -0,0 +1,45 @@ +var core = require('../../core'); + +/** + * This lowers the color depth of your image by the given amount, producing an image with a smaller palette. + * + * @class + * @extends AbstractFilter + * @namespace PIXI + */ +function ColorStepFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/colorStep.frag', 'utf8'), + // custom uniforms + { + step: { type: '1f', value: 5 } + } + ); +} + +ColorStepFilter.prototype = Object.create(core.AbstractFilter.prototype); +ColorStepFilter.prototype.constructor = ColorStepFilter; +module.exports = ColorStepFilter; + +Object.defineProperties(ColorStepFilter.prototype, { + /** + * The number of steps to reduce the palette by. + * + * @member {number} + * @memberof ColorStepFilter# + */ + step: { + get: function () + { + return this.uniforms.step.value; + }, + set: function (value) + { + this.uniforms.step.value = value; + } + } +}); diff --git a/src/filters/color/colorMatrix.frag b/src/filters/color/colorMatrix.frag new file mode 100644 index 0000000..d17a420 --- /dev/null +++ b/src/filters/color/colorMatrix.frag @@ -0,0 +1,11 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +uniform mat4 matrix; + +void main(void) +{ + gl_FragColor = texture2D(uSampler, vTextureCoord) * matrix; +} diff --git a/src/filters/color/colorStep.frag b/src/filters/color/colorStep.frag new file mode 100644 index 0000000..ebd0ba5 --- /dev/null +++ b/src/filters/color/colorStep.frag @@ -0,0 +1,15 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +uniform float step; + +void main(void) +{ + vec4 color = texture2D(uSampler, vTextureCoord); + + color = floor(color * step) / step; + + gl_FragColor = color; +} diff --git a/src/filters/ColorMatrixFilter.js b/src/filters/ColorMatrixFilter.js deleted file mode 100644 index 462dea1..0000000 --- a/src/filters/ColorMatrixFilter.js +++ /dev/null @@ -1,65 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA - * color and alpha values of every pixel on your displayObject to produce a result - * with a new set of RGBA color and alpha values. It's pretty powerful! - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorMatrixFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - matrix: { type: 'mat4', value: [1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1] } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - - 'uniform float invert;', - 'uniform mat4 matrix;', - 'uniform sampler2D uSampler;', - - 'void main(void)', - '{', - ' gl_FragColor = texture2D(uSampler, vTextureCoord) * 1.0;', - // ' gl_FragColor *= gl_FragCoord.x;', -// ' gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);',//texture2D(uSampler, vTextureCoord) * matrix;', - '}' - ].join('\n'); -} - -ColorMatrixFilter.prototype = Object.create(AbstractFilter.prototype); -ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; -module.exports = ColorMatrixFilter; - -Object.defineProperties(ColorMatrixFilter.prototype, { - /** - * Sets the matrix of the color matrix filter - * - * @member {number[]} - * @memberof ColorMatrixFilter# - * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] - */ - matrix: { - get: function () - { - return this.uniforms.matrix.value; - }, - set: function (value) - { - this.uniforms.matrix.value = value; - } - } -}); diff --git a/src/filters/ColorStepFilter.js b/src/filters/ColorStepFilter.js deleted file mode 100644 index 4675215..0000000 --- a/src/filters/ColorStepFilter.js +++ /dev/null @@ -1,56 +0,0 @@ -var AbstractFilter = require('./AbstractFilter'); - -/** - * This lowers the color depth of your image by the given amount, producing an image with a smaller palette. - * - * @class - * @extends AbstractFilter - * @namespace PIXI - */ -function ColorStepFilter() -{ - AbstractFilter.call(this); - - // set the uniforms - this.uniforms = { - step: { type: '1f', value: 5 } - }; - - this.fragmentSrc = [ - 'precision mediump float;', - 'varying vec2 vTextureCoord;', - 'varying vec4 vColor;', - 'uniform sampler2D uSampler;', - 'uniform float step;', - - 'void main(void)', - '{', - ' vec4 color = texture2D(uSampler, vTextureCoord);', - ' color = floor(color * step) / step;', - ' gl_FragColor = color;', - '}' - ]; -} - -ColorStepFilter.prototype = Object.create(AbstractFilter.prototype); -ColorStepFilter.prototype.constructor = ColorStepFilter; -module.exports = ColorStepFilter; - -Object.defineProperties(ColorStepFilter.prototype, { - /** - * The number of steps to reduce the palette by. - * - * @member {number} - * @memberof ColorStepFilter# - */ - step: { - get: function () - { - return this.uniforms.step.value; - }, - set: function (value) - { - this.uniforms.step.value = value; - } - } -}); diff --git a/src/filters/blur/blurX.frag b/src/filters/blur/blurX.frag index d173e9f..26f2041 100644 --- a/src/filters/blur/blurX.frag +++ b/src/filters/blur/blurX.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/blur/blurY.frag b/src/filters/blur/blurY.frag index 4bed2d2..994685d 100644 --- a/src/filters/blur/blurY.frag +++ b/src/filters/blur/blurY.frag @@ -8,17 +8,17 @@ void main(void) { - vec4 sum = vec4(0.0); + vec4 sum = vec4(0.0); - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09; - sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09; + sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05; - gl_FragColor = sum; + gl_FragColor = sum; } diff --git a/src/filters/color/ColorMatrixFilter.js b/src/filters/color/ColorMatrixFilter.js new file mode 100644 index 0000000..330730f --- /dev/null +++ b/src/filters/color/ColorMatrixFilter.js @@ -0,0 +1,51 @@ +var core = require('../../core'); + +/** + * The ColorMatrixFilter class lets you apply a 4x4 matrix transformation on the RGBA + * color and alpha values of every pixel on your displayObject to produce a result + * with a new set of RGBA color and alpha values. It's pretty powerful! + * + * @class + * @extends AbstractFilter + * @namespace PIXI.filters + */ +function ColorMatrixFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/colorMatrix.frag', 'utf8'), + // custom uniforms + { + matrix: { type: 'mat4', value: [1, 0, 0, 0, + 0, 1, 0, 0, + 0, 0, 1, 0, + 0, 0, 0, 1] } + } + ); +} + +ColorMatrixFilter.prototype = Object.create(core.AbstractFilter.prototype); +ColorMatrixFilter.prototype.constructor = ColorMatrixFilter; +module.exports = ColorMatrixFilter; + +Object.defineProperties(ColorMatrixFilter.prototype, { + /** + * Sets the matrix of the color matrix filter + * + * @member {number[]} + * @memberof ColorMatrixFilter# + * @default [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1] + */ + matrix: { + get: function () + { + return this.uniforms.matrix.value; + }, + set: function (value) + { + this.uniforms.matrix.value = value; + } + } +}); diff --git a/src/filters/color/ColorStepFilter.js b/src/filters/color/ColorStepFilter.js new file mode 100644 index 0000000..b505ef3 --- /dev/null +++ b/src/filters/color/ColorStepFilter.js @@ -0,0 +1,45 @@ +var core = require('../../core'); + +/** + * This lowers the color depth of your image by the given amount, producing an image with a smaller palette. + * + * @class + * @extends AbstractFilter + * @namespace PIXI + */ +function ColorStepFilter() +{ + core.AbstractFilter.call(this, + // vertex shader + null, + // fragment shader + require('fs').readFileSync(__dirname + '/colorStep.frag', 'utf8'), + // custom uniforms + { + step: { type: '1f', value: 5 } + } + ); +} + +ColorStepFilter.prototype = Object.create(core.AbstractFilter.prototype); +ColorStepFilter.prototype.constructor = ColorStepFilter; +module.exports = ColorStepFilter; + +Object.defineProperties(ColorStepFilter.prototype, { + /** + * The number of steps to reduce the palette by. + * + * @member {number} + * @memberof ColorStepFilter# + */ + step: { + get: function () + { + return this.uniforms.step.value; + }, + set: function (value) + { + this.uniforms.step.value = value; + } + } +}); diff --git a/src/filters/color/colorMatrix.frag b/src/filters/color/colorMatrix.frag new file mode 100644 index 0000000..d17a420 --- /dev/null +++ b/src/filters/color/colorMatrix.frag @@ -0,0 +1,11 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +uniform mat4 matrix; + +void main(void) +{ + gl_FragColor = texture2D(uSampler, vTextureCoord) * matrix; +} diff --git a/src/filters/color/colorStep.frag b/src/filters/color/colorStep.frag new file mode 100644 index 0000000..ebd0ba5 --- /dev/null +++ b/src/filters/color/colorStep.frag @@ -0,0 +1,15 @@ +precision mediump float; + +varying vec2 vTextureCoord; + +uniform sampler2D uSampler; +uniform float step; + +void main(void) +{ + vec4 color = texture2D(uSampler, vTextureCoord); + + color = floor(color * step) / step; + + gl_FragColor = color; +} diff --git a/src/filters/index.js b/src/filters/index.js index 3b1f066..e5c7e9c 100644 --- a/src/filters/index.js +++ b/src/filters/index.js @@ -14,8 +14,8 @@ BlurFilter: require('./blur/BlurFilter'), BlurXFilter: require('./blur/BlurXFilter'), BlurYFilter: require('./blur/BlurYFilter'), - // ColorMatrixFilter: require('./ColorMatrixFilter'), - // ColorStepFilter: require('./ColorStepFilter'), + ColorMatrixFilter: require('./color/ColorMatrixFilter'), + ColorStepFilter: require('./color/ColorStepFilter'), // ConvolutionFilter: require('./ConvolutionFilter'), // CrossHatchFilter: require('./CrossHatchFilter'), // DisplacementFilter: require('./DisplacementFilter'),