WebGLState.js 9.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. */
  4. THREE.WebGLState = function ( gl, extensions, paramThreeToGL ) {
  5. var _this = this;
  6. var newAttributes = new Uint8Array( 16 );
  7. var enabledAttributes = new Uint8Array( 16 );
  8. var attributeDivisors = new Uint8Array( 16 );
  9. var capabilities = {};
  10. var compressedTextureFormats = null;
  11. var currentBlending = null;
  12. var currentBlendEquation = null;
  13. var currentBlendSrc = null;
  14. var currentBlendDst = null;
  15. var currentBlendEquationAlpha = null;
  16. var currentBlendSrcAlpha = null;
  17. var currentBlendDstAlpha = null;
  18. var currentDepthFunc = null;
  19. var currentDepthWrite = null;
  20. var currentColorWrite = null;
  21. var currentFlipSided = null;
  22. var currentLineWidth = null;
  23. var currentPolygonOffsetFactor = null;
  24. var currentPolygonOffsetUnits = null;
  25. var maxTextures = gl.getParameter( gl.MAX_TEXTURE_IMAGE_UNITS );
  26. var currentTextureSlot = undefined;
  27. var currentBoundTextures = {};
  28. this.init = function () {
  29. gl.clearColor( 0, 0, 0, 1 );
  30. gl.clearDepth( 1 );
  31. gl.clearStencil( 0 );
  32. this.enable( gl.DEPTH_TEST );
  33. gl.depthFunc( gl.LEQUAL );
  34. gl.frontFace( gl.CCW );
  35. gl.cullFace( gl.BACK );
  36. this.enable( gl.CULL_FACE );
  37. this.enable( gl.BLEND );
  38. gl.blendEquation( gl.FUNC_ADD );
  39. gl.blendFunc( gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA );
  40. };
  41. this.initAttributes = function () {
  42. for ( var i = 0, l = newAttributes.length; i < l; i ++ ) {
  43. newAttributes[ i ] = 0;
  44. }
  45. };
  46. this.enableAttribute = function ( attribute ) {
  47. newAttributes[ attribute ] = 1;
  48. if ( enabledAttributes[ attribute ] === 0 ) {
  49. gl.enableVertexAttribArray( attribute );
  50. enabledAttributes[ attribute ] = 1;
  51. }
  52. if ( attributeDivisors[ attribute ] !== 0 ) {
  53. var extension = extensions.get( 'ANGLE_instanced_arrays' );
  54. extension.vertexAttribDivisorANGLE( attribute, 0 );
  55. attributeDivisors[ attribute ] = 0;
  56. }
  57. };
  58. this.enableAttributeAndDivisor = function ( attribute, meshPerAttribute, extension ) {
  59. newAttributes[ attribute ] = 1;
  60. if ( enabledAttributes[ attribute ] === 0 ) {
  61. gl.enableVertexAttribArray( attribute );
  62. enabledAttributes[ attribute ] = 1;
  63. }
  64. if ( attributeDivisors[ attribute ] !== meshPerAttribute ) {
  65. extension.vertexAttribDivisorANGLE( attribute, meshPerAttribute );
  66. attributeDivisors[ attribute ] = meshPerAttribute;
  67. }
  68. };
  69. this.disableUnusedAttributes = function () {
  70. for ( var i = 0, l = enabledAttributes.length; i < l; i ++ ) {
  71. if ( enabledAttributes[ i ] !== newAttributes[ i ] ) {
  72. gl.disableVertexAttribArray( i );
  73. enabledAttributes[ i ] = 0;
  74. }
  75. }
  76. };
  77. this.enable = function ( id ) {
  78. if ( capabilities[ id ] !== true ) {
  79. gl.enable( id );
  80. capabilities[ id ] = true;
  81. }
  82. };
  83. this.disable = function ( id ) {
  84. if ( capabilities[ id ] !== false ) {
  85. gl.disable( id );
  86. capabilities[ id ] = false;
  87. }
  88. };
  89. this.getCompressedTextureFormats = function () {
  90. if ( compressedTextureFormats === null ) {
  91. compressedTextureFormats = [];
  92. if ( extensions.get( 'WEBGL_compressed_texture_pvrtc' ) ||
  93. extensions.get( 'WEBGL_compressed_texture_s3tc' ) ) {
  94. var formats = gl.getParameter( gl.COMPRESSED_TEXTURE_FORMATS );
  95. for ( var i = 0; i < formats.length; i ++ ) {
  96. compressedTextureFormats.push( formats[ i ] );
  97. }
  98. }
  99. }
  100. return compressedTextureFormats;
  101. };
  102. this.setBlending = function ( blending, blendEquation, blendSrc, blendDst, blendEquationAlpha, blendSrcAlpha, blendDstAlpha ) {
  103. if ( blending !== currentBlending ) {
  104. if ( blending === THREE.NoBlending ) {
  105. this.disable( gl.BLEND );
  106. } else if ( blending === THREE.AdditiveBlending ) {
  107. this.enable( gl.BLEND );
  108. gl.blendEquation( gl.FUNC_ADD );
  109. gl.blendFunc( gl.SRC_ALPHA, gl.ONE );
  110. } else if ( blending === THREE.SubtractiveBlending ) {
  111. // TODO: Find blendFuncSeparate() combination
  112. this.enable( gl.BLEND );
  113. gl.blendEquation( gl.FUNC_ADD );
  114. gl.blendFunc( gl.ZERO, gl.ONE_MINUS_SRC_COLOR );
  115. } else if ( blending === THREE.MultiplyBlending ) {
  116. // TODO: Find blendFuncSeparate() combination
  117. this.enable( gl.BLEND );
  118. gl.blendEquation( gl.FUNC_ADD );
  119. gl.blendFunc( gl.ZERO, gl.SRC_COLOR );
  120. } else if ( blending === THREE.CustomBlending ) {
  121. this.enable( gl.BLEND );
  122. } else {
  123. this.enable( gl.BLEND );
  124. gl.blendEquationSeparate( gl.FUNC_ADD, gl.FUNC_ADD );
  125. gl.blendFuncSeparate( gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE_MINUS_SRC_ALPHA );
  126. }
  127. currentBlending = blending;
  128. }
  129. if ( blending === THREE.CustomBlending ) {
  130. blendEquationAlpha = blendEquationAlpha || blendEquation;
  131. blendSrcAlpha = blendSrcAlpha || blendSrc;
  132. blendDstAlpha = blendDstAlpha || blendDst;
  133. if ( blendEquation !== currentBlendEquation || blendEquationAlpha !== currentBlendEquationAlpha ) {
  134. gl.blendEquationSeparate( paramThreeToGL( blendEquation ), paramThreeToGL( blendEquationAlpha ) );
  135. currentBlendEquation = blendEquation;
  136. currentBlendEquationAlpha = blendEquationAlpha;
  137. }
  138. if ( blendSrc !== currentBlendSrc || blendDst !== currentBlendDst || blendSrcAlpha !== currentBlendSrcAlpha || blendDstAlpha !== currentBlendDstAlpha ) {
  139. gl.blendFuncSeparate( paramThreeToGL( blendSrc ), paramThreeToGL( blendDst ), paramThreeToGL( blendSrcAlpha ), paramThreeToGL( blendDstAlpha ) );
  140. currentBlendSrc = blendSrc;
  141. currentBlendDst = blendDst;
  142. currentBlendSrcAlpha = blendSrcAlpha;
  143. currentBlendDstAlpha = blendDstAlpha;
  144. }
  145. } else {
  146. currentBlendEquation = null;
  147. currentBlendSrc = null;
  148. currentBlendDst = null;
  149. currentBlendEquationAlpha = null;
  150. currentBlendSrcAlpha = null;
  151. currentBlendDstAlpha = null;
  152. }
  153. };
  154. this.setDepthFunc = function ( depthFunc ) {
  155. if ( currentDepthFunc !== depthFunc ) {
  156. if ( depthFunc ) {
  157. switch ( depthFunc ) {
  158. case THREE.NeverDepth:
  159. gl.depthFunc( gl.NEVER );
  160. break;
  161. case THREE.AlwaysDepth:
  162. gl.depthFunc( gl.ALWAYS );
  163. break;
  164. case THREE.LessDepth:
  165. gl.depthFunc( gl.LESS );
  166. break;
  167. case THREE.LessEqualDepth:
  168. gl.depthFunc( gl.LEQUAL );
  169. break;
  170. case THREE.EqualDepth:
  171. gl.depthFunc( gl.EQUAL );
  172. break;
  173. case THREE.GreaterEqualDepth:
  174. gl.depthFunc( gl.GEQUAL );
  175. break;
  176. case THREE.GreaterDepth:
  177. gl.depthFunc( gl.GREATER );
  178. break;
  179. case THREE.NotEqualDepth:
  180. gl.depthFunc( gl.NOTEQUAL );
  181. break;
  182. default:
  183. gl.depthFunc( gl.LEQUAL );
  184. }
  185. } else {
  186. gl.depthFunc( gl.LEQUAL );
  187. }
  188. currentDepthFunc = depthFunc;
  189. }
  190. };
  191. this.setDepthTest = function ( depthTest ) {
  192. if ( depthTest ) {
  193. this.enable( gl.DEPTH_TEST );
  194. } else {
  195. this.disable( gl.DEPTH_TEST );
  196. }
  197. };
  198. this.setDepthWrite = function ( depthWrite ) {
  199. if ( currentDepthWrite !== depthWrite ) {
  200. gl.depthMask( depthWrite );
  201. currentDepthWrite = depthWrite;
  202. }
  203. };
  204. this.setColorWrite = function ( colorWrite ) {
  205. if ( currentColorWrite !== colorWrite ) {
  206. gl.colorMask( colorWrite, colorWrite, colorWrite, colorWrite );
  207. currentColorWrite = colorWrite;
  208. }
  209. };
  210. this.setFlipSided = function ( flipSided ) {
  211. if ( currentFlipSided !== flipSided ) {
  212. if ( flipSided ) {
  213. gl.frontFace( gl.CW );
  214. } else {
  215. gl.frontFace( gl.CCW );
  216. }
  217. currentFlipSided = flipSided;
  218. }
  219. };
  220. this.setLineWidth = function ( width ) {
  221. if ( width !== currentLineWidth ) {
  222. gl.lineWidth( width );
  223. currentLineWidth = width;
  224. }
  225. };
  226. this.setPolygonOffset = function ( polygonOffset, factor, units ) {
  227. if ( polygonOffset ) {
  228. this.enable( gl.POLYGON_OFFSET_FILL );
  229. } else {
  230. this.disable( gl.POLYGON_OFFSET_FILL );
  231. }
  232. if ( polygonOffset && ( currentPolygonOffsetFactor !== factor || currentPolygonOffsetUnits !== units ) ) {
  233. gl.polygonOffset( factor, units );
  234. currentPolygonOffsetFactor = factor;
  235. currentPolygonOffsetUnits = units;
  236. }
  237. };
  238. this.setScissorTest = function ( scissorTest ) {
  239. if ( scissorTest ) {
  240. this.enable( gl.SCISSOR_TEST );
  241. } else {
  242. this.disable( gl.SCISSOR_TEST );
  243. }
  244. };
  245. // texture
  246. this.activeTexture = function ( webglSlot ) {
  247. if ( webglSlot === undefined ) webglSlot = gl.TEXTURE0 + maxTextures - 1;
  248. if ( currentTextureSlot !== webglSlot ) {
  249. gl.activeTexture( webglSlot );
  250. currentTextureSlot = webglSlot;
  251. }
  252. }
  253. this.bindTexture = function ( webglType, webglTexture ) {
  254. if ( currentTextureSlot === undefined ) {
  255. _this.activeTexture();
  256. }
  257. var boundTexture = currentBoundTextures[ currentTextureSlot ];
  258. if ( boundTexture === undefined ) {
  259. boundTexture = { type: undefined, texture: undefined };
  260. currentBoundTextures[ currentTextureSlot ] = boundTexture;
  261. }
  262. if ( boundTexture.type !== webglType || boundTexture.texture !== webglTexture ) {
  263. gl.bindTexture( webglType, webglTexture );
  264. boundTexture.type = webglType;
  265. boundTexture.texture = webglTexture;
  266. }
  267. };
  268. this.compressedTexImage2D = function () {
  269. try {
  270. gl.compressedTexImage2D.apply( gl, arguments );
  271. } catch ( error ) {
  272. console.error( error );
  273. }
  274. };
  275. this.texImage2D = function () {
  276. try {
  277. gl.texImage2D.apply( gl, arguments );
  278. } catch ( error ) {
  279. console.error( error );
  280. }
  281. };
  282. //
  283. this.reset = function () {
  284. for ( var i = 0; i < enabledAttributes.length; i ++ ) {
  285. if ( enabledAttributes[ i ] === 1 ) {
  286. gl.disableVertexAttribArray( i );
  287. enabledAttributes[ i ] = 0;
  288. }
  289. }
  290. capabilities = {};
  291. compressedTextureFormats = null;
  292. currentBlending = null;
  293. currentDepthWrite = null;
  294. currentColorWrite = null;
  295. currentFlipSided = null;
  296. };
  297. };