Sdk: WebGL 2 support

Created on 28 Aug 2016  路  14Comments  路  Source: dart-lang/sdk

Looks like there is already some WebGL 2 bindings, but it's impossible to use a WebGL 2 context:

import 'dart:html';
import 'dart:web_gl';

void main() {
  var cnv = querySelector('#cnv') as CanvasElement;
  var gl = cnv.getContext("webgl2");
  print(gl.runtimeType);
}

Firefox 48:
WebGL context is returned but code prints RenderingContext instead of RenderingContext2.
WebGL 2 calls fail like TypeError: $.gl.vertexAttribDivisor$2 is not a function.

Chrome 52:
WebGL context is not returned, code prints UnknownJavaScriptObject.


It seems that getContext from html_dart2js.dart is unaware of RenderingContext2:

  @DomName('HTMLCanvasElement.getContext')
  @DocsEditable()
  @Creates('CanvasRenderingContext2D|RenderingContext')
  @Returns('CanvasRenderingContext2D|RenderingContext|Null')
  Object getContext(String contextId, [Map attributes]) {
    if (attributes != null) {
      var attributes_1 = convertDartToNative_Dictionary(attributes);
      return _getContext_1(contextId, attributes_1);
    }
    return _getContext_2(contextId);
  }

Also, current WebGL 2 bindings aren't aligned with the latest WebGL 2.0 IDL;
most differences are in [compressed]Tex[Sub]Image{2|3}D definitions.

area-library library-webgl

Most helpful comment

The RenderingContext2 from dart:html is just the start. The dart:web_gl library needs major updates too, or it's even a dart:web_gl2 library, i don't know.

All 14 comments

Some of the updating may happen with the next roll of the dart:html libraries, we're relying on the Chrome IDL. We have RenderingContext2, but it's not actually referenced anywhere, and particularly not in the return types for that method. The UnknownJavaScriptObject may well be a RenderingContext2 and we're just not recognizing it. This probably indicates that there are hard-coded templates that need to be updated.

Q from @bp74 on misc: "Firefox 51 got support for WebGL2 and Chrome 56 will support it too. Are there any plans for a WebGL2 library in the Dart SDK? "

@alan-knight Wondering what would it would take to find and update the hard-coded templates needed?

Looks like that comes from here https://github.com/dart-lang/sdk/blob/66b5248bf937ef1202f04b106c63730e57a008b8/tools/dom/scripts/dartmetadata.py#L160

So possibly just changing that would make the context get recognized. The problem that the bindings are out of date is because we're using the WebIDL that matches the Dartium version. There should be a Dartium roll real soon now which would then update those bindings to something closer to current.

If you manually patch the getContext do things actually work, or are there other places that need similar updates?

The RenderingContext2 from dart:html is just the start. The dart:web_gl library needs major updates too, or it's even a dart:web_gl2 library, i don't know.

Any news on this?

The update of the dart:html library should be fairly soon. But it's not clear to me what other fixes are needed.

Are there any news on the topic? The bindings are still for WebGL1 + extensions

@terrylucas
As of 1.23 or 1.24 there should be WebGL 2 bindings in there. Terry can point to examples.

Doesn't look like it, I am on 1.24.2:

dart --version
Dart VM version: 1.24.2 (Thu Jun 22 08:55:56 2017) on "windows_x64"

but WebGL2 enums such as UNIFORM_BUFFER or TRANSFORM_FEEDBACK_BUFFER are not there. I looked in dart-sdk\lib\web_gl\dart2js\web_gl_dart2js.dart . I also ran a grep over the entire SDK and still haven't found any.

