Webgl2

Source/Core/GeometryPipeline.js

@@ -510,7 +510,7 @@ define([
         // If there's an index list and more than 64K attributes, it is possible that
         // some indices are outside the range of unsigned short [0, 64K - 1]
         var numberOfVertices = Geometry.computeNumberOfVertices(geometry);
-        if (defined(geometry.indices) && (numberOfVertices > CesiumMath.SIXTY_FOUR_KILOBYTES)) {
+        if (defined(geometry.indices) && (numberOfVertices >= CesiumMath.SIXTY_FOUR_KILOBYTES)) {
             var oldToNewIndex = [];
             var newIndices = [];
             var currentIndex = 0;
@@ -541,7 +541,7 @@ define([
                     newIndices.push(i);
                 }
 
-                if (currentIndex + indicesPerPrimitive > CesiumMath.SIXTY_FOUR_KILOBYTES) {
+                if (currentIndex + indicesPerPrimitive >= CesiumMath.SIXTY_FOUR_KILOBYTES) {
                     geometries.push(new Geometry({
                         attributes : newAttributes,
                         indices : newIndices,

Source/Core/IndexDatatype.js

@@ -110,7 +110,7 @@ define([
         }
         //>>includeEnd('debug');
 
-        if (numberOfVertices > CesiumMath.SIXTY_FOUR_KILOBYTES) {
+        if (numberOfVertices >= CesiumMath.SIXTY_FOUR_KILOBYTES) {
             return new Uint32Array(indicesLengthOrArray);
         }
 
@@ -141,7 +141,7 @@ define([
         }
         //>>includeEnd('debug');
 
-        if (numberOfVertices > CesiumMath.SIXTY_FOUR_KILOBYTES) {
+        if (numberOfVertices >= CesiumMath.SIXTY_FOUR_KILOBYTES) {
             return new Uint32Array(sourceArray, byteOffset, length);
         }
 

Source/Core/PixelFormat.js

@@ -23,7 +23,7 @@ define([
         DEPTH_COMPONENT : WebGLConstants.DEPTH_COMPONENT,
 
         /**
-         * A pixel format containing a depth and stencil value, most often used with {@link PixelDatatype.UNSIGNED_INT_24_8_WEBGL}.
+         * A pixel format containing a depth and stencil value, most often used with {@link PixelDatatype.UNSIGNED_INT_24_8}.
          *
          * @type {Number}
          * @constant

Source/Core/TerrainProvider.js

@@ -2,11 +2,13 @@
 define([
         './defined',
         './defineProperties',
-        './DeveloperError'
+        './DeveloperError',
+        './Math'
     ], function(
         defined,
         defineProperties,
-        DeveloperError) {
+        DeveloperError,
+        CesiumMath) {
     "use strict";
 
     /**
@@ -104,8 +106,8 @@ define([
      */
     TerrainProvider.getRegularGridIndices = function(width, height) {
         //>>includeStart('debug', pragmas.debug);
-        if (width * height > 64 * 1024) {
-            throw new DeveloperError('The total number of vertices (width * height) must be less than or equal to 65536.');
+        if (width * height >= CesiumMath.SIXTY_FOUR_KILOBYTES) {
+            throw new DeveloperError('The total number of vertices (width * height) must be less than 65536.');
         }
         //>>includeEnd('debug');
 

Source/Renderer/Context.js

@@ -69,6 +69,7 @@ define([
         WebGLConstants) {
     "use strict";
     /*global WebGLRenderingContext*/
+    /*global WebGL2RenderingContext*/
 
     function errorToString(gl, error) {
         var message = 'WebGL Error:  ';
@@ -212,12 +213,26 @@ define([
             }
         }
 
-        this._originalGLContext = canvas.getContext('webgl', webglOptions) || canvas.getContext('experimental-webgl', webglOptions) || undefined;
+        var defaultToWebgl2 = false;
+        var webgl2Supported = (typeof WebGL2RenderingContext !== 'undefined');
+        var webgl2 = false;
+        var glContext;
 
-        if (!defined(this._originalGLContext)) {
+        if (defaultToWebgl2 && webgl2Supported) {
+            glContext = canvas.getContext('webgl2', webglOptions) || canvas.getContext('experimental-webgl2', webglOptions) || undefined;
+            if (defined(glContext)) {
+                webgl2 = true;
+            }
+        }
+        if (!defined(glContext)) {
+            glContext = canvas.getContext('webgl', webglOptions) || canvas.getContext('experimental-webgl', webglOptions) || undefined;
+        }
+        if (!defined(glContext)) {
             throw new RuntimeError('The browser supports WebGL, but initialization failed.');
         }
 
+        this._originalGLContext = glContext;
+        this._webgl2 = webgl2;
         this._id = createGuid();
 
         // Validation and logging disabled by default for speed.
@@ -269,24 +284,80 @@ define([
         this._antialias = gl.getContextAttributes().antialias;
 
         // Query and initialize extensions
-        this._standardDerivatives = getExtension(gl, ['OES_standard_derivatives']);
-        this._elementIndexUint = getExtension(gl, ['OES_element_index_uint']);
-        this._depthTexture = getExtension(gl, ['WEBGL_depth_texture', 'WEBKIT_WEBGL_depth_texture']);
-        this._textureFloat = getExtension(gl, ['OES_texture_float']);
+        this._standardDerivatives = !!getExtension(gl, ['OES_standard_derivatives']);
+        this._elementIndexUint = !!getExtension(gl, ['OES_element_index_uint']);
+        this._depthTexture = !!getExtension(gl, ['WEBGL_depth_texture', 'WEBKIT_WEBGL_depth_texture']);
+        this._textureFloat = !!getExtension(gl, ['OES_texture_float']);
+        this._fragDepth = !!getExtension(gl, ['EXT_frag_depth']);
+        this._debugShaders = getExtension(gl, ['WEBGL_debug_shaders']);
 
         var textureFilterAnisotropic = options.allowTextureFilterAnisotropic ? getExtension(gl, ['EXT_texture_filter_anisotropic', 'WEBKIT_EXT_texture_filter_anisotropic']) : undefined;
-        this._textureFilterAnisotropic = textureFilterAnisotropic;
+        this._textureFilterAnisotropic = !!textureFilterAnisotropic;
         ContextLimits._maximumTextureFilterAnisotropy = defined(textureFilterAnisotropic) ? gl.getParameter(textureFilterAnisotropic.MAX_TEXTURE_MAX_ANISOTROPY_EXT) : 1.0;
-
-        this._vertexArrayObject = getExtension(gl, ['OES_vertex_array_object']);
-        this._fragDepth = getExtension(gl, ['EXT_frag_depth']);
-        this._instancedArrays = getExtension(gl, ['ANGLE_instanced_arrays']);
-
-        this._drawBuffers = getExtension(gl, ['WEBGL_draw_buffers']);
-        ContextLimits._maximumDrawBuffers = defined(this._drawBuffers) ? gl.getParameter(this._drawBuffers.MAX_DRAW_BUFFERS_WEBGL) : 1;
-        ContextLimits._maximumColorAttachments = defined(this._drawBuffers) ? gl.getParameter(this._drawBuffers.MAX_COLOR_ATTACHMENTS_WEBGL) : 1; // min when supported: 4
-
-        this._debugShaders = getExtension(gl, ['WEBGL_debug_shaders']);
+
+        var glCreateVertexArray;
+        var glBindVertexArray;
+        var glDeleteVertexArray;
+
+        var glDrawElementsInstanced;
+        var glDrawArraysInstanced;
+        var glVertexAttribDivisor;
+
+        var glDrawBuffers;
+
+        var vertexArrayObject;
+        var instancedArrays;
+        var drawBuffers;
+
+        if (webgl2) {
+            var that = this;
+
+            glCreateVertexArray = function () { return that._gl.createVertexArray(); };
+            glBindVertexArray = function(vao) { that._gl.bindVertexArray(vao); };
+            glDeleteVertexArray = function(vao) { that._gl.deleteVertexArray(vao); };
+
+            glDrawElementsInstanced = function(mode, count, type, offset, instanceCount) { gl.drawElementsInstanced(mode, count, type, offset, instanceCount); };
+            glDrawArraysInstanced = function(mode, first, count, instanceCount) { gl.drawArraysInstanced(mode, first, count, instanceCount); };
+            glVertexAttribDivisor = function(index, divisor) { gl.vertexAttribDivisor(index, divisor); };
+
+            glDrawBuffers = function(buffers) { gl.drawBuffers(buffers); };
+        } else {
+            vertexArrayObject = getExtension(gl, ['OES_vertex_array_object']);
+            if (defined(vertexArrayObject)) {
+                glCreateVertexArray = function() { return vertexArrayObject.createVertexArrayOES(); };
+                glBindVertexArray = function(vertexArray) { vertexArrayObject.bindVertexArrayOES(vertexArray); };
+                glDeleteVertexArray = function(vertexArray) { vertexArrayObject.deleteVertexArrayOES(vertexArray); };
+            }
+
+            instancedArrays = getExtension(gl, ['ANGLE_instanced_arrays']);
+            if (defined(instancedArrays)) {
+                glDrawElementsInstanced = function(mode, count, type, offset, instanceCount) { instancedArrays.drawElementsInstancedANGLE(mode, count, type, offset, instanceCount); };
+                glDrawArraysInstanced = function(mode, first, count, instanceCount) { instancedArrays.drawArraysInstancedANGLE(mode, first, count, instanceCount); };
+                glVertexAttribDivisor = function(index, divisor) { instancedArrays.vertexAttribDivisorANGLE(index, divisor); };
+            }
+
+            drawBuffers = getExtension(gl, ['WEBGL_draw_buffers']);
+            if (defined(drawBuffers)) {
+                glDrawBuffers = function(buffers) { drawBuffers.drawBuffersWEBGL(buffers); };
+            }
+        }
+
+        this.glCreateVertexArray = glCreateVertexArray;
+        this.glBindVertexArray = glBindVertexArray;
+        this.glDeleteVertexArray = glDeleteVertexArray;
+
+        this.glDrawElementsInstanced = glDrawElementsInstanced;
+        this.glDrawArraysInstanced = glDrawArraysInstanced;
+        this.glVertexAttribDivisor = glVertexAttribDivisor;
+
+        this.glDrawBuffers = glDrawBuffers;
+
+        this._vertexArrayObject = !!vertexArrayObject;
+        this._instancedArrays = !!instancedArrays;
+        this._drawBuffers = !!drawBuffers;
+
+        ContextLimits._maximumDrawBuffers = this.drawBuffers ? gl.getParameter(WebGLConstants.MAX_DRAW_BUFFERS) : 1;
+        ContextLimits._maximumColorAttachments = this.drawBuffers ? gl.getParameter(WebGLConstants.MAX_COLOR_ATTACHMENTS) : 1;
 
         var cc = gl.getParameter(gl.COLOR_CLEAR_VALUE);
         this._clearColor = new Color(cc[0], cc[1], cc[2], cc[3]);
@@ -358,6 +429,11 @@ define([
                 return this._id;
             }
         },
+        webgl2 : {
+            get : function() {
+                return this._webgl2;
+            }
+        },
         canvas : {
             get : function() {
                 return this._canvas;
@@ -473,7 +549,7 @@ define([
          */
         standardDerivatives : {
             get : function() {
-                return !!this._standardDerivatives;
+                return this._standardDerivatives;
             }
         },
 
@@ -487,7 +563,7 @@ define([
          */
         elementIndexUint : {
             get : function() {
-                return !!this._elementIndexUint;
+                return this._elementIndexUint || this._webgl2;
             }
         },
 
@@ -500,7 +576,7 @@ define([
          */
         depthTexture : {
             get : function() {
-                return !!this._depthTexture;
+                return this._depthTexture;
             }
         },
 
@@ -513,13 +589,13 @@ define([
          */
         floatingPointTexture : {
             get : function() {
-                return !!this._textureFloat;
+                return this._textureFloat;
             }
         },
 
         textureFilterAnisotropic : {
             get : function() {
-                return !!this._textureFilterAnisotropic;
+                return this._textureFilterAnisotropic;
             }
         },
 
@@ -533,7 +609,7 @@ define([
          */
         vertexArrayObject : {
             get : function() {
-                return !!this._vertexArrayObject;
+                return this._vertexArrayObject || this._webgl2;
             }
         },
 
@@ -548,7 +624,7 @@ define([
          */
         fragmentDepth : {
             get : function() {
-                return !!this._fragDepth;
+                return this._fragDepth;
             }
         },
 
@@ -561,7 +637,7 @@ define([
          */
         instancedArrays : {
             get : function() {
-                return !!this._instancedArrays;
+                return this._instancedArrays || this._webgl2;
             }
         },
 
@@ -577,7 +653,7 @@ define([
          */
         drawBuffers : {
             get : function() {
-                return !!this._drawBuffers;
+                return this._drawBuffers || this._webgl2;
             }
         },
 
@@ -751,7 +827,7 @@ define([
             }
 
             if (context.drawBuffers) {
-                context._drawBuffers.drawBuffersWEBGL(buffers);
+                context.glDrawBuffers(buffers);
             }
         }
     }
@@ -869,14 +945,14 @@ define([
             if (instanceCount === 0) {
                 context._gl.drawElements(primitiveType, count, indexBuffer.indexDatatype, offset);
             } else {
-                context._instancedArrays.drawElementsInstancedANGLE(primitiveType, count, indexBuffer.indexDatatype, offset, instanceCount);
+                context.glDrawElementsInstanced(primitiveType, count, indexBuffer.indexDatatype, offset, instanceCount);
             }
         } else {
             count = defaultValue(count, va.numberOfVertices);
             if (instanceCount === 0) {
                 context._gl.drawArrays(primitiveType, offset, count);
             } else {
-                context._instancedArrays.drawArraysInstancedANGLE(primitiveType, offset, count, instanceCount);
+                context.glDrawArraysInstanced(primitiveType, offset, count, instanceCount);
             }
         }
 
@@ -911,7 +987,7 @@ define([
 
         var buffers = scratchBackBufferArray;
         if (this.drawBuffers) {
-            this._drawBuffers.drawBuffersWEBGL(scratchBackBufferArray);
+            this.glDrawBuffers(buffers);
         }
 
         var length = this._maxFrameTextureUnitIndex;

Source/Renderer/PixelDatatype.js

@@ -15,7 +15,7 @@ define([
         UNSIGNED_SHORT : WebGLConstants.UNSIGNED_SHORT,
         UNSIGNED_INT : WebGLConstants.UNSIGNED_INT,
         FLOAT : WebGLConstants.FLOAT,
-        UNSIGNED_INT_24_8_WEBGL : WebGLConstants.UNSIGNED_INT_24_8_WEBGL,
+        UNSIGNED_INT_24_8 : WebGLConstants.UNSIGNED_INT_24_8,
         UNSIGNED_SHORT_4_4_4_4 : WebGLConstants.UNSIGNED_SHORT_4_4_4_4,
         UNSIGNED_SHORT_5_5_5_1 : WebGLConstants.UNSIGNED_SHORT_5_5_5_1,
         UNSIGNED_SHORT_5_6_5 : WebGLConstants.UNSIGNED_SHORT_5_6_5,
@@ -25,7 +25,7 @@ define([
                     (pixelDatatype === PixelDatatype.UNSIGNED_SHORT) ||
                     (pixelDatatype === PixelDatatype.UNSIGNED_INT) ||
                     (pixelDatatype === PixelDatatype.FLOAT) ||
-                    (pixelDatatype === PixelDatatype.UNSIGNED_INT_24_8_WEBGL) ||
+                    (pixelDatatype === PixelDatatype.UNSIGNED_INT_24_8) ||
                     (pixelDatatype === PixelDatatype.UNSIGNED_SHORT_4_4_4_4) ||
                     (pixelDatatype === PixelDatatype.UNSIGNED_SHORT_5_5_5_1) ||
                     (pixelDatatype === PixelDatatype.UNSIGNED_SHORT_5_6_5));