diff --git a/src/core/geometry/Buffer.js b/src/core/geometry/Buffer.js index 43d49bf..782d2c2 100644 --- a/src/core/geometry/Buffer.js +++ b/src/core/geometry/Buffer.js @@ -19,7 +19,7 @@ * * @type {ArrayBuffer| SharedArrayBuffer|ArrayBufferView} data the array / typedArray */ - this.data = data; + this.data = data || new Float32Array(1); /** * A map of renderer IDs to webgl buffer @@ -27,7 +27,7 @@ * @private * @member {object} */ - this._glBuffers = []; + this._glBuffers = {}; this._updateID = 0; @@ -42,8 +42,9 @@ /** * flags this buffer as requiring an upload to the GPU */ - update() + update(data) { + this.data = data || this.data; this._updateID++; } diff --git a/src/core/geometry/Buffer.js b/src/core/geometry/Buffer.js index 43d49bf..782d2c2 100644 --- a/src/core/geometry/Buffer.js +++ b/src/core/geometry/Buffer.js @@ -19,7 +19,7 @@ * * @type {ArrayBuffer| SharedArrayBuffer|ArrayBufferView} data the array / typedArray */ - this.data = data; + this.data = data || new Float32Array(1); /** * A map of renderer IDs to webgl buffer @@ -27,7 +27,7 @@ * @private * @member {object} */ - this._glBuffers = []; + this._glBuffers = {}; this._updateID = 0; @@ -42,8 +42,9 @@ /** * flags this buffer as requiring an upload to the GPU */ - update() + update(data) { + this.data = data || this.data; this._updateID++; } diff --git a/src/core/geometry/Geometry.js b/src/core/geometry/Geometry.js index 297a86b..83f0118 100644 --- a/src/core/geometry/Geometry.js +++ b/src/core/geometry/Geometry.js @@ -56,7 +56,7 @@ * @private * @type {Array} */ - this.glVertexArrayObjects = []; + this.glVertexArrayObjects = {}; this.id = UID++; } diff --git a/src/core/geometry/Buffer.js b/src/core/geometry/Buffer.js index 43d49bf..782d2c2 100644 --- a/src/core/geometry/Buffer.js +++ b/src/core/geometry/Buffer.js @@ -19,7 +19,7 @@ * * @type {ArrayBuffer| SharedArrayBuffer|ArrayBufferView} data the array / typedArray */ - this.data = data; + this.data = data || new Float32Array(1); /** * A map of renderer IDs to webgl buffer @@ -27,7 +27,7 @@ * @private * @member {object} */ - this._glBuffers = []; + this._glBuffers = {}; this._updateID = 0; @@ -42,8 +42,9 @@ /** * flags this buffer as requiring an upload to the GPU */ - update() + update(data) { + this.data = data || this.data; this._updateID++; } diff --git a/src/core/geometry/Geometry.js b/src/core/geometry/Geometry.js index 297a86b..83f0118 100644 --- a/src/core/geometry/Geometry.js +++ b/src/core/geometry/Geometry.js @@ -56,7 +56,7 @@ * @private * @type {Array} */ - this.glVertexArrayObjects = []; + this.glVertexArrayObjects = {}; this.id = UID++; } diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index be4c4fb..aafdfe2 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -748,7 +748,7 @@ } else { - renderer.setObjectRenderer(renderer.plugins.graphics); + renderer.batch.setObjectRenderer(renderer.plugins.graphics); renderer.plugins.graphics.render(this); } } diff --git a/src/core/geometry/Buffer.js b/src/core/geometry/Buffer.js index 43d49bf..782d2c2 100644 --- a/src/core/geometry/Buffer.js +++ b/src/core/geometry/Buffer.js @@ -19,7 +19,7 @@ * * @type {ArrayBuffer| SharedArrayBuffer|ArrayBufferView} data the array / typedArray */ - this.data = data; + this.data = data || new Float32Array(1); /** * A map of renderer IDs to webgl buffer @@ -27,7 +27,7 @@ * @private * @member {object} */ - this._glBuffers = []; + this._glBuffers = {}; this._updateID = 0; @@ -42,8 +42,9 @@ /** * flags this buffer as requiring an upload to the GPU */ - update() + update(data) { + this.data = data || this.data; this._updateID++; } diff --git a/src/core/geometry/Geometry.js b/src/core/geometry/Geometry.js index 297a86b..83f0118 100644 --- a/src/core/geometry/Geometry.js +++ b/src/core/geometry/Geometry.js @@ -56,7 +56,7 @@ * @private * @type {Array} */ - this.glVertexArrayObjects = []; + this.glVertexArrayObjects = {}; this.id = UID++; } diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index be4c4fb..aafdfe2 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -748,7 +748,7 @@ } else { - renderer.setObjectRenderer(renderer.plugins.graphics); + renderer.batch.setObjectRenderer(renderer.plugins.graphics); renderer.plugins.graphics.render(this); } } diff --git a/src/core/graphics/webgl/GraphicsRenderer.js b/src/core/graphics/webgl/GraphicsRenderer.js index 67f5e92..4de266d 100644 --- a/src/core/graphics/webgl/GraphicsRenderer.js +++ b/src/core/graphics/webgl/GraphicsRenderer.js @@ -2,6 +2,8 @@ import { SHAPES } from '../../const'; import ObjectRenderer from '../../renderers/webgl/utils/ObjectRenderer'; import WebGLRenderer from '../../renderers/webgl/WebGLRenderer'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; import WebGLGraphicsData from './WebGLGraphicsData'; import PrimitiveShader from './shaders/PrimitiveShader'; @@ -28,8 +30,8 @@ this.graphicsDataPool = []; - this.primitiveShader = null; - + this.primitiveShader = new PrimitiveShader(); + this.primitiveShader.uniforms.globals = renderer.globalUniforms this.gl = renderer.gl; // easy access! @@ -46,7 +48,6 @@ { this.gl = this.renderer.gl; this.CONTEXT_UID = this.renderer.CONTEXT_UID; - this.primitiveShader = new PrimitiveShader(this.gl); } /** @@ -88,28 +89,26 @@ // This could be speeded up for sure! const shader = this.primitiveShader; - renderer._bindGLShader(shader); renderer.state.setBlendMode(graphics.blendMode); for (let i = 0, n = webGL.data.length; i < n; i++) { webGLData = webGL.data[i]; - const shaderTemp = webGLData.shader; - renderer._bindGLShader(shaderTemp); - shaderTemp.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); - shaderTemp.uniforms.tint = hex2rgb(graphics.tint); - shaderTemp.uniforms.alpha = graphics.worldAlpha; + shader.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); + shader.uniforms.tint = hex2rgb(graphics.tint); + shader.uniforms.alpha = graphics.worldAlpha; - renderer.bindVao(webGLData.vao); + renderer.shader.bind(shader); + renderer.geometry.bind(webGLData.geometry, renderer.shader.getGLShader()); if (graphics.nativeLines) { - gl.drawArrays(gl.LINES, 0, webGLData.points.length / 6); + renderer.geometry.draw(gl.LINES, webGLData.indices.length/6); } else { - webGLData.vao.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); + renderer.geometry.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); } } } @@ -184,7 +183,7 @@ webGL.lastIndex++; } - this.renderer.bindVao(null); + //this.renderer.geometry.bindVao(null); // upload all the dirty data... for (let i = 0; i < webGL.data.length; i++) @@ -211,9 +210,7 @@ if (!webGLData || webGLData.points.length > 320000) { - webGLData = this.graphicsDataPool.pop() - || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); - + webGLData = this.graphicsDataPool.pop() || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); webGLData.reset(type); gl.data.push(webGLData); } diff --git a/src/core/geometry/Buffer.js b/src/core/geometry/Buffer.js index 43d49bf..782d2c2 100644 --- a/src/core/geometry/Buffer.js +++ b/src/core/geometry/Buffer.js @@ -19,7 +19,7 @@ * * @type {ArrayBuffer| SharedArrayBuffer|ArrayBufferView} data the array / typedArray */ - this.data = data; + this.data = data || new Float32Array(1); /** * A map of renderer IDs to webgl buffer @@ -27,7 +27,7 @@ * @private * @member {object} */ - this._glBuffers = []; + this._glBuffers = {}; this._updateID = 0; @@ -42,8 +42,9 @@ /** * flags this buffer as requiring an upload to the GPU */ - update() + update(data) { + this.data = data || this.data; this._updateID++; } diff --git a/src/core/geometry/Geometry.js b/src/core/geometry/Geometry.js index 297a86b..83f0118 100644 --- a/src/core/geometry/Geometry.js +++ b/src/core/geometry/Geometry.js @@ -56,7 +56,7 @@ * @private * @type {Array} */ - this.glVertexArrayObjects = []; + this.glVertexArrayObjects = {}; this.id = UID++; } diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index be4c4fb..aafdfe2 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -748,7 +748,7 @@ } else { - renderer.setObjectRenderer(renderer.plugins.graphics); + renderer.batch.setObjectRenderer(renderer.plugins.graphics); renderer.plugins.graphics.render(this); } } diff --git a/src/core/graphics/webgl/GraphicsRenderer.js b/src/core/graphics/webgl/GraphicsRenderer.js index 67f5e92..4de266d 100644 --- a/src/core/graphics/webgl/GraphicsRenderer.js +++ b/src/core/graphics/webgl/GraphicsRenderer.js @@ -2,6 +2,8 @@ import { SHAPES } from '../../const'; import ObjectRenderer from '../../renderers/webgl/utils/ObjectRenderer'; import WebGLRenderer from '../../renderers/webgl/WebGLRenderer'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; import WebGLGraphicsData from './WebGLGraphicsData'; import PrimitiveShader from './shaders/PrimitiveShader'; @@ -28,8 +30,8 @@ this.graphicsDataPool = []; - this.primitiveShader = null; - + this.primitiveShader = new PrimitiveShader(); + this.primitiveShader.uniforms.globals = renderer.globalUniforms this.gl = renderer.gl; // easy access! @@ -46,7 +48,6 @@ { this.gl = this.renderer.gl; this.CONTEXT_UID = this.renderer.CONTEXT_UID; - this.primitiveShader = new PrimitiveShader(this.gl); } /** @@ -88,28 +89,26 @@ // This could be speeded up for sure! const shader = this.primitiveShader; - renderer._bindGLShader(shader); renderer.state.setBlendMode(graphics.blendMode); for (let i = 0, n = webGL.data.length; i < n; i++) { webGLData = webGL.data[i]; - const shaderTemp = webGLData.shader; - renderer._bindGLShader(shaderTemp); - shaderTemp.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); - shaderTemp.uniforms.tint = hex2rgb(graphics.tint); - shaderTemp.uniforms.alpha = graphics.worldAlpha; + shader.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); + shader.uniforms.tint = hex2rgb(graphics.tint); + shader.uniforms.alpha = graphics.worldAlpha; - renderer.bindVao(webGLData.vao); + renderer.shader.bind(shader); + renderer.geometry.bind(webGLData.geometry, renderer.shader.getGLShader()); if (graphics.nativeLines) { - gl.drawArrays(gl.LINES, 0, webGLData.points.length / 6); + renderer.geometry.draw(gl.LINES, webGLData.indices.length/6); } else { - webGLData.vao.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); + renderer.geometry.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); } } } @@ -184,7 +183,7 @@ webGL.lastIndex++; } - this.renderer.bindVao(null); + //this.renderer.geometry.bindVao(null); // upload all the dirty data... for (let i = 0; i < webGL.data.length; i++) @@ -211,9 +210,7 @@ if (!webGLData || webGLData.points.length > 320000) { - webGLData = this.graphicsDataPool.pop() - || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); - + webGLData = this.graphicsDataPool.pop() || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); webGLData.reset(type); gl.data.push(webGLData); } diff --git a/src/core/graphics/webgl/WebGLGraphicsData.js b/src/core/graphics/webgl/WebGLGraphicsData.js index a24030e..967ca78 100644 --- a/src/core/graphics/webgl/WebGLGraphicsData.js +++ b/src/core/graphics/webgl/WebGLGraphicsData.js @@ -1,4 +1,6 @@ import glCore from 'pixi-gl-core'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; /** * An object containing WebGL specific properties to be used by the WebGL renderer @@ -45,13 +47,13 @@ * The main buffer * @member {WebGLBuffer} */ - this.buffer = glCore.GLBuffer.createVertexBuffer(gl); + this.buffer = new Buffer(); /** * The index buffer * @member {WebGLBuffer} */ - this.indexBuffer = glCore.GLBuffer.createIndexBuffer(gl); + this.indexBuffer = new Buffer(); /** * Whether this graphics is dirty or not @@ -59,8 +61,6 @@ */ this.dirty = true; - this.glPoints = null; - this.glIndices = null; /** * @@ -68,10 +68,9 @@ */ this.shader = shader; - this.vao = new glCore.VertexArrayObject(gl, attribsState) - .addIndex(this.indexBuffer) - .addAttribute(this.buffer, shader.attributes.aVertexPosition, gl.FLOAT, false, 4 * 6, 0) - .addAttribute(this.buffer, shader.attributes.aColor, gl.FLOAT, false, 4 * 6, 2 * 4); + this.geometry = new Geometry() + .addAttribute('aVertexPosition|aColor', this.buffer) + .addIndex(this.indexBuffer); } /** @@ -79,6 +78,7 @@ */ reset() { + this.points.length = 0; this.indices.length = 0; } @@ -89,11 +89,12 @@ upload() { this.glPoints = new Float32Array(this.points); - this.buffer.upload(this.glPoints); + this.buffer.update(this.glPoints); this.glIndices = new Uint16Array(this.indices); - this.indexBuffer.upload(this.glIndices); + this.indexBuffer.update(this.glIndices); + // console.log("UPKOADING,.",this.glPoints,this.glIndices) this.dirty = false; } diff --git a/src/core/geometry/Buffer.js b/src/core/geometry/Buffer.js index 43d49bf..782d2c2 100644 --- a/src/core/geometry/Buffer.js +++ b/src/core/geometry/Buffer.js @@ -19,7 +19,7 @@ * * @type {ArrayBuffer| SharedArrayBuffer|ArrayBufferView} data the array / typedArray */ - this.data = data; + this.data = data || new Float32Array(1); /** * A map of renderer IDs to webgl buffer @@ -27,7 +27,7 @@ * @private * @member {object} */ - this._glBuffers = []; + this._glBuffers = {}; this._updateID = 0; @@ -42,8 +42,9 @@ /** * flags this buffer as requiring an upload to the GPU */ - update() + update(data) { + this.data = data || this.data; this._updateID++; } diff --git a/src/core/geometry/Geometry.js b/src/core/geometry/Geometry.js index 297a86b..83f0118 100644 --- a/src/core/geometry/Geometry.js +++ b/src/core/geometry/Geometry.js @@ -56,7 +56,7 @@ * @private * @type {Array} */ - this.glVertexArrayObjects = []; + this.glVertexArrayObjects = {}; this.id = UID++; } diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index be4c4fb..aafdfe2 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -748,7 +748,7 @@ } else { - renderer.setObjectRenderer(renderer.plugins.graphics); + renderer.batch.setObjectRenderer(renderer.plugins.graphics); renderer.plugins.graphics.render(this); } } diff --git a/src/core/graphics/webgl/GraphicsRenderer.js b/src/core/graphics/webgl/GraphicsRenderer.js index 67f5e92..4de266d 100644 --- a/src/core/graphics/webgl/GraphicsRenderer.js +++ b/src/core/graphics/webgl/GraphicsRenderer.js @@ -2,6 +2,8 @@ import { SHAPES } from '../../const'; import ObjectRenderer from '../../renderers/webgl/utils/ObjectRenderer'; import WebGLRenderer from '../../renderers/webgl/WebGLRenderer'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; import WebGLGraphicsData from './WebGLGraphicsData'; import PrimitiveShader from './shaders/PrimitiveShader'; @@ -28,8 +30,8 @@ this.graphicsDataPool = []; - this.primitiveShader = null; - + this.primitiveShader = new PrimitiveShader(); + this.primitiveShader.uniforms.globals = renderer.globalUniforms this.gl = renderer.gl; // easy access! @@ -46,7 +48,6 @@ { this.gl = this.renderer.gl; this.CONTEXT_UID = this.renderer.CONTEXT_UID; - this.primitiveShader = new PrimitiveShader(this.gl); } /** @@ -88,28 +89,26 @@ // This could be speeded up for sure! const shader = this.primitiveShader; - renderer._bindGLShader(shader); renderer.state.setBlendMode(graphics.blendMode); for (let i = 0, n = webGL.data.length; i < n; i++) { webGLData = webGL.data[i]; - const shaderTemp = webGLData.shader; - renderer._bindGLShader(shaderTemp); - shaderTemp.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); - shaderTemp.uniforms.tint = hex2rgb(graphics.tint); - shaderTemp.uniforms.alpha = graphics.worldAlpha; + shader.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); + shader.uniforms.tint = hex2rgb(graphics.tint); + shader.uniforms.alpha = graphics.worldAlpha; - renderer.bindVao(webGLData.vao); + renderer.shader.bind(shader); + renderer.geometry.bind(webGLData.geometry, renderer.shader.getGLShader()); if (graphics.nativeLines) { - gl.drawArrays(gl.LINES, 0, webGLData.points.length / 6); + renderer.geometry.draw(gl.LINES, webGLData.indices.length/6); } else { - webGLData.vao.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); + renderer.geometry.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); } } } @@ -184,7 +183,7 @@ webGL.lastIndex++; } - this.renderer.bindVao(null); + //this.renderer.geometry.bindVao(null); // upload all the dirty data... for (let i = 0; i < webGL.data.length; i++) @@ -211,9 +210,7 @@ if (!webGLData || webGLData.points.length > 320000) { - webGLData = this.graphicsDataPool.pop() - || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); - + webGLData = this.graphicsDataPool.pop() || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); webGLData.reset(type); gl.data.push(webGLData); } diff --git a/src/core/graphics/webgl/WebGLGraphicsData.js b/src/core/graphics/webgl/WebGLGraphicsData.js index a24030e..967ca78 100644 --- a/src/core/graphics/webgl/WebGLGraphicsData.js +++ b/src/core/graphics/webgl/WebGLGraphicsData.js @@ -1,4 +1,6 @@ import glCore from 'pixi-gl-core'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; /** * An object containing WebGL specific properties to be used by the WebGL renderer @@ -45,13 +47,13 @@ * The main buffer * @member {WebGLBuffer} */ - this.buffer = glCore.GLBuffer.createVertexBuffer(gl); + this.buffer = new Buffer(); /** * The index buffer * @member {WebGLBuffer} */ - this.indexBuffer = glCore.GLBuffer.createIndexBuffer(gl); + this.indexBuffer = new Buffer(); /** * Whether this graphics is dirty or not @@ -59,8 +61,6 @@ */ this.dirty = true; - this.glPoints = null; - this.glIndices = null; /** * @@ -68,10 +68,9 @@ */ this.shader = shader; - this.vao = new glCore.VertexArrayObject(gl, attribsState) - .addIndex(this.indexBuffer) - .addAttribute(this.buffer, shader.attributes.aVertexPosition, gl.FLOAT, false, 4 * 6, 0) - .addAttribute(this.buffer, shader.attributes.aColor, gl.FLOAT, false, 4 * 6, 2 * 4); + this.geometry = new Geometry() + .addAttribute('aVertexPosition|aColor', this.buffer) + .addIndex(this.indexBuffer); } /** @@ -79,6 +78,7 @@ */ reset() { + this.points.length = 0; this.indices.length = 0; } @@ -89,11 +89,12 @@ upload() { this.glPoints = new Float32Array(this.points); - this.buffer.upload(this.glPoints); + this.buffer.update(this.glPoints); this.glIndices = new Uint16Array(this.indices); - this.indexBuffer.upload(this.glIndices); + this.indexBuffer.update(this.glIndices); + // console.log("UPKOADING,.",this.glPoints,this.glIndices) this.dirty = false; } diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 5ba9799..d2c4156 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,5 @@ -import { GLShader } from 'pixi-gl-core'; +import Shader from '../../../shader/Shader'; +import Program from '../../../shader/Program'; import { PRECISION } from '../../../const'; /** @@ -8,16 +9,14 @@ * @memberof PIXI * @extends PIXI.Shader */ -export default class PrimitiveShader extends GLShader +export default class PrimitiveShader extends Shader { /** * @param {WebGLRenderingContext} gl - The webgl shader manager this shader works for. */ - constructor(gl) + constructor() { - super(gl, - // vertex shader - [ + const program = Program.from([ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -41,8 +40,8 @@ 'void main(void){', ' gl_FragColor = vColor;', '}', - ].join('\n'), - PRECISION.DEFAULT - ); + ].join('\n')); + + super(program, {}) } } diff --git a/src/core/geometry/Buffer.js b/src/core/geometry/Buffer.js index 43d49bf..782d2c2 100644 --- a/src/core/geometry/Buffer.js +++ b/src/core/geometry/Buffer.js @@ -19,7 +19,7 @@ * * @type {ArrayBuffer| SharedArrayBuffer|ArrayBufferView} data the array / typedArray */ - this.data = data; + this.data = data || new Float32Array(1); /** * A map of renderer IDs to webgl buffer @@ -27,7 +27,7 @@ * @private * @member {object} */ - this._glBuffers = []; + this._glBuffers = {}; this._updateID = 0; @@ -42,8 +42,9 @@ /** * flags this buffer as requiring an upload to the GPU */ - update() + update(data) { + this.data = data || this.data; this._updateID++; } diff --git a/src/core/geometry/Geometry.js b/src/core/geometry/Geometry.js index 297a86b..83f0118 100644 --- a/src/core/geometry/Geometry.js +++ b/src/core/geometry/Geometry.js @@ -56,7 +56,7 @@ * @private * @type {Array} */ - this.glVertexArrayObjects = []; + this.glVertexArrayObjects = {}; this.id = UID++; } diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index be4c4fb..aafdfe2 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -748,7 +748,7 @@ } else { - renderer.setObjectRenderer(renderer.plugins.graphics); + renderer.batch.setObjectRenderer(renderer.plugins.graphics); renderer.plugins.graphics.render(this); } } diff --git a/src/core/graphics/webgl/GraphicsRenderer.js b/src/core/graphics/webgl/GraphicsRenderer.js index 67f5e92..4de266d 100644 --- a/src/core/graphics/webgl/GraphicsRenderer.js +++ b/src/core/graphics/webgl/GraphicsRenderer.js @@ -2,6 +2,8 @@ import { SHAPES } from '../../const'; import ObjectRenderer from '../../renderers/webgl/utils/ObjectRenderer'; import WebGLRenderer from '../../renderers/webgl/WebGLRenderer'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; import WebGLGraphicsData from './WebGLGraphicsData'; import PrimitiveShader from './shaders/PrimitiveShader'; @@ -28,8 +30,8 @@ this.graphicsDataPool = []; - this.primitiveShader = null; - + this.primitiveShader = new PrimitiveShader(); + this.primitiveShader.uniforms.globals = renderer.globalUniforms this.gl = renderer.gl; // easy access! @@ -46,7 +48,6 @@ { this.gl = this.renderer.gl; this.CONTEXT_UID = this.renderer.CONTEXT_UID; - this.primitiveShader = new PrimitiveShader(this.gl); } /** @@ -88,28 +89,26 @@ // This could be speeded up for sure! const shader = this.primitiveShader; - renderer._bindGLShader(shader); renderer.state.setBlendMode(graphics.blendMode); for (let i = 0, n = webGL.data.length; i < n; i++) { webGLData = webGL.data[i]; - const shaderTemp = webGLData.shader; - renderer._bindGLShader(shaderTemp); - shaderTemp.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); - shaderTemp.uniforms.tint = hex2rgb(graphics.tint); - shaderTemp.uniforms.alpha = graphics.worldAlpha; + shader.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); + shader.uniforms.tint = hex2rgb(graphics.tint); + shader.uniforms.alpha = graphics.worldAlpha; - renderer.bindVao(webGLData.vao); + renderer.shader.bind(shader); + renderer.geometry.bind(webGLData.geometry, renderer.shader.getGLShader()); if (graphics.nativeLines) { - gl.drawArrays(gl.LINES, 0, webGLData.points.length / 6); + renderer.geometry.draw(gl.LINES, webGLData.indices.length/6); } else { - webGLData.vao.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); + renderer.geometry.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); } } } @@ -184,7 +183,7 @@ webGL.lastIndex++; } - this.renderer.bindVao(null); + //this.renderer.geometry.bindVao(null); // upload all the dirty data... for (let i = 0; i < webGL.data.length; i++) @@ -211,9 +210,7 @@ if (!webGLData || webGLData.points.length > 320000) { - webGLData = this.graphicsDataPool.pop() - || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); - + webGLData = this.graphicsDataPool.pop() || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); webGLData.reset(type); gl.data.push(webGLData); } diff --git a/src/core/graphics/webgl/WebGLGraphicsData.js b/src/core/graphics/webgl/WebGLGraphicsData.js index a24030e..967ca78 100644 --- a/src/core/graphics/webgl/WebGLGraphicsData.js +++ b/src/core/graphics/webgl/WebGLGraphicsData.js @@ -1,4 +1,6 @@ import glCore from 'pixi-gl-core'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; /** * An object containing WebGL specific properties to be used by the WebGL renderer @@ -45,13 +47,13 @@ * The main buffer * @member {WebGLBuffer} */ - this.buffer = glCore.GLBuffer.createVertexBuffer(gl); + this.buffer = new Buffer(); /** * The index buffer * @member {WebGLBuffer} */ - this.indexBuffer = glCore.GLBuffer.createIndexBuffer(gl); + this.indexBuffer = new Buffer(); /** * Whether this graphics is dirty or not @@ -59,8 +61,6 @@ */ this.dirty = true; - this.glPoints = null; - this.glIndices = null; /** * @@ -68,10 +68,9 @@ */ this.shader = shader; - this.vao = new glCore.VertexArrayObject(gl, attribsState) - .addIndex(this.indexBuffer) - .addAttribute(this.buffer, shader.attributes.aVertexPosition, gl.FLOAT, false, 4 * 6, 0) - .addAttribute(this.buffer, shader.attributes.aColor, gl.FLOAT, false, 4 * 6, 2 * 4); + this.geometry = new Geometry() + .addAttribute('aVertexPosition|aColor', this.buffer) + .addIndex(this.indexBuffer); } /** @@ -79,6 +78,7 @@ */ reset() { + this.points.length = 0; this.indices.length = 0; } @@ -89,11 +89,12 @@ upload() { this.glPoints = new Float32Array(this.points); - this.buffer.upload(this.glPoints); + this.buffer.update(this.glPoints); this.glIndices = new Uint16Array(this.indices); - this.indexBuffer.upload(this.glIndices); + this.indexBuffer.update(this.glIndices); + // console.log("UPKOADING,.",this.glPoints,this.glIndices) this.dirty = false; } diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 5ba9799..d2c4156 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,5 @@ -import { GLShader } from 'pixi-gl-core'; +import Shader from '../../../shader/Shader'; +import Program from '../../../shader/Program'; import { PRECISION } from '../../../const'; /** @@ -8,16 +9,14 @@ * @memberof PIXI * @extends PIXI.Shader */ -export default class PrimitiveShader extends GLShader +export default class PrimitiveShader extends Shader { /** * @param {WebGLRenderingContext} gl - The webgl shader manager this shader works for. */ - constructor(gl) + constructor() { - super(gl, - // vertex shader - [ + const program = Program.from([ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -41,8 +40,8 @@ 'void main(void){', ' gl_FragColor = vColor;', '}', - ].join('\n'), - PRECISION.DEFAULT - ); + ].join('\n')); + + super(program, {}) } } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index 712e179..944ada3 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -111,7 +111,7 @@ .addSystem(FramebufferSystem) .addSystem(StencilSystem) .addSystem(ProjectionSystem) - .addSystem(TextureGCSystem) + //.addSystem(TextureGCSystem) .addSystem(FilterSystem) .addSystem(RenderTextureSystem) .addSystem(BatchSystem) diff --git a/src/core/geometry/Buffer.js b/src/core/geometry/Buffer.js index 43d49bf..782d2c2 100644 --- a/src/core/geometry/Buffer.js +++ b/src/core/geometry/Buffer.js @@ -19,7 +19,7 @@ * * @type {ArrayBuffer| SharedArrayBuffer|ArrayBufferView} data the array / typedArray */ - this.data = data; + this.data = data || new Float32Array(1); /** * A map of renderer IDs to webgl buffer @@ -27,7 +27,7 @@ * @private * @member {object} */ - this._glBuffers = []; + this._glBuffers = {}; this._updateID = 0; @@ -42,8 +42,9 @@ /** * flags this buffer as requiring an upload to the GPU */ - update() + update(data) { + this.data = data || this.data; this._updateID++; } diff --git a/src/core/geometry/Geometry.js b/src/core/geometry/Geometry.js index 297a86b..83f0118 100644 --- a/src/core/geometry/Geometry.js +++ b/src/core/geometry/Geometry.js @@ -56,7 +56,7 @@ * @private * @type {Array} */ - this.glVertexArrayObjects = []; + this.glVertexArrayObjects = {}; this.id = UID++; } diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index be4c4fb..aafdfe2 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -748,7 +748,7 @@ } else { - renderer.setObjectRenderer(renderer.plugins.graphics); + renderer.batch.setObjectRenderer(renderer.plugins.graphics); renderer.plugins.graphics.render(this); } } diff --git a/src/core/graphics/webgl/GraphicsRenderer.js b/src/core/graphics/webgl/GraphicsRenderer.js index 67f5e92..4de266d 100644 --- a/src/core/graphics/webgl/GraphicsRenderer.js +++ b/src/core/graphics/webgl/GraphicsRenderer.js @@ -2,6 +2,8 @@ import { SHAPES } from '../../const'; import ObjectRenderer from '../../renderers/webgl/utils/ObjectRenderer'; import WebGLRenderer from '../../renderers/webgl/WebGLRenderer'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; import WebGLGraphicsData from './WebGLGraphicsData'; import PrimitiveShader from './shaders/PrimitiveShader'; @@ -28,8 +30,8 @@ this.graphicsDataPool = []; - this.primitiveShader = null; - + this.primitiveShader = new PrimitiveShader(); + this.primitiveShader.uniforms.globals = renderer.globalUniforms this.gl = renderer.gl; // easy access! @@ -46,7 +48,6 @@ { this.gl = this.renderer.gl; this.CONTEXT_UID = this.renderer.CONTEXT_UID; - this.primitiveShader = new PrimitiveShader(this.gl); } /** @@ -88,28 +89,26 @@ // This could be speeded up for sure! const shader = this.primitiveShader; - renderer._bindGLShader(shader); renderer.state.setBlendMode(graphics.blendMode); for (let i = 0, n = webGL.data.length; i < n; i++) { webGLData = webGL.data[i]; - const shaderTemp = webGLData.shader; - renderer._bindGLShader(shaderTemp); - shaderTemp.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); - shaderTemp.uniforms.tint = hex2rgb(graphics.tint); - shaderTemp.uniforms.alpha = graphics.worldAlpha; + shader.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); + shader.uniforms.tint = hex2rgb(graphics.tint); + shader.uniforms.alpha = graphics.worldAlpha; - renderer.bindVao(webGLData.vao); + renderer.shader.bind(shader); + renderer.geometry.bind(webGLData.geometry, renderer.shader.getGLShader()); if (graphics.nativeLines) { - gl.drawArrays(gl.LINES, 0, webGLData.points.length / 6); + renderer.geometry.draw(gl.LINES, webGLData.indices.length/6); } else { - webGLData.vao.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); + renderer.geometry.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); } } } @@ -184,7 +183,7 @@ webGL.lastIndex++; } - this.renderer.bindVao(null); + //this.renderer.geometry.bindVao(null); // upload all the dirty data... for (let i = 0; i < webGL.data.length; i++) @@ -211,9 +210,7 @@ if (!webGLData || webGLData.points.length > 320000) { - webGLData = this.graphicsDataPool.pop() - || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); - + webGLData = this.graphicsDataPool.pop() || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); webGLData.reset(type); gl.data.push(webGLData); } diff --git a/src/core/graphics/webgl/WebGLGraphicsData.js b/src/core/graphics/webgl/WebGLGraphicsData.js index a24030e..967ca78 100644 --- a/src/core/graphics/webgl/WebGLGraphicsData.js +++ b/src/core/graphics/webgl/WebGLGraphicsData.js @@ -1,4 +1,6 @@ import glCore from 'pixi-gl-core'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; /** * An object containing WebGL specific properties to be used by the WebGL renderer @@ -45,13 +47,13 @@ * The main buffer * @member {WebGLBuffer} */ - this.buffer = glCore.GLBuffer.createVertexBuffer(gl); + this.buffer = new Buffer(); /** * The index buffer * @member {WebGLBuffer} */ - this.indexBuffer = glCore.GLBuffer.createIndexBuffer(gl); + this.indexBuffer = new Buffer(); /** * Whether this graphics is dirty or not @@ -59,8 +61,6 @@ */ this.dirty = true; - this.glPoints = null; - this.glIndices = null; /** * @@ -68,10 +68,9 @@ */ this.shader = shader; - this.vao = new glCore.VertexArrayObject(gl, attribsState) - .addIndex(this.indexBuffer) - .addAttribute(this.buffer, shader.attributes.aVertexPosition, gl.FLOAT, false, 4 * 6, 0) - .addAttribute(this.buffer, shader.attributes.aColor, gl.FLOAT, false, 4 * 6, 2 * 4); + this.geometry = new Geometry() + .addAttribute('aVertexPosition|aColor', this.buffer) + .addIndex(this.indexBuffer); } /** @@ -79,6 +78,7 @@ */ reset() { + this.points.length = 0; this.indices.length = 0; } @@ -89,11 +89,12 @@ upload() { this.glPoints = new Float32Array(this.points); - this.buffer.upload(this.glPoints); + this.buffer.update(this.glPoints); this.glIndices = new Uint16Array(this.indices); - this.indexBuffer.upload(this.glIndices); + this.indexBuffer.update(this.glIndices); + // console.log("UPKOADING,.",this.glPoints,this.glIndices) this.dirty = false; } diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 5ba9799..d2c4156 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,5 @@ -import { GLShader } from 'pixi-gl-core'; +import Shader from '../../../shader/Shader'; +import Program from '../../../shader/Program'; import { PRECISION } from '../../../const'; /** @@ -8,16 +9,14 @@ * @memberof PIXI * @extends PIXI.Shader */ -export default class PrimitiveShader extends GLShader +export default class PrimitiveShader extends Shader { /** * @param {WebGLRenderingContext} gl - The webgl shader manager this shader works for. */ - constructor(gl) + constructor() { - super(gl, - // vertex shader - [ + const program = Program.from([ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -41,8 +40,8 @@ 'void main(void){', ' gl_FragColor = vColor;', '}', - ].join('\n'), - PRECISION.DEFAULT - ); + ].join('\n')); + + super(program, {}) } } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index 712e179..944ada3 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -111,7 +111,7 @@ .addSystem(FramebufferSystem) .addSystem(StencilSystem) .addSystem(ProjectionSystem) - .addSystem(TextureGCSystem) + //.addSystem(TextureGCSystem) .addSystem(FilterSystem) .addSystem(RenderTextureSystem) .addSystem(BatchSystem) diff --git a/src/core/renderers/webgl/systems/GeometrySystem.js b/src/core/renderers/webgl/systems/GeometrySystem.js index 984e3bb..c934aa6 100644 --- a/src/core/renderers/webgl/systems/GeometrySystem.js +++ b/src/core/renderers/webgl/systems/GeometrySystem.js @@ -59,7 +59,6 @@ { glBuffer._updateID = buffer._updateID; // TODO - partial upload?? - glBuffer.upload(buffer.data, 0); } } diff --git a/src/core/geometry/Buffer.js b/src/core/geometry/Buffer.js index 43d49bf..782d2c2 100644 --- a/src/core/geometry/Buffer.js +++ b/src/core/geometry/Buffer.js @@ -19,7 +19,7 @@ * * @type {ArrayBuffer| SharedArrayBuffer|ArrayBufferView} data the array / typedArray */ - this.data = data; + this.data = data || new Float32Array(1); /** * A map of renderer IDs to webgl buffer @@ -27,7 +27,7 @@ * @private * @member {object} */ - this._glBuffers = []; + this._glBuffers = {}; this._updateID = 0; @@ -42,8 +42,9 @@ /** * flags this buffer as requiring an upload to the GPU */ - update() + update(data) { + this.data = data || this.data; this._updateID++; } diff --git a/src/core/geometry/Geometry.js b/src/core/geometry/Geometry.js index 297a86b..83f0118 100644 --- a/src/core/geometry/Geometry.js +++ b/src/core/geometry/Geometry.js @@ -56,7 +56,7 @@ * @private * @type {Array} */ - this.glVertexArrayObjects = []; + this.glVertexArrayObjects = {}; this.id = UID++; } diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index be4c4fb..aafdfe2 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -748,7 +748,7 @@ } else { - renderer.setObjectRenderer(renderer.plugins.graphics); + renderer.batch.setObjectRenderer(renderer.plugins.graphics); renderer.plugins.graphics.render(this); } } diff --git a/src/core/graphics/webgl/GraphicsRenderer.js b/src/core/graphics/webgl/GraphicsRenderer.js index 67f5e92..4de266d 100644 --- a/src/core/graphics/webgl/GraphicsRenderer.js +++ b/src/core/graphics/webgl/GraphicsRenderer.js @@ -2,6 +2,8 @@ import { SHAPES } from '../../const'; import ObjectRenderer from '../../renderers/webgl/utils/ObjectRenderer'; import WebGLRenderer from '../../renderers/webgl/WebGLRenderer'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; import WebGLGraphicsData from './WebGLGraphicsData'; import PrimitiveShader from './shaders/PrimitiveShader'; @@ -28,8 +30,8 @@ this.graphicsDataPool = []; - this.primitiveShader = null; - + this.primitiveShader = new PrimitiveShader(); + this.primitiveShader.uniforms.globals = renderer.globalUniforms this.gl = renderer.gl; // easy access! @@ -46,7 +48,6 @@ { this.gl = this.renderer.gl; this.CONTEXT_UID = this.renderer.CONTEXT_UID; - this.primitiveShader = new PrimitiveShader(this.gl); } /** @@ -88,28 +89,26 @@ // This could be speeded up for sure! const shader = this.primitiveShader; - renderer._bindGLShader(shader); renderer.state.setBlendMode(graphics.blendMode); for (let i = 0, n = webGL.data.length; i < n; i++) { webGLData = webGL.data[i]; - const shaderTemp = webGLData.shader; - renderer._bindGLShader(shaderTemp); - shaderTemp.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); - shaderTemp.uniforms.tint = hex2rgb(graphics.tint); - shaderTemp.uniforms.alpha = graphics.worldAlpha; + shader.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); + shader.uniforms.tint = hex2rgb(graphics.tint); + shader.uniforms.alpha = graphics.worldAlpha; - renderer.bindVao(webGLData.vao); + renderer.shader.bind(shader); + renderer.geometry.bind(webGLData.geometry, renderer.shader.getGLShader()); if (graphics.nativeLines) { - gl.drawArrays(gl.LINES, 0, webGLData.points.length / 6); + renderer.geometry.draw(gl.LINES, webGLData.indices.length/6); } else { - webGLData.vao.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); + renderer.geometry.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); } } } @@ -184,7 +183,7 @@ webGL.lastIndex++; } - this.renderer.bindVao(null); + //this.renderer.geometry.bindVao(null); // upload all the dirty data... for (let i = 0; i < webGL.data.length; i++) @@ -211,9 +210,7 @@ if (!webGLData || webGLData.points.length > 320000) { - webGLData = this.graphicsDataPool.pop() - || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); - + webGLData = this.graphicsDataPool.pop() || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); webGLData.reset(type); gl.data.push(webGLData); } diff --git a/src/core/graphics/webgl/WebGLGraphicsData.js b/src/core/graphics/webgl/WebGLGraphicsData.js index a24030e..967ca78 100644 --- a/src/core/graphics/webgl/WebGLGraphicsData.js +++ b/src/core/graphics/webgl/WebGLGraphicsData.js @@ -1,4 +1,6 @@ import glCore from 'pixi-gl-core'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; /** * An object containing WebGL specific properties to be used by the WebGL renderer @@ -45,13 +47,13 @@ * The main buffer * @member {WebGLBuffer} */ - this.buffer = glCore.GLBuffer.createVertexBuffer(gl); + this.buffer = new Buffer(); /** * The index buffer * @member {WebGLBuffer} */ - this.indexBuffer = glCore.GLBuffer.createIndexBuffer(gl); + this.indexBuffer = new Buffer(); /** * Whether this graphics is dirty or not @@ -59,8 +61,6 @@ */ this.dirty = true; - this.glPoints = null; - this.glIndices = null; /** * @@ -68,10 +68,9 @@ */ this.shader = shader; - this.vao = new glCore.VertexArrayObject(gl, attribsState) - .addIndex(this.indexBuffer) - .addAttribute(this.buffer, shader.attributes.aVertexPosition, gl.FLOAT, false, 4 * 6, 0) - .addAttribute(this.buffer, shader.attributes.aColor, gl.FLOAT, false, 4 * 6, 2 * 4); + this.geometry = new Geometry() + .addAttribute('aVertexPosition|aColor', this.buffer) + .addIndex(this.indexBuffer); } /** @@ -79,6 +78,7 @@ */ reset() { + this.points.length = 0; this.indices.length = 0; } @@ -89,11 +89,12 @@ upload() { this.glPoints = new Float32Array(this.points); - this.buffer.upload(this.glPoints); + this.buffer.update(this.glPoints); this.glIndices = new Uint16Array(this.indices); - this.indexBuffer.upload(this.glIndices); + this.indexBuffer.update(this.glIndices); + // console.log("UPKOADING,.",this.glPoints,this.glIndices) this.dirty = false; } diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 5ba9799..d2c4156 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,5 @@ -import { GLShader } from 'pixi-gl-core'; +import Shader from '../../../shader/Shader'; +import Program from '../../../shader/Program'; import { PRECISION } from '../../../const'; /** @@ -8,16 +9,14 @@ * @memberof PIXI * @extends PIXI.Shader */ -export default class PrimitiveShader extends GLShader +export default class PrimitiveShader extends Shader { /** * @param {WebGLRenderingContext} gl - The webgl shader manager this shader works for. */ - constructor(gl) + constructor() { - super(gl, - // vertex shader - [ + const program = Program.from([ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -41,8 +40,8 @@ 'void main(void){', ' gl_FragColor = vColor;', '}', - ].join('\n'), - PRECISION.DEFAULT - ); + ].join('\n')); + + super(program, {}) } } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index 712e179..944ada3 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -111,7 +111,7 @@ .addSystem(FramebufferSystem) .addSystem(StencilSystem) .addSystem(ProjectionSystem) - .addSystem(TextureGCSystem) + //.addSystem(TextureGCSystem) .addSystem(FilterSystem) .addSystem(RenderTextureSystem) .addSystem(BatchSystem) diff --git a/src/core/renderers/webgl/systems/GeometrySystem.js b/src/core/renderers/webgl/systems/GeometrySystem.js index 984e3bb..c934aa6 100644 --- a/src/core/renderers/webgl/systems/GeometrySystem.js +++ b/src/core/renderers/webgl/systems/GeometrySystem.js @@ -59,7 +59,6 @@ { glBuffer._updateID = buffer._updateID; // TODO - partial upload?? - glBuffer.upload(buffer.data, 0); } } diff --git a/src/core/shader/Program.js b/src/core/shader/Program.js index bf93ef5..5fe92ad 100644 --- a/src/core/shader/Program.js +++ b/src/core/shader/Program.js @@ -53,7 +53,6 @@ */ extractData(vertexSrc, fragmentSrc) { - console.log(glCore._testingContext) const gl = glCore._testingContext || Program.getTestingContext(); if (!gl) diff --git a/src/core/geometry/Buffer.js b/src/core/geometry/Buffer.js index 43d49bf..782d2c2 100644 --- a/src/core/geometry/Buffer.js +++ b/src/core/geometry/Buffer.js @@ -19,7 +19,7 @@ * * @type {ArrayBuffer| SharedArrayBuffer|ArrayBufferView} data the array / typedArray */ - this.data = data; + this.data = data || new Float32Array(1); /** * A map of renderer IDs to webgl buffer @@ -27,7 +27,7 @@ * @private * @member {object} */ - this._glBuffers = []; + this._glBuffers = {}; this._updateID = 0; @@ -42,8 +42,9 @@ /** * flags this buffer as requiring an upload to the GPU */ - update() + update(data) { + this.data = data || this.data; this._updateID++; } diff --git a/src/core/geometry/Geometry.js b/src/core/geometry/Geometry.js index 297a86b..83f0118 100644 --- a/src/core/geometry/Geometry.js +++ b/src/core/geometry/Geometry.js @@ -56,7 +56,7 @@ * @private * @type {Array} */ - this.glVertexArrayObjects = []; + this.glVertexArrayObjects = {}; this.id = UID++; } diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index be4c4fb..aafdfe2 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -748,7 +748,7 @@ } else { - renderer.setObjectRenderer(renderer.plugins.graphics); + renderer.batch.setObjectRenderer(renderer.plugins.graphics); renderer.plugins.graphics.render(this); } } diff --git a/src/core/graphics/webgl/GraphicsRenderer.js b/src/core/graphics/webgl/GraphicsRenderer.js index 67f5e92..4de266d 100644 --- a/src/core/graphics/webgl/GraphicsRenderer.js +++ b/src/core/graphics/webgl/GraphicsRenderer.js @@ -2,6 +2,8 @@ import { SHAPES } from '../../const'; import ObjectRenderer from '../../renderers/webgl/utils/ObjectRenderer'; import WebGLRenderer from '../../renderers/webgl/WebGLRenderer'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; import WebGLGraphicsData from './WebGLGraphicsData'; import PrimitiveShader from './shaders/PrimitiveShader'; @@ -28,8 +30,8 @@ this.graphicsDataPool = []; - this.primitiveShader = null; - + this.primitiveShader = new PrimitiveShader(); + this.primitiveShader.uniforms.globals = renderer.globalUniforms this.gl = renderer.gl; // easy access! @@ -46,7 +48,6 @@ { this.gl = this.renderer.gl; this.CONTEXT_UID = this.renderer.CONTEXT_UID; - this.primitiveShader = new PrimitiveShader(this.gl); } /** @@ -88,28 +89,26 @@ // This could be speeded up for sure! const shader = this.primitiveShader; - renderer._bindGLShader(shader); renderer.state.setBlendMode(graphics.blendMode); for (let i = 0, n = webGL.data.length; i < n; i++) { webGLData = webGL.data[i]; - const shaderTemp = webGLData.shader; - renderer._bindGLShader(shaderTemp); - shaderTemp.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); - shaderTemp.uniforms.tint = hex2rgb(graphics.tint); - shaderTemp.uniforms.alpha = graphics.worldAlpha; + shader.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); + shader.uniforms.tint = hex2rgb(graphics.tint); + shader.uniforms.alpha = graphics.worldAlpha; - renderer.bindVao(webGLData.vao); + renderer.shader.bind(shader); + renderer.geometry.bind(webGLData.geometry, renderer.shader.getGLShader()); if (graphics.nativeLines) { - gl.drawArrays(gl.LINES, 0, webGLData.points.length / 6); + renderer.geometry.draw(gl.LINES, webGLData.indices.length/6); } else { - webGLData.vao.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); + renderer.geometry.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); } } } @@ -184,7 +183,7 @@ webGL.lastIndex++; } - this.renderer.bindVao(null); + //this.renderer.geometry.bindVao(null); // upload all the dirty data... for (let i = 0; i < webGL.data.length; i++) @@ -211,9 +210,7 @@ if (!webGLData || webGLData.points.length > 320000) { - webGLData = this.graphicsDataPool.pop() - || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); - + webGLData = this.graphicsDataPool.pop() || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); webGLData.reset(type); gl.data.push(webGLData); } diff --git a/src/core/graphics/webgl/WebGLGraphicsData.js b/src/core/graphics/webgl/WebGLGraphicsData.js index a24030e..967ca78 100644 --- a/src/core/graphics/webgl/WebGLGraphicsData.js +++ b/src/core/graphics/webgl/WebGLGraphicsData.js @@ -1,4 +1,6 @@ import glCore from 'pixi-gl-core'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; /** * An object containing WebGL specific properties to be used by the WebGL renderer @@ -45,13 +47,13 @@ * The main buffer * @member {WebGLBuffer} */ - this.buffer = glCore.GLBuffer.createVertexBuffer(gl); + this.buffer = new Buffer(); /** * The index buffer * @member {WebGLBuffer} */ - this.indexBuffer = glCore.GLBuffer.createIndexBuffer(gl); + this.indexBuffer = new Buffer(); /** * Whether this graphics is dirty or not @@ -59,8 +61,6 @@ */ this.dirty = true; - this.glPoints = null; - this.glIndices = null; /** * @@ -68,10 +68,9 @@ */ this.shader = shader; - this.vao = new glCore.VertexArrayObject(gl, attribsState) - .addIndex(this.indexBuffer) - .addAttribute(this.buffer, shader.attributes.aVertexPosition, gl.FLOAT, false, 4 * 6, 0) - .addAttribute(this.buffer, shader.attributes.aColor, gl.FLOAT, false, 4 * 6, 2 * 4); + this.geometry = new Geometry() + .addAttribute('aVertexPosition|aColor', this.buffer) + .addIndex(this.indexBuffer); } /** @@ -79,6 +78,7 @@ */ reset() { + this.points.length = 0; this.indices.length = 0; } @@ -89,11 +89,12 @@ upload() { this.glPoints = new Float32Array(this.points); - this.buffer.upload(this.glPoints); + this.buffer.update(this.glPoints); this.glIndices = new Uint16Array(this.indices); - this.indexBuffer.upload(this.glIndices); + this.indexBuffer.update(this.glIndices); + // console.log("UPKOADING,.",this.glPoints,this.glIndices) this.dirty = false; } diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 5ba9799..d2c4156 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,5 @@ -import { GLShader } from 'pixi-gl-core'; +import Shader from '../../../shader/Shader'; +import Program from '../../../shader/Program'; import { PRECISION } from '../../../const'; /** @@ -8,16 +9,14 @@ * @memberof PIXI * @extends PIXI.Shader */ -export default class PrimitiveShader extends GLShader +export default class PrimitiveShader extends Shader { /** * @param {WebGLRenderingContext} gl - The webgl shader manager this shader works for. */ - constructor(gl) + constructor() { - super(gl, - // vertex shader - [ + const program = Program.from([ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -41,8 +40,8 @@ 'void main(void){', ' gl_FragColor = vColor;', '}', - ].join('\n'), - PRECISION.DEFAULT - ); + ].join('\n')); + + super(program, {}) } } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index 712e179..944ada3 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -111,7 +111,7 @@ .addSystem(FramebufferSystem) .addSystem(StencilSystem) .addSystem(ProjectionSystem) - .addSystem(TextureGCSystem) + //.addSystem(TextureGCSystem) .addSystem(FilterSystem) .addSystem(RenderTextureSystem) .addSystem(BatchSystem) diff --git a/src/core/renderers/webgl/systems/GeometrySystem.js b/src/core/renderers/webgl/systems/GeometrySystem.js index 984e3bb..c934aa6 100644 --- a/src/core/renderers/webgl/systems/GeometrySystem.js +++ b/src/core/renderers/webgl/systems/GeometrySystem.js @@ -59,7 +59,6 @@ { glBuffer._updateID = buffer._updateID; // TODO - partial upload?? - glBuffer.upload(buffer.data, 0); } } diff --git a/src/core/shader/Program.js b/src/core/shader/Program.js index bf93ef5..5fe92ad 100644 --- a/src/core/shader/Program.js +++ b/src/core/shader/Program.js @@ -53,7 +53,6 @@ */ extractData(vertexSrc, fragmentSrc) { - console.log(glCore._testingContext) const gl = glCore._testingContext || Program.getTestingContext(); if (!gl) diff --git a/src/core/sprites/webgl/SpriteRenderer.js b/src/core/sprites/webgl/SpriteRenderer.js index fe7f597..309da9c 100644 --- a/src/core/sprites/webgl/SpriteRenderer.js +++ b/src/core/sprites/webgl/SpriteRenderer.js @@ -224,7 +224,7 @@ const boundTextures = this.boundTextures; const rendererBoundTextures = this.renderer.boundTextures; - const touch = this.renderer.textureGC.count; + const touch = 0//this.renderer.textureGC.count; let index = 0; let nextTexture; diff --git a/src/core/geometry/Buffer.js b/src/core/geometry/Buffer.js index 43d49bf..782d2c2 100644 --- a/src/core/geometry/Buffer.js +++ b/src/core/geometry/Buffer.js @@ -19,7 +19,7 @@ * * @type {ArrayBuffer| SharedArrayBuffer|ArrayBufferView} data the array / typedArray */ - this.data = data; + this.data = data || new Float32Array(1); /** * A map of renderer IDs to webgl buffer @@ -27,7 +27,7 @@ * @private * @member {object} */ - this._glBuffers = []; + this._glBuffers = {}; this._updateID = 0; @@ -42,8 +42,9 @@ /** * flags this buffer as requiring an upload to the GPU */ - update() + update(data) { + this.data = data || this.data; this._updateID++; } diff --git a/src/core/geometry/Geometry.js b/src/core/geometry/Geometry.js index 297a86b..83f0118 100644 --- a/src/core/geometry/Geometry.js +++ b/src/core/geometry/Geometry.js @@ -56,7 +56,7 @@ * @private * @type {Array} */ - this.glVertexArrayObjects = []; + this.glVertexArrayObjects = {}; this.id = UID++; } diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index be4c4fb..aafdfe2 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -748,7 +748,7 @@ } else { - renderer.setObjectRenderer(renderer.plugins.graphics); + renderer.batch.setObjectRenderer(renderer.plugins.graphics); renderer.plugins.graphics.render(this); } } diff --git a/src/core/graphics/webgl/GraphicsRenderer.js b/src/core/graphics/webgl/GraphicsRenderer.js index 67f5e92..4de266d 100644 --- a/src/core/graphics/webgl/GraphicsRenderer.js +++ b/src/core/graphics/webgl/GraphicsRenderer.js @@ -2,6 +2,8 @@ import { SHAPES } from '../../const'; import ObjectRenderer from '../../renderers/webgl/utils/ObjectRenderer'; import WebGLRenderer from '../../renderers/webgl/WebGLRenderer'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; import WebGLGraphicsData from './WebGLGraphicsData'; import PrimitiveShader from './shaders/PrimitiveShader'; @@ -28,8 +30,8 @@ this.graphicsDataPool = []; - this.primitiveShader = null; - + this.primitiveShader = new PrimitiveShader(); + this.primitiveShader.uniforms.globals = renderer.globalUniforms this.gl = renderer.gl; // easy access! @@ -46,7 +48,6 @@ { this.gl = this.renderer.gl; this.CONTEXT_UID = this.renderer.CONTEXT_UID; - this.primitiveShader = new PrimitiveShader(this.gl); } /** @@ -88,28 +89,26 @@ // This could be speeded up for sure! const shader = this.primitiveShader; - renderer._bindGLShader(shader); renderer.state.setBlendMode(graphics.blendMode); for (let i = 0, n = webGL.data.length; i < n; i++) { webGLData = webGL.data[i]; - const shaderTemp = webGLData.shader; - renderer._bindGLShader(shaderTemp); - shaderTemp.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); - shaderTemp.uniforms.tint = hex2rgb(graphics.tint); - shaderTemp.uniforms.alpha = graphics.worldAlpha; + shader.uniforms.translationMatrix = graphics.transform.worldTransform.toArray(true); + shader.uniforms.tint = hex2rgb(graphics.tint); + shader.uniforms.alpha = graphics.worldAlpha; - renderer.bindVao(webGLData.vao); + renderer.shader.bind(shader); + renderer.geometry.bind(webGLData.geometry, renderer.shader.getGLShader()); if (graphics.nativeLines) { - gl.drawArrays(gl.LINES, 0, webGLData.points.length / 6); + renderer.geometry.draw(gl.LINES, webGLData.indices.length/6); } else { - webGLData.vao.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); + renderer.geometry.draw(gl.TRIANGLE_STRIP, webGLData.indices.length); } } } @@ -184,7 +183,7 @@ webGL.lastIndex++; } - this.renderer.bindVao(null); + //this.renderer.geometry.bindVao(null); // upload all the dirty data... for (let i = 0; i < webGL.data.length; i++) @@ -211,9 +210,7 @@ if (!webGLData || webGLData.points.length > 320000) { - webGLData = this.graphicsDataPool.pop() - || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); - + webGLData = this.graphicsDataPool.pop() || new WebGLGraphicsData(this.renderer.gl, this.primitiveShader, this.renderer.state.attribsState); webGLData.reset(type); gl.data.push(webGLData); } diff --git a/src/core/graphics/webgl/WebGLGraphicsData.js b/src/core/graphics/webgl/WebGLGraphicsData.js index a24030e..967ca78 100644 --- a/src/core/graphics/webgl/WebGLGraphicsData.js +++ b/src/core/graphics/webgl/WebGLGraphicsData.js @@ -1,4 +1,6 @@ import glCore from 'pixi-gl-core'; +import Geometry from '../../geometry/Geometry'; +import Buffer from '../../geometry/Buffer'; /** * An object containing WebGL specific properties to be used by the WebGL renderer @@ -45,13 +47,13 @@ * The main buffer * @member {WebGLBuffer} */ - this.buffer = glCore.GLBuffer.createVertexBuffer(gl); + this.buffer = new Buffer(); /** * The index buffer * @member {WebGLBuffer} */ - this.indexBuffer = glCore.GLBuffer.createIndexBuffer(gl); + this.indexBuffer = new Buffer(); /** * Whether this graphics is dirty or not @@ -59,8 +61,6 @@ */ this.dirty = true; - this.glPoints = null; - this.glIndices = null; /** * @@ -68,10 +68,9 @@ */ this.shader = shader; - this.vao = new glCore.VertexArrayObject(gl, attribsState) - .addIndex(this.indexBuffer) - .addAttribute(this.buffer, shader.attributes.aVertexPosition, gl.FLOAT, false, 4 * 6, 0) - .addAttribute(this.buffer, shader.attributes.aColor, gl.FLOAT, false, 4 * 6, 2 * 4); + this.geometry = new Geometry() + .addAttribute('aVertexPosition|aColor', this.buffer) + .addIndex(this.indexBuffer); } /** @@ -79,6 +78,7 @@ */ reset() { + this.points.length = 0; this.indices.length = 0; } @@ -89,11 +89,12 @@ upload() { this.glPoints = new Float32Array(this.points); - this.buffer.upload(this.glPoints); + this.buffer.update(this.glPoints); this.glIndices = new Uint16Array(this.indices); - this.indexBuffer.upload(this.glIndices); + this.indexBuffer.update(this.glIndices); + // console.log("UPKOADING,.",this.glPoints,this.glIndices) this.dirty = false; } diff --git a/src/core/graphics/webgl/shaders/PrimitiveShader.js b/src/core/graphics/webgl/shaders/PrimitiveShader.js index 5ba9799..d2c4156 100644 --- a/src/core/graphics/webgl/shaders/PrimitiveShader.js +++ b/src/core/graphics/webgl/shaders/PrimitiveShader.js @@ -1,4 +1,5 @@ -import { GLShader } from 'pixi-gl-core'; +import Shader from '../../../shader/Shader'; +import Program from '../../../shader/Program'; import { PRECISION } from '../../../const'; /** @@ -8,16 +9,14 @@ * @memberof PIXI * @extends PIXI.Shader */ -export default class PrimitiveShader extends GLShader +export default class PrimitiveShader extends Shader { /** * @param {WebGLRenderingContext} gl - The webgl shader manager this shader works for. */ - constructor(gl) + constructor() { - super(gl, - // vertex shader - [ + const program = Program.from([ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -41,8 +40,8 @@ 'void main(void){', ' gl_FragColor = vColor;', '}', - ].join('\n'), - PRECISION.DEFAULT - ); + ].join('\n')); + + super(program, {}) } } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index 712e179..944ada3 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -111,7 +111,7 @@ .addSystem(FramebufferSystem) .addSystem(StencilSystem) .addSystem(ProjectionSystem) - .addSystem(TextureGCSystem) + //.addSystem(TextureGCSystem) .addSystem(FilterSystem) .addSystem(RenderTextureSystem) .addSystem(BatchSystem) diff --git a/src/core/renderers/webgl/systems/GeometrySystem.js b/src/core/renderers/webgl/systems/GeometrySystem.js index 984e3bb..c934aa6 100644 --- a/src/core/renderers/webgl/systems/GeometrySystem.js +++ b/src/core/renderers/webgl/systems/GeometrySystem.js @@ -59,7 +59,6 @@ { glBuffer._updateID = buffer._updateID; // TODO - partial upload?? - glBuffer.upload(buffer.data, 0); } } diff --git a/src/core/shader/Program.js b/src/core/shader/Program.js index bf93ef5..5fe92ad 100644 --- a/src/core/shader/Program.js +++ b/src/core/shader/Program.js @@ -53,7 +53,6 @@ */ extractData(vertexSrc, fragmentSrc) { - console.log(glCore._testingContext) const gl = glCore._testingContext || Program.getTestingContext(); if (!gl) diff --git a/src/core/sprites/webgl/SpriteRenderer.js b/src/core/sprites/webgl/SpriteRenderer.js index fe7f597..309da9c 100644 --- a/src/core/sprites/webgl/SpriteRenderer.js +++ b/src/core/sprites/webgl/SpriteRenderer.js @@ -224,7 +224,7 @@ const boundTextures = this.boundTextures; const rendererBoundTextures = this.renderer.boundTextures; - const touch = this.renderer.textureGC.count; + const touch = 0//this.renderer.textureGC.count; let index = 0; let nextTexture; diff --git a/src/extras/webgl/TilingSpriteRenderer.js b/src/extras/webgl/TilingSpriteRenderer.js index d792dd3..aeec172 100644 --- a/src/extras/webgl/TilingSpriteRenderer.js +++ b/src/extras/webgl/TilingSpriteRenderer.js @@ -38,28 +38,6 @@ readFileSync(join(__dirname, './tilingSprite_simple.frag'), 'utf8'), uniforms); - this.quad = null; - } - - /** - * Sets up the renderer context and necessary buffers. - * - * @private - */ - contextChange() - { - const gl = this.renderer.gl; -/* - this.shader = new GLShader(gl, - readFileSync(join(__dirname, './tilingSprite.vert'), 'utf8'), - readFileSync(join(__dirname, './tilingSprite.frag'), 'utf8'), - core.PRECISION.DEFAULT); - this.simpleShader = new GLShader(gl, - readFileSync(join(__dirname, './tilingSprite.vert'), 'utf8'), - readFileSync(join(__dirname, './tilingSprite_simple.frag'), 'utf8'), - core.PRECISION.DEFAULT); -*/ - this.renderer.geometry.bindVao(null); this.quad = new core.Quad(); } @@ -72,7 +50,6 @@ const renderer = this.renderer; const quad = this.quad; - let vertices = quad.vertices; vertices[0] = vertices[6] = (ts._width) * -ts.anchor.x;