Looks like these constants are missing form interface WebGL2RenderingContextBase. However, the methods, properties, etc. are there and have been tested with quite a number of WebGL2 interfaces in both Dartium and dart2js. If you want to use these constants, for now I would hard code the value, we'll re-generate the SDK to pull in these constants in a subsequent release.

    const GLenum READ_BUFFER                                   = 0x0C02;
    const GLenum UNPACK_ROW_LENGTH                             = 0x0CF2;
    const GLenum UNPACK_SKIP_ROWS                              = 0x0CF3;
    const GLenum UNPACK_SKIP_PIXELS                            = 0x0CF4;
    const GLenum PACK_ROW_LENGTH                               = 0x0D02;
    const GLenum PACK_SKIP_ROWS                                = 0x0D03;
    const GLenum PACK_SKIP_PIXELS                              = 0x0D04;
    const GLenum COLOR                                         = 0x1800;
    const GLenum DEPTH                                         = 0x1801;
    const GLenum STENCIL                                       = 0x1802;
    const GLenum RED                                           = 0x1903;
    const GLenum RGB8                                          = 0x8051;
    const GLenum RGBA8                                         = 0x8058;
    const GLenum RGB10_A2                                      = 0x8059;
    const GLenum TEXTURE_BINDING_3D                            = 0x806A;
    const GLenum UNPACK_SKIP_IMAGES                            = 0x806D;
    const GLenum UNPACK_IMAGE_HEIGHT                           = 0x806E;
    const GLenum TEXTURE_3D                                    = 0x806F;
    const GLenum TEXTURE_WRAP_R                                = 0x8072;
    const GLenum MAX_3D_TEXTURE_SIZE                           = 0x8073;
    const GLenum UNSIGNED_INT_2_10_10_10_REV                   = 0x8368;
    const GLenum MAX_ELEMENTS_VERTICES                         = 0x80E8;
    const GLenum MAX_ELEMENTS_INDICES                          = 0x80E9;
    const GLenum TEXTURE_MIN_LOD                               = 0x813A;
    const GLenum TEXTURE_MAX_LOD                               = 0x813B;
    const GLenum TEXTURE_BASE_LEVEL                            = 0x813C;
    const GLenum TEXTURE_MAX_LEVEL                             = 0x813D;
    const GLenum MIN                                           = 0x8007;
    const GLenum MAX                                           = 0x8008;
    const GLenum DEPTH_COMPONENT24                             = 0x81A6;
    const GLenum MAX_TEXTURE_LOD_BIAS                          = 0x84FD;
    const GLenum TEXTURE_COMPARE_MODE                          = 0x884C;
    const GLenum TEXTURE_COMPARE_FUNC                          = 0x884D;
    const GLenum CURRENT_QUERY                                 = 0x8865;
    const GLenum QUERY_RESULT                                  = 0x8866;
    const GLenum QUERY_RESULT_AVAILABLE                        = 0x8867;
    const GLenum STREAM_READ                                   = 0x88E1;
    const GLenum STREAM_COPY                                   = 0x88E2;
    const GLenum STATIC_READ                                   = 0x88E5;
    const GLenum STATIC_COPY                                   = 0x88E6;
    const GLenum DYNAMIC_READ                                  = 0x88E9;
    const GLenum DYNAMIC_COPY                                  = 0x88EA;
    const GLenum MAX_DRAW_BUFFERS                              = 0x8824;
    const GLenum DRAW_BUFFER0                                  = 0x8825;
    const GLenum DRAW_BUFFER1                                  = 0x8826;
    const GLenum DRAW_BUFFER2                                  = 0x8827;
    const GLenum DRAW_BUFFER3                                  = 0x8828;
    const GLenum DRAW_BUFFER4                                  = 0x8829;
    const GLenum DRAW_BUFFER5                                  = 0x882A;
    const GLenum DRAW_BUFFER6                                  = 0x882B;
    const GLenum DRAW_BUFFER7                                  = 0x882C;
    const GLenum DRAW_BUFFER8                                  = 0x882D;
    const GLenum DRAW_BUFFER9                                  = 0x882E;
    const GLenum DRAW_BUFFER10                                 = 0x882F;
    const GLenum DRAW_BUFFER11                                 = 0x8830;
    const GLenum DRAW_BUFFER12                                 = 0x8831;
    const GLenum DRAW_BUFFER13                                 = 0x8832;
    const GLenum DRAW_BUFFER14                                 = 0x8833;
    const GLenum DRAW_BUFFER15                                 = 0x8834;
    const GLenum MAX_FRAGMENT_UNIFORM_COMPONENTS               = 0x8B49;
    const GLenum MAX_VERTEX_UNIFORM_COMPONENTS                 = 0x8B4A;
    const GLenum SAMPLER_3D                                    = 0x8B5F;
    const GLenum SAMPLER_2D_SHADOW                             = 0x8B62;
    const GLenum FRAGMENT_SHADER_DERIVATIVE_HINT               = 0x8B8B;
    const GLenum PIXEL_PACK_BUFFER                             = 0x88EB;
    const GLenum PIXEL_UNPACK_BUFFER                           = 0x88EC;
    const GLenum PIXEL_PACK_BUFFER_BINDING                     = 0x88ED;
    const GLenum PIXEL_UNPACK_BUFFER_BINDING                   = 0x88EF;
    const GLenum FLOAT_MAT2x3                                  = 0x8B65;
    const GLenum FLOAT_MAT2x4                                  = 0x8B66;
    const GLenum FLOAT_MAT3x2                                  = 0x8B67;
    const GLenum FLOAT_MAT3x4                                  = 0x8B68;
    const GLenum FLOAT_MAT4x2                                  = 0x8B69;
    const GLenum FLOAT_MAT4x3                                  = 0x8B6A;
    const GLenum SRGB                                          = 0x8C40;
    const GLenum SRGB8                                         = 0x8C41;
    const GLenum SRGB8_ALPHA8                                  = 0x8C43;
    const GLenum COMPARE_REF_TO_TEXTURE                        = 0x884E;
    const GLenum RGBA32F                                       = 0x8814;
    const GLenum RGB32F                                        = 0x8815;
    const GLenum RGBA16F                                       = 0x881A;
    const GLenum RGB16F                                        = 0x881B;
    const GLenum VERTEX_ATTRIB_ARRAY_INTEGER                   = 0x88FD;
    const GLenum MAX_ARRAY_TEXTURE_LAYERS                      = 0x88FF;
    const GLenum MIN_PROGRAM_TEXEL_OFFSET                      = 0x8904;
    const GLenum MAX_PROGRAM_TEXEL_OFFSET                      = 0x8905;
    const GLenum MAX_VARYING_COMPONENTS                        = 0x8B4B;
    const GLenum TEXTURE_2D_ARRAY                              = 0x8C1A;
    const GLenum TEXTURE_BINDING_2D_ARRAY                      = 0x8C1D;
    const GLenum R11F_G11F_B10F                                = 0x8C3A;
    const GLenum UNSIGNED_INT_10F_11F_11F_REV                  = 0x8C3B;
    const GLenum RGB9_E5                                       = 0x8C3D;
    const GLenum UNSIGNED_INT_5_9_9_9_REV                      = 0x8C3E;
    const GLenum TRANSFORM_FEEDBACK_BUFFER_MODE                = 0x8C7F;
    const GLenum MAX_TRANSFORM_FEEDBACK_SEPARATE_COMPONENTS    = 0x8C80;
    const GLenum TRANSFORM_FEEDBACK_VARYINGS                   = 0x8C83;
    const GLenum TRANSFORM_FEEDBACK_BUFFER_START               = 0x8C84;
    const GLenum TRANSFORM_FEEDBACK_BUFFER_SIZE                = 0x8C85;
    const GLenum TRANSFORM_FEEDBACK_PRIMITIVES_WRITTEN         = 0x8C88;
    const GLenum RASTERIZER_DISCARD                            = 0x8C89;
    const GLenum MAX_TRANSFORM_FEEDBACK_INTERLEAVED_COMPONENTS = 0x8C8A;
    const GLenum MAX_TRANSFORM_FEEDBACK_SEPARATE_ATTRIBS       = 0x8C8B;
    const GLenum INTERLEAVED_ATTRIBS                           = 0x8C8C;
    const GLenum SEPARATE_ATTRIBS                              = 0x8C8D;
    const GLenum TRANSFORM_FEEDBACK_BUFFER                     = 0x8C8E;
    const GLenum TRANSFORM_FEEDBACK_BUFFER_BINDING             = 0x8C8F;
    const GLenum RGBA32UI                                      = 0x8D70;
    const GLenum RGB32UI                                       = 0x8D71;
    const GLenum RGBA16UI                                      = 0x8D76;
    const GLenum RGB16UI                                       = 0x8D77;
    const GLenum RGBA8UI                                       = 0x8D7C;
    const GLenum RGB8UI                                        = 0x8D7D;
    const GLenum RGBA32I                                       = 0x8D82;
    const GLenum RGB32I                                        = 0x8D83;
    const GLenum RGBA16I                                       = 0x8D88;
    const GLenum RGB16I                                        = 0x8D89;
    const GLenum RGBA8I                                        = 0x8D8E;
    const GLenum RGB8I                                         = 0x8D8F;
    const GLenum RED_INTEGER                                   = 0x8D94;
    const GLenum RGB_INTEGER                                   = 0x8D98;
    const GLenum RGBA_INTEGER                                  = 0x8D99;
    const GLenum SAMPLER_2D_ARRAY                              = 0x8DC1;
    const GLenum SAMPLER_2D_ARRAY_SHADOW                       = 0x8DC4;
    const GLenum SAMPLER_CUBE_SHADOW                           = 0x8DC5;
    const GLenum UNSIGNED_INT_VEC2                             = 0x8DC6;
    const GLenum UNSIGNED_INT_VEC3                             = 0x8DC7;
    const GLenum UNSIGNED_INT_VEC4                             = 0x8DC8;
    const GLenum INT_SAMPLER_2D                                = 0x8DCA;
    const GLenum INT_SAMPLER_3D                                = 0x8DCB;
    const GLenum INT_SAMPLER_CUBE                              = 0x8DCC;
    const GLenum INT_SAMPLER_2D_ARRAY                          = 0x8DCF;
    const GLenum UNSIGNED_INT_SAMPLER_2D                       = 0x8DD2;
    const GLenum UNSIGNED_INT_SAMPLER_3D                       = 0x8DD3;
    const GLenum UNSIGNED_INT_SAMPLER_CUBE                     = 0x8DD4;
    const GLenum UNSIGNED_INT_SAMPLER_2D_ARRAY                 = 0x8DD7;
    const GLenum DEPTH_COMPONENT32F                            = 0x8CAC;
    const GLenum DEPTH32F_STENCIL8                             = 0x8CAD;
    const GLenum FLOAT_32_UNSIGNED_INT_24_8_REV                = 0x8DAD;
    const GLenum FRAMEBUFFER_ATTACHMENT_COLOR_ENCODING         = 0x8210;
    const GLenum FRAMEBUFFER_ATTACHMENT_COMPONENT_TYPE         = 0x8211;
    const GLenum FRAMEBUFFER_ATTACHMENT_RED_SIZE               = 0x8212;
    const GLenum FRAMEBUFFER_ATTACHMENT_GREEN_SIZE             = 0x8213;
    const GLenum FRAMEBUFFER_ATTACHMENT_BLUE_SIZE              = 0x8214;
    const GLenum FRAMEBUFFER_ATTACHMENT_ALPHA_SIZE             = 0x8215;
    const GLenum FRAMEBUFFER_ATTACHMENT_DEPTH_SIZE             = 0x8216;
    const GLenum FRAMEBUFFER_ATTACHMENT_STENCIL_SIZE           = 0x8217;
    const GLenum FRAMEBUFFER_DEFAULT                           = 0x8218;
    const GLenum UNSIGNED_INT_24_8                             = 0x84FA;
    const GLenum DEPTH24_STENCIL8                              = 0x88F0;
    const GLenum UNSIGNED_NORMALIZED                           = 0x8C17;
    const GLenum DRAW_FRAMEBUFFER_BINDING                      = 0x8CA6; /* Same as FRAMEBUFFER_BINDING */
    const GLenum READ_FRAMEBUFFER                              = 0x8CA8;
    const GLenum DRAW_FRAMEBUFFER                              = 0x8CA9;
    const GLenum READ_FRAMEBUFFER_BINDING                      = 0x8CAA;
    const GLenum RENDERBUFFER_SAMPLES                          = 0x8CAB;
    const GLenum FRAMEBUFFER_ATTACHMENT_TEXTURE_LAYER          = 0x8CD4;
    const GLenum MAX_COLOR_ATTACHMENTS                         = 0x8CDF;
    const GLenum COLOR_ATTACHMENT1                             = 0x8CE1;
    const GLenum COLOR_ATTACHMENT2                             = 0x8CE2;
    const GLenum COLOR_ATTACHMENT3                             = 0x8CE3;
    const GLenum COLOR_ATTACHMENT4                             = 0x8CE4;
    const GLenum COLOR_ATTACHMENT5                             = 0x8CE5;
    const GLenum COLOR_ATTACHMENT6                             = 0x8CE6;
    const GLenum COLOR_ATTACHMENT7                             = 0x8CE7;
    const GLenum COLOR_ATTACHMENT8                             = 0x8CE8;
    const GLenum COLOR_ATTACHMENT9                             = 0x8CE9;
    const GLenum COLOR_ATTACHMENT10                            = 0x8CEA;
    const GLenum COLOR_ATTACHMENT11                            = 0x8CEB;
    const GLenum COLOR_ATTACHMENT12                            = 0x8CEC;
    const GLenum COLOR_ATTACHMENT13                            = 0x8CED;
    const GLenum COLOR_ATTACHMENT14                            = 0x8CEE;
    const GLenum COLOR_ATTACHMENT15                            = 0x8CEF;
    const GLenum FRAMEBUFFER_INCOMPLETE_MULTISAMPLE            = 0x8D56;
    const GLenum MAX_SAMPLES                                   = 0x8D57;
    const GLenum HALF_FLOAT                                    = 0x140B;
    const GLenum RG                                            = 0x8227;
    const GLenum RG_INTEGER                                    = 0x8228;
    const GLenum R8                                            = 0x8229;
    const GLenum RG8                                           = 0x822B;
    const GLenum R16F                                          = 0x822D;
    const GLenum R32F                                          = 0x822E;
    const GLenum RG16F                                         = 0x822F;
    const GLenum RG32F                                         = 0x8230;
    const GLenum R8I                                           = 0x8231;
    const GLenum R8UI                                          = 0x8232;
    const GLenum R16I                                          = 0x8233;
    const GLenum R16UI                                         = 0x8234;
    const GLenum R32I                                          = 0x8235;
    const GLenum R32UI                                         = 0x8236;
    const GLenum RG8I                                          = 0x8237;
    const GLenum RG8UI                                         = 0x8238;
    const GLenum RG16I                                         = 0x8239;
    const GLenum RG16UI                                        = 0x823A;
    const GLenum RG32I                                         = 0x823B;
    const GLenum RG32UI                                        = 0x823C;
    const GLenum VERTEX_ARRAY_BINDING                          = 0x85B5;
    const GLenum R8_SNORM                                      = 0x8F94;
    const GLenum RG8_SNORM                                     = 0x8F95;
    const GLenum RGB8_SNORM                                    = 0x8F96;
    const GLenum RGBA8_SNORM                                   = 0x8F97;
    const GLenum SIGNED_NORMALIZED                             = 0x8F9C;
    const GLenum COPY_READ_BUFFER                              = 0x8F36;
    const GLenum COPY_WRITE_BUFFER                             = 0x8F37;
    const GLenum COPY_READ_BUFFER_BINDING                      = 0x8F36; /* Same as COPY_READ_BUFFER */
    const GLenum COPY_WRITE_BUFFER_BINDING                     = 0x8F37; /* Same as COPY_WRITE_BUFFER */
    const GLenum UNIFORM_BUFFER                                = 0x8A11;
    const GLenum UNIFORM_BUFFER_BINDING                        = 0x8A28;
    const GLenum UNIFORM_BUFFER_START                          = 0x8A29;
    const GLenum UNIFORM_BUFFER_SIZE                           = 0x8A2A;
    const GLenum MAX_VERTEX_UNIFORM_BLOCKS                     = 0x8A2B;
    const GLenum MAX_FRAGMENT_UNIFORM_BLOCKS                   = 0x8A2D;
    const GLenum MAX_COMBINED_UNIFORM_BLOCKS                   = 0x8A2E;
    const GLenum MAX_UNIFORM_BUFFER_BINDINGS                   = 0x8A2F;
    const GLenum MAX_UNIFORM_BLOCK_SIZE                        = 0x8A30;
    const GLenum MAX_COMBINED_VERTEX_UNIFORM_COMPONENTS        = 0x8A31;
    const GLenum MAX_COMBINED_FRAGMENT_UNIFORM_COMPONENTS      = 0x8A33;
    const GLenum UNIFORM_BUFFER_OFFSET_ALIGNMENT               = 0x8A34;
    const GLenum ACTIVE_UNIFORM_BLOCKS                         = 0x8A36;
    const GLenum UNIFORM_TYPE                                  = 0x8A37;
    const GLenum UNIFORM_SIZE                                  = 0x8A38;
    const GLenum UNIFORM_BLOCK_INDEX                           = 0x8A3A;
    const GLenum UNIFORM_OFFSET                                = 0x8A3B;
    const GLenum UNIFORM_ARRAY_STRIDE                          = 0x8A3C;
    const GLenum UNIFORM_MATRIX_STRIDE                         = 0x8A3D;
    const GLenum UNIFORM_IS_ROW_MAJOR                          = 0x8A3E;
    const GLenum UNIFORM_BLOCK_BINDING                         = 0x8A3F;
    const GLenum UNIFORM_BLOCK_DATA_SIZE                       = 0x8A40;
    const GLenum UNIFORM_BLOCK_ACTIVE_UNIFORMS                 = 0x8A42;
    const GLenum UNIFORM_BLOCK_ACTIVE_UNIFORM_INDICES          = 0x8A43;
    const GLenum UNIFORM_BLOCK_REFERENCED_BY_VERTEX_SHADER     = 0x8A44;
    const GLenum UNIFORM_BLOCK_REFERENCED_BY_FRAGMENT_SHADER   = 0x8A46;
    const GLenum INVALID_INDEX                                 = 0xFFFFFFFF;
    const GLenum MAX_VERTEX_OUTPUT_COMPONENTS                  = 0x9122;
    const GLenum MAX_FRAGMENT_INPUT_COMPONENTS                 = 0x9125;
    const GLenum MAX_SERVER_WAIT_TIMEOUT                       = 0x9111;
    const GLenum OBJECT_TYPE                                   = 0x9112;
    const GLenum SYNC_CONDITION                                = 0x9113;
    const GLenum SYNC_STATUS                                   = 0x9114;
    const GLenum SYNC_FLAGS                                    = 0x9115;
    const GLenum SYNC_FENCE                                    = 0x9116;
    const GLenum SYNC_GPU_COMMANDS_COMPLETE                    = 0x9117;
    const GLenum UNSIGNALED                                    = 0x9118;
    const GLenum SIGNALED                                      = 0x9119;
    const GLenum ALREADY_SIGNALED                              = 0x911A;
    const GLenum TIMEOUT_EXPIRED                               = 0x911B;
    const GLenum CONDITION_SATISFIED                           = 0x911C;
    const GLenum WAIT_FAILED                                   = 0x911D;
    const GLenum SYNC_FLUSH_COMMANDS_BIT                       = 0x00000001;
    const GLenum VERTEX_ATTRIB_ARRAY_DIVISOR                   = 0x88FE;
    const GLenum ANY_SAMPLES_PASSED                            = 0x8C2F;
    const GLenum ANY_SAMPLES_PASSED_CONSERVATIVE               = 0x8D6A;
    const GLenum SAMPLER_BINDING                               = 0x8919;
    const GLenum RGB10_A2UI                                    = 0x906F;
    const GLenum GREEN                                         = 0x1904;
    const GLenum BLUE                                          = 0x1905;
    const GLenum INT_2_10_10_10_REV                            = 0x8D9F;
    const GLenum TRANSFORM_FEEDBACK                            = 0x8E22;
    const GLenum TRANSFORM_FEEDBACK_PAUSED                     = 0x8E23;
    const GLenum TRANSFORM_FEEDBACK_ACTIVE                     = 0x8E24;
    const GLenum TRANSFORM_FEEDBACK_BINDING                    = 0x8E25;
    const GLenum COMPRESSED_R11_EAC                            = 0x9270;
    const GLenum COMPRESSED_SIGNED_R11_EAC                     = 0x9271;
    const GLenum COMPRESSED_RG11_EAC                           = 0x9272;
    const GLenum COMPRESSED_SIGNED_RG11_EAC                    = 0x9273;
    const GLenum COMPRESSED_RGB8_ETC2                          = 0x9274;
    const GLenum COMPRESSED_SRGB8_ETC2                         = 0x9275;
    const GLenum COMPRESSED_RGB8_PUNCHTHROUGH_ALPHA1_ETC2      = 0x9276;
    const GLenum COMPRESSED_SRGB8_PUNCHTHROUGH_ALPHA1_ETC2     = 0x9277;
    const GLenum COMPRESSED_RGBA8_ETC2_EAC                     = 0x9278;
    const GLenum COMPRESSED_SRGB8_ALPHA8_ETC2_EAC              = 0x9279;
    const GLenum TEXTURE_IMMUTABLE_FORMAT                      = 0x912F;
    const GLenum MAX_ELEMENT_INDEX                             = 0x8D6B;
    const GLenum NUM_SAMPLE_COUNTS                             = 0x9380;
    const GLenum TEXTURE_IMMUTABLE_LEVELS                      = 0x82DF;
    const GLint TIMEOUT_IGNORED                                = -1;

    /* WebGL-specific enums */
    const GLenum MAX_CLIENT_WAIT_TIMEOUT_WEBGL                 = 0x9247;

