ris-framework 0.2.0-dev.11 → 0.2.0-dev.13

package/src/webgl/render-pipelines/WebGlMainRenderTargetRenderPipeline.ts

@@ -6,7 +6,13 @@ import {VertexBufferLayout} from "../../core/rendering/vertex-buffer-layout";
 import type {WebGlTexture2D} from "../texture/WebGlTexture2D.ts";
 import WebGlShaderModule from "../shader/WebGlShaderModule.ts";
 import {AWebGlRenderPipeline} from "./AWebGlRenderPipeline.ts";
-import {BufferUsage, type IFramework, type IMainRenderTargetRenderPipeline, type ITexture2D} from "../../api/index.ts";
+import {
+    BufferUsage,
+    type IFramework,
+    type IMainRenderTargetRenderPipeline,
+    type ITexture2D,
+    TextureFormat
+} from "../../api/index.ts";
 
 /**
  * The WebGL implementation of the main render target render pipeline.
@@ -17,6 +23,9 @@ export class WebGlMainRenderTargetRenderPipeline extends AWebGlRenderPipeline im
     private _indexBuffer: WebGLIndexBuffer = null!;
     private _mainRenderTarget: WebGlTexture2D = null!;
 
+    private _colorConversionUniformLocation: WebGLUniformLocation = null!;
+    private _colorSpaceValue = 0;
+
     /**
      * The constructor.
      * @param framework The framework.
@@ -25,6 +34,10 @@ export class WebGlMainRenderTargetRenderPipeline extends AWebGlRenderPipeline im
     public constructor(framework: IFramework, mainRenderTarget: ITexture2D) {
         super(framework);
         this._mainRenderTarget = mainRenderTarget as WebGlTexture2D;
+
+        if(framework.renderer.preferredTextureFormat == TextureFormat.RGBA_8_UNORM_SRGB) {
+            this._colorSpaceValue = 1;
+        }
     }
 
     /** @inheritDoc */
@@ -55,6 +68,8 @@ export class WebGlMainRenderTargetRenderPipeline extends AWebGlRenderPipeline im
         this._createResources();
         this.vertexBufferLayouts = [VertexBufferLayout.createFloat3Float2Layout()];
         super.initialize();
+
+        this._colorConversionUniformLocation = this._gl.getUniformLocation(this._program, "u_colorConversion")!;
     }
 
     private _createResources(): void {
@@ -93,6 +108,8 @@ export class WebGlMainRenderTargetRenderPipeline extends AWebGlRenderPipeline im
         this._gl.bindTexture(this._gl.TEXTURE_2D, this._mainRenderTarget.glTexture);
         this._gl.bindSampler(0, this._defaultTextureSampler.glSampler);
 
+        this._gl.uniform1i(this._colorConversionUniformLocation, this._colorSpaceValue)
+
         this._gl.drawElements(this._gl.TRIANGLES, this._indexBuffer.indicesCount, this._gl.UNSIGNED_SHORT, 0);
     }
 

package/src/webgl/swap-chain/WebGlSwapChain.ts

@@ -1,4 +1,4 @@
-import { vec2 } from "gl-matrix";
+import {vec2} from "gl-matrix";
 import {type IGraphicsDevice, type ISwapChain, TextureFormat} from "../../api/index.ts";
 import type {WebGlGraphicsDevice} from "../WebGlGraphicsDevice.ts";
 
@@ -16,8 +16,9 @@ export class WebGlSwapChain implements ISwapChain {
      * The WebGLSwapChain constructor.
      * @param canvas The HTML canvas element that the swap chain will use for rendering.
      * @param graphicsDevice The graphics device.
+     * @param srgb Prefer use of
      */
-    public constructor(canvas: HTMLCanvasElement, graphicsDevice: IGraphicsDevice) {
+    public constructor(canvas: HTMLCanvasElement, graphicsDevice: IGraphicsDevice, srgb = true) {
         this._canvas = canvas;
         this._graphicsDevice = graphicsDevice as WebGlGraphicsDevice;
         this._backBufferSize = vec2.fromValues(this._canvas.width, this._canvas.height);
@@ -25,13 +26,13 @@ export class WebGlSwapChain implements ISwapChain {
             this._backBufferSize[0] = this._canvas.width;
             this._backBufferSize[1] = this._canvas.height;
         });
-    }
 
+        // Nothing else to do. Typically, framebuffer should be srgb, but that is already handled through canvas.
+        this.textureFormat = srgb ? TextureFormat.RGBA_8_UNORM_SRGB : TextureFormat.RGBA_8_UNORM;
+    }
 
     /** @inheritdoc */
