engine.multiRender.ts 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372
  1. import { InternalTexture, InternalTextureSource } from '../../Materials/Textures/internalTexture';
  2. import { IMultiRenderTargetOptions } from '../../Materials/Textures/multiRenderTarget';
  3. import { Logger } from '../../Misc/logger';
  4. import { Nullable } from '../../types';
  5. import { Constants } from '../constants';
  6. import { ThinEngine } from '../thinEngine';
  7. import { IColor4Like } from '../../Maths/math.like';
  8. declare module "../../Engines/thinEngine" {
  9. export interface ThinEngine {
  10. /**
  11. * Unbind a list of render target textures from the webGL context
  12. * This is used only when drawBuffer extension or webGL2 are active
  13. * @param count number of color textures
  14. * @param textures defines the render target textures to unbind
  15. * @param disableGenerateMipMaps defines a boolean indicating that mipmaps must not be generated
  16. * @param onBeforeUnbind defines a function which will be called before the effective unbind
  17. */
  18. unBindMultiColorAttachmentFramebuffer(count: number, textures: InternalTexture[], disableGenerateMipMaps: boolean, onBeforeUnbind?: () => void): void;
  19. /**
  20. * Create a multi render target texture
  21. * @see http://doc.babylonjs.com/features/webgl2#multiple-render-target
  22. * @param size defines the size of the texture
  23. * @param options defines the creation options
  24. * @returns the cube texture as an InternalTexture
  25. */
  26. createMultipleRenderTarget(size: any, options: IMultiRenderTargetOptions): InternalTexture[];
  27. /**
  28. * Update the sample count for a given multiple render target texture
  29. * @see http://doc.babylonjs.com/features/webgl2#multisample-render-targets
  30. * @param count number of color textures
  31. * @param textures defines the textures to update
  32. * @param samples defines the sample count to set
  33. * @returns the effective sample count (could be 0 if multisample render targets are not supported)
  34. */
  35. updateMultipleRenderTargetTextureSampleCount(count: number, textures: Nullable<InternalTexture[]>, samples: number): number;
  36. /**
  37. * Clears attachments from index 1 to last index.
  38. * @param color Clear color
  39. * @param attachments attachments to clear
  40. */
  41. clearColorAttachments(texture: InternalTexture, color?: IColor4Like) : void;
  42. /**
  43. * Select a subsets of attachments to draw to.
  44. * @param attachments gl attachments
  45. */
  46. renderToAttachments(attachments: any[]) : void;
  47. }
  48. }
  49. ThinEngine.prototype.renderToAttachments = function(attachments: any[]): void {
  50. const gl = this._gl;
  51. gl.drawBuffers(attachments);
  52. };
  53. ThinEngine.prototype.clearColorAttachments = function(texture: InternalTexture, color?: IColor4Like): void {
  54. // Default clear everything to transparent black
  55. const gl = this._gl;
  56. // Texture created with createMultipleRenderTarget should have its attachments
  57. const attachments = texture._attachments!.slice(0);
  58. attachments[0] = gl.NONE;
  59. // We don't clear the first attachments which is cleared with the user clear color
  60. gl.drawBuffers(attachments);
  61. if (color) {
  62. gl.clearColor(color.r, color.g, color.b, color.a);
  63. } else {
  64. gl.clearColor(0, 0, 0, 0);
  65. }
  66. gl.clear(gl.COLOR_BUFFER_BIT);
  67. gl.drawBuffers(texture._attachments!);
  68. };
  69. ThinEngine.prototype.unBindMultiColorAttachmentFramebuffer = function(count: number, textures: InternalTexture[], disableGenerateMipMaps: boolean = false, onBeforeUnbind?: () => void): void {
  70. this._currentRenderTarget = null;
  71. // If MSAA, we need to bitblt back to main texture
  72. var gl = this._gl;
  73. if (textures[0]._MSAAFramebuffer) {
  74. gl.bindFramebuffer(gl.READ_FRAMEBUFFER, textures[0]._MSAAFramebuffer);
  75. gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, textures[0]._framebuffer);
  76. var attachments = textures[0]._attachments;
  77. if (!attachments) {
  78. attachments = new Array(count);
  79. textures[0]._attachments = attachments;
  80. }
  81. for (var i = 0; i < count; i++) {
  82. var texture = textures[i];
  83. for (var j = 0; j < attachments.length; j++) {
  84. attachments[j] = gl.NONE;
  85. }
  86. attachments[i] = (<any>gl)[this.webGLVersion > 1 ? "COLOR_ATTACHMENT" + i : "COLOR_ATTACHMENT" + i + "_WEBGL"];
  87. gl.readBuffer(attachments[i]);
  88. gl.drawBuffers(attachments);
  89. gl.blitFramebuffer(0, 0, texture.width, texture.height,
  90. 0, 0, texture.width, texture.height,
  91. gl.COLOR_BUFFER_BIT, gl.NEAREST);
  92. }
  93. for (var i = 0; i < attachments.length; i++) {
  94. attachments[i] = (<any>gl)[this.webGLVersion > 1 ? "COLOR_ATTACHMENT" + i : "COLOR_ATTACHMENT" + i + "_WEBGL"];
  95. }
  96. gl.drawBuffers(attachments);
  97. }
  98. for (var i = 0; i < count; i++) {
  99. var texture = textures[i];
  100. if (texture.generateMipMaps && !disableGenerateMipMaps && !texture.isCube) {
  101. this._bindTextureDirectly(gl.TEXTURE_2D, texture, true);
  102. gl.generateMipmap(gl.TEXTURE_2D);
  103. this._bindTextureDirectly(gl.TEXTURE_2D, null);
  104. }
  105. }
  106. if (onBeforeUnbind) {
  107. if (textures[0]._MSAAFramebuffer) {
  108. // Bind the correct framebuffer
  109. this._bindUnboundFramebuffer(textures[0]._framebuffer);
  110. }
  111. onBeforeUnbind();
  112. }
  113. this._bindUnboundFramebuffer(null);
  114. };
  115. ThinEngine.prototype.createMultipleRenderTarget = function(size: any, options: IMultiRenderTargetOptions): InternalTexture[] {
  116. var generateMipMaps = false;
  117. var generateDepthBuffer = true;
  118. var generateStencilBuffer = false;
  119. var generateDepthTexture = false;
  120. var textureCount = 1;
  121. var defaultType = Constants.TEXTURETYPE_UNSIGNED_INT;
  122. var defaultSamplingMode = Constants.TEXTURE_TRILINEAR_SAMPLINGMODE;
  123. var types = new Array<number>();
  124. var samplingModes = new Array<number>();
  125. if (options !== undefined) {
  126. generateMipMaps = options.generateMipMaps === undefined ? false : options.generateMipMaps;
  127. generateDepthBuffer = options.generateDepthBuffer === undefined ? true : options.generateDepthBuffer;
  128. generateStencilBuffer = options.generateStencilBuffer === undefined ? false : options.generateStencilBuffer;
  129. generateDepthTexture = options.generateDepthTexture === undefined ? false : options.generateDepthTexture;
  130. textureCount = options.textureCount || 1;
  131. if (options.types) {
  132. types = options.types;
  133. }
  134. if (options.samplingModes) {
  135. samplingModes = options.samplingModes;
  136. }
  137. }
  138. var gl = this._gl;
  139. // Create the framebuffer
  140. var framebuffer = gl.createFramebuffer();
  141. this._bindUnboundFramebuffer(framebuffer);
  142. var width = size.width || size;
  143. var height = size.height || size;
  144. var textures = [];
  145. var attachments = [];
  146. var depthStencilBuffer = this._setupFramebufferDepthAttachments(generateStencilBuffer, generateDepthBuffer, width, height);
  147. for (var i = 0; i < textureCount; i++) {
  148. var samplingMode = samplingModes[i] || defaultSamplingMode;
  149. var type = types[i] || defaultType;
  150. if (type === Constants.TEXTURETYPE_FLOAT && !this._caps.textureFloatLinearFiltering) {
  151. // if floating point linear (gl.FLOAT) then force to NEAREST_SAMPLINGMODE
  152. samplingMode = Constants.TEXTURE_NEAREST_SAMPLINGMODE;
  153. }
  154. else if (type === Constants.TEXTURETYPE_HALF_FLOAT && !this._caps.textureHalfFloatLinearFiltering) {
  155. // if floating point linear (HALF_FLOAT) then force to NEAREST_SAMPLINGMODE
  156. samplingMode = Constants.TEXTURE_NEAREST_SAMPLINGMODE;
  157. }
  158. var filters = this._getSamplingParameters(samplingMode, generateMipMaps);
  159. if (type === Constants.TEXTURETYPE_FLOAT && !this._caps.textureFloat) {
  160. type = Constants.TEXTURETYPE_UNSIGNED_INT;
  161. Logger.Warn("Float textures are not supported. Render target forced to TEXTURETYPE_UNSIGNED_BYTE type");
  162. }
  163. var texture = new InternalTexture(this, InternalTextureSource.MultiRenderTarget);
  164. var attachment = (<any>gl)[this.webGLVersion > 1 ? "COLOR_ATTACHMENT" + i : "COLOR_ATTACHMENT" + i + "_WEBGL"];
  165. textures.push(texture);
  166. attachments.push(attachment);
  167. gl.activeTexture((<any>gl)["TEXTURE" + i]);
  168. gl.bindTexture(gl.TEXTURE_2D, texture._webGLTexture);
  169. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, filters.mag);
  170. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, filters.min);
  171. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
  172. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
  173. gl.texImage2D(gl.TEXTURE_2D, 0, this._getRGBABufferInternalSizedFormat(type), width, height, 0, gl.RGBA, this._getWebGLTextureType(type), null);
  174. gl.framebufferTexture2D(gl.DRAW_FRAMEBUFFER, attachment, gl.TEXTURE_2D, texture._webGLTexture, 0);
  175. if (generateMipMaps) {
  176. this._gl.generateMipmap(this._gl.TEXTURE_2D);
  177. }
  178. // Unbind
  179. this._bindTextureDirectly(gl.TEXTURE_2D, null);
  180. texture._framebuffer = framebuffer;
  181. texture._depthStencilBuffer = depthStencilBuffer;
  182. texture.baseWidth = width;
  183. texture.baseHeight = height;
  184. texture.width = width;
  185. texture.height = height;
  186. texture.isReady = true;
  187. texture.samples = 1;
  188. texture.generateMipMaps = generateMipMaps;
  189. texture.samplingMode = samplingMode;
  190. texture.type = type;
  191. texture._generateDepthBuffer = generateDepthBuffer;
  192. texture._generateStencilBuffer = generateStencilBuffer;
  193. texture._attachments = attachments;
  194. texture._textureArray = textures;
  195. texture._textureCount = textureCount;
  196. this._internalTexturesCache.push(texture);
  197. }
  198. if (generateDepthTexture && this._caps.depthTextureExtension) {
  199. // Depth texture
  200. var depthTexture = new InternalTexture(this, InternalTextureSource.MultiRenderTarget);
  201. gl.activeTexture(gl.TEXTURE0);
  202. gl.bindTexture(gl.TEXTURE_2D, depthTexture._webGLTexture);
  203. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
  204. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
  205. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
  206. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
  207. gl.texImage2D(
  208. gl.TEXTURE_2D,
  209. 0,
  210. this.webGLVersion < 2 ? gl.DEPTH_COMPONENT : gl.DEPTH_COMPONENT16,
  211. width,
  212. height,
  213. 0,
  214. gl.DEPTH_COMPONENT,
  215. gl.UNSIGNED_SHORT,
  216. null
  217. );
  218. gl.framebufferTexture2D(
  219. gl.FRAMEBUFFER,
  220. gl.DEPTH_ATTACHMENT,
  221. gl.TEXTURE_2D,
  222. depthTexture._webGLTexture,
  223. 0
  224. );
  225. depthTexture._framebuffer = framebuffer;
  226. depthTexture.baseWidth = width;
  227. depthTexture.baseHeight = height;
  228. depthTexture.width = width;
  229. depthTexture.height = height;
  230. depthTexture.isReady = true;
  231. depthTexture.samples = 1;
  232. depthTexture.generateMipMaps = generateMipMaps;
  233. depthTexture.samplingMode = gl.NEAREST;
  234. depthTexture._generateDepthBuffer = generateDepthBuffer;
  235. depthTexture._generateStencilBuffer = generateStencilBuffer;
  236. textures.push(depthTexture);
  237. this._internalTexturesCache.push(depthTexture);
  238. }
  239. gl.drawBuffers(attachments);
  240. this._bindUnboundFramebuffer(null);
  241. this.resetTextureCache();
  242. return textures;
  243. };
  244. ThinEngine.prototype.updateMultipleRenderTargetTextureSampleCount = function(count: number, textures: Nullable<InternalTexture[]>, samples: number): number {
  245. if (this.webGLVersion < 2 || !textures || count == 0) {
  246. return 1;
  247. }
  248. if (textures[0].samples === samples) {
  249. return samples;
  250. }
  251. var gl = this._gl;
  252. samples = Math.min(samples, this.getCaps().maxMSAASamples);
  253. // Dispose previous render buffers
  254. if (textures[0]._depthStencilBuffer) {
  255. gl.deleteRenderbuffer(textures[0]._depthStencilBuffer);
  256. textures[0]._depthStencilBuffer = null;
  257. }
  258. if (textures[0]._MSAAFramebuffer) {
  259. gl.deleteFramebuffer(textures[0]._MSAAFramebuffer);
  260. textures[0]._MSAAFramebuffer = null;
  261. }
  262. for (var i = 0; i < count; i++) {
  263. if (textures[i]._MSAARenderBuffer) {
  264. gl.deleteRenderbuffer(textures[i]._MSAARenderBuffer);
  265. textures[i]._MSAARenderBuffer = null;
  266. }
  267. }
  268. if (samples > 1 && gl.renderbufferStorageMultisample) {
  269. let framebuffer = gl.createFramebuffer();
  270. if (!framebuffer) {
  271. throw new Error("Unable to create multi sampled framebuffer");
  272. }
  273. this._bindUnboundFramebuffer(framebuffer);
  274. let depthStencilBuffer = this._setupFramebufferDepthAttachments(textures[0]._generateStencilBuffer, textures[0]._generateDepthBuffer, textures[0].width, textures[0].height, samples);
  275. var attachments = [];
  276. for (var i = 0; i < count; i++) {
  277. var texture = textures[i];
  278. var attachment = (<any>gl)[this.webGLVersion > 1 ? "COLOR_ATTACHMENT" + i : "COLOR_ATTACHMENT" + i + "_WEBGL"];
  279. var colorRenderbuffer = gl.createRenderbuffer();
  280. if (!colorRenderbuffer) {
  281. throw new Error("Unable to create multi sampled framebuffer");
  282. }
  283. gl.bindRenderbuffer(gl.RENDERBUFFER, colorRenderbuffer);
  284. gl.renderbufferStorageMultisample(gl.RENDERBUFFER, samples, this._getRGBAMultiSampleBufferFormat(texture.type), texture.width, texture.height);
  285. gl.framebufferRenderbuffer(gl.FRAMEBUFFER, attachment, gl.RENDERBUFFER, colorRenderbuffer);
  286. texture._MSAAFramebuffer = framebuffer;
  287. texture._MSAARenderBuffer = colorRenderbuffer;
  288. texture.samples = samples;
  289. texture._depthStencilBuffer = depthStencilBuffer;
  290. gl.bindRenderbuffer(gl.RENDERBUFFER, null);
  291. attachments.push(attachment);
  292. }
  293. gl.drawBuffers(attachments);
  294. } else {
  295. this._bindUnboundFramebuffer(textures[0]._framebuffer);
  296. }
  297. this._bindUnboundFramebuffer(null);
  298. return samples;
  299. };