HTML and CSS Reference
In-Depth Information
bytesPerBlock = 16;
errorCallback("Unsupported FourCC code: " + int32ToFourCC(fourCC));
// Determine how many mipmap levels the file contains.
var levels = 1;
levels = Math.max(1, header[DDS_HEADER_MIPMAPCOUNT]);
// Gather other basic metrics and a view of the raw the DXT data.
var width = header[DDS_HEADER_WIDTH];
var height = header[DDS_HEADER_HEIGHT];
var dataOffset = header[DDS_HEADER_SIZE] + 4;
var dxtData = new Uint8Array(arrayBuffer, dataOffset);
// Pass the DXT information to the callback for uploading.
callback(dxtData, width, height, levels, internalFormat, bytesPerBlock);
Now that you have a function to read data out of a DXT file, let's work on actually allowing users to load one. To
make the process as user-friendly as possible, you'll define a class called DXTLoader that provides the interface for
loading these textures. In order to use DXT textures, you have to first query for the WEBGL_compressed_texture_s3tc
extension. You do that in the loader classes constructor, and users can check to make sure the extension is supported
by calling the supportsDXT method on the class instance (see Listing 21-4).
Listing 21-4. DXTLoader Constructor and SupportsType Method
// This class is our public interface.
var DXTLoader = function(gl) { = gl;
// Load the S3TC (DXT) extension, if it's available
this.ext = null;
var vendorPrefixes = ["", "WEBKIT_", "MOZ_"];
for(i in vendorPrefixes) {
this.ext = gl.getExtension(vendorPrefixes[i] + "WEBGL_compressed_texture_s3tc");
if (this.ext) { break; }
// Check to see if compressed textures are supported by this browser/device.
DXTLoader.prototype.supportsDXT = function() {
return !!this.ext;
Search WWH ::

Custom Search