babylon.spriteManager.ts 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188
  1. module BABYLON {
  2. export class SpriteManager {
  3. public sprites = new Array<Sprite>();
  4. public renderingGroupId = 0;
  5. public onDispose: () => void;
  6. public fogEnabled = true;
  7. private _capacity: number;
  8. private _spriteTexture: Texture;
  9. private _epsilon: number;
  10. private _scene: Scene;
  11. private _vertexDeclaration = [3, 4, 4, 4];
  12. private _vertexStrideSize = 15 * 4; // 15 floats per sprite (x, y, z, angle, size, offsetX, offsetY, invertU, invertV, cellIndexX, cellIndexY, color)
  13. private _vertexBuffer: WebGLBuffer
  14. private _indexBuffer: WebGLBuffer;
  15. private _vertices: Float32Array;
  16. private _effectBase: Effect;
  17. private _effectFog: Effect;
  18. constructor(public name: string, imgUrl: string, capacity: number, public cellSize: number, scene: Scene, epsilon?: number) {
  19. this._capacity = capacity;
  20. this._spriteTexture = new BABYLON.Texture(imgUrl, scene, true, false);
  21. this._spriteTexture.wrapU = BABYLON.Texture.CLAMP_ADDRESSMODE;
  22. this._spriteTexture.wrapV = BABYLON.Texture.CLAMP_ADDRESSMODE;
  23. this._epsilon = epsilon === undefined ? 0.01 : epsilon;
  24. this._scene = scene;
  25. this._scene.spriteManagers.push(this);
  26. // VBO
  27. this._vertexDeclaration = [3, 4, 4, 4];
  28. this._vertexStrideSize = 15 * 4;
  29. this._vertexBuffer = scene.getEngine().createDynamicVertexBuffer(capacity * this._vertexStrideSize * 4);
  30. var indices = [];
  31. var index = 0;
  32. for (var count = 0; count < capacity; count++) {
  33. indices.push(index);
  34. indices.push(index + 1);
  35. indices.push(index + 2);
  36. indices.push(index);
  37. indices.push(index + 2);
  38. indices.push(index + 3);
  39. index += 4;
  40. }
  41. this._indexBuffer = scene.getEngine().createIndexBuffer(indices);
  42. this._vertices = new Float32Array(capacity * this._vertexStrideSize);
  43. // Effects
  44. this._effectBase = this._scene.getEngine().createEffect("sprites",
  45. ["position", "options", "cellInfo", "color"],
  46. ["view", "projection", "textureInfos", "alphaTest"],
  47. ["diffuseSampler"], "");
  48. this._effectFog = this._scene.getEngine().createEffect("sprites",
  49. ["position", "options", "cellInfo", "color"],
  50. ["view", "projection", "textureInfos", "alphaTest", "vFogInfos", "vFogColor"],
  51. ["diffuseSampler"], "#define FOG");
  52. }
  53. private _appendSpriteVertex(index: number, sprite: Sprite, offsetX: number, offsetY: number, rowSize: number): void {
  54. var arrayOffset = index * 15;
  55. if (offsetX == 0)
  56. offsetX = this._epsilon;
  57. else if (offsetX == 1)
  58. offsetX = 1 - this._epsilon;
  59. if (offsetY == 0)
  60. offsetY = this._epsilon;
  61. else if (offsetY == 1)
  62. offsetY = 1 - this._epsilon;
  63. this._vertices[arrayOffset] = sprite.position.x;
  64. this._vertices[arrayOffset + 1] = sprite.position.y;
  65. this._vertices[arrayOffset + 2] = sprite.position.z;
  66. this._vertices[arrayOffset + 3] = sprite.angle;
  67. this._vertices[arrayOffset + 4] = sprite.size;
  68. this._vertices[arrayOffset + 5] = offsetX;
  69. this._vertices[arrayOffset + 6] = offsetY;
  70. this._vertices[arrayOffset + 7] = sprite.invertU ? 1 : 0;
  71. this._vertices[arrayOffset + 8] = sprite.invertV ? 1 : 0;
  72. var offset = (sprite.cellIndex / rowSize) >> 0;
  73. this._vertices[arrayOffset + 9] = sprite.cellIndex - offset * rowSize;
  74. this._vertices[arrayOffset + 10] = offset;
  75. // Color
  76. this._vertices[arrayOffset + 11] = sprite.color.r;
  77. this._vertices[arrayOffset + 12] = sprite.color.g;
  78. this._vertices[arrayOffset + 13] = sprite.color.b;
  79. this._vertices[arrayOffset + 14] = sprite.color.a;
  80. }
  81. public render(): void {
  82. // Check
  83. if (!this._effectBase.isReady() || !this._effectFog.isReady() || !this._spriteTexture || !this._spriteTexture.isReady())
  84. return;
  85. var engine = this._scene.getEngine();
  86. var baseSize = this._spriteTexture.getBaseSize();
  87. // Sprites
  88. var deltaTime = engine.getDeltaTime();
  89. var max = Math.min(this._capacity, this.sprites.length);
  90. var rowSize = baseSize.width / this.cellSize;
  91. var offset = 0;
  92. for (var index = 0; index < max; index++) {
  93. var sprite = this.sprites[index];
  94. if (!sprite) {
  95. continue;
  96. }
  97. sprite._animate(deltaTime);
  98. this._appendSpriteVertex(offset++, sprite, 0, 0, rowSize);
  99. this._appendSpriteVertex(offset++, sprite, 1, 0, rowSize);
  100. this._appendSpriteVertex(offset++, sprite, 1, 1, rowSize);
  101. this._appendSpriteVertex(offset++, sprite, 0, 1, rowSize);
  102. }
  103. engine.updateDynamicVertexBuffer(this._vertexBuffer, this._vertices);
  104. // Render
  105. var effect = this._effectBase;
  106. if (this._scene.fogEnabled && this._scene.fogMode !== Scene.FOGMODE_NONE && this.fogEnabled) {
  107. effect = this._effectFog;
  108. }
  109. engine.enableEffect(effect);
  110. var viewMatrix = this._scene.getViewMatrix();
  111. effect.setTexture("diffuseSampler", this._spriteTexture);
  112. effect.setMatrix("view", viewMatrix);
  113. effect.setMatrix("projection", this._scene.getProjectionMatrix());
  114. effect.setFloat2("textureInfos", this.cellSize / baseSize.width, this.cellSize / baseSize.height);
  115. // Fog
  116. if (this._scene.fogEnabled && this._scene.fogMode !== Scene.FOGMODE_NONE && this.fogEnabled) {
  117. effect.setFloat4("vFogInfos", this._scene.fogMode, this._scene.fogStart, this._scene.fogEnd, this._scene.fogDensity);
  118. effect.setColor3("vFogColor", this._scene.fogColor);
  119. }
  120. // VBOs
  121. engine.bindBuffers(this._vertexBuffer, this._indexBuffer, this._vertexDeclaration, this._vertexStrideSize, effect);
  122. // Draw order
  123. effect.setBool("alphaTest", true);
  124. engine.setColorWrite(false);
  125. engine.draw(true, 0, max * 6);
  126. engine.setColorWrite(true);
  127. effect.setBool("alphaTest", false);
  128. engine.setAlphaMode(BABYLON.Engine.ALPHA_COMBINE);
  129. engine.draw(true, 0, max * 6);
  130. engine.setAlphaMode(BABYLON.Engine.ALPHA_DISABLE);
  131. }
  132. public dispose(): void {
  133. if (this._vertexBuffer) {
  134. this._scene.getEngine()._releaseBuffer(this._vertexBuffer);
  135. this._vertexBuffer = null;
  136. }
  137. if (this._indexBuffer) {
  138. this._scene.getEngine()._releaseBuffer(this._indexBuffer);
  139. this._indexBuffer = null;
  140. }
  141. if (this._spriteTexture) {
  142. this._spriteTexture.dispose();
  143. this._spriteTexture = null;
  144. }
  145. // Remove from scene
  146. var index = this._scene.spriteManagers.indexOf(this);
  147. this._scene.spriteManagers.splice(index, 1);
  148. // Callback
  149. if (this.onDispose) {
  150. this.onDispose();
  151. }
  152. }
  153. }
  154. }