Home Reference Source

cables_dev/cables/src/libs/cgl/cubemapframebuffer/cubemaptexture.js

  1. import { Texture } from "../../../core/cgl/cgl_texture.js";
  2.  
  3. const DEFAULT_TEXTURE_SIZE = 8;
  4.  
  5. class CubemapTexture
  6. {
  7. constructor(cgl, options)
  8. {
  9. this.id = CABLES.uuid();
  10. this.name = options.name || "unknown cubemap texture";
  11. this._cgl = cgl;
  12. this.textureType = Texture.TYPE_DEFAULT;
  13. this._options = options;
  14.  
  15. this._cubemapFaces = [
  16. this._cgl.gl.TEXTURE_CUBE_MAP_POSITIVE_X,
  17. this._cgl.gl.TEXTURE_CUBE_MAP_NEGATIVE_X,
  18. this._cgl.gl.TEXTURE_CUBE_MAP_POSITIVE_Y,
  19. this._cgl.gl.TEXTURE_CUBE_MAP_NEGATIVE_Y,
  20. this._cgl.gl.TEXTURE_CUBE_MAP_POSITIVE_Z,
  21. this._cgl.gl.TEXTURE_CUBE_MAP_NEGATIVE_Z
  22. ];
  23.  
  24. this.cubemap = this.tex = this._cgl.gl.createTexture();
  25.  
  26.  
  27. this.texTarget = this._cgl.gl.TEXTURE_CUBE_MAP;
  28.  
  29. this.width = DEFAULT_TEXTURE_SIZE;
  30. this.height = DEFAULT_TEXTURE_SIZE;
  31.  
  32. this.filter = options.filter || CGL.Texture.FILTER_NEAREST;
  33. this.wrap = options.wrap || CGL.Texture.WRAP_CLAMP_TO_EDGE;
  34. this.unpackAlpha = options.unpackAlpha || true;
  35.  
  36. this.flip = options.flip || true;
  37.  
  38.  
  39. if (!options.hasOwnProperty("pixelFormat") || !options.pixelFormat)
  40. {
  41. if (options.isFloatingPointTexture) options.pixelFormat = Texture.PFORMATSTR_RGBA32F;
  42. else options.pixelFormat = Texture.PFORMATSTR_RGBA8UB;
  43. }
  44.  
  45. this.pixelFormat = options.pixelFormat;
  46.  
  47.  
  48. // if (options.isFloatingPointTexture) this.textureType = Texture.TYPE_FLOAT;
  49.  
  50. this._cgl.profileData.profileTextureNew++;
  51.  
  52. this.setSize(options.width, options.height);
  53. }
  54.  
  55. getInfo()
  56. {
  57. return { "pixelFormat": this.pixelFormat };
  58. }
  59.  
  60. setSize(w, h)
  61. {
  62. // if (this.width == w && this.height == h) return;
  63.  
  64. this.delete();
  65. this.cubemap = this.tex = this._cgl.gl.createTexture();
  66.  
  67. this._cgl.checkFrameStarted("cubemap corelib setsize");
  68.  
  69. if (w != w || w <= 0 || !w) w = DEFAULT_TEXTURE_SIZE;
  70. if (h != h || h <= 0 || !h) h = DEFAULT_TEXTURE_SIZE;
  71.  
  72. if (w > this._cgl.maxTexSize || h > this._cgl.maxTexSize) console.error("texture size too big! " + w + "x" + h + " / max: " + this._cgl.maxTexSize);
  73.  
  74. w = Math.min(w, this._cgl.maxTexSize);
  75. h = Math.min(h, this._cgl.maxTexSize);
  76.  
  77. w = Math.floor(w);
  78. h = Math.floor(h);
  79.  
  80. this.width = w;
  81. this.height = h;
  82.  
  83. this._cgl.gl.bindTexture(this.texTarget, this.tex);
  84. this._cgl.profileData.profileTextureResize++;
  85.  
  86. const info = Texture.setUpGlPixelFormat(this._cgl, this._options.pixelFormat);
  87. this.pixelFormat = info.pixelFormat;
  88.  
  89. if (CGL.Texture.isPixelFormatHalfFloat(info.pixelFormat))
  90. {
  91. const extcb = this._cgl.enableExtension("EXT_color_buffer_half_float");
  92.  
  93. if (!this._cgl.enableExtension("OES_texture_float_linear"))
  94. {
  95. this.filter = Texture.FILTER_NEAREST;
  96. }
  97. }
  98. else if (CGL.Texture.isPixelFormatFloat(info.pixelFormat))
  99. {
  100. if (!this._cgl.enableExtension("OES_texture_float_linear"))
  101. {
  102. console.log("no linear pixelformat,using nearest");
  103. this.filter = Texture.FILTER_NEAREST;
  104. }
  105. }
  106. // console.log("cubemaptex setfilter...");
  107.  
  108. for (let i = 0; i < 6; i++)
  109. {
  110. // console.log("cube tex ", i);
  111.  
  112. // if (this._cgl.glVersion == 1)console.log("webgl1");
  113. // {
  114. // if (this._cgl.glUseHalfFloatTex)
  115. // {
  116. // const ext = this._cgl.enableExtension("OES_texture_half_float");
  117. // if (this._cgl.glVersion == 1 && !ext) throw new Error("no half float texture extension");
  118.  
  119. // this._cgl.gl.texImage2D(this._cubemapFaces[i], 0, this._cgl.gl.RGBA, this.width, this.height, 0, this._cgl.gl.RGBA, ext.HALF_FLOAT_OES, null);
  120. // }
  121. // else
  122. // {
  123. // const ext = this._cgl.enableExtension("OES_texture_float");
  124.  
  125. // this._cgl.gl.texImage2D(this._cubemapFaces[i], 0, this._cgl.gl.RGBA, this.width, this.height, 0, this._cgl.gl.RGBA, this._cgl.gl.FLOAT, null);
  126. // }
  127. // this._cgl.gl.texImage2D(this._cubemapFaces[i], 0, this._cgl.gl.RGBA, this.width, this.height, 0, this._cgl.gl.RGBA, this._cgl.gl.UNSIGNED_BYTE, null);
  128. // }
  129. // else
  130. // {
  131. // this._cgl.enableExtension("EXT_color_buffer_float");
  132. // this._cgl.enableExtension("OES_texture_float_linear"); // yes, i am sure, this is a webgl 1 and 2 ext
  133.  
  134. // console.log(info);
  135. this._cgl.gl.texImage2D(this._cubemapFaces[i], 0, info.glInternalFormat, this.width, this.height, 0, info.glDataFormat, info.glDataType, null);
  136.  
  137. // if (this.textureType == Texture.TYPE_FLOAT)
  138. // {
  139. // // console.log("cubemap FLOAT TEX", this._options);
  140. // this._cgl.enableExtension("EXT_color_buffer_float");
  141. // this._cgl.enableExtension("OES_texture_float_linear"); // yes, i am sure, this is a webgl 1 and 2 ext
  142.  
  143. // this._cgl.gl.texImage2D(this._cubemapFaces[i], 0, this._cgl.gl.RGBA32F, this.width, this.height, 0, this._cgl.gl.RGBA, this._cgl.gl.FLOAT, null);
  144. // }
  145. // else
  146. // {
  147. // this._cgl.gl.texImage2D(this._cubemapFaces[i], 0, this._cgl.gl.RGBA, this.width, this.height, 0, this._cgl.gl.RGBA, this._cgl.gl.UNSIGNED_BYTE, null);
  148. // }
  149. // }
  150. // * NOTE: was gl.RGBA32F && gl.FLOAT instead of gl.RGBA && gl.UNSIGNED_BYTE
  151. }
  152.  
  153. this._setFilter();
  154.  
  155. // console.log("cubemaptex update mips ..");
  156. this.updateMipMap();
  157. // console.log("cubemaptex ende");
  158. this._cgl.gl.bindTexture(this.texTarget, null);
  159. }
  160.  
  161. _setFilter()
  162. {
  163. this._cgl.checkFrameStarted("cubemap corelib");
  164.  
  165. this._cgl.gl.pixelStorei(this._cgl.gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, this.unpackAlpha);
  166.  
  167. if (CGL.Texture.isPixelFormatFloat(this.pixelFormat) && this.filter == CGL.Texture.FILTER_MIPMAP)
  168. {
  169. console.log("texture: HDR and mipmap filtering at the same time is not possible");
  170. this.filter = CGL.Texture.FILTER_LINEAR;
  171. }
  172.  
  173. if (this._cgl.glVersion == 1 && !Texture.isPowerOfTwo())
  174. {
  175. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_MAG_FILTER, this._cgl.gl.NEAREST);
  176. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_MIN_FILTER, this._cgl.gl.NEAREST);
  177.  
  178. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_WRAP_S, this._cgl.gl.CLAMP_TO_EDGE);
  179. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_WRAP_T, this._cgl.gl.CLAMP_TO_EDGE);
  180.  
  181. this.filter = CGL.Texture.FILTER_NEAREST;
  182. this.wrap = CGL.Texture.WRAP_CLAMP_TO_EDGE;
  183. }
  184. else
  185. {
  186. if (this.wrap == CGL.Texture.WRAP_CLAMP_TO_EDGE)
  187. {
  188. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_WRAP_S, this._cgl.gl.CLAMP_TO_EDGE);
  189. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_WRAP_T, this._cgl.gl.CLAMP_TO_EDGE);
  190. }
  191. else if (this.wrap == CGL.Texture.WRAP_REPEAT)
  192. {
  193. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_WRAP_S, this._cgl.gl.REPEAT);
  194. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_WRAP_T, this._cgl.gl.REPEAT);
  195. }
  196. else if (this.wrap == CGL.Texture.WRAP_MIRRORED_REPEAT)
  197. {
  198. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_WRAP_S, this._cgl.gl.MIRRORED_REPEAT);
  199. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_WRAP_T, this._cgl.gl.MIRRORED_REPEAT);
  200. }
  201. else
  202. {
  203. throw new Error("[CubemapTexture] unknown texture filter!" + this.filter);
  204. }
  205.  
  206. if (this.filter == CGL.Texture.FILTER_NEAREST)
  207. {
  208. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_MAG_FILTER, this._cgl.gl.NEAREST);
  209. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_MIN_FILTER, this._cgl.gl.NEAREST);
  210. }
  211. else if (this.filter == CGL.Texture.FILTER_LINEAR)
  212. {
  213. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_MIN_FILTER, this._cgl.gl.LINEAR);
  214. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_MAG_FILTER, this._cgl.gl.LINEAR);
  215. }
  216. else if (this.filter == CGL.Texture.FILTER_MIPMAP)
  217. {
  218. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_MAG_FILTER, this._cgl.gl.LINEAR);
  219. this._cgl.gl.texParameteri(this.texTarget, this._cgl.gl.TEXTURE_MIN_FILTER, this._cgl.gl.LINEAR_MIPMAP_LINEAR);
  220. }
  221. else
  222. {
  223. throw new Error("[CubemapTexture] unknown texture filter!" + this.filter);
  224. }
  225. }
  226. }
  227.  
  228. updateMipMap()
  229. {
  230. // if (!((this._cgl.glVersion == 2 || Texture.isPowerOfTwo()) && this.filter == CGL.Texture.FILTER_MIPMAP)) return;
  231.  
  232. if (this.filter == CGL.Texture.FILTER_MIPMAP)
  233. {
  234. this._cgl.gl.bindTexture(this.texTarget, this.tex);
  235. this._cgl.gl.generateMipmap(this.texTarget);
  236. this._cgl.profileData.profileGenMipMap++;
  237. }
  238. }
  239.  
  240. delete()
  241. {
  242. this._cgl.gl.deleteTexture(this.tex);
  243. }
  244. }
  245.  
  246. export { CubemapTexture };