2
0

WebGPUTextureUtils.js 30 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040
  1. import {
  2. GPUTextureFormat, GPUAddressMode, GPUFilterMode, GPUTextureDimension, GPUFeatureName
  3. } from './WebGPUConstants.js';
  4. import {
  5. CubeTexture, Texture,
  6. NearestFilter, NearestMipmapNearestFilter, NearestMipmapLinearFilter,
  7. RepeatWrapping, MirroredRepeatWrapping,
  8. RGB_ETC2_Format, RGBA_ETC2_EAC_Format,
  9. RGBAFormat, RedFormat, RGFormat, RGBA_S3TC_DXT1_Format, RGBA_S3TC_DXT3_Format, RGBA_S3TC_DXT5_Format, UnsignedByteType, FloatType, HalfFloatType, SRGBColorSpace, DepthFormat, DepthStencilFormat,
  10. RGBA_ASTC_4x4_Format, RGBA_ASTC_5x4_Format, RGBA_ASTC_5x5_Format, RGBA_ASTC_6x5_Format, RGBA_ASTC_6x6_Format, RGBA_ASTC_8x5_Format, RGBA_ASTC_8x6_Format, RGBA_ASTC_8x8_Format, RGBA_ASTC_10x5_Format,
  11. RGBA_ASTC_10x6_Format, RGBA_ASTC_10x8_Format, RGBA_ASTC_10x10_Format, RGBA_ASTC_12x10_Format, RGBA_ASTC_12x12_Format, UnsignedIntType, UnsignedShortType, UnsignedInt248Type,
  12. NeverCompare, AlwaysCompare, LessCompare, LessEqualCompare, EqualCompare, GreaterEqualCompare, GreaterCompare, NotEqualCompare
  13. } from 'three';
  14. import { CubeReflectionMapping, CubeRefractionMapping, EquirectangularReflectionMapping, EquirectangularRefractionMapping, DepthTexture } from 'three';
  15. import WebGPUTexturePassUtils from './WebGPUTexturePassUtils.js';
  16. const _compareToWebGPU = {
  17. [ NeverCompare ]: 'never',
  18. [ LessCompare ]: 'less',
  19. [ EqualCompare ]: 'equal',
  20. [ LessEqualCompare ]: 'less-equal',
  21. [ GreaterCompare ]: 'greater',
  22. [ GreaterEqualCompare ]: 'greater-equal',
  23. [ AlwaysCompare ]: 'always',
  24. [ NotEqualCompare ]: 'not-equal'
  25. };
  26. const _flipMap = [ 0, 1, 3, 2, 4, 5 ];
  27. class WebGPUTextureUtils {
  28. constructor( backend ) {
  29. this.backend = backend;
  30. this._passUtils = null;
  31. this.defaultTexture = null;
  32. this.defaultCubeTexture = null;
  33. this.colorBuffer = null;
  34. this.depthTexture = new DepthTexture();
  35. this.depthTexture.name = 'depthBuffer';
  36. }
  37. createSampler( texture ) {
  38. const backend = this.backend;
  39. const device = backend.device;
  40. const textureGPU = backend.get( texture );
  41. const samplerDescriptorGPU = {
  42. addressModeU: this._convertAddressMode( texture.wrapS ),
  43. addressModeV: this._convertAddressMode( texture.wrapT ),
  44. addressModeW: this._convertAddressMode( texture.wrapR ),
  45. magFilter: this._convertFilterMode( texture.magFilter ),
  46. minFilter: this._convertFilterMode( texture.minFilter ),
  47. mipmapFilter: this._convertFilterMode( texture.minFilter ),
  48. maxAnisotropy: texture.anisotropy
  49. };
  50. if ( texture.isDepthTexture && texture.compareFunction !== null ) {
  51. samplerDescriptorGPU.compare = _compareToWebGPU[ texture.compareFunction ];
  52. }
  53. textureGPU.sampler = device.createSampler( samplerDescriptorGPU );
  54. }
  55. createDefaultTexture( texture ) {
  56. let textureGPU;
  57. if ( texture.isCubeTexture ) {
  58. textureGPU = this._getDefaultCubeTextureGPU();
  59. } else {
  60. textureGPU = this._getDefaultTextureGPU();
  61. }
  62. this.backend.get( texture ).texture = textureGPU;
  63. }
  64. createTexture( texture, options = {} ) {
  65. const backend = this.backend;
  66. const textureData = backend.get( texture );
  67. if ( textureData.initialized ) {
  68. throw new Error( 'WebGPUTextureUtils: Texture already initialized.' );
  69. }
  70. if ( options.needsMipmaps === undefined ) options.needsMipmaps = false;
  71. if ( options.levels === undefined ) options.levels = 1;
  72. if ( options.depth === undefined ) options.depth = 1;
  73. const { width, height, depth, levels } = options;
  74. const dimension = this._getDimension( texture );
  75. const format = texture.internalFormat || getFormat( texture, backend.device );
  76. let sampleCount = options.sampleCount !== undefined ? options.sampleCount : 1;
  77. if ( sampleCount > 1 ) {
  78. // WebGPU only supports power-of-two sample counts and 2 is not a valid value
  79. sampleCount = Math.pow( 2, Math.floor( Math.log2( sampleCount ) ) );
  80. if ( sampleCount === 2 ) {
  81. sampleCount = 4;
  82. }
  83. }
  84. const primarySampleCount = texture.isRenderTargetTexture ? 1 : sampleCount;
  85. let usage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.COPY_SRC;
  86. if ( texture.isStorageTexture === true ) {
  87. usage |= GPUTextureUsage.STORAGE_BINDING;
  88. }
  89. if ( texture.isCompressedTexture !== true ) {
  90. usage |= GPUTextureUsage.RENDER_ATTACHMENT;
  91. }
  92. const textureDescriptorGPU = {
  93. label: texture.name,
  94. size: {
  95. width: width,
  96. height: height,
  97. depthOrArrayLayers: depth,
  98. },
  99. mipLevelCount: levels,
  100. sampleCount: primarySampleCount,
  101. dimension: dimension,
  102. format: format,
  103. usage: usage
  104. };
  105. // texture creation
  106. if ( texture.isVideoTexture ) {
  107. const video = texture.source.data;
  108. const videoFrame = new VideoFrame( video );
  109. textureDescriptorGPU.size.width = videoFrame.displayWidth;
  110. textureDescriptorGPU.size.height = videoFrame.displayHeight;
  111. videoFrame.close();
  112. textureData.externalTexture = video;
  113. } else {
  114. if ( format === undefined ) {
  115. console.warn( 'WebGPURenderer: Texture format not supported.' );
  116. return this.createDefaultTexture( texture );
  117. }
  118. textureData.texture = backend.device.createTexture( textureDescriptorGPU );
  119. }
  120. if ( texture.isRenderTargetTexture && sampleCount > 1 ) {
  121. const msaaTextureDescriptorGPU = Object.assign( {}, textureDescriptorGPU );
  122. msaaTextureDescriptorGPU.label = msaaTextureDescriptorGPU.label + '-msaa';
  123. msaaTextureDescriptorGPU.sampleCount = sampleCount;
  124. textureData.msaaTexture = backend.device.createTexture( msaaTextureDescriptorGPU );
  125. }
  126. textureData.initialized = true;
  127. textureData.textureDescriptorGPU = textureDescriptorGPU;
  128. }
  129. destroyTexture( texture ) {
  130. const backend = this.backend;
  131. const textureData = backend.get( texture );
  132. textureData.texture.destroy();
  133. if ( textureData.msaaTexture !== undefined ) textureData.msaaTexture.destroy();
  134. backend.delete( texture );
  135. }
  136. destroySampler( texture ) {
  137. const backend = this.backend;
  138. const textureData = backend.get( texture );
  139. delete textureData.sampler;
  140. }
  141. generateMipmaps( texture ) {
  142. const textureData = this.backend.get( texture );
  143. if ( texture.isCubeTexture ) {
  144. for ( let i = 0; i < 6; i ++ ) {
  145. this._generateMipmaps( textureData.texture, textureData.textureDescriptorGPU, i );
  146. }
  147. } else {
  148. this._generateMipmaps( textureData.texture, textureData.textureDescriptorGPU );
  149. }
  150. }
  151. getColorBuffer() {
  152. if ( this.colorBuffer ) this.colorBuffer.destroy();
  153. const backend = this.backend;
  154. const { width, height } = backend.getDrawingBufferSize();
  155. this.colorBuffer = backend.device.createTexture( {
  156. label: 'colorBuffer',
  157. size: {
  158. width: width,
  159. height: height,
  160. depthOrArrayLayers: 1
  161. },
  162. sampleCount: backend.parameters.sampleCount,
  163. format: GPUTextureFormat.BGRA8Unorm,
  164. usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.COPY_SRC
  165. } );
  166. return this.colorBuffer;
  167. }
  168. getDepthBuffer( depth = true, stencil = true ) {
  169. const backend = this.backend;
  170. const { width, height } = backend.getDrawingBufferSize();
  171. const depthTexture = this.depthTexture;
  172. const depthTextureGPU = backend.get( depthTexture ).texture;
  173. let format, type;
  174. if ( stencil ) {
  175. format = DepthStencilFormat;
  176. type = UnsignedInt248Type;
  177. } else if ( depth ) {
  178. format = DepthFormat;
  179. type = UnsignedIntType;
  180. }
  181. if ( depthTextureGPU !== undefined ) {
  182. if ( depthTexture.image.width === width && depthTexture.image.height === height && depthTexture.format === format && depthTexture.type === type ) {
  183. return depthTextureGPU;
  184. }
  185. this.destroyTexture( depthTexture );
  186. }
  187. depthTexture.name = 'depthBuffer';
  188. depthTexture.format = format;
  189. depthTexture.type = type;
  190. depthTexture.image.width = width;
  191. depthTexture.image.height = height;
  192. this.createTexture( depthTexture, { sampleCount: backend.parameters.sampleCount, width, height } );
  193. return backend.get( depthTexture ).texture;
  194. }
  195. updateTexture( texture, options ) {
  196. const textureData = this.backend.get( texture );
  197. const { textureDescriptorGPU } = textureData;
  198. if ( texture.isRenderTargetTexture || ( textureDescriptorGPU === undefined /* unsupported texture format */ ) )
  199. return;
  200. // transfer texture data
  201. if ( texture.isDataTexture || texture.isData3DTexture ) {
  202. this._copyBufferToTexture( options.image, textureData.texture, textureDescriptorGPU, 0, false );
  203. } else if ( texture.isDataArrayTexture ) {
  204. for ( let i = 0; i < options.image.depth; i ++ ) {
  205. this._copyBufferToTexture( options.image, textureData.texture, textureDescriptorGPU, i, false, i );
  206. }
  207. } else if ( texture.isCompressedTexture ) {
  208. this._copyCompressedBufferToTexture( texture.mipmaps, textureData.texture, textureDescriptorGPU );
  209. } else if ( texture.isCubeTexture ) {
  210. this._copyCubeMapToTexture( options.images, textureData.texture, textureDescriptorGPU, texture.flipY );
  211. } else if ( texture.isVideoTexture ) {
  212. const video = texture.source.data;
  213. textureData.externalTexture = video;
  214. } else {
  215. this._copyImageToTexture( options.image, textureData.texture, textureDescriptorGPU, 0, texture.flipY );
  216. }
  217. //
  218. textureData.version = texture.version;
  219. if ( texture.onUpdate ) texture.onUpdate( texture );
  220. }
  221. async copyTextureToBuffer( texture, x, y, width, height ) {
  222. const device = this.backend.device;
  223. const textureData = this.backend.get( texture );
  224. const textureGPU = textureData.texture;
  225. const format = textureData.textureDescriptorGPU.format;
  226. const bytesPerTexel = this._getBytesPerTexel( format );
  227. let bytesPerRow = width * bytesPerTexel;
  228. bytesPerRow = Math.ceil( bytesPerRow / 256 ) * 256; // Align to 256 bytes
  229. const readBuffer = device.createBuffer(
  230. {
  231. size: width * height * bytesPerTexel,
  232. usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.MAP_READ
  233. }
  234. );
  235. const encoder = device.createCommandEncoder();
  236. encoder.copyTextureToBuffer(
  237. {
  238. texture: textureGPU,
  239. origin: { x, y },
  240. },
  241. {
  242. buffer: readBuffer,
  243. bytesPerRow: bytesPerRow
  244. },
  245. {
  246. width: width,
  247. height: height
  248. }
  249. );
  250. const typedArrayType = this._getTypedArrayType( format );
  251. device.queue.submit( [ encoder.finish() ] );
  252. await readBuffer.mapAsync( GPUMapMode.READ );
  253. const buffer = readBuffer.getMappedRange();
  254. return new typedArrayType( buffer );
  255. }
  256. _isEnvironmentTexture( texture ) {
  257. const mapping = texture.mapping;
  258. return ( mapping === EquirectangularReflectionMapping || mapping === EquirectangularRefractionMapping ) || ( mapping === CubeReflectionMapping || mapping === CubeRefractionMapping );
  259. }
  260. _getDefaultTextureGPU() {
  261. let defaultTexture = this.defaultTexture;
  262. if ( defaultTexture === null ) {
  263. const texture = new Texture();
  264. texture.minFilter = NearestFilter;
  265. texture.magFilter = NearestFilter;
  266. this.createTexture( texture, { width: 1, height: 1 } );
  267. this.defaultTexture = defaultTexture = texture;
  268. }
  269. return this.backend.get( defaultTexture ).texture;
  270. }
  271. _getDefaultCubeTextureGPU() {
  272. let defaultCubeTexture = this.defaultTexture;
  273. if ( defaultCubeTexture === null ) {
  274. const texture = new CubeTexture();
  275. texture.minFilter = NearestFilter;
  276. texture.magFilter = NearestFilter;
  277. this.createTexture( texture, { width: 1, height: 1, depth: 6 } );
  278. this.defaultCubeTexture = defaultCubeTexture = texture;
  279. }
  280. return this.backend.get( defaultCubeTexture ).texture;
  281. }
  282. _copyCubeMapToTexture( images, textureGPU, textureDescriptorGPU, flipY ) {
  283. for ( let i = 0; i < 6; i ++ ) {
  284. const image = images[ i ];
  285. const flipIndex = flipY === true ? _flipMap[ i ] : i;
  286. if ( image.isDataTexture ) {
  287. this._copyBufferToTexture( image.image, textureGPU, textureDescriptorGPU, flipIndex, flipY );
  288. } else {
  289. this._copyImageToTexture( image, textureGPU, textureDescriptorGPU, flipIndex, flipY );
  290. }
  291. }
  292. }
  293. _copyImageToTexture( image, textureGPU, textureDescriptorGPU, originDepth, flipY ) {
  294. const device = this.backend.device;
  295. device.queue.copyExternalImageToTexture(
  296. {
  297. source: image
  298. }, {
  299. texture: textureGPU,
  300. mipLevel: 0,
  301. origin: { x: 0, y: 0, z: originDepth }
  302. }, {
  303. width: image.width,
  304. height: image.height,
  305. depthOrArrayLayers: 1
  306. }
  307. );
  308. if ( flipY === true ) {
  309. this._flipY( textureGPU, textureDescriptorGPU, originDepth );
  310. }
  311. }
  312. _getPassUtils() {
  313. let passUtils = this._passUtils;
  314. if ( passUtils === null ) {
  315. this._passUtils = passUtils = new WebGPUTexturePassUtils( this.backend.device );
  316. }
  317. return passUtils;
  318. }
  319. _generateMipmaps( textureGPU, textureDescriptorGPU, baseArrayLayer = 0 ) {
  320. this._getPassUtils().generateMipmaps( textureGPU, textureDescriptorGPU, baseArrayLayer );
  321. }
  322. _flipY( textureGPU, textureDescriptorGPU, originDepth = 0 ) {
  323. this._getPassUtils().flipY( textureGPU, textureDescriptorGPU, originDepth );
  324. }
  325. _copyBufferToTexture( image, textureGPU, textureDescriptorGPU, originDepth, flipY, depth = 0 ) {
  326. // @TODO: Consider to use GPUCommandEncoder.copyBufferToTexture()
  327. // @TODO: Consider to support valid buffer layouts with other formats like RGB
  328. const device = this.backend.device;
  329. const data = image.data;
  330. const bytesPerTexel = this._getBytesPerTexel( textureDescriptorGPU.format );
  331. const bytesPerRow = image.width * bytesPerTexel;
  332. device.queue.writeTexture(
  333. {
  334. texture: textureGPU,
  335. mipLevel: 0,
  336. origin: { x: 0, y: 0, z: originDepth }
  337. },
  338. data,
  339. {
  340. offset: image.width * image.height * bytesPerTexel * depth,
  341. bytesPerRow
  342. },
  343. {
  344. width: image.width,
  345. height: image.height,
  346. depthOrArrayLayers: 1
  347. } );
  348. if ( flipY === true ) {
  349. this._flipY( textureGPU, textureDescriptorGPU, originDepth );
  350. }
  351. }
  352. _copyCompressedBufferToTexture( mipmaps, textureGPU, textureDescriptorGPU ) {
  353. // @TODO: Consider to use GPUCommandEncoder.copyBufferToTexture()
  354. const device = this.backend.device;
  355. const blockData = this._getBlockData( textureDescriptorGPU.format );
  356. for ( let i = 0; i < mipmaps.length; i ++ ) {
  357. const mipmap = mipmaps[ i ];
  358. const width = mipmap.width;
  359. const height = mipmap.height;
  360. const bytesPerRow = Math.ceil( width / blockData.width ) * blockData.byteLength;
  361. device.queue.writeTexture(
  362. {
  363. texture: textureGPU,
  364. mipLevel: i
  365. },
  366. mipmap.data,
  367. {
  368. offset: 0,
  369. bytesPerRow
  370. },
  371. {
  372. width: Math.ceil( width / blockData.width ) * blockData.width,
  373. height: Math.ceil( height / blockData.width ) * blockData.width,
  374. depthOrArrayLayers: 1
  375. }
  376. );
  377. }
  378. }
  379. _getBlockData( format ) {
  380. // this method is only relevant for compressed texture formats
  381. if ( format === GPUTextureFormat.BC1RGBAUnorm || format === GPUTextureFormat.BC1RGBAUnormSRGB ) return { byteLength: 8, width: 4, height: 4 }; // DXT1
  382. if ( format === GPUTextureFormat.BC2RGBAUnorm || format === GPUTextureFormat.BC2RGBAUnormSRGB ) return { byteLength: 16, width: 4, height: 4 }; // DXT3
  383. if ( format === GPUTextureFormat.BC3RGBAUnorm || format === GPUTextureFormat.BC3RGBAUnormSRGB ) return { byteLength: 16, width: 4, height: 4 }; // DXT5
  384. if ( format === GPUTextureFormat.BC4RUnorm || format === GPUTextureFormat.BC4RSNorm ) return { byteLength: 8, width: 4, height: 4 }; // RGTC1
  385. if ( format === GPUTextureFormat.BC5RGUnorm || format === GPUTextureFormat.BC5RGSnorm ) return { byteLength: 16, width: 4, height: 4 }; // RGTC2
  386. if ( format === GPUTextureFormat.BC6HRGBUFloat || format === GPUTextureFormat.BC6HRGBFloat ) return { byteLength: 16, width: 4, height: 4 }; // BPTC (float)
  387. if ( format === GPUTextureFormat.BC7RGBAUnorm || format === GPUTextureFormat.BC7RGBAUnormSRGB ) return { byteLength: 16, width: 4, height: 4 }; // BPTC (unorm)
  388. if ( format === GPUTextureFormat.ETC2RGB8Unorm || format === GPUTextureFormat.ETC2RGB8UnormSRGB ) return { byteLength: 8, width: 4, height: 4 };
  389. if ( format === GPUTextureFormat.ETC2RGB8A1Unorm || format === GPUTextureFormat.ETC2RGB8A1UnormSRGB ) return { byteLength: 8, width: 4, height: 4 };
  390. if ( format === GPUTextureFormat.ETC2RGBA8Unorm || format === GPUTextureFormat.ETC2RGBA8UnormSRGB ) return { byteLength: 16, width: 4, height: 4 };
  391. if ( format === GPUTextureFormat.EACR11Unorm ) return { byteLength: 8, width: 4, height: 4 };
  392. if ( format === GPUTextureFormat.EACR11Snorm ) return { byteLength: 8, width: 4, height: 4 };
  393. if ( format === GPUTextureFormat.EACRG11Unorm ) return { byteLength: 16, width: 4, height: 4 };
  394. if ( format === GPUTextureFormat.EACRG11Snorm ) return { byteLength: 16, width: 4, height: 4 };
  395. if ( format === GPUTextureFormat.ASTC4x4Unorm || format === GPUTextureFormat.ASTC4x4UnormSRGB ) return { byteLength: 16, width: 4, height: 4 };
  396. if ( format === GPUTextureFormat.ASTC5x4Unorm || format === GPUTextureFormat.ASTC5x4UnormSRGB ) return { byteLength: 16, width: 5, height: 4 };
  397. if ( format === GPUTextureFormat.ASTC5x5Unorm || format === GPUTextureFormat.ASTC5x5UnormSRGB ) return { byteLength: 16, width: 5, height: 5 };
  398. if ( format === GPUTextureFormat.ASTC6x5Unorm || format === GPUTextureFormat.ASTC6x5UnormSRGB ) return { byteLength: 16, width: 6, height: 5 };
  399. if ( format === GPUTextureFormat.ASTC6x6Unorm || format === GPUTextureFormat.ASTC6x6UnormSRGB ) return { byteLength: 16, width: 6, height: 6 };
  400. if ( format === GPUTextureFormat.ASTC8x5Unorm || format === GPUTextureFormat.ASTC8x5UnormSRGB ) return { byteLength: 16, width: 8, height: 5 };
  401. if ( format === GPUTextureFormat.ASTC8x6Unorm || format === GPUTextureFormat.ASTC8x6UnormSRGB ) return { byteLength: 16, width: 8, height: 6 };
  402. if ( format === GPUTextureFormat.ASTC8x8Unorm || format === GPUTextureFormat.ASTC8x8UnormSRGB ) return { byteLength: 16, width: 8, height: 8 };
  403. if ( format === GPUTextureFormat.ASTC10x5Unorm || format === GPUTextureFormat.ASTC10x5UnormSRGB ) return { byteLength: 16, width: 10, height: 5 };
  404. if ( format === GPUTextureFormat.ASTC10x6Unorm || format === GPUTextureFormat.ASTC10x6UnormSRGB ) return { byteLength: 16, width: 10, height: 6 };
  405. if ( format === GPUTextureFormat.ASTC10x8Unorm || format === GPUTextureFormat.ASTC10x8UnormSRGB ) return { byteLength: 16, width: 10, height: 8 };
  406. if ( format === GPUTextureFormat.ASTC10x10Unorm || format === GPUTextureFormat.ASTC10x10UnormSRGB ) return { byteLength: 16, width: 10, height: 10 };
  407. if ( format === GPUTextureFormat.ASTC12x10Unorm || format === GPUTextureFormat.ASTC12x10UnormSRGB ) return { byteLength: 16, width: 12, height: 10 };
  408. if ( format === GPUTextureFormat.ASTC12x12Unorm || format === GPUTextureFormat.ASTC12x12UnormSRGB ) return { byteLength: 16, width: 12, height: 12 };
  409. }
  410. _convertAddressMode( value ) {
  411. let addressMode = GPUAddressMode.ClampToEdge;
  412. if ( value === RepeatWrapping ) {
  413. addressMode = GPUAddressMode.Repeat;
  414. } else if ( value === MirroredRepeatWrapping ) {
  415. addressMode = GPUAddressMode.MirrorRepeat;
  416. }
  417. return addressMode;
  418. }
  419. _convertFilterMode( value ) {
  420. let filterMode = GPUFilterMode.Linear;
  421. if ( value === NearestFilter || value === NearestMipmapNearestFilter || value === NearestMipmapLinearFilter ) {
  422. filterMode = GPUFilterMode.Nearest;
  423. }
  424. return filterMode;
  425. }
  426. _getBytesPerTexel( format ) {
  427. // 8-bit formats
  428. if ( format === GPUTextureFormat.R8Unorm ||
  429. format === GPUTextureFormat.R8Snorm ||
  430. format === GPUTextureFormat.R8Uint ||
  431. format === GPUTextureFormat.R8Sint ) return 1;
  432. // 16-bit formats
  433. if ( format === GPUTextureFormat.R16Uint ||
  434. format === GPUTextureFormat.R16Sint ||
  435. format === GPUTextureFormat.R16Float ||
  436. format === GPUTextureFormat.RG8Unorm ||
  437. format === GPUTextureFormat.RG8Snorm ||
  438. format === GPUTextureFormat.RG8Uint ||
  439. format === GPUTextureFormat.RG8Sint ) return 2;
  440. // 32-bit formats
  441. if ( format === GPUTextureFormat.R32Uint ||
  442. format === GPUTextureFormat.R32Sint ||
  443. format === GPUTextureFormat.R32Float ||
  444. format === GPUTextureFormat.RG16Uint ||
  445. format === GPUTextureFormat.RG16Sint ||
  446. format === GPUTextureFormat.RG16Float ||
  447. format === GPUTextureFormat.RGBA8Unorm ||
  448. format === GPUTextureFormat.RGBA8UnormSRGB ||
  449. format === GPUTextureFormat.RGBA8Snorm ||
  450. format === GPUTextureFormat.RGBA8Uint ||
  451. format === GPUTextureFormat.RGBA8Sint ||
  452. format === GPUTextureFormat.BGRA8Unorm ||
  453. format === GPUTextureFormat.BGRA8UnormSRGB ||
  454. // Packed 32-bit formats
  455. format === GPUTextureFormat.RGB9E5UFloat ||
  456. format === GPUTextureFormat.RGB10A2Unorm ||
  457. format === GPUTextureFormat.RG11B10UFloat ||
  458. format === GPUTextureFormat.Depth32Float ||
  459. format === GPUTextureFormat.Depth24Plus ||
  460. format === GPUTextureFormat.Depth24PlusStencil8 ||
  461. format === GPUTextureFormat.Depth32FloatStencil8 ) return 4;
  462. // 64-bit formats
  463. if ( format === GPUTextureFormat.RG32Uint ||
  464. format === GPUTextureFormat.RG32Sint ||
  465. format === GPUTextureFormat.RG32Float ||
  466. format === GPUTextureFormat.RGBA16Uint ||
  467. format === GPUTextureFormat.RGBA16Sint ||
  468. format === GPUTextureFormat.RGBA16Float ) return 8;
  469. // 128-bit formats
  470. if ( format === GPUTextureFormat.RGBA32Uint ||
  471. format === GPUTextureFormat.RGBA32Sint ||
  472. format === GPUTextureFormat.RGBA32Float ) return 16;
  473. }
  474. _getTypedArrayType( format ) {
  475. if ( format === GPUTextureFormat.R8Uint ) return Uint8Array;
  476. if ( format === GPUTextureFormat.R8Sint ) return Int8Array;
  477. if ( format === GPUTextureFormat.R8Unorm ) return Uint8Array;
  478. if ( format === GPUTextureFormat.R8Snorm ) return Int8Array;
  479. if ( format === GPUTextureFormat.RG8Uint ) return Uint8Array;
  480. if ( format === GPUTextureFormat.RG8Sint ) return Int8Array;
  481. if ( format === GPUTextureFormat.RG8Unorm ) return Uint8Array;
  482. if ( format === GPUTextureFormat.RG8Snorm ) return Int8Array;
  483. if ( format === GPUTextureFormat.RGBA8Uint ) return Uint8Array;
  484. if ( format === GPUTextureFormat.RGBA8Sint ) return Int8Array;
  485. if ( format === GPUTextureFormat.RGBA8Unorm ) return Uint8Array;
  486. if ( format === GPUTextureFormat.RGBA8Snorm ) return Int8Array;
  487. if ( format === GPUTextureFormat.R16Uint ) return Uint16Array;
  488. if ( format === GPUTextureFormat.R16Sint ) return Int16Array;
  489. if ( format === GPUTextureFormat.RG16Uint ) return Uint16Array;
  490. if ( format === GPUTextureFormat.RG16Sint ) return Int16Array;
  491. if ( format === GPUTextureFormat.RGBA16Uint ) return Uint16Array;
  492. if ( format === GPUTextureFormat.RGBA16Sint ) return Int16Array;
  493. if ( format === GPUTextureFormat.R16Float ) return Float32Array;
  494. if ( format === GPUTextureFormat.RG16Float ) return Float32Array;
  495. if ( format === GPUTextureFormat.RGBA16Float ) return Float32Array;
  496. if ( format === GPUTextureFormat.R32Uint ) return Uint32Array;
  497. if ( format === GPUTextureFormat.R32Sint ) return Int32Array;
  498. if ( format === GPUTextureFormat.R32Float ) return Float32Array;
  499. if ( format === GPUTextureFormat.RG32Uint ) return Uint32Array;
  500. if ( format === GPUTextureFormat.RG32Sint ) return Int32Array;
  501. if ( format === GPUTextureFormat.RG32Float ) return Float32Array;
  502. if ( format === GPUTextureFormat.RGBA32Uint ) return Uint32Array;
  503. if ( format === GPUTextureFormat.RGBA32Sint ) return Int32Array;
  504. if ( format === GPUTextureFormat.RGBA32Float ) return Float32Array;
  505. if ( format === GPUTextureFormat.BGRA8Unorm ) return Uint8Array;
  506. if ( format === GPUTextureFormat.BGRA8UnormSRGB ) return Uint8Array;
  507. if ( format === GPUTextureFormat.RGB10A2Unorm ) return Uint32Array;
  508. if ( format === GPUTextureFormat.RGB9E5UFloat ) return Uint32Array;
  509. if ( format === GPUTextureFormat.RG11B10UFloat ) return Uint32Array;
  510. if ( format === GPUTextureFormat.Depth32Float ) return Float32Array;
  511. if ( format === GPUTextureFormat.Depth24Plus ) return Uint32Array;
  512. if ( format === GPUTextureFormat.Depth24PlusStencil8 ) return Uint32Array;
  513. if ( format === GPUTextureFormat.Depth32FloatStencil8 ) return Float32Array;
  514. }
  515. _getDimension( texture ) {
  516. let dimension;
  517. if ( texture.isData3DTexture ) {
  518. dimension = GPUTextureDimension.ThreeD;
  519. } else {
  520. dimension = GPUTextureDimension.TwoD;
  521. }
  522. return dimension;
  523. }
  524. }
  525. export function getFormat( texture, device = null ) {
  526. const format = texture.format;
  527. const type = texture.type;
  528. const colorSpace = texture.colorSpace;
  529. let formatGPU;
  530. if ( texture.isFramebufferTexture === true && texture.type === UnsignedByteType ) {
  531. formatGPU = GPUTextureFormat.BGRA8Unorm;
  532. } else if ( texture.isCompressedTexture === true ) {
  533. switch ( format ) {
  534. case RGBA_S3TC_DXT1_Format:
  535. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.BC1RGBAUnormSRGB : GPUTextureFormat.BC1RGBAUnorm;
  536. break;
  537. case RGBA_S3TC_DXT3_Format:
  538. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.BC2RGBAUnormSRGB : GPUTextureFormat.BC2RGBAUnorm;
  539. break;
  540. case RGBA_S3TC_DXT5_Format:
  541. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.BC3RGBAUnormSRGB : GPUTextureFormat.BC3RGBAUnorm;
  542. break;
  543. case RGB_ETC2_Format:
  544. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ETC2RGB8UnormSRGB : GPUTextureFormat.ETC2RGB8Unorm;
  545. break;
  546. case RGBA_ETC2_EAC_Format:
  547. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ETC2RGBA8UnormSRGB : GPUTextureFormat.ETC2RGBA8Unorm;
  548. break;
  549. case RGBA_ASTC_4x4_Format:
  550. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC4x4UnormSRGB : GPUTextureFormat.ASTC4x4Unorm;
  551. break;
  552. case RGBA_ASTC_5x4_Format:
  553. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC5x4UnormSRGB : GPUTextureFormat.ASTC5x4Unorm;
  554. break;
  555. case RGBA_ASTC_5x5_Format:
  556. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC5x5UnormSRGB : GPUTextureFormat.ASTC5x5Unorm;
  557. break;
  558. case RGBA_ASTC_6x5_Format:
  559. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC6x5UnormSRGB : GPUTextureFormat.ASTC6x5Unorm;
  560. break;
  561. case RGBA_ASTC_6x6_Format:
  562. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC6x6UnormSRGB : GPUTextureFormat.ASTC6x6Unorm;
  563. break;
  564. case RGBA_ASTC_8x5_Format:
  565. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC8x5UnormSRGB : GPUTextureFormat.ASTC8x5Unorm;
  566. break;
  567. case RGBA_ASTC_8x6_Format:
  568. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC8x6UnormSRGB : GPUTextureFormat.ASTC8x6Unorm;
  569. break;
  570. case RGBA_ASTC_8x8_Format:
  571. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC8x8UnormSRGB : GPUTextureFormat.ASTC8x8Unorm;
  572. break;
  573. case RGBA_ASTC_10x5_Format:
  574. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC10x5UnormSRGB : GPUTextureFormat.ASTC10x5Unorm;
  575. break;
  576. case RGBA_ASTC_10x6_Format:
  577. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC10x6UnormSRGB : GPUTextureFormat.ASTC10x6Unorm;
  578. break;
  579. case RGBA_ASTC_10x8_Format:
  580. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC10x8UnormSRGB : GPUTextureFormat.ASTC10x8Unorm;
  581. break;
  582. case RGBA_ASTC_10x10_Format:
  583. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC10x10UnormSRGB : GPUTextureFormat.ASTC10x10Unorm;
  584. break;
  585. case RGBA_ASTC_12x10_Format:
  586. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC12x10UnormSRGB : GPUTextureFormat.ASTC12x10Unorm;
  587. break;
  588. case RGBA_ASTC_12x12_Format:
  589. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.ASTC12x12UnormSRGB : GPUTextureFormat.ASTC12x12Unorm;
  590. break;
  591. default:
  592. console.error( 'WebGPURenderer: Unsupported texture format.', format );
  593. }
  594. } else {
  595. switch ( format ) {
  596. case RGBAFormat:
  597. switch ( type ) {
  598. case UnsignedByteType:
  599. formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.RGBA8UnormSRGB : GPUTextureFormat.RGBA8Unorm;
  600. break;
  601. case HalfFloatType:
  602. formatGPU = GPUTextureFormat.RGBA16Float;
  603. break;
  604. case FloatType:
  605. formatGPU = GPUTextureFormat.RGBA32Float;
  606. break;
  607. default:
  608. console.error( 'WebGPURenderer: Unsupported texture type with RGBAFormat.', type );
  609. }
  610. break;
  611. case RedFormat:
  612. switch ( type ) {
  613. case UnsignedByteType:
  614. formatGPU = GPUTextureFormat.R8Unorm;
  615. break;
  616. case HalfFloatType:
  617. formatGPU = GPUTextureFormat.R16Float;
  618. break;
  619. case FloatType:
  620. formatGPU = GPUTextureFormat.R32Float;
  621. break;
  622. default:
  623. console.error( 'WebGPURenderer: Unsupported texture type with RedFormat.', type );
  624. }
  625. break;
  626. case RGFormat:
  627. switch ( type ) {
  628. case UnsignedByteType:
  629. formatGPU = GPUTextureFormat.RG8Unorm;
  630. break;
  631. case HalfFloatType:
  632. formatGPU = GPUTextureFormat.RG16Float;
  633. break;
  634. case FloatType:
  635. formatGPU = GPUTextureFormat.RG32Float;
  636. break;
  637. default:
  638. console.error( 'WebGPURenderer: Unsupported texture type with RGFormat.', type );
  639. }
  640. break;
  641. case DepthFormat:
  642. switch ( type ) {
  643. case UnsignedShortType:
  644. formatGPU = GPUTextureFormat.Depth16Unorm;
  645. break;
  646. case UnsignedIntType:
  647. formatGPU = GPUTextureFormat.Depth24Plus;
  648. break;
  649. case FloatType:
  650. formatGPU = GPUTextureFormat.Depth32Float;
  651. break;
  652. default:
  653. console.error( 'WebGPURenderer: Unsupported texture type with DepthFormat.', type );
  654. }
  655. break;
  656. case DepthStencilFormat:
  657. switch ( type ) {
  658. case UnsignedInt248Type:
  659. formatGPU = GPUTextureFormat.Depth24PlusStencil8;
  660. break;
  661. case FloatType:
  662. if ( device && device.features.has( GPUFeatureName.Depth32FloatStencil8 ) === false ) {
  663. console.error( 'WebGPURenderer: Depth textures with DepthStencilFormat + FloatType can only be used with the "depth32float-stencil8" GPU feature.' );
  664. }
  665. formatGPU = GPUTextureFormat.Depth32FloatStencil8;
  666. break;
  667. default:
  668. console.error( 'WebGPURenderer: Unsupported texture type with DepthStencilFormat.', type );
  669. }
  670. break;
  671. default:
  672. console.error( 'WebGPURenderer: Unsupported texture format.', format );
  673. }
  674. }
  675. return formatGPU;
  676. }
  677. export default WebGPUTextureUtils;