three-stdlib 2.15.1 → 2.16.0

package/misc/Volume.mjs

@@ -0,0 +1,244 @@
+import { Matrix3, Matrix4, Vector3 } from "three";
+import { VolumeSlice } from "./VolumeSlice.mjs";
+var Volume = function(xLength, yLength, zLength, type, arrayBuffer) {
+  if (arguments.length > 0) {
+    this.xLength = Number(xLength) || 1;
+    this.yLength = Number(yLength) || 1;
+    this.zLength = Number(zLength) || 1;
+    switch (type) {
+      case "Uint8":
+      case "uint8":
+      case "uchar":
+      case "unsigned char":
+      case "uint8_t":
+        this.data = new Uint8Array(arrayBuffer);
+        break;
+      case "Int8":
+      case "int8":
+      case "signed char":
+      case "int8_t":
+        this.data = new Int8Array(arrayBuffer);
+        break;
+      case "Int16":
+      case "int16":
+      case "short":
+      case "short int":
+      case "signed short":
+      case "signed short int":
+      case "int16_t":
+        this.data = new Int16Array(arrayBuffer);
+        break;
+      case "Uint16":
+      case "uint16":
+      case "ushort":
+      case "unsigned short":
+      case "unsigned short int":
+      case "uint16_t":
+        this.data = new Uint16Array(arrayBuffer);
+        break;
+      case "Int32":
+      case "int32":
+      case "int":
+      case "signed int":
+      case "int32_t":
+        this.data = new Int32Array(arrayBuffer);
+        break;
+      case "Uint32":
+      case "uint32":
+      case "uint":
+      case "unsigned int":
+      case "uint32_t":
+        this.data = new Uint32Array(arrayBuffer);
+        break;
+      case "longlong":
+      case "long long":
+      case "long long int":
+      case "signed long long":
+      case "signed long long int":
+      case "int64":
+      case "int64_t":
+      case "ulonglong":
+      case "unsigned long long":
+      case "unsigned long long int":
+      case "uint64":
+      case "uint64_t":
+        throw "Error in Volume constructor : this type is not supported in JavaScript";
+        break;
+      case "Float32":
+      case "float32":
+      case "float":
+        this.data = new Float32Array(arrayBuffer);
+        break;
+      case "Float64":
+      case "float64":
+      case "double":
+        this.data = new Float64Array(arrayBuffer);
+        break;
+      default:
+        this.data = new Uint8Array(arrayBuffer);
+    }
+    if (this.data.length !== this.xLength * this.yLength * this.zLength) {
+      throw "Error in Volume constructor, lengths are not matching arrayBuffer size";
+    }
+  }
+  this.spacing = [1, 1, 1];
+  this.offset = [0, 0, 0];
+  this.matrix = new Matrix3();
+  this.matrix.identity();
+  var lowerThreshold = -Infinity;
+  Object.defineProperty(this, "lowerThreshold", {
+    get: function() {
+      return lowerThreshold;
+    },
+    set: function(value) {
+      lowerThreshold = value;
+      this.sliceList.forEach(function(slice) {
+        slice.geometryNeedsUpdate = true;
+      });
+    }
+  });
+  var upperThreshold = Infinity;
+  Object.defineProperty(this, "upperThreshold", {
+    get: function() {
+      return upperThreshold;
+    },
+    set: function(value) {
+      upperThreshold = value;
+      this.sliceList.forEach(function(slice) {
+        slice.geometryNeedsUpdate = true;
+      });
+    }
+  });
+  this.sliceList = [];
+};
+Volume.prototype = {
+  constructor: Volume,
+  getData: function(i, j, k) {
+    return this.data[k * this.xLength * this.yLength + j * this.xLength + i];
+  },
+  access: function(i, j, k) {
+    return k * this.xLength * this.yLength + j * this.xLength + i;
+  },
+  reverseAccess: function(index) {
+    var z = Math.floor(index / (this.yLength * this.xLength));
+    var y = Math.floor((index - z * this.yLength * this.xLength) / this.xLength);
+    var x = index - z * this.yLength * this.xLength - y * this.xLength;
+    return [x, y, z];
+  },
+  map: function(functionToMap, context) {
+    var length = this.data.length;
+    context = context || this;
+    for (let i = 0; i < length; i++) {
+      this.data[i] = functionToMap.call(context, this.data[i], i, this.data);
+    }
+    return this;
+  },
+  extractPerpendicularPlane: function(axis, RASIndex) {
+    var iLength, jLength, sliceAccess, planeMatrix = new Matrix4().identity(), volume = this, planeWidth, planeHeight, firstSpacing, secondSpacing, positionOffset, IJKIndex;
+    var axisInIJK = new Vector3(), firstDirection = new Vector3(), secondDirection = new Vector3();
+    var dimensions = new Vector3(this.xLength, this.yLength, this.zLength);
+    switch (axis) {
+      case "x":
+        axisInIJK.set(1, 0, 0);
+        firstDirection.set(0, 0, -1);
+        secondDirection.set(0, -1, 0);
+        firstSpacing = this.spacing[2];
+        secondSpacing = this.spacing[1];
+        IJKIndex = new Vector3(RASIndex, 0, 0);
+        planeMatrix.multiply(new Matrix4().makeRotationY(Math.PI / 2));
+        positionOffset = (volume.RASDimensions[0] - 1) / 2;
+        planeMatrix.setPosition(new Vector3(RASIndex - positionOffset, 0, 0));
+        break;
+      case "y":
+        axisInIJK.set(0, 1, 0);
+        firstDirection.set(1, 0, 0);
+        secondDirection.set(0, 0, 1);
+        firstSpacing = this.spacing[0];
+        secondSpacing = this.spacing[2];
+        IJKIndex = new Vector3(0, RASIndex, 0);
+        planeMatrix.multiply(new Matrix4().makeRotationX(-Math.PI / 2));
+        positionOffset = (volume.RASDimensions[1] - 1) / 2;
+        planeMatrix.setPosition(new Vector3(0, RASIndex - positionOffset, 0));
+        break;
+      case "z":
+      default:
+        axisInIJK.set(0, 0, 1);
+        firstDirection.set(1, 0, 0);
+        secondDirection.set(0, -1, 0);
+        firstSpacing = this.spacing[0];
+        secondSpacing = this.spacing[1];
+        IJKIndex = new Vector3(0, 0, RASIndex);
+        positionOffset = (volume.RASDimensions[2] - 1) / 2;
+        planeMatrix.setPosition(new Vector3(0, 0, RASIndex - positionOffset));
+        break;
+    }
+    firstDirection.applyMatrix4(volume.inverseMatrix).normalize();
+    firstDirection.argVar = "i";
+    secondDirection.applyMatrix4(volume.inverseMatrix).normalize();
+    secondDirection.argVar = "j";
+    axisInIJK.applyMatrix4(volume.inverseMatrix).normalize();
+    iLength = Math.floor(Math.abs(firstDirection.dot(dimensions)));
+    jLength = Math.floor(Math.abs(secondDirection.dot(dimensions)));
+    planeWidth = Math.abs(iLength * firstSpacing);
+    planeHeight = Math.abs(jLength * secondSpacing);
+    IJKIndex = Math.abs(Math.round(IJKIndex.applyMatrix4(volume.inverseMatrix).dot(axisInIJK)));
+    var base = [new Vector3(1, 0, 0), new Vector3(0, 1, 0), new Vector3(0, 0, 1)];
+    var iDirection = [firstDirection, secondDirection, axisInIJK].find(function(x) {
+      return Math.abs(x.dot(base[0])) > 0.9;
+    });
+    var jDirection = [firstDirection, secondDirection, axisInIJK].find(function(x) {
+      return Math.abs(x.dot(base[1])) > 0.9;
+    });
+    var kDirection = [firstDirection, secondDirection, axisInIJK].find(function(x) {
+      return Math.abs(x.dot(base[2])) > 0.9;
+    });
+    sliceAccess = function(i, j) {
+      var accessI, accessJ, accessK;
+      var si = iDirection === axisInIJK ? IJKIndex : iDirection.argVar === "i" ? i : j;
+      var sj = jDirection === axisInIJK ? IJKIndex : jDirection.argVar === "i" ? i : j;
+      var sk = kDirection === axisInIJK ? IJKIndex : kDirection.argVar === "i" ? i : j;
+      var accessI = iDirection.dot(base[0]) > 0 ? si : volume.xLength - 1 - si;
+      var accessJ = jDirection.dot(base[1]) > 0 ? sj : volume.yLength - 1 - sj;
+      var accessK = kDirection.dot(base[2]) > 0 ? sk : volume.zLength - 1 - sk;
+      return volume.access(accessI, accessJ, accessK);
+    };
+    return {
+      iLength,
+      jLength,
+      sliceAccess,
+      matrix: planeMatrix,
+      planeWidth,
+      planeHeight
+    };
+  },
+  extractSlice: function(axis, index) {
+    var slice = new VolumeSlice(this, index, axis);
+    this.sliceList.push(slice);
+    return slice;
+  },
+  repaintAllSlices: function() {
+    this.sliceList.forEach(function(slice) {
+      slice.repaint();
+    });
+    return this;
+  },
+  computeMinMax: function() {
+    var min = Infinity;
+    var max = -Infinity;
+    var datasize = this.data.length;
+    var i = 0;
+    for (i = 0; i < datasize; i++) {
+      if (!isNaN(this.data[i])) {
+        var value = this.data[i];
+        min = Math.min(min, value);
+        max = Math.max(max, value);
+      }
+    }
+    this.min = min;
+    this.max = max;
+    return [min, max];
+  }
+};
+export {
+  Volume
+};

