WebGL.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
  1. /**
  2. * A utility module with basic WebGL 2 capability testing.
  3. *
  4. * @hideconstructor
  5. * @three_import import WebGL from 'three/addons/capabilities/WebGL.js';
  6. */
  7. class WebGL {
  8. /**
  9. * Returns `true` if WebGL 2 is available.
  10. *
  11. * @return {boolean} Whether WebGL 2 is available or not.
  12. */
  13. static isWebGL2Available() {
  14. try {
  15. const canvas = document.createElement( 'canvas' );
  16. return !! ( window.WebGL2RenderingContext && canvas.getContext( 'webgl2' ) );
  17. } catch ( e ) {
  18. return false;
  19. }
  20. }
  21. /**
  22. * Returns `true` if the given color space is available. This method can only be used
  23. * if WebGL 2 is supported.
  24. *
  25. * @param {string} colorSpace - The color space to test.
  26. * @return {boolean} Whether the given color space is available or not.
  27. */
  28. static isColorSpaceAvailable( colorSpace ) {
  29. try {
  30. const canvas = document.createElement( 'canvas' );
  31. const ctx = window.WebGL2RenderingContext && canvas.getContext( 'webgl2' );
  32. ctx.drawingBufferColorSpace = colorSpace;
  33. return ctx.drawingBufferColorSpace === colorSpace; // deepscan-disable-line SAME_OPERAND_VALUE
  34. } catch ( e ) {
  35. return false;
  36. }
  37. }
  38. /**
  39. * Returns a `div` element representing a formatted error message that can be appended in
  40. * web sites if WebGL 2 isn't supported.
  41. *
  42. * @return {HTMLDivElement} A `div` element representing a formatted error message that WebGL 2 isn't supported.
  43. */
  44. static getWebGL2ErrorMessage() {
  45. return this._getErrorMessage( 2 );
  46. }
  47. // private
  48. static _getErrorMessage( version ) {
  49. const names = {
  50. 1: 'WebGL',
  51. 2: 'WebGL 2'
  52. };
  53. const contexts = {
  54. 1: window.WebGLRenderingContext,
  55. 2: window.WebGL2RenderingContext
  56. };
  57. 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>';
  58. const element = document.createElement( 'div' );
  59. element.id = 'webglmessage';
  60. element.style.fontFamily = 'monospace';
  61. element.style.fontSize = '13px';
  62. element.style.fontWeight = 'normal';
  63. element.style.textAlign = 'center';
  64. element.style.background = '#fff';
  65. element.style.color = '#000';
  66. element.style.padding = '1.5em';
  67. element.style.width = '400px';
  68. element.style.margin = '5em auto 0';
  69. if ( contexts[ version ] ) {
  70. message = message.replace( '$0', 'graphics card' );
  71. } else {
  72. message = message.replace( '$0', 'browser' );
  73. }
  74. message = message.replace( '$1', names[ version ] );
  75. element.innerHTML = message;
  76. return element;
  77. }
  78. // @deprecated, r168
  79. static isWebGLAvailable() {
  80. console.warn( 'isWebGLAvailable() has been deprecated and will be removed in r178. Use isWebGL2Available() instead.' );
  81. try {
  82. const canvas = document.createElement( 'canvas' );
  83. return !! ( window.WebGLRenderingContext && ( canvas.getContext( 'webgl' ) || canvas.getContext( 'experimental-webgl' ) ) );
  84. } catch ( e ) {
  85. return false;
  86. }
  87. }
  88. static getWebGLErrorMessage() {
  89. console.warn( 'getWebGLErrorMessage() has been deprecated and will be removed in r178. Use getWebGL2ErrorMessage() instead.' );
  90. return this._getErrorMessage( 1 );
  91. }
  92. }
  93. export default WebGL;