ToonShader.js 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335
  1. ( function () {
  2. /**
  3. * Currently contains:
  4. *
  5. * toon1
  6. * toon2
  7. * hatching
  8. * dotted
  9. */
  10. const ToonShader1 = {
  11. uniforms: {
  12. 'uDirLightPos': {
  13. value: new THREE.Vector3()
  14. },
  15. 'uDirLightColor': {
  16. value: new THREE.Color( 0xeeeeee )
  17. },
  18. 'uAmbientLightColor': {
  19. value: new THREE.Color( 0x050505 )
  20. },
  21. 'uBaseColor': {
  22. value: new THREE.Color( 0xffffff )
  23. }
  24. },
  25. vertexShader: /* glsl */`
  26. varying vec3 vNormal;
  27. varying vec3 vRefract;
  28. void main() {
  29. vec4 worldPosition = modelMatrix * vec4( position, 1.0 );
  30. vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
  31. vec3 worldNormal = normalize ( mat3( modelMatrix[0].xyz, modelMatrix[1].xyz, modelMatrix[2].xyz ) * normal );
  32. vNormal = normalize( normalMatrix * normal );
  33. vec3 I = worldPosition.xyz - cameraPosition;
  34. vRefract = refract( normalize( I ), worldNormal, 1.02 );
  35. gl_Position = projectionMatrix * mvPosition;
  36. }`,
  37. fragmentShader: /* glsl */`
  38. uniform vec3 uBaseColor;
  39. uniform vec3 uDirLightPos;
  40. uniform vec3 uDirLightColor;
  41. uniform vec3 uAmbientLightColor;
  42. varying vec3 vNormal;
  43. varying vec3 vRefract;
  44. void main() {
  45. float directionalLightWeighting = max( dot( normalize( vNormal ), uDirLightPos ), 0.0);
  46. vec3 lightWeighting = uAmbientLightColor + uDirLightColor * directionalLightWeighting;
  47. float intensity = smoothstep( - 0.5, 1.0, pow( length(lightWeighting), 20.0 ) );
  48. intensity += length(lightWeighting) * 0.2;
  49. float cameraWeighting = dot( normalize( vNormal ), vRefract );
  50. intensity += pow( 1.0 - length( cameraWeighting ), 6.0 );
  51. intensity = intensity * 0.2 + 0.3;
  52. if ( intensity < 0.50 ) {
  53. gl_FragColor = vec4( 2.0 * intensity * uBaseColor, 1.0 );
  54. } else {
  55. gl_FragColor = vec4( 1.0 - 2.0 * ( 1.0 - intensity ) * ( 1.0 - uBaseColor ), 1.0 );
  56. }
  57. }`
  58. };
  59. const ToonShader2 = {
  60. uniforms: {
  61. 'uDirLightPos': {
  62. value: new THREE.Vector3()
  63. },
  64. 'uDirLightColor': {
  65. value: new THREE.Color( 0xeeeeee )
  66. },
  67. 'uAmbientLightColor': {
  68. value: new THREE.Color( 0x050505 )
  69. },
  70. 'uBaseColor': {
  71. value: new THREE.Color( 0xeeeeee )
  72. },
  73. 'uLineColor1': {
  74. value: new THREE.Color( 0x808080 )
  75. },
  76. 'uLineColor2': {
  77. value: new THREE.Color( 0x000000 )
  78. },
  79. 'uLineColor3': {
  80. value: new THREE.Color( 0x000000 )
  81. },
  82. 'uLineColor4': {
  83. value: new THREE.Color( 0x000000 )
  84. }
  85. },
  86. vertexShader: /* glsl */`
  87. varying vec3 vNormal;
  88. void main() {
  89. gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
  90. vNormal = normalize( normalMatrix * normal );
  91. }`,
  92. fragmentShader: /* glsl */`
  93. uniform vec3 uBaseColor;
  94. uniform vec3 uLineColor1;
  95. uniform vec3 uLineColor2;
  96. uniform vec3 uLineColor3;
  97. uniform vec3 uLineColor4;
  98. uniform vec3 uDirLightPos;
  99. uniform vec3 uDirLightColor;
  100. uniform vec3 uAmbientLightColor;
  101. varying vec3 vNormal;
  102. void main() {
  103. float camera = max( dot( normalize( vNormal ), vec3( 0.0, 0.0, 1.0 ) ), 0.4);
  104. float light = max( dot( normalize( vNormal ), uDirLightPos ), 0.0);
  105. gl_FragColor = vec4( uBaseColor, 1.0 );
  106. if ( length(uAmbientLightColor + uDirLightColor * light) < 1.00 ) {
  107. gl_FragColor *= vec4( uLineColor1, 1.0 );
  108. }
  109. if ( length(uAmbientLightColor + uDirLightColor * camera) < 0.50 ) {
  110. gl_FragColor *= vec4( uLineColor2, 1.0 );
  111. }
  112. }`
  113. };
  114. const ToonShaderHatching = {
  115. uniforms: {
  116. 'uDirLightPos': {
  117. value: new THREE.Vector3()
  118. },
  119. 'uDirLightColor': {
  120. value: new THREE.Color( 0xeeeeee )
  121. },
  122. 'uAmbientLightColor': {
  123. value: new THREE.Color( 0x050505 )
  124. },
  125. 'uBaseColor': {
  126. value: new THREE.Color( 0xffffff )
  127. },
  128. 'uLineColor1': {
  129. value: new THREE.Color( 0x000000 )
  130. },
  131. 'uLineColor2': {
  132. value: new THREE.Color( 0x000000 )
  133. },
  134. 'uLineColor3': {
  135. value: new THREE.Color( 0x000000 )
  136. },
  137. 'uLineColor4': {
  138. value: new THREE.Color( 0x000000 )
  139. }
  140. },
  141. vertexShader: /* glsl */`
  142. varying vec3 vNormal;
  143. void main() {
  144. gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
  145. vNormal = normalize( normalMatrix * normal );
  146. }`,
  147. fragmentShader: /* glsl */`
  148. uniform vec3 uBaseColor;
  149. uniform vec3 uLineColor1;
  150. uniform vec3 uLineColor2;
  151. uniform vec3 uLineColor3;
  152. uniform vec3 uLineColor4;
  153. uniform vec3 uDirLightPos;
  154. uniform vec3 uDirLightColor;
  155. uniform vec3 uAmbientLightColor;
  156. varying vec3 vNormal;
  157. void main() {
  158. float directionalLightWeighting = max( dot( normalize(vNormal), uDirLightPos ), 0.0);
  159. vec3 lightWeighting = uAmbientLightColor + uDirLightColor * directionalLightWeighting;
  160. gl_FragColor = vec4( uBaseColor, 1.0 );
  161. if ( length(lightWeighting) < 1.00 ) {
  162. if ( mod(gl_FragCoord.x + gl_FragCoord.y, 10.0) == 0.0) {
  163. gl_FragColor = vec4( uLineColor1, 1.0 );
  164. }
  165. }
  166. if ( length(lightWeighting) < 0.75 ) {
  167. if (mod(gl_FragCoord.x - gl_FragCoord.y, 10.0) == 0.0) {
  168. gl_FragColor = vec4( uLineColor2, 1.0 );
  169. }
  170. }
  171. if ( length(lightWeighting) < 0.50 ) {
  172. if (mod(gl_FragCoord.x + gl_FragCoord.y - 5.0, 10.0) == 0.0) {
  173. gl_FragColor = vec4( uLineColor3, 1.0 );
  174. }
  175. }
  176. if ( length(lightWeighting) < 0.3465 ) {
  177. if (mod(gl_FragCoord.x - gl_FragCoord.y - 5.0, 10.0) == 0.0) {
  178. gl_FragColor = vec4( uLineColor4, 1.0 );
  179. }
  180. }
  181. }`
  182. };
  183. const ToonShaderDotted = {
  184. uniforms: {
  185. 'uDirLightPos': {
  186. value: new THREE.Vector3()
  187. },
  188. 'uDirLightColor': {
  189. value: new THREE.Color( 0xeeeeee )
  190. },
  191. 'uAmbientLightColor': {
  192. value: new THREE.Color( 0x050505 )
  193. },
  194. 'uBaseColor': {
  195. value: new THREE.Color( 0xffffff )
  196. },
  197. 'uLineColor1': {
  198. value: new THREE.Color( 0x000000 )
  199. }
  200. },
  201. vertexShader: /* glsl */`
  202. varying vec3 vNormal;
  203. void main() {
  204. gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
  205. vNormal = normalize( normalMatrix * normal );
  206. }`,
  207. fragmentShader: /* glsl */`
  208. uniform vec3 uBaseColor;
  209. uniform vec3 uLineColor1;
  210. uniform vec3 uLineColor2;
  211. uniform vec3 uLineColor3;
  212. uniform vec3 uLineColor4;
  213. uniform vec3 uDirLightPos;
  214. uniform vec3 uDirLightColor;
  215. uniform vec3 uAmbientLightColor;
  216. varying vec3 vNormal;
  217. void main() {
  218. float directionalLightWeighting = max( dot( normalize(vNormal), uDirLightPos ), 0.0);
  219. vec3 lightWeighting = uAmbientLightColor + uDirLightColor * directionalLightWeighting;
  220. gl_FragColor = vec4( uBaseColor, 1.0 );
  221. if ( length(lightWeighting) < 1.00 ) {
  222. if ( ( mod(gl_FragCoord.x, 4.001) + mod(gl_FragCoord.y, 4.0) ) > 6.00 ) {
  223. gl_FragColor = vec4( uLineColor1, 1.0 );
  224. }
  225. }
  226. if ( length(lightWeighting) < 0.50 ) {
  227. if ( ( mod(gl_FragCoord.x + 2.0, 4.001) + mod(gl_FragCoord.y + 2.0, 4.0) ) > 6.00 ) {
  228. gl_FragColor = vec4( uLineColor1, 1.0 );
  229. }
  230. }
  231. }`
  232. };
  233. THREE.ToonShader1 = ToonShader1;
  234. THREE.ToonShader2 = ToonShader2;
  235. THREE.ToonShaderDotted = ToonShaderDotted;
  236. THREE.ToonShaderHatching = ToonShaderHatching;
  237. } )();