diff --git a/packages/core/src/batch/BatchDrawCall.js b/packages/core/src/batch/BatchDrawCall.js new file mode 100644 index 0000000..2d0a93b --- /dev/null +++ b/packages/core/src/batch/BatchDrawCall.js @@ -0,0 +1,20 @@ +/** + * Used by the batcher to draw batches + * each one of these contains all information required to draw a bound geometry. + * + * @class + * @memberof PIXI + */ +export default class BatchDrawCall +{ + constructor() + { + this.textures = []; + this.ids = []; + this.blend = 0; + this.textureCount = 0; + this.start = 0; + this.size = 0; + this.type = 4; + } +} diff --git a/packages/core/src/batch/BatchDrawCall.js b/packages/core/src/batch/BatchDrawCall.js new file mode 100644 index 0000000..2d0a93b --- /dev/null +++ b/packages/core/src/batch/BatchDrawCall.js @@ -0,0 +1,20 @@ +/** + * Used by the batcher to draw batches + * each one of these contains all information required to draw a bound geometry. + * + * @class + * @memberof PIXI + */ +export default class BatchDrawCall +{ + constructor() + { + this.textures = []; + this.ids = []; + this.blend = 0; + this.textureCount = 0; + this.start = 0; + this.size = 0; + this.type = 4; + } +} diff --git a/packages/core/src/batch/BatchRenderer.js b/packages/core/src/batch/BatchRenderer.js index b7a9bec..4c1c27c 100644 --- a/packages/core/src/batch/BatchRenderer.js +++ b/packages/core/src/batch/BatchRenderer.js @@ -1,4 +1,6 @@ import BatchGeometry from './BatchGeometry'; +import BatchDrawCall from './BatchDrawCall'; + import State from '../state/State'; import ObjectRenderer from './ObjectRenderer'; import checkMaxIfStatementsInShader from '../shader/utils/checkMaxIfStatementsInShader'; @@ -87,7 +89,7 @@ for (let k = 0; k < this.size / 4; k++) { - this.groups[k] = { textures: [], textureCount: 0, ids: [], size: 0, start: 0, blend: 0 }; + this.groups[k] = new BatchDrawCall(); } this.elements = []; diff --git a/packages/core/src/batch/BatchDrawCall.js b/packages/core/src/batch/BatchDrawCall.js new file mode 100644 index 0000000..2d0a93b --- /dev/null +++ b/packages/core/src/batch/BatchDrawCall.js @@ -0,0 +1,20 @@ +/** + * Used by the batcher to draw batches + * each one of these contains all information required to draw a bound geometry. + * + * @class + * @memberof PIXI + */ +export default class BatchDrawCall +{ + constructor() + { + this.textures = []; + this.ids = []; + this.blend = 0; + this.textureCount = 0; + this.start = 0; + this.size = 0; + this.type = 4; + } +} diff --git a/packages/core/src/batch/BatchRenderer.js b/packages/core/src/batch/BatchRenderer.js index b7a9bec..4c1c27c 100644 --- a/packages/core/src/batch/BatchRenderer.js +++ b/packages/core/src/batch/BatchRenderer.js @@ -1,4 +1,6 @@ import BatchGeometry from './BatchGeometry'; +import BatchDrawCall from './BatchDrawCall'; + import State from '../state/State'; import ObjectRenderer from './ObjectRenderer'; import checkMaxIfStatementsInShader from '../shader/utils/checkMaxIfStatementsInShader'; @@ -87,7 +89,7 @@ for (let k = 0; k < this.size / 4; k++) { - this.groups[k] = { textures: [], textureCount: 0, ids: [], size: 0, start: 0, blend: 0 }; + this.groups[k] = new BatchDrawCall(); } this.elements = []; diff --git a/packages/core/src/index.js b/packages/core/src/index.js index b795638..14eca1e 100644 --- a/packages/core/src/index.js +++ b/packages/core/src/index.js @@ -21,6 +21,7 @@ export { default as ObjectRenderer } from './batch/ObjectRenderer'; export { default as BatchRenderer } from './batch/BatchRenderer'; export { default as BatchGeometry } from './batch/BatchGeometry'; +export { default as BatchDrawCall } from './batch/BatchDrawCall'; export { default as generateMultiTextureShader } from './batch/generateMultiTextureShader'; export { default as Quad } from './utils/Quad'; export { default as QuadUv } from './utils/QuadUv'; diff --git a/packages/core/src/batch/BatchDrawCall.js b/packages/core/src/batch/BatchDrawCall.js new file mode 100644 index 0000000..2d0a93b --- /dev/null +++ b/packages/core/src/batch/BatchDrawCall.js @@ -0,0 +1,20 @@ +/** + * Used by the batcher to draw batches + * each one of these contains all information required to draw a bound geometry. + * + * @class + * @memberof PIXI + */ +export default class BatchDrawCall +{ + constructor() + { + this.textures = []; + this.ids = []; + this.blend = 0; + this.textureCount = 0; + this.start = 0; + this.size = 0; + this.type = 4; + } +} diff --git a/packages/core/src/batch/BatchRenderer.js b/packages/core/src/batch/BatchRenderer.js index b7a9bec..4c1c27c 100644 --- a/packages/core/src/batch/BatchRenderer.js +++ b/packages/core/src/batch/BatchRenderer.js @@ -1,4 +1,6 @@ import BatchGeometry from './BatchGeometry'; +import BatchDrawCall from './BatchDrawCall'; + import State from '../state/State'; import ObjectRenderer from './ObjectRenderer'; import checkMaxIfStatementsInShader from '../shader/utils/checkMaxIfStatementsInShader'; @@ -87,7 +89,7 @@ for (let k = 0; k < this.size / 4; k++) { - this.groups[k] = { textures: [], textureCount: 0, ids: [], size: 0, start: 0, blend: 0 }; + this.groups[k] = new BatchDrawCall(); } this.elements = []; diff --git a/packages/core/src/index.js b/packages/core/src/index.js index b795638..14eca1e 100644 --- a/packages/core/src/index.js +++ b/packages/core/src/index.js @@ -21,6 +21,7 @@ export { default as ObjectRenderer } from './batch/ObjectRenderer'; export { default as BatchRenderer } from './batch/BatchRenderer'; export { default as BatchGeometry } from './batch/BatchGeometry'; +export { default as BatchDrawCall } from './batch/BatchDrawCall'; export { default as generateMultiTextureShader } from './batch/generateMultiTextureShader'; export { default as Quad } from './utils/Quad'; export { default as QuadUv } from './utils/QuadUv'; diff --git a/packages/graphics/src/GraphicsGeometry.js b/packages/graphics/src/GraphicsGeometry.js index b03c0aa..ad8a830 100644 --- a/packages/graphics/src/GraphicsGeometry.js +++ b/packages/graphics/src/GraphicsGeometry.js @@ -1,6 +1,6 @@ -import { BatchGeometry } from '@pixi/core'; import { SHAPES } from '@pixi/math'; import { Bounds } from '@pixi/display'; +import { BatchGeometry, BatchDrawCall } from '@pixi/core'; import GraphicsData from './GraphicsData'; import buildCircle from './utils/buildCircle'; @@ -29,6 +29,22 @@ fillCommands[SHAPES.RREC] = buildRoundedRectangle; /** + * A little internal structure to hold interim batch objects. + * @private + */ +class BatchPart +{ + constructor() + { + this.style = null; + this.size = 0; + this.start = 0; + this.attribStart = 0; + this.attribSize = 0; + } +} + +/** * The Graphics class contains methods used to draw primitive shapes such as lines, circles and * rectangles to the display, and to color and fill them. GraphicsGeometry * is designed to not be continually update the geometry since it's expensive @@ -407,7 +423,7 @@ let batchPart = this.batches.pop() || BATCH_POOL.pop() - || { style: null, size: 0, start: 0, attribStart: 0, attribSize: 0 }; + || new BatchPart(); batchPart.style = batchPart.style || this.graphicsData[0].fillStyle @@ -460,7 +476,8 @@ if (batchPart.size > 0) { - batchPart = BATCH_POOL.pop() || { style, size: 0, start: 0, attribStart: 0, attribSize: 0 }; + batchPart = BATCH_POOL.pop() || new BatchPart(); + this.batches.push(batchPart); } @@ -548,13 +565,11 @@ this.drawCalls.length = 0; - let lastIndex = this.indices.length; - const uvs = this.uvs; const colors = this.colors; const textureIds = this.textureIds; - let currentGroup = DRAW_CALL_POOL.pop() || { textures: [], textureCount: 0, size: 0, start: 0, type: 4 }; + let currentGroup = DRAW_CALL_POOL.pop() || new BatchDrawCall(); currentGroup.textureCount = 0; currentGroup.start = 0; @@ -562,8 +577,10 @@ let textureCount = 0; let currentTexture = null; let textureId = 0; + let native = false; + let drawMode = 4; - lastIndex = 0; + let index = 0; this.drawCalls.push(currentGroup); @@ -579,6 +596,17 @@ const nextTexture = style.texture.baseTexture; + if (native !== style.native) + { + native = style.native; + drawMode = native ? 1 : 4; + + // force the batch to break! + currentTexture = null; + textureCount = MAX_TEXTURES; + TICK++; + } + if (currentTexture !== nextTexture) { currentTexture = nextTexture; @@ -588,20 +616,19 @@ if (textureCount === MAX_TEXTURES) { TICK++; + textureCount = 0; - const index = data.start; + if (currentGroup.size > 0) + { + currentGroup = DRAW_CALL_POOL.pop() || new BatchDrawCall(); + this.drawCalls.push(currentGroup); + } - currentGroup.size = index - lastIndex; - - currentGroup = DRAW_CALL_POOL.pop() || { textures: [], textureCount: 0, size: 0, start: 0, type: 4 }; - + currentGroup.start = index; + currentGroup.size = 0; currentGroup.textureCount = 0; - - currentGroup.start = lastIndex; - this.drawCalls.push(currentGroup); - - lastIndex = index; + currentGroup.type = drawMode; } // TODO add this to the render part.. @@ -615,18 +642,15 @@ } } - const size = data.attribSize; + currentGroup.size += data.size; + index += data.size; textureId = nextTexture._id; - this.addColors(colors, style.color, style.alpha, size); - this.addTextureIds(textureIds, textureId, size); + this.addColors(colors, style.color, style.alpha, data.attribSize); + this.addTextureIds(textureIds, textureId, data.attribSize); } - const index = this.indices.length; - - currentGroup.size = index - lastIndex; - // upload.. // merge for now! const verts = this.points; diff --git a/packages/core/src/batch/BatchDrawCall.js b/packages/core/src/batch/BatchDrawCall.js new file mode 100644 index 0000000..2d0a93b --- /dev/null +++ b/packages/core/src/batch/BatchDrawCall.js @@ -0,0 +1,20 @@ +/** + * Used by the batcher to draw batches + * each one of these contains all information required to draw a bound geometry. + * + * @class + * @memberof PIXI + */ +export default class BatchDrawCall +{ + constructor() + { + this.textures = []; + this.ids = []; + this.blend = 0; + this.textureCount = 0; + this.start = 0; + this.size = 0; + this.type = 4; + } +} diff --git a/packages/core/src/batch/BatchRenderer.js b/packages/core/src/batch/BatchRenderer.js index b7a9bec..4c1c27c 100644 --- a/packages/core/src/batch/BatchRenderer.js +++ b/packages/core/src/batch/BatchRenderer.js @@ -1,4 +1,6 @@ import BatchGeometry from './BatchGeometry'; +import BatchDrawCall from './BatchDrawCall'; + import State from '../state/State'; import ObjectRenderer from './ObjectRenderer'; import checkMaxIfStatementsInShader from '../shader/utils/checkMaxIfStatementsInShader'; @@ -87,7 +89,7 @@ for (let k = 0; k < this.size / 4; k++) { - this.groups[k] = { textures: [], textureCount: 0, ids: [], size: 0, start: 0, blend: 0 }; + this.groups[k] = new BatchDrawCall(); } this.elements = []; diff --git a/packages/core/src/index.js b/packages/core/src/index.js index b795638..14eca1e 100644 --- a/packages/core/src/index.js +++ b/packages/core/src/index.js @@ -21,6 +21,7 @@ export { default as ObjectRenderer } from './batch/ObjectRenderer'; export { default as BatchRenderer } from './batch/BatchRenderer'; export { default as BatchGeometry } from './batch/BatchGeometry'; +export { default as BatchDrawCall } from './batch/BatchDrawCall'; export { default as generateMultiTextureShader } from './batch/generateMultiTextureShader'; export { default as Quad } from './utils/Quad'; export { default as QuadUv } from './utils/QuadUv'; diff --git a/packages/graphics/src/GraphicsGeometry.js b/packages/graphics/src/GraphicsGeometry.js index b03c0aa..ad8a830 100644 --- a/packages/graphics/src/GraphicsGeometry.js +++ b/packages/graphics/src/GraphicsGeometry.js @@ -1,6 +1,6 @@ -import { BatchGeometry } from '@pixi/core'; import { SHAPES } from '@pixi/math'; import { Bounds } from '@pixi/display'; +import { BatchGeometry, BatchDrawCall } from '@pixi/core'; import GraphicsData from './GraphicsData'; import buildCircle from './utils/buildCircle'; @@ -29,6 +29,22 @@ fillCommands[SHAPES.RREC] = buildRoundedRectangle; /** + * A little internal structure to hold interim batch objects. + * @private + */ +class BatchPart +{ + constructor() + { + this.style = null; + this.size = 0; + this.start = 0; + this.attribStart = 0; + this.attribSize = 0; + } +} + +/** * The Graphics class contains methods used to draw primitive shapes such as lines, circles and * rectangles to the display, and to color and fill them. GraphicsGeometry * is designed to not be continually update the geometry since it's expensive @@ -407,7 +423,7 @@ let batchPart = this.batches.pop() || BATCH_POOL.pop() - || { style: null, size: 0, start: 0, attribStart: 0, attribSize: 0 }; + || new BatchPart(); batchPart.style = batchPart.style || this.graphicsData[0].fillStyle @@ -460,7 +476,8 @@ if (batchPart.size > 0) { - batchPart = BATCH_POOL.pop() || { style, size: 0, start: 0, attribStart: 0, attribSize: 0 }; + batchPart = BATCH_POOL.pop() || new BatchPart(); + this.batches.push(batchPart); } @@ -548,13 +565,11 @@ this.drawCalls.length = 0; - let lastIndex = this.indices.length; - const uvs = this.uvs; const colors = this.colors; const textureIds = this.textureIds; - let currentGroup = DRAW_CALL_POOL.pop() || { textures: [], textureCount: 0, size: 0, start: 0, type: 4 }; + let currentGroup = DRAW_CALL_POOL.pop() || new BatchDrawCall(); currentGroup.textureCount = 0; currentGroup.start = 0; @@ -562,8 +577,10 @@ let textureCount = 0; let currentTexture = null; let textureId = 0; + let native = false; + let drawMode = 4; - lastIndex = 0; + let index = 0; this.drawCalls.push(currentGroup); @@ -579,6 +596,17 @@ const nextTexture = style.texture.baseTexture; + if (native !== style.native) + { + native = style.native; + drawMode = native ? 1 : 4; + + // force the batch to break! + currentTexture = null; + textureCount = MAX_TEXTURES; + TICK++; + } + if (currentTexture !== nextTexture) { currentTexture = nextTexture; @@ -588,20 +616,19 @@ if (textureCount === MAX_TEXTURES) { TICK++; + textureCount = 0; - const index = data.start; + if (currentGroup.size > 0) + { + currentGroup = DRAW_CALL_POOL.pop() || new BatchDrawCall(); + this.drawCalls.push(currentGroup); + } - currentGroup.size = index - lastIndex; - - currentGroup = DRAW_CALL_POOL.pop() || { textures: [], textureCount: 0, size: 0, start: 0, type: 4 }; - + currentGroup.start = index; + currentGroup.size = 0; currentGroup.textureCount = 0; - - currentGroup.start = lastIndex; - this.drawCalls.push(currentGroup); - - lastIndex = index; + currentGroup.type = drawMode; } // TODO add this to the render part.. @@ -615,18 +642,15 @@ } } - const size = data.attribSize; + currentGroup.size += data.size; + index += data.size; textureId = nextTexture._id; - this.addColors(colors, style.color, style.alpha, size); - this.addTextureIds(textureIds, textureId, size); + this.addColors(colors, style.color, style.alpha, data.attribSize); + this.addTextureIds(textureIds, textureId, data.attribSize); } - const index = this.indices.length; - - currentGroup.size = index - lastIndex; - // upload.. // merge for now! const verts = this.points; diff --git a/packages/graphics/src/utils/buildLine.js b/packages/graphics/src/utils/buildLine.js index ac43591..5ae3117 100644 --- a/packages/graphics/src/utils/buildLine.js +++ b/packages/graphics/src/utils/buildLine.js @@ -246,7 +246,8 @@ function buildNativeLine(graphicsData, graphicsGeometry) { let i = 0; - const points = graphicsData.points; + + const points = graphicsData.points || graphicsData.shape.points; if (points.length === 0) return;