package/misc/VolumeSlice.js

@@ -1,137 +1,62 @@
-import { Texture, LinearFilter, ClampToEdgeWrapping, MeshBasicMaterial, DoubleSide, Mesh, PlaneGeometry } from 'three';
-
-/**
- * This class has been made to hold a slice of a volume data
- * @class
- * @param   {Volume} volume    The associated volume
- * @param   {number}       [index=0] The index of the slice
- * @param   {string}       [axis='z']      For now only 'x', 'y' or 'z' but later it will change to a normal vector
- * @see Volume
- */
-
-var VolumeSlice = function (volume, index, axis) {
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const THREE = require("three");
+var VolumeSlice = function(volume, index, axis) {
   var slice = this;
-  /**
-   * @member {Volume} volume The associated volume
-   */
-
   this.volume = volume;
-  /**
-   * @member {Number} index The index of the slice, if changed, will automatically call updateGeometry at the next repaint
-   */
-
   index = index || 0;
-  Object.defineProperty(this, 'index', {
-    get: function () {
+  Object.defineProperty(this, "index", {
+    get: function() {
       return index;
     },
-    set: function (value) {
+    set: function(value) {
       index = value;
       slice.geometryNeedsUpdate = true;
       return index;
     }
   });
-  /**
-   * @member {String} axis The normal axis
-   */
-
-  this.axis = axis || 'z';
-  /**
-   * @member {HTMLCanvasElement} canvas The final canvas used for the texture
-   */
-
-  /**
-   * @member {CanvasRenderingContext2D} ctx Context of the canvas
-   */
-
-  this.canvas = document.createElement('canvas');
-  /**
-   * @member {HTMLCanvasElement} canvasBuffer The intermediary canvas used to paint the data
-   */
-
-  /**
-   * @member {CanvasRenderingContext2D} ctxBuffer Context of the canvas buffer
-   */
-
-  this.canvasBuffer = document.createElement('canvas');
+  this.axis = axis || "z";
+  this.canvas = document.createElement("canvas");
+  this.canvasBuffer = document.createElement("canvas");
   this.updateGeometry();
-  var canvasMap = new Texture(this.canvas);
-  canvasMap.minFilter = LinearFilter;
-  canvasMap.wrapS = canvasMap.wrapT = ClampToEdgeWrapping;
-  var material = new MeshBasicMaterial({
+  var canvasMap = new THREE.Texture(this.canvas);
+  canvasMap.minFilter = THREE.LinearFilter;
+  canvasMap.wrapS = canvasMap.wrapT = THREE.ClampToEdgeWrapping;
+  var material = new THREE.MeshBasicMaterial({
     map: canvasMap,
-    side: DoubleSide,
+    side: THREE.DoubleSide,
     transparent: true
   });
-  /**
-   * @member {Mesh} mesh The mesh ready to get used in the scene
-   */
-
-  this.mesh = new Mesh(this.geometry, material);
+  this.mesh = new THREE.Mesh(this.geometry, material);
   this.mesh.matrixAutoUpdate = false;
-  /**
-   * @member {Boolean} geometryNeedsUpdate If set to true, updateGeometry will be triggered at the next repaint
-   */
-
   this.geometryNeedsUpdate = true;
   this.repaint();
-  /**
-   * @member {Number} iLength Width of slice in the original coordinate system, corresponds to the width of the buffer canvas
-   */
-
-  /**
-   * @member {Number} jLength Height of slice in the original coordinate system, corresponds to the height of the buffer canvas
-   */
-
-  /**
-   * @member {Function} sliceAccess Function that allow the slice to access right data
-   * @see Volume.extractPerpendicularPlane
-   * @param {Number} i The first coordinate
-   * @param {Number} j The second coordinate
-   * @returns {Number} the index corresponding to the voxel in volume.data of the given position in the slice
-   */
 };
-
 VolumeSlice.prototype = {
   constructor: VolumeSlice,
-
-  /**
-   * @member {Function} repaint Refresh the texture and the geometry if geometryNeedsUpdate is set to true
-   * @memberof VolumeSlice
-   */
-  repaint: function () {
+  repaint: function() {
     if (this.geometryNeedsUpdate) {
       this.updateGeometry();
     }
-
-    var iLength = this.iLength,
-        jLength = this.jLength,
-        sliceAccess = this.sliceAccess,
-        volume = this.volume,
-        canvas = this.canvasBuffer,
-        ctx = this.ctxBuffer; // get the imageData and pixel array from the canvas
-
+    var iLength = this.iLength, jLength = this.jLength, sliceAccess = this.sliceAccess, volume = this.volume, canvas = this.canvasBuffer, ctx = this.ctxBuffer;
     var imgData = ctx.getImageData(0, 0, iLength, jLength);
     var data = imgData.data;
     var volumeData = volume.data;
     var upperThreshold = volume.upperThreshold;
     var lowerThreshold = volume.lowerThreshold;
     var windowLow = volume.windowLow;
-    var windowHigh = volume.windowHigh; // manipulate some pixel elements
-
+    var windowHigh = volume.windowHigh;
     var pixelCount = 0;
-
-    if (volume.dataType === 'label') {
-      //this part is currently useless but will be used when colortables will be handled
+    if (volume.dataType === "label") {
       for (let j = 0; j < jLength; j++) {
         for (let i = 0; i < iLength; i++) {
           var label = volumeData[sliceAccess(i, j)];
           label = label >= this.colorMap.length ? label % this.colorMap.length + 1 : label;
           var color = this.colorMap[label];
-          data[4 * pixelCount] = color >> 24 & 0xff;
-          data[4 * pixelCount + 1] = color >> 16 & 0xff;
-          data[4 * pixelCount + 2] = color >> 8 & 0xff;
-          data[4 * pixelCount + 3] = color & 0xff;
+          data[4 * pixelCount] = color >> 24 & 255;
+          data[4 * pixelCount + 1] = color >> 16 & 255;
+          data[4 * pixelCount + 2] = color >> 8 & 255;
+          data[4 * pixelCount + 3] = color & 255;
           pixelCount++;
         }
       }
@@ -139,10 +64,8 @@ VolumeSlice.prototype = {
       for (let j = 0; j < jLength; j++) {
         for (let i = 0; i < iLength; i++) {
           var value = volumeData[sliceAccess(i, j)];
-          var alpha = 0xff; //apply threshold
-
-          alpha = upperThreshold >= value ? lowerThreshold <= value ? alpha : 0 : 0; //apply window level
-
+          var alpha = 255;
+          alpha = upperThreshold >= value ? lowerThreshold <= value ? alpha : 0 : 0;
           value = Math.floor(255 * (value - windowLow) / (windowHigh - windowLow));
           value = value > 255 ? 255 : value < 0 ? 0 : value | 0;
           data[4 * pixelCount] = value;
@@ -153,18 +76,11 @@ VolumeSlice.prototype = {
         }
       }
     }
-
     ctx.putImageData(imgData, 0, 0);
     this.ctx.drawImage(canvas, 0, 0, iLength, jLength, 0, 0, this.canvas.width, this.canvas.height);
     this.mesh.material.map.needsUpdate = true;
   },
-
-  /**
-   * @member {Function} Refresh the geometry according to axis and index
-   * @see Volume.extractPerpendicularPlane
-   * @memberof VolumeSlice
-   */
-  updateGeometry: function () {
+  updateGeometry: function() {
     var extracted = this.volume.extractPerpendicularPlane(this.axis, this.index);
     this.sliceAccess = extracted.sliceAccess;
     this.jLength = extracted.jLength;
@@ -174,21 +90,17 @@ VolumeSlice.prototype = {
     this.canvas.height = extracted.planeHeight;
     this.canvasBuffer.width = this.iLength;
     this.canvasBuffer.height = this.jLength;
-    this.ctx = this.canvas.getContext('2d');
-    this.ctxBuffer = this.canvasBuffer.getContext('2d');
-    if (this.geometry) this.geometry.dispose(); // dispose existing geometry
-
-    this.geometry = new PlaneGeometry(extracted.planeWidth, extracted.planeHeight);
-
+    this.ctx = this.canvas.getContext("2d");
+    this.ctxBuffer = this.canvasBuffer.getContext("2d");
+    if (this.geometry)
+      this.geometry.dispose();
+    this.geometry = new THREE.PlaneGeometry(extracted.planeWidth, extracted.planeHeight);
     if (this.mesh) {
-      this.mesh.geometry = this.geometry; //reset mesh matrix
-
+      this.mesh.geometry = this.geometry;
       this.mesh.matrix.identity();
       this.mesh.applyMatrix4(this.matrix);
     }
-
     this.geometryNeedsUpdate = false;
   }
 };
-
-export { VolumeSlice };
+exports.VolumeSlice = VolumeSlice;

package/misc/VolumeSlice.mjs

@@ -0,0 +1,106 @@
+import { Texture, LinearFilter, ClampToEdgeWrapping, MeshBasicMaterial, DoubleSide, Mesh, PlaneGeometry } from "three";
+var VolumeSlice = function(volume, index, axis) {
+  var slice = this;
+  this.volume = volume;
+  index = index || 0;
+  Object.defineProperty(this, "index", {
+    get: function() {
+      return index;
+    },
+    set: function(value) {
+      index = value;
+      slice.geometryNeedsUpdate = true;
+      return index;
+    }
+  });
+  this.axis = axis || "z";
+  this.canvas = document.createElement("canvas");
+  this.canvasBuffer = document.createElement("canvas");
+  this.updateGeometry();
+  var canvasMap = new Texture(this.canvas);
+  canvasMap.minFilter = LinearFilter;
+  canvasMap.wrapS = canvasMap.wrapT = ClampToEdgeWrapping;
+  var material = new MeshBasicMaterial({
+    map: canvasMap,
+    side: DoubleSide,
+    transparent: true
+  });
+  this.mesh = new Mesh(this.geometry, material);
+  this.mesh.matrixAutoUpdate = false;
+  this.geometryNeedsUpdate = true;
+  this.repaint();
+};
+VolumeSlice.prototype = {
+  constructor: VolumeSlice,
+  repaint: function() {
+    if (this.geometryNeedsUpdate) {
+      this.updateGeometry();
+    }
+    var iLength = this.iLength, jLength = this.jLength, sliceAccess = this.sliceAccess, volume = this.volume, canvas = this.canvasBuffer, ctx = this.ctxBuffer;
+    var imgData = ctx.getImageData(0, 0, iLength, jLength);
+    var data = imgData.data;
+    var volumeData = volume.data;
+    var upperThreshold = volume.upperThreshold;
+    var lowerThreshold = volume.lowerThreshold;
+    var windowLow = volume.windowLow;
+    var windowHigh = volume.windowHigh;
+    var pixelCount = 0;
+    if (volume.dataType === "label") {
+      for (let j = 0; j < jLength; j++) {
+        for (let i = 0; i < iLength; i++) {
+          var label = volumeData[sliceAccess(i, j)];
+          label = label >= this.colorMap.length ? label % this.colorMap.length + 1 : label;
+          var color = this.colorMap[label];
+          data[4 * pixelCount] = color >> 24 & 255;
+          data[4 * pixelCount + 1] = color >> 16 & 255;
+          data[4 * pixelCount + 2] = color >> 8 & 255;
+          data[4 * pixelCount + 3] = color & 255;
+          pixelCount++;
+        }
+      }
+    } else {
+      for (let j = 0; j < jLength; j++) {
+        for (let i = 0; i < iLength; i++) {
+          var value = volumeData[sliceAccess(i, j)];
+          var alpha = 255;
+          alpha = upperThreshold >= value ? lowerThreshold <= value ? alpha : 0 : 0;
+          value = Math.floor(255 * (value - windowLow) / (windowHigh - windowLow));
+          value = value > 255 ? 255 : value < 0 ? 0 : value | 0;
+          data[4 * pixelCount] = value;
+          data[4 * pixelCount + 1] = value;
+          data[4 * pixelCount + 2] = value;
+          data[4 * pixelCount + 3] = alpha;
+          pixelCount++;
+        }
+      }
+    }
+    ctx.putImageData(imgData, 0, 0);
+    this.ctx.drawImage(canvas, 0, 0, iLength, jLength, 0, 0, this.canvas.width, this.canvas.height);
+    this.mesh.material.map.needsUpdate = true;
+  },
+  updateGeometry: function() {
+    var extracted = this.volume.extractPerpendicularPlane(this.axis, this.index);
+    this.sliceAccess = extracted.sliceAccess;
+    this.jLength = extracted.jLength;
+    this.iLength = extracted.iLength;
+    this.matrix = extracted.matrix;
+    this.canvas.width = extracted.planeWidth;
+    this.canvas.height = extracted.planeHeight;
+    this.canvasBuffer.width = this.iLength;
+    this.canvasBuffer.height = this.jLength;
+    this.ctx = this.canvas.getContext("2d");
+    this.ctxBuffer = this.canvasBuffer.getContext("2d");
+    if (this.geometry)
+      this.geometry.dispose();
+    this.geometry = new PlaneGeometry(extracted.planeWidth, extracted.planeHeight);
+    if (this.mesh) {
+      this.mesh.geometry = this.geometry;
+      this.mesh.matrix.identity();
+      this.mesh.applyMatrix4(this.matrix);
+    }
+    this.geometryNeedsUpdate = false;
+  }
+};
+export {
+  VolumeSlice
+};

package/misc/WebGL.js

@@ -1,29 +1,31 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 let webGLAvailable, webGL2Available;
 function isWebGLAvailable() {
-  if (webGLAvailable !== undefined) return webGLAvailable;
-
+  var _a;
+  if (webGLAvailable !== void 0)
+    return webGLAvailable;
   try {
-    var _gl$getExtension;
-
     let gl;
-    const canvas = document.createElement('canvas');
-    webGLAvailable = !!(window.WebGLRenderingContext && (gl = canvas.getContext('webgl')));
-    if (gl) (_gl$getExtension = gl.getExtension('WEBGL_lose_context')) === null || _gl$getExtension === void 0 ? void 0 : _gl$getExtension.loseContext();
+    const canvas = document.createElement("canvas");
+    webGLAvailable = !!(window.WebGLRenderingContext && (gl = canvas.getContext("webgl")));
+    if (gl)
+      (_a = gl.getExtension("WEBGL_lose_context")) == null ? void 0 : _a.loseContext();
     return webGLAvailable;
   } catch (e) {
     return webGLAvailable = false;
   }
 }
 function isWebGL2Available() {
-  if (webGL2Available !== undefined) return webGL2Available;
-
+  var _a;
+  if (webGL2Available !== void 0)
+    return webGL2Available;
   try {
-    var _gl$getExtension2;
-
     let gl;
-    const canvas = document.createElement('canvas');
-    webGL2Available = !!(window.WebGL2RenderingContext && (gl = canvas.getContext('webgl2')));
-    if (gl) (_gl$getExtension2 = gl.getExtension('WEBGL_lose_context')) === null || _gl$getExtension2 === void 0 ? void 0 : _gl$getExtension2.loseContext();
+    const canvas = document.createElement("canvas");
+    webGL2Available = !!(window.WebGL2RenderingContext && (gl = canvas.getContext("webgl2")));
+    if (gl)
+      (_a = gl.getExtension("WEBGL_lose_context")) == null ? void 0 : _a.loseContext();
     return webGL2Available;
   } catch (e) {
     return webGL2Available = false;
@@ -37,35 +39,36 @@ function getWebGL2ErrorMessage() {
 }
 function getErrorMessage(version) {
   const names = {
-    1: 'WebGL',
-    2: 'WebGL 2'
+    1: "WebGL",
+    2: "WebGL 2"
   };
   const contexts = {
     1: window.WebGLRenderingContext,
     2: window.WebGL2RenderingContext
   };
-  const element = document.createElement('div');
-  element.id = 'webglmessage';
-  element.style.fontFamily = 'monospace';
-  element.style.fontSize = '13px';
-  element.style.fontWeight = 'normal';
-  element.style.textAlign = 'center';
-  element.style.background = '#fff';
-  element.style.color = '#000';
-  element.style.padding = '1.5em';
-  element.style.width = '400px';
-  element.style.margin = '5em auto 0';
+  const element = document.createElement("div");
+  element.id = "webglmessage";
+  element.style.fontFamily = "monospace";
+  element.style.fontSize = "13px";
+  element.style.fontWeight = "normal";
+  element.style.textAlign = "center";
+  element.style.background = "#fff";
+  element.style.color = "#000";
+  element.style.padding = "1.5em";
+  element.style.width = "400px";
+  element.style.margin = "5em auto 0";
   let message = 'Your $0 does not seem to support <a href="http://khronos.org/webgl/wiki/Getting_a_WebGL_Implementation" style="color:#000">$1</a>';
-
   if (contexts[version]) {
-    message = message.replace('$0', 'graphics card');
+    message = message.replace("$0", "graphics card");
   } else {
-    message = message.replace('$0', 'browser');
+    message = message.replace("$0", "browser");
   }
-
-  message = message.replace('$1', names[version]);
+  message = message.replace("$1", names[version]);
   element.innerHTML = message;
   return element;
 }
-
-export { getErrorMessage, getWebGL2ErrorMessage, getWebGLErrorMessage, isWebGL2Available, isWebGLAvailable };
+exports.getErrorMessage = getErrorMessage;
+exports.getWebGL2ErrorMessage = getWebGL2ErrorMessage;
+exports.getWebGLErrorMessage = getWebGLErrorMessage;
+exports.isWebGL2Available = isWebGL2Available;
+exports.isWebGLAvailable = isWebGLAvailable;