1 export const vertexShader = ` 2 precision highp float; 3 4 attribute vec3 position; 5 attribute vec2 uv; 6 7 uniform mat4 modelMatrix; // Matriz de transformación del objeto 8 uniform mat4 viewMatrix; // Matriz de transformación de la cámara 9 uniform mat4 projectionMatrix; // Matriz de proyección de la cámara 10 11 varying vec2 vUv; 12 13 void main() { 14 vec3 pos = position; 15 gl_Position = projectionMatrix*viewMatrix*modelMatrix* vec4(pos, 1.0); 16 vUv = uv; 17 }`; 18 19 export const fragmentShader = ` 20 precision mediump float; 21 22 uniform float scale1; 23 uniform float mask1low; 24 uniform float mask1high; 25 uniform float mask2low; 26 uniform float mask2high; 27 uniform sampler2D tierraSampler; 28 uniform sampler2D rocaSampler; 29 uniform sampler2D pastoSampler; 30 31 varying vec2 vUv; 32 33 // Perlin Noise 34 vec3 mod289(vec3 x){ 35 return x - floor(x * (1.0 / 289.0)) * 289.0; 36 } 37 38 vec4 mod289(vec4 x){ 39 return x - floor(x * (1.0 / 289.0)) * 289.0; 40 } 41 42 vec4 permute(vec4 x){ 43 return mod289(((x * 34.0) + 1.0) * x); 44 } 45 46 vec4 taylorInvSqrt(vec4 r){ 47 return 1.79284291400159 - 0.85373472095314 * r; 48 } 49 50 vec3 fade(vec3 t) { 51 return t * t * t * (t * (t * 6.0 - 15.0) + 10.0); 52 } 53 54 // Classic Perlin noise 55 float cnoise(vec3 P){ 56 vec3 Pi0 = floor(P); 57 vec3 Pi1 = Pi0 + vec3(1.0); 58 Pi0 = mod289(Pi0); 59 Pi1 = mod289(Pi1); 60 vec3 Pf0 = fract(P); 61 vec3 Pf1 = Pf0 - vec3(1.0); 62 vec4 ix = vec4(Pi0.x, Pi1.x, Pi0.x, Pi1.x); 63 vec4 iy = vec4(Pi0.yy, Pi1.yy); 64 vec4 iz0 = Pi0.zzzz; 65 vec4 iz1 = Pi1.zzzz; 66 67 vec4 ixy = permute(permute(ix) + iy); 68 vec4 ixy0 = permute(ixy + iz0); 69 vec4 ixy1 = permute(ixy + iz1); 70 71 vec4 gx0 = ixy0 * (1.0 / 7.0); 72 vec4 gy0 = fract(floor(gx0) * (1.0 / 7.0)) - 0.5; 73 gx0 = fract(gx0); 74 vec4 gz0 = vec4(0.5) - abs(gx0) - abs(gy0); 75 vec4 sz0 = step(gz0, vec4(0.0)); 76 gx0 -= sz0 * (step(0.0, gx0) - 0.5); 77 gy0 -= sz0 * (step(0.0, gy0) - 0.5); 78 79 vec4 gx1 = ixy1 * (1.0 / 7.0); 80 vec4 gy1 = fract(floor(gx1) * (1.0 / 7.0)) - 0.5; 81 gx1 = fract(gx1); 82 vec4 gz1 = vec4(0.5) - abs(gx1) - abs(gy1); 83 vec4 sz1 = step(gz1, vec4(0.0)); 84 gx1 -= sz1 * (step(0.0, gx1) - 0.5); 85 gy1 -= sz1 * (step(0.0, gy1) - 0.5); 86 87 vec3 g000 = vec3(gx0.x, gy0.x, gz0.x); 88 vec3 g100 = vec3(gx0.y, gy0.y, gz0.y); 89 vec3 g010 = vec3(gx0.z, gy0.z, gz0.z); 90 vec3 g110 = vec3(gx0.w, gy0.w, gz0.w); 91 vec3 g001 = vec3(gx1.x, gy1.x, gz1.x); 92 vec3 g101 = vec3(gx1.y, gy1.y, gz1.y); 93 vec3 g011 = vec3(gx1.z, gy1.z, gz1.z); 94 vec3 g111 = vec3(gx1.w, gy1.w, gz1.w); 95 96 vec4 norm0 = taylorInvSqrt(vec4(dot(g000, g000), 97 dot(g010, g010), 98 dot(g100, g100), 99 dot(g110, g110))); 100 g000 *= norm0.x; 101 g010 *= norm0.y; 102 g100 *= norm0.z; 103 g110 *= norm0.w; 104 vec4 norm1 = taylorInvSqrt(vec4(dot(g001, g001), 105 dot(g011, g011), 106 dot(g101, g101), 107 dot(g111, g111))); 108 g001 *= norm1.x; 109 g011 *= norm1.y; 110 g101 *= norm1.z; 111 g111 *= norm1.w; 112 113 float n000 = dot(g000, Pf0); 114 float n100 = dot(g100, vec3(Pf1.x, Pf0.yz)); 115 float n010 = dot(g010, vec3(Pf0.x, Pf1.y, Pf0.z)); 116 float n110 = dot(g110, vec3(Pf1.xy, Pf0.z)); 117 float n001 = dot(g001, vec3(Pf0.xy, Pf1.z)); 118 float n101 = dot(g101, vec3(Pf1.x, Pf0.y, Pf1.z)); 119 float n011 = dot(g011, vec3(Pf0.x, Pf1.yz)); 120 float n111 = dot(g111, Pf1); 121 122 vec3 fade_xyz = fade(Pf0); 123 vec4 n_z = mix(vec4(n000, n100, n010, n110), 124 vec4(n001, n101, n011, n111), 125 fade_xyz.z); 126 127 vec2 n_yz = mix(n_z.xy, n_z.zw, fade_xyz.y); 128 float n_xyz = mix(n_yz.x, n_yz.y, fade_xyz.x); 129 return 2.2 * n_xyz; 130 } 131 132 void main(void) { 133 vec2 uv2=vUv*scale1; 134 135 // se mezcla la textura 'pasto' a diferentes escalas 136 vec3 pasto1 = texture2D(pastoSampler, uv2 * 1.0).xyz; 137 vec3 pasto2 = texture2D(pastoSampler, uv2 * 3.13).xyz; 138 vec3 pasto3 = texture2D(pastoSampler, uv2 * 2.37).xyz; 139 vec3 colorPasto = mix(mix(pasto1, pasto2, 0.5), pasto3, 0.3); 140 141 // lo mismo para la textura 'tierra' 142 vec3 tierra1 = texture2D(tierraSampler, uv2*3.77).xyz; 143 vec3 tierra2 = texture2D(tierraSampler, uv2*1.58).xyz; 144 vec3 colorTierra = mix(tierra1, tierra2, 0.5); 145 146 // lo mismo para la textura 'roca' 147 vec3 roca1 = texture2D(rocaSampler, uv2).xyz; 148 vec3 roca2 = texture2D(rocaSampler, uv2*2.38).xyz; 149 vec3 colorRoca = mix(roca1, roca2, 0.5); 150 151 float noise1 = cnoise(uv2.xyx*8.23+23.11); 152 float noise2 = cnoise(uv2.xyx*11.77+9.45); 153 float noise3 = cnoise(uv2.xyx*14.8+21.2); 154 float mask1 = mix(mix(noise1, noise2, 0.5), noise3, 0.3); 155 mask1 = smoothstep(mask1low, mask1high, mask1); 156 157 float noise4 = cnoise(uv2.xyx*8.23*scale1); 158 float noise5 = cnoise(uv2.xyx*11.77*scale1); 159 float noise6 = cnoise(uv2.xyx*14.8*scale1); 160 float mask2 = mix(mix(noise4, noise5, 0.5), noise6, 0.3); 161 mask2 = smoothstep(mask2low, mask2high, mask2); 162 vec3 colorTierraRoca = mix(colorTierra, colorRoca, mask1); 163 vec3 color = mix(colorPasto, colorTierraRoca, mask2); 164 165 gl_FragColor = vec4(color, 1.0); 166 }`;
