diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/filters/FXAA/FXAA.frag b/src/filters/FXAA/FXAA.frag index 2f3b3ae..bb6b18b 100755 --- a/src/filters/FXAA/FXAA.frag +++ b/src/filters/FXAA/FXAA.frag @@ -1,6 +1,3 @@ -precision lowp float; - - /** Basic FXAA implementation based on the code on geeks3d.com with the modification that the texture2DLod stuff was removed since it's diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/filters/FXAA/FXAA.frag b/src/filters/FXAA/FXAA.frag index 2f3b3ae..bb6b18b 100755 --- a/src/filters/FXAA/FXAA.frag +++ b/src/filters/FXAA/FXAA.frag @@ -1,6 +1,3 @@ -precision lowp float; - - /** Basic FXAA implementation based on the code on geeks3d.com with the modification that the texture2DLod stuff was removed since it's diff --git a/src/filters/FXAA/FXAA.vert b/src/filters/FXAA/FXAA.vert index b0c1860..9d1db9b 100755 --- a/src/filters/FXAA/FXAA.vert +++ b/src/filters/FXAA/FXAA.vert @@ -1,6 +1,3 @@ - -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/filters/FXAA/FXAA.frag b/src/filters/FXAA/FXAA.frag index 2f3b3ae..bb6b18b 100755 --- a/src/filters/FXAA/FXAA.frag +++ b/src/filters/FXAA/FXAA.frag @@ -1,6 +1,3 @@ -precision lowp float; - - /** Basic FXAA implementation based on the code on geeks3d.com with the modification that the texture2DLod stuff was removed since it's diff --git a/src/filters/FXAA/FXAA.vert b/src/filters/FXAA/FXAA.vert index b0c1860..9d1db9b 100755 --- a/src/filters/FXAA/FXAA.vert +++ b/src/filters/FXAA/FXAA.vert @@ -1,6 +1,3 @@ - -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; diff --git a/src/filters/blur/generateBlurFragSource.js b/src/filters/blur/generateBlurFragSource.js index 10610a1..480ff4d 100644 --- a/src/filters/blur/generateBlurFragSource.js +++ b/src/filters/blur/generateBlurFragSource.js @@ -8,9 +8,6 @@ }; var fragTemplate = [ - - 'precision mediump float;', - 'varying vec2 vBlurTexCoords[%size%];', 'uniform sampler2D uSampler;', diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/filters/FXAA/FXAA.frag b/src/filters/FXAA/FXAA.frag index 2f3b3ae..bb6b18b 100755 --- a/src/filters/FXAA/FXAA.frag +++ b/src/filters/FXAA/FXAA.frag @@ -1,6 +1,3 @@ -precision lowp float; - - /** Basic FXAA implementation based on the code on geeks3d.com with the modification that the texture2DLod stuff was removed since it's diff --git a/src/filters/FXAA/FXAA.vert b/src/filters/FXAA/FXAA.vert index b0c1860..9d1db9b 100755 --- a/src/filters/FXAA/FXAA.vert +++ b/src/filters/FXAA/FXAA.vert @@ -1,6 +1,3 @@ - -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; diff --git a/src/filters/blur/generateBlurFragSource.js b/src/filters/blur/generateBlurFragSource.js index 10610a1..480ff4d 100644 --- a/src/filters/blur/generateBlurFragSource.js +++ b/src/filters/blur/generateBlurFragSource.js @@ -8,9 +8,6 @@ }; var fragTemplate = [ - - 'precision mediump float;', - 'varying vec2 vBlurTexCoords[%size%];', 'uniform sampler2D uSampler;', diff --git a/src/filters/colormatrix/colorMatrix.frag b/src/filters/colormatrix/colorMatrix.frag index 166857b..3aaf2b3 100644 --- a/src/filters/colormatrix/colorMatrix.frag +++ b/src/filters/colormatrix/colorMatrix.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; uniform float m[20]; diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/filters/FXAA/FXAA.frag b/src/filters/FXAA/FXAA.frag index 2f3b3ae..bb6b18b 100755 --- a/src/filters/FXAA/FXAA.frag +++ b/src/filters/FXAA/FXAA.frag @@ -1,6 +1,3 @@ -precision lowp float; - - /** Basic FXAA implementation based on the code on geeks3d.com with the modification that the texture2DLod stuff was removed since it's diff --git a/src/filters/FXAA/FXAA.vert b/src/filters/FXAA/FXAA.vert index b0c1860..9d1db9b 100755 --- a/src/filters/FXAA/FXAA.vert +++ b/src/filters/FXAA/FXAA.vert @@ -1,6 +1,3 @@ - -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; diff --git a/src/filters/blur/generateBlurFragSource.js b/src/filters/blur/generateBlurFragSource.js index 10610a1..480ff4d 100644 --- a/src/filters/blur/generateBlurFragSource.js +++ b/src/filters/blur/generateBlurFragSource.js @@ -8,9 +8,6 @@ }; var fragTemplate = [ - - 'precision mediump float;', - 'varying vec2 vBlurTexCoords[%size%];', 'uniform sampler2D uSampler;', diff --git a/src/filters/colormatrix/colorMatrix.frag b/src/filters/colormatrix/colorMatrix.frag index 166857b..3aaf2b3 100644 --- a/src/filters/colormatrix/colorMatrix.frag +++ b/src/filters/colormatrix/colorMatrix.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; uniform float m[20]; diff --git a/src/filters/colormatrix/colorMatrix.vert b/src/filters/colormatrix/colorMatrix.vert index 87b6f2a..787220d 100644 --- a/src/filters/colormatrix/colorMatrix.vert +++ b/src/filters/colormatrix/colorMatrix.vert @@ -1,5 +1,3 @@ -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; @@ -9,4 +7,4 @@ void main(void){ gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); vTextureCoord = aTextureCoord; -} \ No newline at end of file +} diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/filters/FXAA/FXAA.frag b/src/filters/FXAA/FXAA.frag index 2f3b3ae..bb6b18b 100755 --- a/src/filters/FXAA/FXAA.frag +++ b/src/filters/FXAA/FXAA.frag @@ -1,6 +1,3 @@ -precision lowp float; - - /** Basic FXAA implementation based on the code on geeks3d.com with the modification that the texture2DLod stuff was removed since it's diff --git a/src/filters/FXAA/FXAA.vert b/src/filters/FXAA/FXAA.vert index b0c1860..9d1db9b 100755 --- a/src/filters/FXAA/FXAA.vert +++ b/src/filters/FXAA/FXAA.vert @@ -1,6 +1,3 @@ - -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; diff --git a/src/filters/blur/generateBlurFragSource.js b/src/filters/blur/generateBlurFragSource.js index 10610a1..480ff4d 100644 --- a/src/filters/blur/generateBlurFragSource.js +++ b/src/filters/blur/generateBlurFragSource.js @@ -8,9 +8,6 @@ }; var fragTemplate = [ - - 'precision mediump float;', - 'varying vec2 vBlurTexCoords[%size%];', 'uniform sampler2D uSampler;', diff --git a/src/filters/colormatrix/colorMatrix.frag b/src/filters/colormatrix/colorMatrix.frag index 166857b..3aaf2b3 100644 --- a/src/filters/colormatrix/colorMatrix.frag +++ b/src/filters/colormatrix/colorMatrix.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; uniform float m[20]; diff --git a/src/filters/colormatrix/colorMatrix.vert b/src/filters/colormatrix/colorMatrix.vert index 87b6f2a..787220d 100644 --- a/src/filters/colormatrix/colorMatrix.vert +++ b/src/filters/colormatrix/colorMatrix.vert @@ -1,5 +1,3 @@ -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; @@ -9,4 +7,4 @@ void main(void){ gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); vTextureCoord = aTextureCoord; -} \ No newline at end of file +} diff --git a/src/filters/displacement/displacement.frag b/src/filters/displacement/displacement.frag index 3850c1a..5f3518a 100644 --- a/src/filters/displacement/displacement.frag +++ b/src/filters/displacement/displacement.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vMapCoord; varying vec2 vTextureCoord; varying vec4 vColor; diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/filters/FXAA/FXAA.frag b/src/filters/FXAA/FXAA.frag index 2f3b3ae..bb6b18b 100755 --- a/src/filters/FXAA/FXAA.frag +++ b/src/filters/FXAA/FXAA.frag @@ -1,6 +1,3 @@ -precision lowp float; - - /** Basic FXAA implementation based on the code on geeks3d.com with the modification that the texture2DLod stuff was removed since it's diff --git a/src/filters/FXAA/FXAA.vert b/src/filters/FXAA/FXAA.vert index b0c1860..9d1db9b 100755 --- a/src/filters/FXAA/FXAA.vert +++ b/src/filters/FXAA/FXAA.vert @@ -1,6 +1,3 @@ - -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; diff --git a/src/filters/blur/generateBlurFragSource.js b/src/filters/blur/generateBlurFragSource.js index 10610a1..480ff4d 100644 --- a/src/filters/blur/generateBlurFragSource.js +++ b/src/filters/blur/generateBlurFragSource.js @@ -8,9 +8,6 @@ }; var fragTemplate = [ - - 'precision mediump float;', - 'varying vec2 vBlurTexCoords[%size%];', 'uniform sampler2D uSampler;', diff --git a/src/filters/colormatrix/colorMatrix.frag b/src/filters/colormatrix/colorMatrix.frag index 166857b..3aaf2b3 100644 --- a/src/filters/colormatrix/colorMatrix.frag +++ b/src/filters/colormatrix/colorMatrix.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; uniform float m[20]; diff --git a/src/filters/colormatrix/colorMatrix.vert b/src/filters/colormatrix/colorMatrix.vert index 87b6f2a..787220d 100644 --- a/src/filters/colormatrix/colorMatrix.vert +++ b/src/filters/colormatrix/colorMatrix.vert @@ -1,5 +1,3 @@ -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; @@ -9,4 +7,4 @@ void main(void){ gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); vTextureCoord = aTextureCoord; -} \ No newline at end of file +} diff --git a/src/filters/displacement/displacement.frag b/src/filters/displacement/displacement.frag index 3850c1a..5f3518a 100644 --- a/src/filters/displacement/displacement.frag +++ b/src/filters/displacement/displacement.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vMapCoord; varying vec2 vTextureCoord; varying vec4 vColor; diff --git a/src/filters/godray/godray.frag b/src/filters/godray/godray.frag index b5a63b4..3dbd533 100644 --- a/src/filters/godray/godray.frag +++ b/src/filters/godray/godray.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform float exposure; uniform float decay; @@ -16,7 +14,7 @@ vec2 textCoo = vTextureCoord; deltaTextCoord *= 1.0 / float(NUM_SAMPLES) * density; float illuminationDecay = 1.0; - + for(int i=0; i < NUM_SAMPLES ; i++) { textCoo -= deltaTextCoord; @@ -28,6 +26,6 @@ illuminationDecay *= decay; } - + gl_FragColor *= exposure; -} \ No newline at end of file +} diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/filters/FXAA/FXAA.frag b/src/filters/FXAA/FXAA.frag index 2f3b3ae..bb6b18b 100755 --- a/src/filters/FXAA/FXAA.frag +++ b/src/filters/FXAA/FXAA.frag @@ -1,6 +1,3 @@ -precision lowp float; - - /** Basic FXAA implementation based on the code on geeks3d.com with the modification that the texture2DLod stuff was removed since it's diff --git a/src/filters/FXAA/FXAA.vert b/src/filters/FXAA/FXAA.vert index b0c1860..9d1db9b 100755 --- a/src/filters/FXAA/FXAA.vert +++ b/src/filters/FXAA/FXAA.vert @@ -1,6 +1,3 @@ - -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; diff --git a/src/filters/blur/generateBlurFragSource.js b/src/filters/blur/generateBlurFragSource.js index 10610a1..480ff4d 100644 --- a/src/filters/blur/generateBlurFragSource.js +++ b/src/filters/blur/generateBlurFragSource.js @@ -8,9 +8,6 @@ }; var fragTemplate = [ - - 'precision mediump float;', - 'varying vec2 vBlurTexCoords[%size%];', 'uniform sampler2D uSampler;', diff --git a/src/filters/colormatrix/colorMatrix.frag b/src/filters/colormatrix/colorMatrix.frag index 166857b..3aaf2b3 100644 --- a/src/filters/colormatrix/colorMatrix.frag +++ b/src/filters/colormatrix/colorMatrix.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; uniform float m[20]; diff --git a/src/filters/colormatrix/colorMatrix.vert b/src/filters/colormatrix/colorMatrix.vert index 87b6f2a..787220d 100644 --- a/src/filters/colormatrix/colorMatrix.vert +++ b/src/filters/colormatrix/colorMatrix.vert @@ -1,5 +1,3 @@ -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; @@ -9,4 +7,4 @@ void main(void){ gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); vTextureCoord = aTextureCoord; -} \ No newline at end of file +} diff --git a/src/filters/displacement/displacement.frag b/src/filters/displacement/displacement.frag index 3850c1a..5f3518a 100644 --- a/src/filters/displacement/displacement.frag +++ b/src/filters/displacement/displacement.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vMapCoord; varying vec2 vTextureCoord; varying vec4 vColor; diff --git a/src/filters/godray/godray.frag b/src/filters/godray/godray.frag index b5a63b4..3dbd533 100644 --- a/src/filters/godray/godray.frag +++ b/src/filters/godray/godray.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform float exposure; uniform float decay; @@ -16,7 +14,7 @@ vec2 textCoo = vTextureCoord; deltaTextCoord *= 1.0 / float(NUM_SAMPLES) * density; float illuminationDecay = 1.0; - + for(int i=0; i < NUM_SAMPLES ; i++) { textCoo -= deltaTextCoord; @@ -28,6 +26,6 @@ illuminationDecay *= decay; } - + gl_FragColor *= exposure; -} \ No newline at end of file +} diff --git a/src/filters/gray/gray.frag b/src/filters/gray/gray.frag index 8bd3a3b..2a1d3b1 100644 --- a/src/filters/gray/gray.frag +++ b/src/filters/gray/gray.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/filters/FXAA/FXAA.frag b/src/filters/FXAA/FXAA.frag index 2f3b3ae..bb6b18b 100755 --- a/src/filters/FXAA/FXAA.frag +++ b/src/filters/FXAA/FXAA.frag @@ -1,6 +1,3 @@ -precision lowp float; - - /** Basic FXAA implementation based on the code on geeks3d.com with the modification that the texture2DLod stuff was removed since it's diff --git a/src/filters/FXAA/FXAA.vert b/src/filters/FXAA/FXAA.vert index b0c1860..9d1db9b 100755 --- a/src/filters/FXAA/FXAA.vert +++ b/src/filters/FXAA/FXAA.vert @@ -1,6 +1,3 @@ - -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; diff --git a/src/filters/blur/generateBlurFragSource.js b/src/filters/blur/generateBlurFragSource.js index 10610a1..480ff4d 100644 --- a/src/filters/blur/generateBlurFragSource.js +++ b/src/filters/blur/generateBlurFragSource.js @@ -8,9 +8,6 @@ }; var fragTemplate = [ - - 'precision mediump float;', - 'varying vec2 vBlurTexCoords[%size%];', 'uniform sampler2D uSampler;', diff --git a/src/filters/colormatrix/colorMatrix.frag b/src/filters/colormatrix/colorMatrix.frag index 166857b..3aaf2b3 100644 --- a/src/filters/colormatrix/colorMatrix.frag +++ b/src/filters/colormatrix/colorMatrix.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; uniform float m[20]; diff --git a/src/filters/colormatrix/colorMatrix.vert b/src/filters/colormatrix/colorMatrix.vert index 87b6f2a..787220d 100644 --- a/src/filters/colormatrix/colorMatrix.vert +++ b/src/filters/colormatrix/colorMatrix.vert @@ -1,5 +1,3 @@ -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; @@ -9,4 +7,4 @@ void main(void){ gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); vTextureCoord = aTextureCoord; -} \ No newline at end of file +} diff --git a/src/filters/displacement/displacement.frag b/src/filters/displacement/displacement.frag index 3850c1a..5f3518a 100644 --- a/src/filters/displacement/displacement.frag +++ b/src/filters/displacement/displacement.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vMapCoord; varying vec2 vTextureCoord; varying vec4 vColor; diff --git a/src/filters/godray/godray.frag b/src/filters/godray/godray.frag index b5a63b4..3dbd533 100644 --- a/src/filters/godray/godray.frag +++ b/src/filters/godray/godray.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform float exposure; uniform float decay; @@ -16,7 +14,7 @@ vec2 textCoo = vTextureCoord; deltaTextCoord *= 1.0 / float(NUM_SAMPLES) * density; float illuminationDecay = 1.0; - + for(int i=0; i < NUM_SAMPLES ; i++) { textCoo -= deltaTextCoord; @@ -28,6 +26,6 @@ illuminationDecay *= decay; } - + gl_FragColor *= exposure; -} \ No newline at end of file +} diff --git a/src/filters/gray/gray.frag b/src/filters/gray/gray.frag index 8bd3a3b..2a1d3b1 100644 --- a/src/filters/gray/gray.frag +++ b/src/filters/gray/gray.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; diff --git a/src/filters/gray/gray.vert b/src/filters/gray/gray.vert index e79970e..787220d 100644 --- a/src/filters/gray/gray.vert +++ b/src/filters/gray/gray.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; @@ -9,4 +7,4 @@ void main(void){ gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); vTextureCoord = aTextureCoord; -} \ No newline at end of file +} diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/filters/FXAA/FXAA.frag b/src/filters/FXAA/FXAA.frag index 2f3b3ae..bb6b18b 100755 --- a/src/filters/FXAA/FXAA.frag +++ b/src/filters/FXAA/FXAA.frag @@ -1,6 +1,3 @@ -precision lowp float; - - /** Basic FXAA implementation based on the code on geeks3d.com with the modification that the texture2DLod stuff was removed since it's diff --git a/src/filters/FXAA/FXAA.vert b/src/filters/FXAA/FXAA.vert index b0c1860..9d1db9b 100755 --- a/src/filters/FXAA/FXAA.vert +++ b/src/filters/FXAA/FXAA.vert @@ -1,6 +1,3 @@ - -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; diff --git a/src/filters/blur/generateBlurFragSource.js b/src/filters/blur/generateBlurFragSource.js index 10610a1..480ff4d 100644 --- a/src/filters/blur/generateBlurFragSource.js +++ b/src/filters/blur/generateBlurFragSource.js @@ -8,9 +8,6 @@ }; var fragTemplate = [ - - 'precision mediump float;', - 'varying vec2 vBlurTexCoords[%size%];', 'uniform sampler2D uSampler;', diff --git a/src/filters/colormatrix/colorMatrix.frag b/src/filters/colormatrix/colorMatrix.frag index 166857b..3aaf2b3 100644 --- a/src/filters/colormatrix/colorMatrix.frag +++ b/src/filters/colormatrix/colorMatrix.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; uniform float m[20]; diff --git a/src/filters/colormatrix/colorMatrix.vert b/src/filters/colormatrix/colorMatrix.vert index 87b6f2a..787220d 100644 --- a/src/filters/colormatrix/colorMatrix.vert +++ b/src/filters/colormatrix/colorMatrix.vert @@ -1,5 +1,3 @@ -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; @@ -9,4 +7,4 @@ void main(void){ gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); vTextureCoord = aTextureCoord; -} \ No newline at end of file +} diff --git a/src/filters/displacement/displacement.frag b/src/filters/displacement/displacement.frag index 3850c1a..5f3518a 100644 --- a/src/filters/displacement/displacement.frag +++ b/src/filters/displacement/displacement.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vMapCoord; varying vec2 vTextureCoord; varying vec4 vColor; diff --git a/src/filters/godray/godray.frag b/src/filters/godray/godray.frag index b5a63b4..3dbd533 100644 --- a/src/filters/godray/godray.frag +++ b/src/filters/godray/godray.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform float exposure; uniform float decay; @@ -16,7 +14,7 @@ vec2 textCoo = vTextureCoord; deltaTextCoord *= 1.0 / float(NUM_SAMPLES) * density; float illuminationDecay = 1.0; - + for(int i=0; i < NUM_SAMPLES ; i++) { textCoo -= deltaTextCoord; @@ -28,6 +26,6 @@ illuminationDecay *= decay; } - + gl_FragColor *= exposure; -} \ No newline at end of file +} diff --git a/src/filters/gray/gray.frag b/src/filters/gray/gray.frag index 8bd3a3b..2a1d3b1 100644 --- a/src/filters/gray/gray.frag +++ b/src/filters/gray/gray.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; diff --git a/src/filters/gray/gray.vert b/src/filters/gray/gray.vert index e79970e..787220d 100644 --- a/src/filters/gray/gray.vert +++ b/src/filters/gray/gray.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; @@ -9,4 +7,4 @@ void main(void){ gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); vTextureCoord = aTextureCoord; -} \ No newline at end of file +} diff --git a/src/filters/twist/twist.frag b/src/filters/twist/twist.frag index 0ef65a3..22e1b00 100644 --- a/src/filters/twist/twist.frag +++ b/src/filters/twist/twist.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/filters/FXAA/FXAA.frag b/src/filters/FXAA/FXAA.frag index 2f3b3ae..bb6b18b 100755 --- a/src/filters/FXAA/FXAA.frag +++ b/src/filters/FXAA/FXAA.frag @@ -1,6 +1,3 @@ -precision lowp float; - - /** Basic FXAA implementation based on the code on geeks3d.com with the modification that the texture2DLod stuff was removed since it's diff --git a/src/filters/FXAA/FXAA.vert b/src/filters/FXAA/FXAA.vert index b0c1860..9d1db9b 100755 --- a/src/filters/FXAA/FXAA.vert +++ b/src/filters/FXAA/FXAA.vert @@ -1,6 +1,3 @@ - -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; diff --git a/src/filters/blur/generateBlurFragSource.js b/src/filters/blur/generateBlurFragSource.js index 10610a1..480ff4d 100644 --- a/src/filters/blur/generateBlurFragSource.js +++ b/src/filters/blur/generateBlurFragSource.js @@ -8,9 +8,6 @@ }; var fragTemplate = [ - - 'precision mediump float;', - 'varying vec2 vBlurTexCoords[%size%];', 'uniform sampler2D uSampler;', diff --git a/src/filters/colormatrix/colorMatrix.frag b/src/filters/colormatrix/colorMatrix.frag index 166857b..3aaf2b3 100644 --- a/src/filters/colormatrix/colorMatrix.frag +++ b/src/filters/colormatrix/colorMatrix.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; uniform float m[20]; diff --git a/src/filters/colormatrix/colorMatrix.vert b/src/filters/colormatrix/colorMatrix.vert index 87b6f2a..787220d 100644 --- a/src/filters/colormatrix/colorMatrix.vert +++ b/src/filters/colormatrix/colorMatrix.vert @@ -1,5 +1,3 @@ -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; @@ -9,4 +7,4 @@ void main(void){ gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); vTextureCoord = aTextureCoord; -} \ No newline at end of file +} diff --git a/src/filters/displacement/displacement.frag b/src/filters/displacement/displacement.frag index 3850c1a..5f3518a 100644 --- a/src/filters/displacement/displacement.frag +++ b/src/filters/displacement/displacement.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vMapCoord; varying vec2 vTextureCoord; varying vec4 vColor; diff --git a/src/filters/godray/godray.frag b/src/filters/godray/godray.frag index b5a63b4..3dbd533 100644 --- a/src/filters/godray/godray.frag +++ b/src/filters/godray/godray.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform float exposure; uniform float decay; @@ -16,7 +14,7 @@ vec2 textCoo = vTextureCoord; deltaTextCoord *= 1.0 / float(NUM_SAMPLES) * density; float illuminationDecay = 1.0; - + for(int i=0; i < NUM_SAMPLES ; i++) { textCoo -= deltaTextCoord; @@ -28,6 +26,6 @@ illuminationDecay *= decay; } - + gl_FragColor *= exposure; -} \ No newline at end of file +} diff --git a/src/filters/gray/gray.frag b/src/filters/gray/gray.frag index 8bd3a3b..2a1d3b1 100644 --- a/src/filters/gray/gray.frag +++ b/src/filters/gray/gray.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; diff --git a/src/filters/gray/gray.vert b/src/filters/gray/gray.vert index e79970e..787220d 100644 --- a/src/filters/gray/gray.vert +++ b/src/filters/gray/gray.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; @@ -9,4 +7,4 @@ void main(void){ gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); vTextureCoord = aTextureCoord; -} \ No newline at end of file +} diff --git a/src/filters/twist/twist.frag b/src/filters/twist/twist.frag index 0ef65a3..22e1b00 100644 --- a/src/filters/twist/twist.frag +++ b/src/filters/twist/twist.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; diff --git a/src/mesh/webgl/MeshShader.js b/src/mesh/webgl/MeshShader.js index 065300c..dda3e46 100644 --- a/src/mesh/webgl/MeshShader.js +++ b/src/mesh/webgl/MeshShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); /** * @class @@ -12,7 +12,6 @@ gl, // vertex shader [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -27,8 +26,6 @@ '}' ].join('\n'), [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'uniform float alpha;', diff --git a/src/core/Shader.js b/src/core/Shader.js new file mode 100644 index 0000000..5022a73 --- /dev/null +++ b/src/core/Shader.js @@ -0,0 +1,35 @@ +var GLShader = require('pixi-gl-core').GLShader; +var Const = require('./const'); + +function checkPrecision(src) { + if (src instanceof Array) { + if (src[0].substring(0,9) !== 'precision') { + var copy = src.slice(0); + copy.unshift('precision ' + Const.PRECISION.DEFAULT + ' float;'); + return copy; + } + } else { + if (src.substring(0,9) !== 'precision') { + return 'precision ' + Const.PRECISION.DEFAULT + ' float;\n' + src; + } + } + return src; +} + +/** + * Wrapper class, webGL Shader for Pixi. + * Adds precision string if vertexSrc or fragmentSrc have no mention of it. + * + * @class + * @memberof PIXI + * @param gl {WebGLRenderingContext} + * @param vertexSrc {string|string[]} The vertex shader source as an array of strings. + * @param fragmentSrc {string|string[]} The fragment shader source as an array of strings. + */ +var Shader = function(gl, vertexSrc, fragmentSrc) { + GLShader.call(this, gl, checkPrecision(vertexSrc), checkPrecision(fragmentSrc)); +}; + +Shader.prototype = Object.create(GLShader.prototype); +Shader.prototype.constructor = Shader; +module.exports = Shader; diff --git a/src/core/const.js b/src/core/const.js index 470852b..198f528 100644 --- a/src/core/const.js +++ b/src/core/const.js @@ -16,7 +16,7 @@ /** * Two Pi. - * + * * @property {number} PI_2 * @constant * @static @@ -25,7 +25,7 @@ /** * Conversion factor for converting radians to degrees. - * + * * @property {number} RAD_TO_DEG * @constant * @static @@ -34,7 +34,7 @@ /** * Conversion factor for converting degrees to radians. - * + * * @property {number} DEG_TO_RAD * @constant * @static @@ -68,7 +68,7 @@ /** * Various blend modes supported by PIXI. - * + * * IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * Anything else will silently act like NORMAL. * @@ -164,7 +164,7 @@ * It can be re-assigned to either CLAMP or REPEAT, depending upon suitability. * If the texture is non power of two then clamp will be used regardless as webGL can only use REPEAT if the texture is po2. * This property only affects WebGL. - * + * * @static * @constant * @property {object} WRAP_MODES @@ -190,7 +190,7 @@ * This property only affects WebGL * Handy for mobile devices! * This property only affects WebGL. - * + * * @static * @constant * @property {object} GC_MODES @@ -207,7 +207,7 @@ /** * If set to true WebGL will attempt make textures mimpaped by default. * Mipmapping will only succeed if the base texture uploaded has power of two dimensions. - * + * * @static * @constant * @property {bool} MIPMAP_TEXTURES @@ -226,7 +226,7 @@ /** * Default resolution of the renderer. - * + * * @property {number} RESOLUTION * @constant * @static @@ -235,7 +235,7 @@ /** * Default filter resolution. - * + * * @property {number} FILTER_RESOLUTION * @constant * @static @@ -293,11 +293,29 @@ RREC: 4 }, + /** + * Constants that specify float precision in shaders. + * + * @static + * @constant + * @property {object} PRECISION + * @property {number} PRECISION.DEFAULT='mediump' + * @property {number} PRECISION.LOW='lowp' + * @property {number} PRECISION.MEDIUM='mediump' + * @property {number} PRECISION.HIGH='highp' + */ + PRECISION: { + DEFAULT: 'mediump', + LOW: 'lowp', + MEDIUM: 'mediump', + HIGH: 'highp' + }, + // TODO: maybe change to SPRITE.BATCH_SIZE: 2000 // TODO: maybe add PARTICLE.BATCH_SIZE: 15000 SPRITE_BATCH_SIZE: 4096, //nice balance between mobile and desktop machines SPRITE_MAX_TEXTURES: require('./utils/maxRecommendedTextures')(32), //this is the MAXIMUM - various gpus will have there own limits. - TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed + TEXT_STYLE_CHANGED: 'changed' //Name of the event that fires when a text style is changed }; module.exports = CONST; diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 81c1893..76634ae 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../../Shader'); /** * This shader is used to draw simple primitive shapes for {@link PIXI.Graphics}. @@ -32,8 +32,6 @@ ].join('\n'), // fragment shader [ - 'precision mediump float;', - 'varying vec4 vColor;', 'void main(void){', diff --git a/src/core/index.js b/src/core/index.js index 464870a..42fc231 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -48,6 +48,7 @@ CanvasRenderTarget: require('./renderers/canvas/utils/CanvasRenderTarget'), // renderers - webgl + Shader: require('./Shader'), WebGLRenderer: require('./renderers/webgl/WebGLRenderer'), WebGLManager: require('./renderers/webgl/managers/WebGLManager'), ObjectRenderer: require('./renderers/webgl/utils/ObjectRenderer'), diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js index 755ea02..6b74505 100644 --- a/src/core/renderers/webgl/filters/Filter.js +++ b/src/core/renderers/webgl/filters/Filter.js @@ -80,7 +80,6 @@ * @constant */ Filter.defaultVertexSrc = [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -104,8 +103,6 @@ * @constant */ Filter.defaultFragmentSrc = [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying vec2 vFilterCoord;', diff --git a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag index 690dab0..325dd13 100644 --- a/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag +++ b/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vMaskCoord; varying vec2 vTextureCoord; diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 253e9e9..2f4cbba 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -3,7 +3,7 @@ RenderTarget = require('../utils/RenderTarget'), Quad = require('../utils/Quad'), math = require('../../../math'), - Shader = require('pixi-gl-core').GLShader, + Shader = require('../../../Shader'), filterTransforms = require('../filters/filterTransforms'), bitTwiddle = require('bit-twiddle'); diff --git a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js index 062cc0b..241cb47 100644 --- a/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js +++ b/src/core/renderers/webgl/utils/checkMaxIfStatmentsInShader.js @@ -1,7 +1,7 @@ var glCore = require('pixi-gl-core'); var fragTemplate = [ - 'precision lowp float;', + 'precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', @@ -26,7 +26,7 @@ while(true) { - var fragmentSrc = fragTemplate.replace(/\%forloop\%/gi, generateIfTestSrc(maxIfs)); + var fragmentSrc = fragTemplate.replace(/%forloop%/gi, generateIfTestSrc(maxIfs)); gl.shaderSource(shader, fragmentSrc); gl.compileShader(shader); diff --git a/src/core/sprites/webgl/generateMultiTextureShader.js b/src/core/sprites/webgl/generateMultiTextureShader.js index e749168..f08d8be 100644 --- a/src/core/sprites/webgl/generateMultiTextureShader.js +++ b/src/core/sprites/webgl/generateMultiTextureShader.js @@ -1,8 +1,7 @@ -var Shader = require('pixi-gl-core').GLShader; var glslify = require('glslify'); +var Shader = require('../../Shader'); +var glslify = require('glslify'); var fragTemplate = [ - - 'precision lowp float;', 'varying vec2 vTextureCoord;', 'varying vec4 vColor;', 'varying float vTextureId;', @@ -20,8 +19,8 @@ var vertexSrc = glslify('./texture.vert'); var fragmentSrc = fragTemplate; - fragmentSrc = fragmentSrc.replace(/\%count\%/gi, maxTextures); - fragmentSrc = fragmentSrc.replace(/\%forloop\%/gi, generateSampleSrc(maxTextures)); + fragmentSrc = fragmentSrc.replace(/%count%/gi, maxTextures); + fragmentSrc = fragmentSrc.replace(/%forloop%/gi, generateSampleSrc(maxTextures)); var shader = new Shader(gl, vertexSrc, fragmentSrc); diff --git a/src/core/sprites/webgl/texture.vert b/src/core/sprites/webgl/texture.vert index 87a6199..5ebe025 100644 --- a/src/core/sprites/webgl/texture.vert +++ b/src/core/sprites/webgl/texture.vert @@ -1,4 +1,3 @@ -precision lowp float; attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -15,4 +14,4 @@ vTextureCoord = aTextureCoord; vTextureId = aTextureId; vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/extras/webgl/TilingShader.js b/src/extras/webgl/TilingShader.js index 19b33b6..ef1337f 100644 --- a/src/extras/webgl/TilingShader.js +++ b/src/extras/webgl/TilingShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); var glslify = require('glslify'); /** diff --git a/src/extras/webgl/tilingSprite.frag b/src/extras/webgl/tilingSprite.frag index 21d8ee6..cad664a 100644 --- a/src/extras/webgl/tilingSprite.frag +++ b/src/extras/webgl/tilingSprite.frag @@ -1,5 +1,3 @@ -precision lowp float; - varying vec2 vTextureCoord; varying vec4 vColor; @@ -15,4 +13,4 @@ coord += uFrame.xy; gl_FragColor = texture2D(uSampler, coord) ; -} \ No newline at end of file +} diff --git a/src/extras/webgl/tilingSprite.vert b/src/extras/webgl/tilingSprite.vert index 3f989ea..7589b04 100644 --- a/src/extras/webgl/tilingSprite.vert +++ b/src/extras/webgl/tilingSprite.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; @@ -16,11 +14,11 @@ void main(void) { gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); - + vec2 coord = aTextureCoord; coord -= uTransform.xy; coord /= uTransform.zw; vTextureCoord = coord; - + vColor = vec4(aColor.rgb * aColor.a, aColor.a); -} \ No newline at end of file +} diff --git a/src/filters/FXAA/FXAA.frag b/src/filters/FXAA/FXAA.frag index 2f3b3ae..bb6b18b 100755 --- a/src/filters/FXAA/FXAA.frag +++ b/src/filters/FXAA/FXAA.frag @@ -1,6 +1,3 @@ -precision lowp float; - - /** Basic FXAA implementation based on the code on geeks3d.com with the modification that the texture2DLod stuff was removed since it's diff --git a/src/filters/FXAA/FXAA.vert b/src/filters/FXAA/FXAA.vert index b0c1860..9d1db9b 100755 --- a/src/filters/FXAA/FXAA.vert +++ b/src/filters/FXAA/FXAA.vert @@ -1,6 +1,3 @@ - -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; attribute vec4 aColor; diff --git a/src/filters/blur/generateBlurFragSource.js b/src/filters/blur/generateBlurFragSource.js index 10610a1..480ff4d 100644 --- a/src/filters/blur/generateBlurFragSource.js +++ b/src/filters/blur/generateBlurFragSource.js @@ -8,9 +8,6 @@ }; var fragTemplate = [ - - 'precision mediump float;', - 'varying vec2 vBlurTexCoords[%size%];', 'uniform sampler2D uSampler;', diff --git a/src/filters/colormatrix/colorMatrix.frag b/src/filters/colormatrix/colorMatrix.frag index 166857b..3aaf2b3 100644 --- a/src/filters/colormatrix/colorMatrix.frag +++ b/src/filters/colormatrix/colorMatrix.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; uniform float m[20]; diff --git a/src/filters/colormatrix/colorMatrix.vert b/src/filters/colormatrix/colorMatrix.vert index 87b6f2a..787220d 100644 --- a/src/filters/colormatrix/colorMatrix.vert +++ b/src/filters/colormatrix/colorMatrix.vert @@ -1,5 +1,3 @@ -precision mediump float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; @@ -9,4 +7,4 @@ void main(void){ gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); vTextureCoord = aTextureCoord; -} \ No newline at end of file +} diff --git a/src/filters/displacement/displacement.frag b/src/filters/displacement/displacement.frag index 3850c1a..5f3518a 100644 --- a/src/filters/displacement/displacement.frag +++ b/src/filters/displacement/displacement.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vMapCoord; varying vec2 vTextureCoord; varying vec4 vColor; diff --git a/src/filters/godray/godray.frag b/src/filters/godray/godray.frag index b5a63b4..3dbd533 100644 --- a/src/filters/godray/godray.frag +++ b/src/filters/godray/godray.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform float exposure; uniform float decay; @@ -16,7 +14,7 @@ vec2 textCoo = vTextureCoord; deltaTextCoord *= 1.0 / float(NUM_SAMPLES) * density; float illuminationDecay = 1.0; - + for(int i=0; i < NUM_SAMPLES ; i++) { textCoo -= deltaTextCoord; @@ -28,6 +26,6 @@ illuminationDecay *= decay; } - + gl_FragColor *= exposure; -} \ No newline at end of file +} diff --git a/src/filters/gray/gray.frag b/src/filters/gray/gray.frag index 8bd3a3b..2a1d3b1 100644 --- a/src/filters/gray/gray.frag +++ b/src/filters/gray/gray.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; diff --git a/src/filters/gray/gray.vert b/src/filters/gray/gray.vert index e79970e..787220d 100644 --- a/src/filters/gray/gray.vert +++ b/src/filters/gray/gray.vert @@ -1,5 +1,3 @@ -precision lowp float; - attribute vec2 aVertexPosition; attribute vec2 aTextureCoord; @@ -9,4 +7,4 @@ void main(void){ gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0); vTextureCoord = aTextureCoord; -} \ No newline at end of file +} diff --git a/src/filters/twist/twist.frag b/src/filters/twist/twist.frag index 0ef65a3..22e1b00 100644 --- a/src/filters/twist/twist.frag +++ b/src/filters/twist/twist.frag @@ -1,5 +1,3 @@ -precision mediump float; - varying vec2 vTextureCoord; uniform sampler2D uSampler; diff --git a/src/mesh/webgl/MeshShader.js b/src/mesh/webgl/MeshShader.js index 065300c..dda3e46 100644 --- a/src/mesh/webgl/MeshShader.js +++ b/src/mesh/webgl/MeshShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); /** * @class @@ -12,7 +12,6 @@ gl, // vertex shader [ - 'precision lowp float;', 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -27,8 +26,6 @@ '}' ].join('\n'), [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'uniform float alpha;', diff --git a/src/particles/webgl/ParticleShader.js b/src/particles/webgl/ParticleShader.js index 59814ca..4c98aab 100644 --- a/src/particles/webgl/ParticleShader.js +++ b/src/particles/webgl/ParticleShader.js @@ -1,4 +1,4 @@ -var Shader = require('pixi-gl-core').GLShader; +var Shader = require('../../core/Shader'); /** * @class @@ -40,8 +40,6 @@ ].join('\n'), // hello [ - 'precision lowp float;', - 'varying vec2 vTextureCoord;', 'varying float vColor;',