WebGLState.js 9.5 KB

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