diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index 99fd267..4524008 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -35,7 +35,7 @@ { const glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); - if (this.shader !== shader) + // if (this.shader !== shader) { this.shader = shader; this.renderer._bindGLShader(glShader); diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index 99fd267..4524008 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -35,7 +35,7 @@ { const glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); - if (this.shader !== shader) + // if (this.shader !== shader) { this.shader = shader; this.renderer._bindGLShader(glShader); diff --git a/src/core/shader/generateUniformsSync.js b/src/core/shader/generateUniformsSync.js index 68b9c75..3e2b0ac 100644 --- a/src/core/shader/generateUniformsSync.js +++ b/src/core/shader/generateUniformsSync.js @@ -50,8 +50,6 @@ // TODO && uniformData[i].value !== 0 <-- do we still need this? if (data.type === 'float') { - //const template = GLSL_TO_SINGLE_SETTERS_CACHED[data.type].replace('location', `uniformData.${i}.location`); - func += `\nif(uniformValues.${i} !== uniformData.${i}.value) { uniformData.${i}.value = uniformValues.${i} diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index 99fd267..4524008 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -35,7 +35,7 @@ { const glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); - if (this.shader !== shader) + // if (this.shader !== shader) { this.shader = shader; this.renderer._bindGLShader(glShader); diff --git a/src/core/shader/generateUniformsSync.js b/src/core/shader/generateUniformsSync.js index 68b9c75..3e2b0ac 100644 --- a/src/core/shader/generateUniformsSync.js +++ b/src/core/shader/generateUniformsSync.js @@ -50,8 +50,6 @@ // TODO && uniformData[i].value !== 0 <-- do we still need this? if (data.type === 'float') { - //const template = GLSL_TO_SINGLE_SETTERS_CACHED[data.type].replace('location', `uniformData.${i}.location`); - func += `\nif(uniformValues.${i} !== uniformData.${i}.value) { uniformData.${i}.value = uniformValues.${i} diff --git a/src/mesh/Mesh.js b/src/mesh/Mesh.js index c930e91..2adc05c 100644 --- a/src/mesh/Mesh.js +++ b/src/mesh/Mesh.js @@ -34,8 +34,8 @@ * @default PIXI.BLEND_MODES.NORMAL * @see PIXI.BLEND_MODES */ - this.blendMode = core.BLEND_MODES.NORMAL; - + this.blendMode = core.BLEND_MODES.SCREEN; + this.state.blendMode = this.blendMode /** * The way the Mesh should be drawn, can be any of the {@link PIXI.mesh.Mesh.DRAW_MODES} consts * @@ -44,18 +44,18 @@ */ this.drawMode = drawMode; - // TODO uniform auto generation? - // make sure to add required feilds - this.uniforms = uniforms || shader.uniforms; + uniforms = uniforms || {}; - /** - * The tint applied to the mesh. This is a [r,g,b] value. A value of [1,1,1] will remove any - * tint effect. - * - * @member {number} - * @memberof PIXI.mesh.Mesh# - */ - this.tintRgb = new Float32Array([1, 1, 1]); + // make sure to add required feilds + for(let i in shader.uniforms) + { + if(uniforms[i] === undefined) + { + uniforms[i] = shader.uniforms[i]; + } + } + + this.uniforms = uniforms; /** * A map of renderer IDs to webgl render data @@ -99,16 +99,6 @@ } /** - * When the texture is updated, this event will fire to update the scale and frame - * - * @private - */ - _onTextureUpdate() - { - /* empty */ - } - - /** * Returns the bounds of the mesh as a rectangle. The bounds calculation takes the worldTransform into account. * */ diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index 99fd267..4524008 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -35,7 +35,7 @@ { const glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); - if (this.shader !== shader) + // if (this.shader !== shader) { this.shader = shader; this.renderer._bindGLShader(glShader); diff --git a/src/core/shader/generateUniformsSync.js b/src/core/shader/generateUniformsSync.js index 68b9c75..3e2b0ac 100644 --- a/src/core/shader/generateUniformsSync.js +++ b/src/core/shader/generateUniformsSync.js @@ -50,8 +50,6 @@ // TODO && uniformData[i].value !== 0 <-- do we still need this? if (data.type === 'float') { - //const template = GLSL_TO_SINGLE_SETTERS_CACHED[data.type].replace('location', `uniformData.${i}.location`); - func += `\nif(uniformValues.${i} !== uniformData.${i}.value) { uniformData.${i}.value = uniformValues.${i} diff --git a/src/mesh/Mesh.js b/src/mesh/Mesh.js index c930e91..2adc05c 100644 --- a/src/mesh/Mesh.js +++ b/src/mesh/Mesh.js @@ -34,8 +34,8 @@ * @default PIXI.BLEND_MODES.NORMAL * @see PIXI.BLEND_MODES */ - this.blendMode = core.BLEND_MODES.NORMAL; - + this.blendMode = core.BLEND_MODES.SCREEN; + this.state.blendMode = this.blendMode /** * The way the Mesh should be drawn, can be any of the {@link PIXI.mesh.Mesh.DRAW_MODES} consts * @@ -44,18 +44,18 @@ */ this.drawMode = drawMode; - // TODO uniform auto generation? - // make sure to add required feilds - this.uniforms = uniforms || shader.uniforms; + uniforms = uniforms || {}; - /** - * The tint applied to the mesh. This is a [r,g,b] value. A value of [1,1,1] will remove any - * tint effect. - * - * @member {number} - * @memberof PIXI.mesh.Mesh# - */ - this.tintRgb = new Float32Array([1, 1, 1]); + // make sure to add required feilds + for(let i in shader.uniforms) + { + if(uniforms[i] === undefined) + { + uniforms[i] = shader.uniforms[i]; + } + } + + this.uniforms = uniforms; /** * A map of renderer IDs to webgl render data @@ -99,16 +99,6 @@ } /** - * When the texture is updated, this event will fire to update the scale and frame - * - * @private - */ - _onTextureUpdate() - { - /* empty */ - } - - /** * Returns the bounds of the mesh as a rectangle. The bounds calculation takes the worldTransform into account. * */ diff --git a/src/mesh/Plane.js b/src/mesh/Plane.js index 4ad7ef5..2478458 100644 --- a/src/mesh/Plane.js +++ b/src/mesh/Plane.js @@ -43,19 +43,17 @@ .addAttribute('aTextureCoord', new Float32Array(2), 2) .addIndex(new Uint16Array(2)); - super(geometry, meshShader, 4); + const uniforms = { + uSampler2:texture, + alpha:1, + translationMatrix:null, + tint:new Float32Array([1, 1, 1]) + } + + super(geometry, meshShader, uniforms, 4); this.texture = texture; - /** - * Tracker for if the Plane is ready to be drawn. Needed because Mesh ctor can - * call _onTextureUpdated which could call refresh too early. - * - * @member {boolean} - * @private - */ - this._ready = true; - this.segmentsX = this.verticesX = verticesX || 10; this.segmentsY = this.verticesY = verticesY || 10; @@ -64,18 +62,39 @@ if (texture.baseTexture.hasLoaded) { - this._onTextureUpdate(); + this.refresh(); } else { - texture.once('update', this._onTextureUpdate, this); + texture.once('update', this.refresh, this); } - this.refresh(); - + this._tint = 0xFFFFFF; this.tint = 0xFFFFFF; } + set tint(value) + { + this._tint = value; + core.utils.hex2rgb(this._tint, this.uniforms.tint); + } + + get tint() + { + return this._tint; + } + + set texture(value) + { + this._texture = value; + this.uniforms.uSample2 = this.texture; + } + + get texture() + { + return this._texture; + } + /** * Refreshes * @@ -149,29 +168,6 @@ this.geometry.data.indexBuffer.update(); } - /** - * Clear texture UVs when new texture is set - * - * @private - */ - _onTextureUpdate() - { - // wait for the Plane ctor to finish before calling refresh - if (this._ready) - { - this.refresh(); - } - } - - _renderWebGL(renderer) - { - this.shader.uniforms.tint = core.utils.hex2rgb(this.tint, temp); - this.shader.uniforms.uSampler2 = this.texture; - - renderer.setObjectRenderer(renderer.plugins.mesh); - renderer.plugins.mesh.render(this); - } - updateTransform() { this.geometry.getAttribute('aVertexPosition').update(); diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index 99fd267..4524008 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -35,7 +35,7 @@ { const glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); - if (this.shader !== shader) + // if (this.shader !== shader) { this.shader = shader; this.renderer._bindGLShader(glShader); diff --git a/src/core/shader/generateUniformsSync.js b/src/core/shader/generateUniformsSync.js index 68b9c75..3e2b0ac 100644 --- a/src/core/shader/generateUniformsSync.js +++ b/src/core/shader/generateUniformsSync.js @@ -50,8 +50,6 @@ // TODO && uniformData[i].value !== 0 <-- do we still need this? if (data.type === 'float') { - //const template = GLSL_TO_SINGLE_SETTERS_CACHED[data.type].replace('location', `uniformData.${i}.location`); - func += `\nif(uniformValues.${i} !== uniformData.${i}.value) { uniformData.${i}.value = uniformValues.${i} diff --git a/src/mesh/Mesh.js b/src/mesh/Mesh.js index c930e91..2adc05c 100644 --- a/src/mesh/Mesh.js +++ b/src/mesh/Mesh.js @@ -34,8 +34,8 @@ * @default PIXI.BLEND_MODES.NORMAL * @see PIXI.BLEND_MODES */ - this.blendMode = core.BLEND_MODES.NORMAL; - + this.blendMode = core.BLEND_MODES.SCREEN; + this.state.blendMode = this.blendMode /** * The way the Mesh should be drawn, can be any of the {@link PIXI.mesh.Mesh.DRAW_MODES} consts * @@ -44,18 +44,18 @@ */ this.drawMode = drawMode; - // TODO uniform auto generation? - // make sure to add required feilds - this.uniforms = uniforms || shader.uniforms; + uniforms = uniforms || {}; - /** - * The tint applied to the mesh. This is a [r,g,b] value. A value of [1,1,1] will remove any - * tint effect. - * - * @member {number} - * @memberof PIXI.mesh.Mesh# - */ - this.tintRgb = new Float32Array([1, 1, 1]); + // make sure to add required feilds + for(let i in shader.uniforms) + { + if(uniforms[i] === undefined) + { + uniforms[i] = shader.uniforms[i]; + } + } + + this.uniforms = uniforms; /** * A map of renderer IDs to webgl render data @@ -99,16 +99,6 @@ } /** - * When the texture is updated, this event will fire to update the scale and frame - * - * @private - */ - _onTextureUpdate() - { - /* empty */ - } - - /** * Returns the bounds of the mesh as a rectangle. The bounds calculation takes the worldTransform into account. * */ diff --git a/src/mesh/Plane.js b/src/mesh/Plane.js index 4ad7ef5..2478458 100644 --- a/src/mesh/Plane.js +++ b/src/mesh/Plane.js @@ -43,19 +43,17 @@ .addAttribute('aTextureCoord', new Float32Array(2), 2) .addIndex(new Uint16Array(2)); - super(geometry, meshShader, 4); + const uniforms = { + uSampler2:texture, + alpha:1, + translationMatrix:null, + tint:new Float32Array([1, 1, 1]) + } + + super(geometry, meshShader, uniforms, 4); this.texture = texture; - /** - * Tracker for if the Plane is ready to be drawn. Needed because Mesh ctor can - * call _onTextureUpdated which could call refresh too early. - * - * @member {boolean} - * @private - */ - this._ready = true; - this.segmentsX = this.verticesX = verticesX || 10; this.segmentsY = this.verticesY = verticesY || 10; @@ -64,18 +62,39 @@ if (texture.baseTexture.hasLoaded) { - this._onTextureUpdate(); + this.refresh(); } else { - texture.once('update', this._onTextureUpdate, this); + texture.once('update', this.refresh, this); } - this.refresh(); - + this._tint = 0xFFFFFF; this.tint = 0xFFFFFF; } + set tint(value) + { + this._tint = value; + core.utils.hex2rgb(this._tint, this.uniforms.tint); + } + + get tint() + { + return this._tint; + } + + set texture(value) + { + this._texture = value; + this.uniforms.uSample2 = this.texture; + } + + get texture() + { + return this._texture; + } + /** * Refreshes * @@ -149,29 +168,6 @@ this.geometry.data.indexBuffer.update(); } - /** - * Clear texture UVs when new texture is set - * - * @private - */ - _onTextureUpdate() - { - // wait for the Plane ctor to finish before calling refresh - if (this._ready) - { - this.refresh(); - } - } - - _renderWebGL(renderer) - { - this.shader.uniforms.tint = core.utils.hex2rgb(this.tint, temp); - this.shader.uniforms.uSampler2 = this.texture; - - renderer.setObjectRenderer(renderer.plugins.mesh); - renderer.plugins.mesh.render(this); - } - updateTransform() { this.geometry.getAttribute('aVertexPosition').update(); diff --git a/src/mesh/Rope.js b/src/mesh/Rope.js index c324e6e..69fbea9 100644 --- a/src/mesh/Rope.js +++ b/src/mesh/Rope.js @@ -53,8 +53,6 @@ uniforms.translationMatrix = this.transform.worldTransform; - this.texture = texture; - /* * @member {PIXI.Point[]} An array of points that determine the rope */ @@ -63,14 +61,15 @@ this._tint = 0xFFFFFF; this.tint = 0xFFFFFF; + this.texture = texture; // wait for the texture to load if (texture.baseTexture.hasLoaded) { - this._onTextureUpdate(); + this.refresh(); } else { - texture.once('update', this._onTextureUpdate, this); + texture.once('update', this.refresh, this); } } @@ -85,17 +84,27 @@ return this._tint; } + set texture(value) + { + this._texture = value; + this.uniforms.uSampler2 = this.texture; + } + + get texture() + { + return this._texture; + } + /** * Refreshes */ refresh() { const points = this.points; - const vertices = this.geometry.getAttribute('aVertexPosition').data; - const uvs = this.geometry.getAttribute('aTextureCoord').data; - // TODO - lets make this more accessable... maybe a getIndx()? - const indices = this.geometry.data.indexBuffer.data; + const vertexBuffer = this.geometry.getAttribute('aVertexPosition'); + const uvBuffer = this.geometry.getAttribute('aTextureCoord'); + const indexBuffer = this.geometry.getIndex(); // if too little points, or texture hasn't got UVs set yet just move on. if (points.length < 1 || !this.texture._uvs) @@ -104,16 +113,17 @@ } // if the number of points has changed we will need to recreate the arraybuffers - if (vertices.length / 4 !== points.length) + if (vertexBuffer.data.length / 4 !== points.length) { - /* - this.vertices = new Float32Array(points.length * 4); - this.uvs = new Float32Array(points.length * 4); - this.colors = new Float32Array(points.length * 2); - this.indices = new Uint16Array(points.length * 2); - */ + vertexBuffer.data = new Float32Array(points.length * 4); + uvBuffer.data = new Float32Array(points.length * 4); + indexBuffer.data = new Uint16Array(points.length * 2); } + const vertices = vertexBuffer.data; + const uvs = uvBuffer.data; + const indices = indexBuffer.data; + const textureUvs = this.texture._uvs; const offset = new core.Point(textureUvs.x0, textureUvs.y0); const factor = new core.Point(textureUvs.x2 - textureUvs.x0, textureUvs.y2 - textureUvs.y0); @@ -146,19 +156,9 @@ } // ensure that the changes are uploaded - this.geometry.getAttribute('aVertexPosition').update(); - this.geometry.getAttribute('aTextureCoord').update(); - this.geometry.data.indexBuffer.update(); - } - - /** - * Clear texture UVs when new texture is set - * - * @private - */ - _onTextureUpdate() - { - this.refresh(); + vertexBuffer.update(); + uvBuffer.update(); + indexBuffer.update(); } /** @@ -182,7 +182,8 @@ // this.count -= 0.2; - const vertices = this.geometry.getAttribute('aVertexPosition').data; + const vertexBuffer = this.geometry.getAttribute('aVertexPosition'); + const vertices = vertexBuffer.data; const total = points.length; @@ -226,10 +227,10 @@ lastPoint = point; } - this.geometry.getAttribute('aVertexPosition').update(); + // mark the buffer as requiring an upload.. + vertexBuffer.update(); this.uniforms.alpha = this.worldAlpha; - this.uniforms.uSample2 = this.texture; this.containerUpdateTransform(); } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index 99fd267..4524008 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -35,7 +35,7 @@ { const glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); - if (this.shader !== shader) + // if (this.shader !== shader) { this.shader = shader; this.renderer._bindGLShader(glShader); diff --git a/src/core/shader/generateUniformsSync.js b/src/core/shader/generateUniformsSync.js index 68b9c75..3e2b0ac 100644 --- a/src/core/shader/generateUniformsSync.js +++ b/src/core/shader/generateUniformsSync.js @@ -50,8 +50,6 @@ // TODO && uniformData[i].value !== 0 <-- do we still need this? if (data.type === 'float') { - //const template = GLSL_TO_SINGLE_SETTERS_CACHED[data.type].replace('location', `uniformData.${i}.location`); - func += `\nif(uniformValues.${i} !== uniformData.${i}.value) { uniformData.${i}.value = uniformValues.${i} diff --git a/src/mesh/Mesh.js b/src/mesh/Mesh.js index c930e91..2adc05c 100644 --- a/src/mesh/Mesh.js +++ b/src/mesh/Mesh.js @@ -34,8 +34,8 @@ * @default PIXI.BLEND_MODES.NORMAL * @see PIXI.BLEND_MODES */ - this.blendMode = core.BLEND_MODES.NORMAL; - + this.blendMode = core.BLEND_MODES.SCREEN; + this.state.blendMode = this.blendMode /** * The way the Mesh should be drawn, can be any of the {@link PIXI.mesh.Mesh.DRAW_MODES} consts * @@ -44,18 +44,18 @@ */ this.drawMode = drawMode; - // TODO uniform auto generation? - // make sure to add required feilds - this.uniforms = uniforms || shader.uniforms; + uniforms = uniforms || {}; - /** - * The tint applied to the mesh. This is a [r,g,b] value. A value of [1,1,1] will remove any - * tint effect. - * - * @member {number} - * @memberof PIXI.mesh.Mesh# - */ - this.tintRgb = new Float32Array([1, 1, 1]); + // make sure to add required feilds + for(let i in shader.uniforms) + { + if(uniforms[i] === undefined) + { + uniforms[i] = shader.uniforms[i]; + } + } + + this.uniforms = uniforms; /** * A map of renderer IDs to webgl render data @@ -99,16 +99,6 @@ } /** - * When the texture is updated, this event will fire to update the scale and frame - * - * @private - */ - _onTextureUpdate() - { - /* empty */ - } - - /** * Returns the bounds of the mesh as a rectangle. The bounds calculation takes the worldTransform into account. * */ diff --git a/src/mesh/Plane.js b/src/mesh/Plane.js index 4ad7ef5..2478458 100644 --- a/src/mesh/Plane.js +++ b/src/mesh/Plane.js @@ -43,19 +43,17 @@ .addAttribute('aTextureCoord', new Float32Array(2), 2) .addIndex(new Uint16Array(2)); - super(geometry, meshShader, 4); + const uniforms = { + uSampler2:texture, + alpha:1, + translationMatrix:null, + tint:new Float32Array([1, 1, 1]) + } + + super(geometry, meshShader, uniforms, 4); this.texture = texture; - /** - * Tracker for if the Plane is ready to be drawn. Needed because Mesh ctor can - * call _onTextureUpdated which could call refresh too early. - * - * @member {boolean} - * @private - */ - this._ready = true; - this.segmentsX = this.verticesX = verticesX || 10; this.segmentsY = this.verticesY = verticesY || 10; @@ -64,18 +62,39 @@ if (texture.baseTexture.hasLoaded) { - this._onTextureUpdate(); + this.refresh(); } else { - texture.once('update', this._onTextureUpdate, this); + texture.once('update', this.refresh, this); } - this.refresh(); - + this._tint = 0xFFFFFF; this.tint = 0xFFFFFF; } + set tint(value) + { + this._tint = value; + core.utils.hex2rgb(this._tint, this.uniforms.tint); + } + + get tint() + { + return this._tint; + } + + set texture(value) + { + this._texture = value; + this.uniforms.uSample2 = this.texture; + } + + get texture() + { + return this._texture; + } + /** * Refreshes * @@ -149,29 +168,6 @@ this.geometry.data.indexBuffer.update(); } - /** - * Clear texture UVs when new texture is set - * - * @private - */ - _onTextureUpdate() - { - // wait for the Plane ctor to finish before calling refresh - if (this._ready) - { - this.refresh(); - } - } - - _renderWebGL(renderer) - { - this.shader.uniforms.tint = core.utils.hex2rgb(this.tint, temp); - this.shader.uniforms.uSampler2 = this.texture; - - renderer.setObjectRenderer(renderer.plugins.mesh); - renderer.plugins.mesh.render(this); - } - updateTransform() { this.geometry.getAttribute('aVertexPosition').update(); diff --git a/src/mesh/Rope.js b/src/mesh/Rope.js index c324e6e..69fbea9 100644 --- a/src/mesh/Rope.js +++ b/src/mesh/Rope.js @@ -53,8 +53,6 @@ uniforms.translationMatrix = this.transform.worldTransform; - this.texture = texture; - /* * @member {PIXI.Point[]} An array of points that determine the rope */ @@ -63,14 +61,15 @@ this._tint = 0xFFFFFF; this.tint = 0xFFFFFF; + this.texture = texture; // wait for the texture to load if (texture.baseTexture.hasLoaded) { - this._onTextureUpdate(); + this.refresh(); } else { - texture.once('update', this._onTextureUpdate, this); + texture.once('update', this.refresh, this); } } @@ -85,17 +84,27 @@ return this._tint; } + set texture(value) + { + this._texture = value; + this.uniforms.uSampler2 = this.texture; + } + + get texture() + { + return this._texture; + } + /** * Refreshes */ refresh() { const points = this.points; - const vertices = this.geometry.getAttribute('aVertexPosition').data; - const uvs = this.geometry.getAttribute('aTextureCoord').data; - // TODO - lets make this more accessable... maybe a getIndx()? - const indices = this.geometry.data.indexBuffer.data; + const vertexBuffer = this.geometry.getAttribute('aVertexPosition'); + const uvBuffer = this.geometry.getAttribute('aTextureCoord'); + const indexBuffer = this.geometry.getIndex(); // if too little points, or texture hasn't got UVs set yet just move on. if (points.length < 1 || !this.texture._uvs) @@ -104,16 +113,17 @@ } // if the number of points has changed we will need to recreate the arraybuffers - if (vertices.length / 4 !== points.length) + if (vertexBuffer.data.length / 4 !== points.length) { - /* - this.vertices = new Float32Array(points.length * 4); - this.uvs = new Float32Array(points.length * 4); - this.colors = new Float32Array(points.length * 2); - this.indices = new Uint16Array(points.length * 2); - */ + vertexBuffer.data = new Float32Array(points.length * 4); + uvBuffer.data = new Float32Array(points.length * 4); + indexBuffer.data = new Uint16Array(points.length * 2); } + const vertices = vertexBuffer.data; + const uvs = uvBuffer.data; + const indices = indexBuffer.data; + const textureUvs = this.texture._uvs; const offset = new core.Point(textureUvs.x0, textureUvs.y0); const factor = new core.Point(textureUvs.x2 - textureUvs.x0, textureUvs.y2 - textureUvs.y0); @@ -146,19 +156,9 @@ } // ensure that the changes are uploaded - this.geometry.getAttribute('aVertexPosition').update(); - this.geometry.getAttribute('aTextureCoord').update(); - this.geometry.data.indexBuffer.update(); - } - - /** - * Clear texture UVs when new texture is set - * - * @private - */ - _onTextureUpdate() - { - this.refresh(); + vertexBuffer.update(); + uvBuffer.update(); + indexBuffer.update(); } /** @@ -182,7 +182,8 @@ // this.count -= 0.2; - const vertices = this.geometry.getAttribute('aVertexPosition').data; + const vertexBuffer = this.geometry.getAttribute('aVertexPosition'); + const vertices = vertexBuffer.data; const total = points.length; @@ -226,10 +227,10 @@ lastPoint = point; } - this.geometry.getAttribute('aVertexPosition').update(); + // mark the buffer as requiring an upload.. + vertexBuffer.update(); this.uniforms.alpha = this.worldAlpha; - this.uniforms.uSample2 = this.texture; this.containerUpdateTransform(); } diff --git a/src/mesh/geometry/Geometry.js b/src/mesh/geometry/Geometry.js index 321949c..60bd81f 100644 --- a/src/mesh/geometry/Geometry.js +++ b/src/mesh/geometry/Geometry.js @@ -7,7 +7,6 @@ class Geometry { - constructor(data, style) { this.style = style || new GeometryStyle(); @@ -51,6 +50,11 @@ return this; } + getIndex() + { + return this.data.indexBuffer; + } + destroy() { //TODO - this is wrong! diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index 99fd267..4524008 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -35,7 +35,7 @@ { const glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); - if (this.shader !== shader) + // if (this.shader !== shader) { this.shader = shader; this.renderer._bindGLShader(glShader); diff --git a/src/core/shader/generateUniformsSync.js b/src/core/shader/generateUniformsSync.js index 68b9c75..3e2b0ac 100644 --- a/src/core/shader/generateUniformsSync.js +++ b/src/core/shader/generateUniformsSync.js @@ -50,8 +50,6 @@ // TODO && uniformData[i].value !== 0 <-- do we still need this? if (data.type === 'float') { - //const template = GLSL_TO_SINGLE_SETTERS_CACHED[data.type].replace('location', `uniformData.${i}.location`); - func += `\nif(uniformValues.${i} !== uniformData.${i}.value) { uniformData.${i}.value = uniformValues.${i} diff --git a/src/mesh/Mesh.js b/src/mesh/Mesh.js index c930e91..2adc05c 100644 --- a/src/mesh/Mesh.js +++ b/src/mesh/Mesh.js @@ -34,8 +34,8 @@ * @default PIXI.BLEND_MODES.NORMAL * @see PIXI.BLEND_MODES */ - this.blendMode = core.BLEND_MODES.NORMAL; - + this.blendMode = core.BLEND_MODES.SCREEN; + this.state.blendMode = this.blendMode /** * The way the Mesh should be drawn, can be any of the {@link PIXI.mesh.Mesh.DRAW_MODES} consts * @@ -44,18 +44,18 @@ */ this.drawMode = drawMode; - // TODO uniform auto generation? - // make sure to add required feilds - this.uniforms = uniforms || shader.uniforms; + uniforms = uniforms || {}; - /** - * The tint applied to the mesh. This is a [r,g,b] value. A value of [1,1,1] will remove any - * tint effect. - * - * @member {number} - * @memberof PIXI.mesh.Mesh# - */ - this.tintRgb = new Float32Array([1, 1, 1]); + // make sure to add required feilds + for(let i in shader.uniforms) + { + if(uniforms[i] === undefined) + { + uniforms[i] = shader.uniforms[i]; + } + } + + this.uniforms = uniforms; /** * A map of renderer IDs to webgl render data @@ -99,16 +99,6 @@ } /** - * When the texture is updated, this event will fire to update the scale and frame - * - * @private - */ - _onTextureUpdate() - { - /* empty */ - } - - /** * Returns the bounds of the mesh as a rectangle. The bounds calculation takes the worldTransform into account. * */ diff --git a/src/mesh/Plane.js b/src/mesh/Plane.js index 4ad7ef5..2478458 100644 --- a/src/mesh/Plane.js +++ b/src/mesh/Plane.js @@ -43,19 +43,17 @@ .addAttribute('aTextureCoord', new Float32Array(2), 2) .addIndex(new Uint16Array(2)); - super(geometry, meshShader, 4); + const uniforms = { + uSampler2:texture, + alpha:1, + translationMatrix:null, + tint:new Float32Array([1, 1, 1]) + } + + super(geometry, meshShader, uniforms, 4); this.texture = texture; - /** - * Tracker for if the Plane is ready to be drawn. Needed because Mesh ctor can - * call _onTextureUpdated which could call refresh too early. - * - * @member {boolean} - * @private - */ - this._ready = true; - this.segmentsX = this.verticesX = verticesX || 10; this.segmentsY = this.verticesY = verticesY || 10; @@ -64,18 +62,39 @@ if (texture.baseTexture.hasLoaded) { - this._onTextureUpdate(); + this.refresh(); } else { - texture.once('update', this._onTextureUpdate, this); + texture.once('update', this.refresh, this); } - this.refresh(); - + this._tint = 0xFFFFFF; this.tint = 0xFFFFFF; } + set tint(value) + { + this._tint = value; + core.utils.hex2rgb(this._tint, this.uniforms.tint); + } + + get tint() + { + return this._tint; + } + + set texture(value) + { + this._texture = value; + this.uniforms.uSample2 = this.texture; + } + + get texture() + { + return this._texture; + } + /** * Refreshes * @@ -149,29 +168,6 @@ this.geometry.data.indexBuffer.update(); } - /** - * Clear texture UVs when new texture is set - * - * @private - */ - _onTextureUpdate() - { - // wait for the Plane ctor to finish before calling refresh - if (this._ready) - { - this.refresh(); - } - } - - _renderWebGL(renderer) - { - this.shader.uniforms.tint = core.utils.hex2rgb(this.tint, temp); - this.shader.uniforms.uSampler2 = this.texture; - - renderer.setObjectRenderer(renderer.plugins.mesh); - renderer.plugins.mesh.render(this); - } - updateTransform() { this.geometry.getAttribute('aVertexPosition').update(); diff --git a/src/mesh/Rope.js b/src/mesh/Rope.js index c324e6e..69fbea9 100644 --- a/src/mesh/Rope.js +++ b/src/mesh/Rope.js @@ -53,8 +53,6 @@ uniforms.translationMatrix = this.transform.worldTransform; - this.texture = texture; - /* * @member {PIXI.Point[]} An array of points that determine the rope */ @@ -63,14 +61,15 @@ this._tint = 0xFFFFFF; this.tint = 0xFFFFFF; + this.texture = texture; // wait for the texture to load if (texture.baseTexture.hasLoaded) { - this._onTextureUpdate(); + this.refresh(); } else { - texture.once('update', this._onTextureUpdate, this); + texture.once('update', this.refresh, this); } } @@ -85,17 +84,27 @@ return this._tint; } + set texture(value) + { + this._texture = value; + this.uniforms.uSampler2 = this.texture; + } + + get texture() + { + return this._texture; + } + /** * Refreshes */ refresh() { const points = this.points; - const vertices = this.geometry.getAttribute('aVertexPosition').data; - const uvs = this.geometry.getAttribute('aTextureCoord').data; - // TODO - lets make this more accessable... maybe a getIndx()? - const indices = this.geometry.data.indexBuffer.data; + const vertexBuffer = this.geometry.getAttribute('aVertexPosition'); + const uvBuffer = this.geometry.getAttribute('aTextureCoord'); + const indexBuffer = this.geometry.getIndex(); // if too little points, or texture hasn't got UVs set yet just move on. if (points.length < 1 || !this.texture._uvs) @@ -104,16 +113,17 @@ } // if the number of points has changed we will need to recreate the arraybuffers - if (vertices.length / 4 !== points.length) + if (vertexBuffer.data.length / 4 !== points.length) { - /* - this.vertices = new Float32Array(points.length * 4); - this.uvs = new Float32Array(points.length * 4); - this.colors = new Float32Array(points.length * 2); - this.indices = new Uint16Array(points.length * 2); - */ + vertexBuffer.data = new Float32Array(points.length * 4); + uvBuffer.data = new Float32Array(points.length * 4); + indexBuffer.data = new Uint16Array(points.length * 2); } + const vertices = vertexBuffer.data; + const uvs = uvBuffer.data; + const indices = indexBuffer.data; + const textureUvs = this.texture._uvs; const offset = new core.Point(textureUvs.x0, textureUvs.y0); const factor = new core.Point(textureUvs.x2 - textureUvs.x0, textureUvs.y2 - textureUvs.y0); @@ -146,19 +156,9 @@ } // ensure that the changes are uploaded - this.geometry.getAttribute('aVertexPosition').update(); - this.geometry.getAttribute('aTextureCoord').update(); - this.geometry.data.indexBuffer.update(); - } - - /** - * Clear texture UVs when new texture is set - * - * @private - */ - _onTextureUpdate() - { - this.refresh(); + vertexBuffer.update(); + uvBuffer.update(); + indexBuffer.update(); } /** @@ -182,7 +182,8 @@ // this.count -= 0.2; - const vertices = this.geometry.getAttribute('aVertexPosition').data; + const vertexBuffer = this.geometry.getAttribute('aVertexPosition'); + const vertices = vertexBuffer.data; const total = points.length; @@ -226,10 +227,10 @@ lastPoint = point; } - this.geometry.getAttribute('aVertexPosition').update(); + // mark the buffer as requiring an upload.. + vertexBuffer.update(); this.uniforms.alpha = this.worldAlpha; - this.uniforms.uSample2 = this.texture; this.containerUpdateTransform(); } diff --git a/src/mesh/geometry/Geometry.js b/src/mesh/geometry/Geometry.js index 321949c..60bd81f 100644 --- a/src/mesh/geometry/Geometry.js +++ b/src/mesh/geometry/Geometry.js @@ -7,7 +7,6 @@ class Geometry { - constructor(data, style) { this.style = style || new GeometryStyle(); @@ -51,6 +50,11 @@ return this; } + getIndex() + { + return this.data.indexBuffer; + } + destroy() { //TODO - this is wrong! diff --git a/src/mesh/webgl/MeshRenderer copy.js b/src/mesh/webgl/MeshRenderer copy.js deleted file mode 100644 index e712a9f..0000000 --- a/src/mesh/webgl/MeshRenderer copy.js +++ /dev/null @@ -1,110 +0,0 @@ -import * as core from '../../core'; -import glCore from 'pixi-gl-core'; -import { default as Mesh } from '../Mesh'; - -const glslify = require('glslify'); // eslint-disable-line no-undef - -/** - * WebGL renderer plugin for tiling sprites - */ -export default class MeshRenderer extends core.ObjectRenderer { - - /** - * constructor for renderer - * - * @param {WebGLRenderer} renderer The renderer this tiling awesomeness works for. - */ - constructor(renderer) - { - super(renderer); - - this.shader = null; - } - - /** - * Sets up the renderer context and necessary buffers. - * - * @private - */ - onContextChange() - { - const gl = this.renderer.gl; - - this.shader = new glCore.GLShader(gl, - glslify('./mesh.vert'), - glslify('./mesh.frag'), - core.PRECISION.DEFAULT); - } - - /** - * renders mesh - * - * @param {PIXI.mesh.Mesh} mesh mesh instance - */ - render(mesh) - { - const renderer = this.renderer; - const gl = renderer.gl; - const texture = mesh._texture; - - if (!texture.valid) - { - return; - } - - let glData = mesh._glDatas[renderer.CONTEXT_UID]; - - if (!glData) - { - glData = { - shader: this.shader, - vertexBuffer: glCore.GLBuffer.createVertexBuffer(gl, mesh.vertices, gl.STREAM_DRAW), - uvBuffer: glCore.GLBuffer.createVertexBuffer(gl, mesh.uvs, gl.STREAM_DRAW), - indexBuffer: glCore.GLBuffer.createIndexBuffer(gl, mesh.indices, gl.STATIC_DRAW), - // build the vao object that will render.. - vao: new glCore.VertexArrayObject(gl), - dirty: mesh.dirty, - indexDirty: mesh.indexDirty, - }; - - // build the vao object that will render.. - glData.vao = new glCore.VertexArrayObject(gl) - .addIndex(glData.indexBuffer) - .addAttribute(glData.vertexBuffer, glData.shader.attributes.aVertexPosition, gl.FLOAT, false, 2 * 4, 0) - .addAttribute(glData.uvBuffer, glData.shader.attributes.aTextureCoord, gl.FLOAT, false, 2 * 4, 0); - - mesh._glDatas[renderer.CONTEXT_UID] = glData; - } - - if (mesh.dirty !== glData.dirty) - { - glData.dirty = mesh.dirty; - glData.uvBuffer.upload(); - } - - if (mesh.indexDirty !== glData.indexDirty) - { - glData.indexDirty = mesh.indexDirty; - glData.indexBuffer.upload(); - } - - glData.vertexBuffer.upload(); - - renderer._bindGLShader(glData.shader); - - glData.shader.uniforms.uSampler = renderer.bindTexture(texture); - renderer.state.setBlendMode(mesh.blendMode); - - glData.shader.uniforms.translationMatrix = mesh.worldTransform.toArray(true); - glData.shader.uniforms.alpha = mesh.worldAlpha; - glData.shader.uniforms.tint = mesh.tintRgb; - - const drawMode = mesh.drawMode === Mesh.DRAW_MODES.TRIANGLE_MESH ? gl.TRIANGLE_STRIP : gl.TRIANGLES; - - glData.vao.bind() - .draw(drawMode, mesh.indices.length) - .unbind(); - } -} - -core.WebGLRenderer.registerPlugin('mesh', MeshRenderer);