@kevmoo

dart:web_gl is inconsistent on how constants are exposed and some constants are not exposed (from the IDLs).

We expose some constants as both top-level constants and in a Dart class e.g.,
Only constants from WebGLRenderingContextBase are exposed as top-level constants
const int VERTEX_SHADER = RenderingContext.VERTEX_SHADER;

All constants in WebGL2RenderingContextBase are all missing e.g.,
const GLenum READ_BUFFER = 0x0C02;

Constants in web_gl are in the following interfaces:

WebGLRenderingContextBase (Dart class RenderingContext) constants from WebGLRenderingContextBase e.g.,
const GLenum VERTEX_SHADER = 0x8B31;

WebGLDrawBuffers (Dart class DrawBuffers) e.g.,
const GLenum COLOR_ATTACHMENT0_WEBGL = 0x8CE0;

WebGL2RenderingContext (Dart class RenderingContext2) constants from WebGLRenderingContextBase (triply defined in RenderingContext and top-level) e.g.,
const GLenum VERTEX_SHADER = 0x8B31;

Two possible solutions:

  1. Keep all constants inside of classes:
    - Constants from WebGLRenderingContextBase are in both RenderingContext and RenderingContext2 (probably ok) but I'm thinking of removing the RenderingContext2 duplicates and add WebGL2RenderingContextBase constants in RenderingContext2. To reduce the amount of constants.
    - Remove the top-level constants seem gratuitous?

  2. Eliminate all constants in nested classes and make all constants top-level provided the 700+ constants don't collide inside of web_gl but could collide outside if imported without a prefix.

What do you think?

@robertmuth

(caveat someone involved in the webgl standards committee should probably chime in)
My understanding is this:

There is database of 16bit constants managed by "the khronos group".
If a constant has the same name it also has the same value regardless where it is used, e.g.
webgl, opengl, webgl2, opengl-es, etc.
There should be not clashes between webgl, webgl2.

Because the dart SDK was lacking certain webgl2 constants I ended defining my own
for the chronosgl library, cf.:
https://github.com/ChronosTeam/ChronosGL/blob/master/lib/src/core/constants.dart
This worked fine for me and is similar to you proposal #2.

I do not particular like the way how the constants are spread out in the JS API but I can
guess the motivation: by, say, adding a constant to a class representing a webgl extension,
you cannot accidentally use the constant when the extension is not available.
Of course, in webgl2 many features which used to be in optional extension are now
available by default.

So my recommendation would be to centralize the constants in one place.
However if you have some abstract definition of the webgl(2) JS API that includes
all the constants and that is used to automagically generate the dart bindings then
I could go with what adds the least amount of work. But I think this is not the case.

Was this page helpful?
0 / 5 - 0 ratings