loadKTX.js 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274
  1. import when from "../ThirdParty/when.js";
  2. import Check from "./Check.js";
  3. import CompressedTextureBuffer from "./CompressedTextureBuffer.js";
  4. import defined from "./defined.js";
  5. import PixelFormat from "./PixelFormat.js";
  6. import Resource from "./Resource.js";
  7. import RuntimeError from "./RuntimeError.js";
  8. import WebGLConstants from "./WebGLConstants.js";
  9. /**
  10. * Asynchronously loads and parses the given URL to a KTX file or parses the raw binary data of a KTX file.
  11. * Returns a promise that will resolve to an object containing the image buffer, width, height and format once loaded,
  12. * or reject if the URL failed to load or failed to parse the data. The data is loaded
  13. * using XMLHttpRequest, which means that in order to make requests to another origin,
  14. * the server must have Cross-Origin Resource Sharing (CORS) headers enabled.
  15. * <p>
  16. * The following are part of the KTX format specification but are not supported:
  17. * <ul>
  18. * <li>Big-endian files</li>
  19. * <li>Metadata</li>
  20. * <li>3D textures</li>
  21. * <li>Texture Arrays</li>
  22. * <li>Cubemaps</li>
  23. * <li>Mipmaps</li>
  24. * </ul>
  25. * </p>
  26. *
  27. * @function loadKTX
  28. *
  29. * @param {Resource|String|ArrayBuffer} resourceOrUrlOrBuffer The URL of the binary data or an ArrayBuffer.
  30. * @returns {Promise.<CompressedTextureBuffer>|undefined} A promise that will resolve to the requested data when loaded. Returns undefined if <code>request.throttle</code> is true and the request does not have high enough priority.
  31. *
  32. * @exception {RuntimeError} Invalid KTX file.
  33. * @exception {RuntimeError} File is the wrong endianness.
  34. * @exception {RuntimeError} glInternalFormat is not a valid format.
  35. * @exception {RuntimeError} glType must be zero when the texture is compressed.
  36. * @exception {RuntimeError} The type size for compressed textures must be 1.
  37. * @exception {RuntimeError} glFormat must be zero when the texture is compressed.
  38. * @exception {RuntimeError} Generating mipmaps for a compressed texture is unsupported.
  39. * @exception {RuntimeError} The base internal format must be the same as the format for uncompressed textures.
  40. * @exception {RuntimeError} 3D textures are not supported.
  41. * @exception {RuntimeError} Texture arrays are not supported.
  42. * @exception {RuntimeError} Cubemaps are not supported.
  43. *
  44. * @example
  45. * // load a single URL asynchronously
  46. * Cesium.loadKTX('some/url').then(function(ktxData) {
  47. * var width = ktxData.width;
  48. * var height = ktxData.height;
  49. * var format = ktxData.internalFormat;
  50. * var arrayBufferView = ktxData.bufferView;
  51. * // use the data to create a texture
  52. * }).otherwise(function(error) {
  53. * // an error occurred
  54. * });
  55. *
  56. * @see {@link https://www.khronos.org/opengles/sdk/tools/KTX/file_format_spec/|KTX file format}
  57. * @see {@link http://www.w3.org/TR/cors/|Cross-Origin Resource Sharing}
  58. * @see {@link http://wiki.commonjs.org/wiki/Promises/A|CommonJS Promises/A}
  59. */
  60. function loadKTX(resourceOrUrlOrBuffer) {
  61. //>>includeStart('debug', pragmas.debug);
  62. Check.defined("resourceOrUrlOrBuffer", resourceOrUrlOrBuffer);
  63. //>>includeEnd('debug');
  64. var loadPromise;
  65. if (
  66. resourceOrUrlOrBuffer instanceof ArrayBuffer ||
  67. ArrayBuffer.isView(resourceOrUrlOrBuffer)
  68. ) {
  69. loadPromise = when.resolve(resourceOrUrlOrBuffer);
  70. } else {
  71. var resource = Resource.createIfNeeded(resourceOrUrlOrBuffer);
  72. loadPromise = resource.fetchArrayBuffer();
  73. }
  74. if (!defined(loadPromise)) {
  75. return undefined;
  76. }
  77. return loadPromise.then(function (data) {
  78. if (defined(data)) {
  79. return parseKTX(data);
  80. }
  81. });
  82. }
  83. var fileIdentifier = [
  84. 0xab,
  85. 0x4b,
  86. 0x54,
  87. 0x58,
  88. 0x20,
  89. 0x31,
  90. 0x31,
  91. 0xbb,
  92. 0x0d,
  93. 0x0a,
  94. 0x1a,
  95. 0x0a,
  96. ];
  97. var endiannessTest = 0x04030201;
  98. var faceOrder = [
  99. "positiveX",
  100. "negativeX",
  101. "positiveY",
  102. "negativeY",
  103. "positiveZ",
  104. "negativeZ",
  105. ];
  106. var sizeOfUint32 = 4;
  107. function parseKTX(data) {
  108. var byteBuffer = new Uint8Array(data);
  109. var isKTX = true;
  110. var i;
  111. for (i = 0; i < fileIdentifier.length; ++i) {
  112. if (fileIdentifier[i] !== byteBuffer[i]) {
  113. isKTX = false;
  114. break;
  115. }
  116. }
  117. if (!isKTX) {
  118. throw new RuntimeError("Invalid KTX file.");
  119. }
  120. var view;
  121. var byteOffset;
  122. if (defined(data.buffer)) {
  123. view = new DataView(data.buffer);
  124. byteOffset = data.byteOffset;
  125. } else {
  126. view = new DataView(data);
  127. byteOffset = 0;
  128. }
  129. byteOffset += 12; // skip identifier
  130. var endianness = view.getUint32(byteOffset, true);
  131. byteOffset += sizeOfUint32;
  132. if (endianness !== endiannessTest) {
  133. throw new RuntimeError("File is the wrong endianness.");
  134. }
  135. var glType = view.getUint32(byteOffset, true);
  136. byteOffset += sizeOfUint32;
  137. var glTypeSize = view.getUint32(byteOffset, true);
  138. byteOffset += sizeOfUint32;
  139. var glFormat = view.getUint32(byteOffset, true);
  140. byteOffset += sizeOfUint32;
  141. var glInternalFormat = view.getUint32(byteOffset, true);
  142. byteOffset += sizeOfUint32;
  143. var glBaseInternalFormat = view.getUint32(byteOffset, true);
  144. byteOffset += sizeOfUint32;
  145. var pixelWidth = view.getUint32(byteOffset, true);
  146. byteOffset += sizeOfUint32;
  147. var pixelHeight = view.getUint32(byteOffset, true);
  148. byteOffset += sizeOfUint32;
  149. var pixelDepth = view.getUint32(byteOffset, true);
  150. byteOffset += sizeOfUint32;
  151. var numberOfArrayElements = view.getUint32(byteOffset, true);
  152. byteOffset += sizeOfUint32;
  153. var numberOfFaces = view.getUint32(byteOffset, true);
  154. byteOffset += sizeOfUint32;
  155. var numberOfMipmapLevels = view.getUint32(byteOffset, true);
  156. byteOffset += sizeOfUint32;
  157. var bytesOfKeyValueByteSize = view.getUint32(byteOffset, true);
  158. byteOffset += sizeOfUint32;
  159. // skip metadata
  160. byteOffset += bytesOfKeyValueByteSize;
  161. var imageSize = view.getUint32(byteOffset, true);
  162. byteOffset += sizeOfUint32;
  163. var texture;
  164. if (defined(data.buffer)) {
  165. texture = new Uint8Array(data.buffer, byteOffset, imageSize);
  166. } else {
  167. texture = new Uint8Array(data, byteOffset, imageSize);
  168. }
  169. // Some tools use a sized internal format.
  170. // See table 2: https://www.opengl.org/sdk/docs/man/html/glTexImage2D.xhtml
  171. if (glInternalFormat === WebGLConstants.RGB8) {
  172. glInternalFormat = PixelFormat.RGB;
  173. } else if (glInternalFormat === WebGLConstants.RGBA8) {
  174. glInternalFormat = PixelFormat.RGBA;
  175. }
  176. if (!PixelFormat.validate(glInternalFormat)) {
  177. throw new RuntimeError("glInternalFormat is not a valid format.");
  178. }
  179. if (PixelFormat.isCompressedFormat(glInternalFormat)) {
  180. if (glType !== 0) {
  181. throw new RuntimeError(
  182. "glType must be zero when the texture is compressed."
  183. );
  184. }
  185. if (glTypeSize !== 1) {
  186. throw new RuntimeError(
  187. "The type size for compressed textures must be 1."
  188. );
  189. }
  190. if (glFormat !== 0) {
  191. throw new RuntimeError(
  192. "glFormat must be zero when the texture is compressed."
  193. );
  194. }
  195. } else if (glType !== WebGLConstants.UNSIGNED_BYTE) {
  196. throw new RuntimeError("Only unsigned byte buffers are supported.");
  197. } else if (glBaseInternalFormat !== glFormat) {
  198. throw new RuntimeError(
  199. "The base internal format must be the same as the format for uncompressed textures."
  200. );
  201. }
  202. if (pixelDepth !== 0) {
  203. throw new RuntimeError("3D textures are unsupported.");
  204. }
  205. if (numberOfArrayElements !== 0) {
  206. throw new RuntimeError("Texture arrays are unsupported.");
  207. }
  208. var offset = texture.byteOffset;
  209. var mipmaps = new Array(numberOfMipmapLevels);
  210. for (i = 0; i < numberOfMipmapLevels; ++i) {
  211. var level = (mipmaps[i] = {});
  212. for (var j = 0; j < numberOfFaces; ++j) {
  213. var width = pixelWidth >> i;
  214. var height = pixelHeight >> i;
  215. var levelSize = PixelFormat.isCompressedFormat(glInternalFormat)
  216. ? PixelFormat.compressedTextureSizeInBytes(
  217. glInternalFormat,
  218. width,
  219. height
  220. )
  221. : PixelFormat.textureSizeInBytes(
  222. glInternalFormat,
  223. glType,
  224. width,
  225. height
  226. );
  227. var levelBuffer = new Uint8Array(texture.buffer, offset, levelSize);
  228. level[faceOrder[j]] = new CompressedTextureBuffer(
  229. glInternalFormat,
  230. width,
  231. height,
  232. levelBuffer
  233. );
  234. offset += levelSize;
  235. }
  236. offset += 3 - ((offset + 3) % 4) + 4;
  237. }
  238. var result = mipmaps;
  239. if (numberOfFaces === 1) {
  240. for (i = 0; i < numberOfMipmapLevels; ++i) {
  241. result[i] = result[i][faceOrder[0]];
  242. }
  243. }
  244. if (numberOfMipmapLevels === 1) {
  245. result = result[0];
  246. }
  247. return result;
  248. }
  249. export default loadKTX;