-    public get textureFormat(): TextureFormat {
-        return TextureFormat.RGBA_8_UNORM;
-    }
+    public readonly textureFormat: TextureFormat;
 
     /** @inheritdoc */
     public get backBufferSize(): vec2 {

package/src/webgl/texture/WebGlTextureFactory.ts

@@ -9,7 +9,7 @@ import {
     TextureUtilities
 } from "../../api/index.ts"
 import {WebGlTexture2D} from "./WebGlTexture2D.ts";
-import {type IKtx2Texture, KtxTranscodeFlags, KtxTranscodeFormat, TextureFormatInfo, VkFormat} from "ris-ktx2";
+import {type IKtx2Texture, KtxTranscodeFlags, KtxTranscodeFormat, VkFormat} from "ris-ktx2";
 import {vec2} from "gl-matrix";
 
 export class WebGlTextureFactory implements ITextureFactory {
@@ -31,13 +31,13 @@ export class WebGlTextureFactory implements ITextureFactory {
         let transcodeFormat = KtxTranscodeFormat.NO_SELECTION;
         let textureFormat = descriptor.textureFormat;
         const gpuFeatures = this._framework.graphicsDevice.features;
-        let texFormatInfo: TextureFormatInfo | null = null;
 
         if (ktxTexture.needsTranscoding && vkFormat == VkFormat.UNDEFINED)
         {
             // If descriptor format is UNDEFINED, we will use format according to the GPU features.
             if(descriptor.textureFormat == TextureFormat.UNDEFINED)
             {
+                // BC7 needs BPTC (supportsTextureCompressionBC), BC3 needs S3TC.
                 if(gpuFeatures.supportsTextureCompressionBC)
                 {
                     transcodeFormat = KtxTranscodeFormat.BC7_RGBA;
@@ -46,7 +46,7 @@ export class WebGlTextureFactory implements ITextureFactory {
                 else if(gpuFeatures.supportsTextureCompressionASTC)
                 {
                     transcodeFormat = KtxTranscodeFormat.ASTC_4X4_RGBA;
-                    textureFormat = TextureFormat.ASTC_4X4_RGBA
+                    textureFormat = TextureFormat.ASTC_4X4_RGBA_UNORM
                 }
                 else if(gpuFeatures.supportsTextureCompressionS3TC)
                 {
@@ -58,6 +58,16 @@ export class WebGlTextureFactory implements ITextureFactory {
                     transcodeFormat = KtxTranscodeFormat.ETC2_RGBA;
                     textureFormat = TextureFormat.ETC2_RGBA8_UNORM;
                 }
+                else if(gpuFeatures.supportsTextureCompressionPVRTC)
+                {
+                    transcodeFormat = KtxTranscodeFormat.PVRTC1_4_RGBA;
+                    textureFormat = TextureFormat.PVRTC_4BPPV1_RGBA;
+                }
+                else
+                {
+                    transcodeFormat = KtxTranscodeFormat.RGBA32;
+                    textureFormat = TextureFormat.RGBA_8_UNORM;
+                }
             }
             else
             {
@@ -65,12 +75,23 @@ export class WebGlTextureFactory implements ITextureFactory {
             }
 
             ktxTexture.transcodeBasis(transcodeFormat, KtxTranscodeFlags.HIGH_QUALITY);
-            texFormatInfo = ktxTexture.getTextureFormatInfo(TextureUtilities.convertKtxTranscodeFormatToVkFormat(transcodeFormat));
+
+            // After transcoding, libktx reports the sRGB vkFormat when the file's DFD transfer function is sRGB.
+            if (descriptor.textureFormat == TextureFormat.UNDEFINED && WebGlTextureFactory._isSrgbVkFormat(ktxTexture.vkFormat))
+            {
+                textureFormat = TextureUtilities.toSrgbFormat(textureFormat);
+            }
         }
         else {
-            // No transcoding path, but still get info about the texture format.
+            // No transcoding path, the vkFormat already says linear or sRGB.
             textureFormat = TextureUtilities.convertVkFormatToTextureFormat(vkFormat);
-            texFormatInfo = ktxTexture.getTextureFormatInfo(vkFormat);
+        }
+
+        textureFormat = this._ensureSrgbSupported(textureFormat, ktxTexture.filePath);
+
+        const blockSize = TextureUtilities.getBlockSize(textureFormat);
+        if (!blockSize) {
+            throw new Error(`Unknown block size for texture format ${textureFormat}.`);
         }
 
         const data: Uint8Array[] = [];
@@ -85,13 +106,34 @@ export class WebGlTextureFactory implements ITextureFactory {
         textureDescriptor.data = data;
         textureDescriptor.textureFormat = textureFormat;
         textureDescriptor.generateMipmaps = descriptor.generateMipmaps;
-        textureDescriptor.blockSize = vec2.fromValues(texFormatInfo.blockWidth, texFormatInfo.blockHeight);
+        textureDescriptor.blockSize = vec2.fromValues(blockSize[0], blockSize[1]);
 
         const texture = new WebGlTexture2D(this._framework, textureDescriptor);
         texture.initialize();
         return texture;
     }
 
+    /** Whether the Vulkan format is an sRGB format. */
+    private static _isSrgbVkFormat(vkFormat: VkFormat): boolean {
+        const name = (VkFormat as unknown as Record<number, string>)[vkFormat];
+        return typeof name === "string" && name.includes("_SRGB");
+    }
+
+    /**
+     * Falls back to the linear variant (with a warning) when the GPU cannot sample the sRGB format.
+     * Only S3TC sRGB (BC1/BC3) has its own WebGL extension; BC7, ETC2 and ASTC sRGB ship with their base extension.
+     */
+    private _ensureSrgbSupported(textureFormat: TextureFormat, source?: string): TextureFormat {
+        const isS3tcSrgb = textureFormat === TextureFormat.BC3_RGBA_SRGB || textureFormat === TextureFormat.BC1_RGB_SRGB;
+        if (isS3tcSrgb && !this._framework.graphicsDevice.features.supportsTextureCompressionS3TCSrgb) {
+            const linear = TextureUtilities.toLinearFormat(textureFormat);
+            console.warn(`sRGB S3TC is not supported (WEBGL_compressed_texture_s3tc_srgb missing); ` +
+                `loading ${source ?? "texture"} as ${linear}. Colours will look washed out.`);
+            return linear;
+        }
+        return textureFormat;
+    }
+
     /** @inheritdoc */
     public create(
         width: number, height: number,

package/src/webgl/utilities/WebGlConstants.ts

@@ -0,0 +1,136 @@
+/**
+ * WebGL extension constants that WebGL2RenderingContext does not expose.
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Constants
+ */
+export class WebGlConstants {
+
+    /** BC1 RGB */
+    public static readonly GL_COMPRESSED_RGB_S3TC_DXT1_EXT = 0x83F0;
+
+    /** BC1 RGB sRGB (WEBGL_compressed_texture_s3tc_srgb) */
+    public static readonly GL_COMPRESSED_SRGB_S3TC_DXT1_EXT = 0x8C4C;
+
+    /** BC3 sRGB (WEBGL_compressed_texture_s3tc_srgb) */
+    public static readonly GL_COMPRESSED_SRGB_ALPHA_S3TC_DXT5_EXT = 0x8C4F;
+
+    /** BC7 sRGB (EXT_texture_compression_bptc) */
+    public static readonly GL_COMPRESSED_SRGB_ALPHA_BPTC_UNORM = 0x8E8D;
+
+    /** ETC2 RGB8 */
+    public static readonly GL_COMPRESSED_RGB8_ETC2 = 0x9274;
+
+    /** ETC2 RGB8 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ETC2 = 0x9275;
+
+    /** ETC2 RGBA8 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ETC2_EAC = 0x9279;
+
+    /** BC3 */
+    public static readonly GL_COMPRESSED_RGBA_S3TC_DXT5_EXT = 0x83F3;
+
+    /** BC7 */
+    public static readonly GL_COMPRESSED_RGBA_BPTC_UNORM = 0x8E8C;
+
+    /** ETC2 */
+    public static readonly GL_COMPRESSED_RGBA8_ETC2_EAC = 0x9278;
+
+    // ASTC (WEBGL_compressed_texture_astc).
+
+    /** ASTC 4x4 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_4x4_KHR = 0x93B0;
+
+    /** ASTC 4x4 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_4x4_KHR = 0x93D0;
+
+    /** ASTC 5x4 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_5x4_KHR = 0x93B1;
+
+    /** ASTC 5x4 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_5x4_KHR = 0x93D1;
+
+    /** ASTC 5x5 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_5x5_KHR = 0x93B2;
+
+    /** ASTC 5x5 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_5x5_KHR = 0x93D2;
+
+    /** ASTC 6x5 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_6x5_KHR = 0x93B3;
+
+    /** ASTC 6x5 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_6x5_KHR = 0x93D3;
+
+    /** ASTC 6x6 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_6x6_KHR = 0x93B4;
+
+    /** ASTC 6x6 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_6x6_KHR = 0x93D4;
+
+    /** ASTC 8x5 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_8x5_KHR = 0x93B5;
+
+    /** ASTC 8x5 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_8x5_KHR = 0x93D5;
+
+    /** ASTC 8x6 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_8x6_KHR = 0x93B6;
+
+    /** ASTC 8x6 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_8x6_KHR = 0x93D6;
+
+    /** ASTC 8x8 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_8x8_KHR = 0x93B7;
+
+    /** ASTC 8x8 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_8x8_KHR = 0x93D7;
+
+    /** ASTC 10x5 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_10x5_KHR = 0x93B8;
+
+    /** ASTC 10x5 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_10x5_KHR = 0x93D8;
+
+    /** ASTC 10x6 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_10x6_KHR = 0x93B9;
+
+    /** ASTC 10x6 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_10x6_KHR = 0x93D9;
+
+    /** ASTC 10x8 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_10x8_KHR = 0x93BA;
+
+    /** ASTC 10x8 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_10x8_KHR = 0x93DA;
+
+    /** ASTC 10x10 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_10x10_KHR = 0x93BB;
+
+    /** ASTC 10x10 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_10x10_KHR = 0x93DB;
+
+    /** ASTC 12x10 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_12x10_KHR = 0x93BC;
+
+    /** ASTC 12x10 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_12x10_KHR = 0x93DC;
+
+    /** ASTC 12x12 */
+    public static readonly GL_COMPRESSED_RGBA_ASTC_12x12_KHR = 0x93BD;
+
+    /** ASTC 12x12 sRGB */
+    public static readonly GL_COMPRESSED_SRGB8_ALPHA8_ASTC_12x12_KHR = 0x93DD;
+
+    // PVRTC (WEBGL_compressed_texture_pvrtc).
+
+    /** PVRTC 4 bits per pixel, RGB */
+    public static readonly GL_COMPRESSED_RGB_PVRTC_4BPPV1_IMG = 0x8C00;
+
+    /** PVRTC 2 bits per pixel, RGB */
+    public static readonly GL_COMPRESSED_RGB_PVRTC_2BPPV1_IMG = 0x8C01;
+
+    /** PVRTC 4 bits per pixel, RGBA */
+    public static readonly GL_COMPRESSED_RGBA_PVRTC_4BPPV1_IMG = 0x8C02;
+
+    /** PVRTC 2 bits per pixel, RGBA */
+    public static readonly GL_COMPRESSED_RGBA_PVRTC_2BPPV1_IMG = 0x8C03;
+}

package/src/webgl/utilities/WebGlConverter.ts

@@ -1,3 +1,4 @@
+import {WebGlConstants} from "./WebGlConstants.ts";
 import {Culling} from "../../api/rendering/enums.ts";
 import {BlendFactor, BlendOperation} from "../../core/rendering/blending/enums";
 import {VertexFormat} from "../../api/geometry/VertexFormat.ts";
@@ -14,20 +15,6 @@ import {
 
 export class WebGlConverter {
 
-    // https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Constants
-
-    /** BC3 */
-    private static GL_COMPRESSED_RGBA_S3TC_DXT5_EXT = 0x83F3;
-
-    /** BC7 */
-    private static GL_COMPRESSED_RGBA_BPTC_UNORM = 0x8E8C;
-
-
-    /** ETC2 */
-    private static GL_COMPRESSED_RGBA8_ETC2_EAC = 0x9278;
-
-    private static GL_COMPRESSED_RGBA_ASTC_4x4_KHR = 0x93B0;
-
     /**
      * Converts PrimitiveTopology to WebGL enum.
      * @param topology The PrimitiveTopology.
@@ -65,7 +52,8 @@ export class WebGlConverter {
                 return WebGL2RenderingContext.BACK;
             case CullMode.FRONT:
                 return WebGL2RenderingContext.FRONT;
-            default: throw new Error("Method not implemented.");
+            default:
+                throw new Error("Method not implemented.");
         }
 
     }
@@ -95,13 +83,13 @@ export class WebGlConverter {
 
         let bufferUsage: number = WebGL2RenderingContext.STATIC_DRAW;
 
-        if((usage & BufferUsage.COPY_DST) == BufferUsage.COPY_DST)
-        {
+        if ((usage & BufferUsage.COPY_DST) == BufferUsage.COPY_DST) {
             bufferUsage = WebGL2RenderingContext.DYNAMIC_DRAW;
         }
 
         return bufferUsage;
     }
+
     /**
      * Converts BlendOperation to WebGL enum.
      * @param gl The WebGL2RenderingContext.
@@ -195,13 +183,94 @@ export class WebGlConverter {
             case TextureFormat.DEPTH_24_STENCIL_8:
                 return gl.DEPTH24_STENCIL8;
             case TextureFormat.BC3_RGBA_UNORM:
-                return WebGlConverter.GL_COMPRESSED_RGBA_S3TC_DXT5_EXT;
+                return WebGlConstants.GL_COMPRESSED_RGBA_S3TC_DXT5_EXT;
             case TextureFormat.ETC2_RGBA8_UNORM:
-                return WebGlConverter.GL_COMPRESSED_RGBA8_ETC2_EAC;
+                return WebGlConstants.GL_COMPRESSED_RGBA8_ETC2_EAC;
             case TextureFormat.BC7_RGBA_UNORM:
-                return WebGlConverter.GL_COMPRESSED_RGBA_BPTC_UNORM;
-            case TextureFormat.ASTC_4X4_RGBA:
-                return WebGlConverter.GL_COMPRESSED_RGBA_ASTC_4x4_KHR;
+                return WebGlConstants.GL_COMPRESSED_RGBA_BPTC_UNORM;
+            case TextureFormat.BC7_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB_ALPHA_BPTC_UNORM;
+            case TextureFormat.BC3_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB_ALPHA_S3TC_DXT5_EXT;
+            case TextureFormat.BC1_RGB_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGB_S3TC_DXT1_EXT;
+            case TextureFormat.BC1_RGB_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB_S3TC_DXT1_EXT;
+            case TextureFormat.ETC2_RGBA8_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ETC2_EAC;
+            case TextureFormat.ETC2_RGB8_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGB8_ETC2;
+            case TextureFormat.ETC2_RGB8_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ETC2;
+
+            // ASTC
+            case TextureFormat.ASTC_4X4_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_4x4_KHR;
+            case TextureFormat.ASTC_4X4_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_4x4_KHR;
+            case TextureFormat.ASTC_5X4_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_5x4_KHR;
+            case TextureFormat.ASTC_5X4_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_5x4_KHR;
+            case TextureFormat.ASTC_5X5_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_5x5_KHR;
+            case TextureFormat.ASTC_5X5_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_5x5_KHR;
+            case TextureFormat.ASTC_6X5_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_6x5_KHR;
+            case TextureFormat.ASTC_6X5_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_6x5_KHR;
+            case TextureFormat.ASTC_6X6_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_6x6_KHR;
+            case TextureFormat.ASTC_6X6_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_6x6_KHR;
+            case TextureFormat.ASTC_8X5_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_8x5_KHR;
+            case TextureFormat.ASTC_8X5_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_8x5_KHR;
+            case TextureFormat.ASTC_8X6_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_8x6_KHR;
+            case TextureFormat.ASTC_8X6_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_8x6_KHR;
+            case TextureFormat.ASTC_8X8_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_8x8_KHR;
+            case TextureFormat.ASTC_8X8_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_8x8_KHR;
+            case TextureFormat.ASTC_10X5_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_10x5_KHR;
+            case TextureFormat.ASTC_10X5_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_10x5_KHR;
+            case TextureFormat.ASTC_10X6_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_10x6_KHR;
+            case TextureFormat.ASTC_10X6_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_10x6_KHR;
+            case TextureFormat.ASTC_10X8_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_10x8_KHR;
+            case TextureFormat.ASTC_10X8_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_10x8_KHR;
+            case TextureFormat.ASTC_10X10_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_10x10_KHR;
+            case TextureFormat.ASTC_10X10_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_10x10_KHR;
+            case TextureFormat.ASTC_12X10_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_12x10_KHR;
+            case TextureFormat.ASTC_12X10_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_12x10_KHR;
+            case TextureFormat.ASTC_12X12_RGBA_UNORM:
+                return WebGlConstants.GL_COMPRESSED_RGBA_ASTC_12x12_KHR;
+            case TextureFormat.ASTC_12X12_RGBA_SRGB:
+                return WebGlConstants.GL_COMPRESSED_SRGB8_ALPHA8_ASTC_12x12_KHR;
+
+            // PVRTC
+            case TextureFormat.PVRTC_4BPPV1_RGBA:
+                return WebGlConstants.GL_COMPRESSED_RGBA_PVRTC_4BPPV1_IMG;
+            case TextureFormat.PVRTC_4BPPV1_RGB:
+                return WebGlConstants.GL_COMPRESSED_RGB_PVRTC_4BPPV1_IMG;
+
+            case TextureFormat.PVRTC_2BPPV1_RGBA:
+                return WebGlConstants.GL_COMPRESSED_RGBA_PVRTC_2BPPV1_IMG;
+            case TextureFormat.PVRTC_2BPPV1_RGB:
+                return WebGlConstants.GL_COMPRESSED_RGB_PVRTC_2BPPV1_IMG;
 
             default:
                 throw new Error("NotImplementedException");

package/src/webgl/utilities/WebGlErrorUtilities.ts

@@ -0,0 +1,15 @@
+export class WebGlErrorUtilities {
+
+    private readonly _map: Record<number, string> = {
+        1282: "INVALID_OPERATION"
+    }
+
+    /**
+     * Maps the WebGL2 error code to string.
+     * @param error The error code.
+     * @return The string of error code.
+     */
+    public errorToStr(error: number) : string {
+        return this._map[error] ?? error.toString();
+    }
+}

package/src/webgl/utilities/WebGlTextureUtilities.ts

@@ -1,6 +1,7 @@
 import {WebGlConverter} from "./WebGlConverter.ts";
 import {AlignUtilities, TextureFormat} from "../../api/index.ts";
 import {vec2} from "gl-matrix";
+import {WebGlUtilities} from "./WebGlUtilities.ts";
 
 /**
  * The utilities for working with WebGL textures.
@@ -120,8 +121,8 @@ export class WebGlTextureUtilities {
         gl.bindTexture(gl.TEXTURE_2D, texture);
 
         const internalFormat = WebGlConverter.convertInternalFormat(gl, textureFormat);
-
         const useTexStorage = baseWidth % blockSize[0] == 0 && baseHeight % blockSize[1] == 0;
+
         if (useTexStorage) {
             gl.texStorage2D(gl.TEXTURE_2D, mipLevels, internalFormat, baseWidth, baseHeight);
         }
@@ -163,7 +164,9 @@ export class WebGlTextureUtilities {
 
         const error = gl.getError();
         if (error != gl.NO_ERROR) {
-            throw new Error("WebGlTextureUtilities error " + error.toString());
+            const errorStr ="WebGlTextureUtilities error " + WebGlUtilities.error.errorToStr(error);
+            console.error(errorStr);
+            throw new Error(errorStr);
         }
 
         return texture;

package/src/webgl/utilities/WebGlUtilities.ts

@@ -8,6 +8,7 @@ import { WebGLRenderbufferUtilities } from "./webgl-renderbuffer-utilities";
 import { WebGlSamplerUtilities } from "./WebGlSamplerUtilities.ts";
 import { WebGlShaderUtilities } from "./WebGlShaderUtilities.ts";
 import { WebGlTextureUtilities } from "./WebGlTextureUtilities.ts";
+import {WebGlErrorUtilities} from "./WebGlErrorUtilities.ts";
 
 /**
  * The utility class for WebGL operations.
@@ -68,4 +69,7 @@ export class WebGlUtilities {
      * The WebGL program utilities.
      */
     public static readonly program = new WebGLProgramUtilities();
+
+    /** The WebGL error utilities. Helper class for working with errors. */
+    public  static  readonly error = new WebGlErrorUtilities();
 }

package/src/webgpu/WebGpuGpuInfo.ts

@@ -0,0 +1,61 @@
+import {type IGPUInfo, RenderingBackend, TextureFormat} from "../api/index.ts";
+import type {GpuAdapter} from "./WebGpuTypes.ts";
+import type {WebGpuGraphicsDeviceFeatures} from "./WebGpuGraphicsDeviceFeatures.ts";
+
+/**
+ * The WebGPU GPU info, read from the adapter info.
+ * @internal
+ */
+export class WebGpuGpuInfo implements IGPUInfo {
+
+    /**
+     * The constructor.
+     * @param adapter The adapter.
+     * @param features The device features.
+     */
+    public constructor(adapter: GpuAdapter, features: WebGpuGraphicsDeviceFeatures) {
+        const info = adapter.info;
+        this.name = info?.description || info?.device || info?.architecture || "Unknown";
+        this.vendor = info?.vendor || "Unknown";
+        this.apiVersion = "WebGPU";
+        this.api = RenderingBackend.WEB_GPU;
+        // The native API behind WebGPU (Vulkan, Metal, D3D12) is hidden from the page.
+        this.underlyingBackend = RenderingBackend.DEFAULT;
+
+        // Features are read from the device (only requested features are enabled), so this lists what can be created.
+        const formats: TextureFormat[] = [];
+        if (features.supportsTextureCompressionASTC) {
+            formats.push(TextureFormat.ASTC_4X4_RGBA_UNORM, TextureFormat.ASTC_4X4_RGBA_SRGB);
+        }
+        if (features.supportsTextureCompressionS3TC) {
+            formats.push(TextureFormat.BC1_RGB_UNORM, TextureFormat.BC1_RGB_SRGB,
+                TextureFormat.BC3_RGBA_UNORM, TextureFormat.BC3_RGBA_SRGB);
+        }
+        if (features.supportsTextureCompressionETC2) {
+            formats.push(TextureFormat.ETC2_RGB8_UNORM, TextureFormat.ETC2_RGB8_SRGB,
+                TextureFormat.ETC2_RGBA8_UNORM, TextureFormat.ETC2_RGBA8_SRGB);
+        }
+        if (features.supportsTextureCompressionBC) {
+            formats.push(TextureFormat.BC7_RGBA_UNORM, TextureFormat.BC7_RGBA_SRGB);
+        }
+        this.supportedCompressedTextureFormats = formats;
+    }
+
+    /** @inheritDoc */
+    public readonly name: string;
+
+    /** @inheritDoc */
+    public readonly vendor: string;
+
+    /** @inheritDoc */
+    public readonly apiVersion: string;
+
+    /** @inheritDoc */
+    public readonly api: RenderingBackend;
+
+    /** @inheritDoc */
+    public readonly underlyingBackend: RenderingBackend;
+
+    /** @inheritDoc */
+    public readonly supportedCompressedTextureFormats: TextureFormat[];
+}