This commit is contained in:
Richard Davey 2018-03-05 16:59:03 +00:00
commit 0538134a04
9 changed files with 326 additions and 58 deletions

View file

@ -33,6 +33,7 @@ var Phaser = {
Loader: require('./loader'),
Math: require('./math'),
Physics: require('./physics'),
Renderer: require('./renderer'),
Scene: require('./scene/Scene'),
Scenes: require('./scene'),
Sound: require('./sound'),

View file

@ -198,6 +198,33 @@ var WebGLPipeline = new Class({
this.flushLocked = false;
},
/**
* [description]
*
* @method Phaser.Renderer.WebGL.WebGLPipeline#addAttribute
* @since 3.2.0
*
* @param {string} name - [description]
* @param {int} size - [description]
* @param {int} type - [description]
* @param {boolean} normalized - [description]
* @param {int} offset - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
addAttribute: function (name, size, type, normalized, offset)
{
this.attributes.push({
name: name,
size: size,
type: this.renderer.glFormats[type],
normalized: normalized,
offset: offset
});
return this;
},
/**
* [description]
*
@ -381,6 +408,211 @@ var WebGLPipeline = new Class({
delete this.vertexBuffer;
delete this.gl;
return this;
},
/**
* [description]
*
* @method Phaser.Renderer.WebGL.WebGLPipeline#setFloat1
* @since 3.2.0
*
* @param {string} name - [description]
* @param {float} x - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
setFloat1: function (name, x)
{
this.renderer.setFloat1(this.program, name, x);
return this;
},
/**
* [description]
*
* @method Phaser.Renderer.WebGL.WebGLPipeline#setFloat2
* @since 3.2.0
*
* @param {string} name - [description]
* @param {float} x - [description]
* @param {float} y - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
setFloat2: function (name, x, y)
{
this.renderer.setFloat2(this.program, name, x, y);
return this;
},
/**
* [description]
*
* @method Phaser.Renderer.WebGL.WebGLPipeline#setFloat3
* @since 3.2.0
*
* @param {string} name - [description]
* @param {float} x - [description]
* @param {float} y - [description]
* @param {float} z - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
setFloat3: function (name, x, y, z)
{
this.renderer.setFloat3(this.program, name, x, y, z);
return this;
},
/**
* [description]
*
* @method Phaser.Renderer.WebGL.WebGLPipeline#setFloat4
* @since 3.2.0
*
* @param {string} name - [description]
* @param {float} x - [description]
* @param {float} y - [description]
* @param {float} z - [description]
* @param {float} w - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
setFloat4: function (name, x, y, z, w)
{
this.renderer.setFloat4(this.program, name, x, y, z, w);
return this;
},
/**
* [description]
*
* @method Phaser.Renderer.WebGL.WebGLPipeline#setInt1
* @since 3.2.0
*
* @param {string} name - [description]
* @param {int} x - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
setInt1: function (name, x)
{
this.renderer.setInt1(this.program, name, x);
return this;
},
/**
* [description]
*
* @method Phaser.Renderer.WebGL.WebGLPipeline#setInt2
* @since 3.2.0
*
* @param {string} name - [description]
* @param {int} x - [description]
* @param {int} y - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
setInt2: function (name, x, y)
{
this.renderer.setInt2(this.program, name, x, y);
return this;
},
/**
* [description]
*
* @method Phaser.Renderer.WebGL.WebGLPipeline#setInt3
* @since 3.2.0
*
* @param {string} name - [description]
* @param {int} x - [description]
* @param {int} y - [description]
* @param {int} z - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
setInt3: function (name, x, y, z)
{
this.renderer.setInt3(this.program, name, x, y, z);
return this;
},
/**
* [description]
*
* @method Phaser.Renderer.WebGL.WebGLPipeline#setInt4
* @since 3.2.0
*
* @param {string} name - [description]
* @param {int} x - [description]
* @param {int} y - [description]
* @param {int} z - [description]
* @param {int} w - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
setInt4: function (name, x, y, z, w)
{
this.renderer.setInt4(this.program, name, x, y, z, w);
return this;
},
/**
* [description]
*
* @method Phaser.Renderer.WebGL.WebGLPipeline#setMatrix2
* @since 3.2.0
*
* @param {string} name - [description]
* @param {boolean} transpose - [description]
* @param {Float32Array} matrix - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
setMatrix2: function (name, transpose, matrix)
{
this.renderer.setMatrix2(this.program, name, transpose, matrix);
return this;
},
/**
* [description]
*
* @method Phaser.Renderer.WebGL.WebGLPipeline#setMatrix3
* @since 3.2.0
*
* @param {string} name - [description]
* @param {boolean} transpose - [description]
* @param {Float32Array} matrix - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
setMatrix3: function (name, transpose, matrix)
{
this.renderer.setMatrix3(this.program, name, transpose, matrix);
return this;
},
/**
* [description]
*
* @method Phaser.Renderer.WebGL.WebGLPipeline#setMatrix4
* @since 3.2.0
*
* @param {string} name - [description]
* @param {boolean} transpose - [description]
* @param {Float32Array} matrix - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
setMatrix4: function (name, transpose, matrix)
{
this.renderer.setMatrix4(this.program, name, transpose, matrix);
return this;
}

View file

@ -354,6 +354,16 @@ var WebGLRenderer = new Class({
*/
this.extensions = {};
/**
* [description]
*
* @name Phaser.Renderer.WebGL.WebGLRenderer#glFormats
* @type {array}
* @default []
* @since 3.2.0
*/
this.glFormats = [];
this.init(this.config);
},
@ -390,6 +400,12 @@ var WebGLRenderer = new Class({
this.blendModes[2].func = [ gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA ];
this.blendModes[3].func = [ gl.ONE, gl.ONE_MINUS_SRC_COLOR ];
this.glFormats[0] = gl.BYTE;
this.glFormats[1] = gl.SHORT;
this.glFormats[2] = gl.UNSIGNED_BYTE;
this.glFormats[3] = gl.UNSIGNED_SHORT;
this.glFormats[4] = gl.FLOAT;
// Load supported extensions
this.supportedExtensions = gl.getSupportedExtensions();
@ -409,10 +425,10 @@ var WebGLRenderer = new Class({
// Clear previous pipelines and reload default ones
this.pipelines = {};
this.addPipeline('TextureTintPipeline', new TextureTintPipeline(this.game, gl, this));
this.addPipeline('FlatTintPipeline', new FlatTintPipeline(this.game, gl, this));
this.addPipeline('BitmapMaskPipeline', new BitmapMaskPipeline(this.game, gl, this));
this.addPipeline('Light2D', new ForwardDiffuseLightPipeline(this.game, gl, this));
this.addPipeline('TextureTintPipeline', new TextureTintPipeline({ game: this.game, renderer: this }));
this.addPipeline('FlatTintPipeline', new FlatTintPipeline({ game: this.game, renderer: this }));
this.addPipeline('BitmapMaskPipeline', new BitmapMaskPipeline({ game: this.game, renderer: this }));
this.addPipeline('Light2D', new ForwardDiffuseLightPipeline({ game: this.game, renderer: this }));
this.setBlendMode(CONST.BlendModes.NORMAL);
this.resize(this.width, this.height);
@ -602,7 +618,7 @@ var WebGLRenderer = new Class({
* @param {string} pipelineName - [description]
* @param {Phaser.Renderer.WebGL.WebGLPipeline} pipelineInstance - [description]
*
* @return {Phaser.Renderer.WebGL.WebGLRenderer} [description]
* @return {Phaser.Renderer.WebGL.WebGLPipeline} [description]
*/
addPipeline: function (pipelineName, pipelineInstance)
{
@ -612,7 +628,7 @@ var WebGLRenderer = new Class({
pipelineInstance.name = pipelineName;
this.pipelines[pipelineName].resize(this.width, this.height, this.config.resolution);
return this;
return pipelineInstance;
},
/**

View file

@ -12,6 +12,14 @@ module.exports = {
Utils: require('./Utils'),
WebGLPipeline: require('./WebGLPipeline'),
WebGLRenderer: require('./WebGLRenderer')
WebGLRenderer: require('./WebGLRenderer'),
Pipelines: require('./pipelines'),
// Constants
BYTE: 0,
SHORT: 1,
UNSIGNED_BYTE: 2,
UNSIGNED_SHORT: 3,
FLOAT: 4
};

View file

@ -19,9 +19,7 @@ var WebGLPipeline = require('../WebGLPipeline');
* @constructor
* @since 3.0.0
*
* @param {Phaser.Game} game - [description]
* @param {WebGLRenderingContext} gl - [description]
* @param {Phaser.Renderer.WebGL.WebGLRenderer} renderer - [description]
* @param {object} config - [description]
*/
var BitmapMaskPipeline = new Class({
@ -29,19 +27,19 @@ var BitmapMaskPipeline = new Class({
initialize:
function BitmapMaskPipeline (game, gl, renderer)
function BitmapMaskPipeline (config)
{
WebGLPipeline.call(this, {
game: game,
gl: gl,
renderer: renderer,
topology: gl.TRIANGLES,
vertShader: ShaderSourceVS,
fragShader: ShaderSourceFS,
vertexCapacity: 3,
game: config.game,
renderer: config.renderer,
gl: config.renderer.gl,
topology: (config.topology ? config.topology : config.renderer.gl.TRIANGLES),
vertShader: (config.vertShader ? config.vertShader : ShaderSourceVS),
fragShader: (config.fragShader ? config.fragShader : ShaderSourceFS),
vertexCapacity: (config.vertexCapacity ? config.vertexCapacity : 3),
vertexSize:
Float32Array.BYTES_PER_ELEMENT * 2,
vertexSize: (config.vertexSize ? config.vertexSize :
Float32Array.BYTES_PER_ELEMENT * 2),
vertices: new Float32Array([
-1, +1, -1, -7, +7, +1
@ -51,7 +49,7 @@ var BitmapMaskPipeline = new Class({
{
name: 'inPosition',
size: 2,
type: gl.FLOAT,
type: config.renderer.gl.FLOAT,
normalized: false,
offset: 0
}

View file

@ -44,9 +44,7 @@ var pathArray = [];
* @constructor
* @since 3.0.0
*
* @param {Phaser.Game} game - [description]
* @param {WebGLRenderingContext} gl - [description]
* @param {Phaser.Renderer.WebGL.WebGLRenderer} renderer - [description]
* @param {object} config - [description]
*/
var FlatTintPipeline = new Class({
@ -58,33 +56,33 @@ var FlatTintPipeline = new Class({
initialize:
function FlatTintPipeline (game, gl, renderer)
function FlatTintPipeline (config)
{
WebGLPipeline.call(this, {
game: game,
gl: gl,
renderer: renderer,
topology: gl.TRIANGLES,
vertShader: ShaderSourceVS,
fragShader: ShaderSourceFS,
vertexCapacity: 12000,
game: config.game,
renderer: config.renderer,
gl: config.renderer.gl,
topology: (config.topology ? config.topology : config.renderer.gl.TRIANGLES),
vertShader: (config.vertShader ? config.vertShader : ShaderSourceVS),
fragShader: (config.fragShader ? config.fragShader : ShaderSourceFS),
vertexCapacity: (config.vertexCapcity ? config.vertexCapacity : 12000),
vertexSize:
vertexSize: (config.vertexSize ? config.vertexSize :
Float32Array.BYTES_PER_ELEMENT * 2 +
Uint8Array.BYTES_PER_ELEMENT * 4,
Uint8Array.BYTES_PER_ELEMENT * 4),
attributes: [
{
name: 'inPosition',
size: 2,
type: gl.FLOAT,
type: config.renderer.gl.FLOAT,
normalized: false,
offset: 0
},
{
name: 'inTint',
size: 4,
type: gl.UNSIGNED_BYTE,
type: config.renderer.gl.UNSIGNED_BYTE,
normalized: true,
offset: Float32Array.BYTES_PER_ELEMENT * 2
}

View file

@ -20,9 +20,7 @@ var LIGHT_COUNT = 10;
* @constructor
* @since 3.0.0
*
* @param {Phaser.Game} game - [description]
* @param {WebGLRenderingContext} gl - [description]
* @param {Phaser.Renderer.WebGL.WebGLRenderer} renderer - [description]
* @param {object} config - [description]
*/
var ForwardDiffuseLightPipeline = new Class({
@ -30,9 +28,11 @@ var ForwardDiffuseLightPipeline = new Class({
initialize:
function ForwardDiffuseLightPipeline (game, gl, renderer)
function ForwardDiffuseLightPipeline (config)
{
TextureTintPipeline.call(this, game, gl, renderer, ShaderSourceFS.replace('%LIGHT_COUNT%', LIGHT_COUNT.toString()));
config.fragShader = ShaderSourceFS.replace('%LIGHT_COUNT%', LIGHT_COUNT.toString());
TextureTintPipeline.call(this, config);
},
/**

View file

@ -21,10 +21,7 @@ var WebGLPipeline = require('../WebGLPipeline');
* @constructor
* @since 3.0.0
*
* @param {Phaser.Game} game - [description]
* @param {WebGLRenderingContext} gl - [description]
* @param {Phaser.Renderer.WebGL.WebGLRenderer} renderer - [description]
* @param {boolean} overrideFragmentShader - [description]
* @param {object} config - [description]
*/
var TextureTintPipeline = new Class({
@ -36,41 +33,41 @@ var TextureTintPipeline = new Class({
initialize:
function TextureTintPipeline (game, gl, renderer, overrideFragmentShader)
function TextureTintPipeline (config)
{
WebGLPipeline.call(this, {
game: game,
gl: gl,
renderer: renderer,
topology: gl.TRIANGLES,
vertShader: ShaderSourceVS,
fragShader: (overrideFragmentShader ? overrideFragmentShader : ShaderSourceFS),
vertexCapacity: 6 * 2000,
game: config.game,
renderer: config.renderer,
gl: config.renderer.gl,
topology: (config.topology ? config.topology : config.renderer.gl.TRIANGLES),
vertShader: (config.vertShader ? config.vertShader : ShaderSourceVS),
fragShader: (config.fragShader ? config.fragShader : ShaderSourceFS),
vertexCapacity: (config.vertexCapacity ? config.vertexCapacity : 6 * 2000),
vertexSize:
vertexSize: (config.vertexSize ? config.vertexSize :
Float32Array.BYTES_PER_ELEMENT * 2 +
Float32Array.BYTES_PER_ELEMENT * 2 +
Uint8Array.BYTES_PER_ELEMENT * 4,
Uint8Array.BYTES_PER_ELEMENT * 4),
attributes: [
{
name: 'inPosition',
size: 2,
type: gl.FLOAT,
type: config.renderer.gl.FLOAT,
normalized: false,
offset: 0
},
{
name: 'inTexCoord',
size: 2,
type: gl.FLOAT,
type: config.renderer.gl.FLOAT,
normalized: false,
offset: Float32Array.BYTES_PER_ELEMENT * 2
},
{
name: 'inTint',
size: 4,
type: gl.UNSIGNED_BYTE,
type: config.renderer.gl.UNSIGNED_BYTE,
normalized: true,
offset: Float32Array.BYTES_PER_ELEMENT * 4
}

View file

@ -0,0 +1,18 @@
/**
* @author Richard Davey <rich@photonstorm.com>
* @copyright 2018 Photon Storm Ltd.
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
/**
* @namespace Phaser.Renderer.WebGL.Pipelines
*/
module.exports = {
BitmapMaskPipeline: require('./BitmapMaskPipeline'),
FlatTintPipeline: require('./FlatTintPipeline'),
ForwardDiffuseLightPipeline: require('./ForwardDiffuseLightPipeline'),
TextureTintPipeline: require('./TextureTintPipeline')
};