mirror of
https://gitlab.com/freepascal.org/fpc/pas2js.git
synced 2025-07-10 06:35:51 +02:00
95 lines
3.0 KiB
HTML
95 lines
3.0 KiB
HTML
<html>
|
|
<head>
|
|
<meta charset="utf-8"/>
|
|
<script type="application/javascript" src="../Pas2JS_WebGL_Terrain.js"></script>
|
|
</head>
|
|
<body>
|
|
<pre id="debug-console"></pre>
|
|
|
|
<script type="application/glsl" id="vertex.glsl">
|
|
attribute vec3 in_position;
|
|
attribute vec2 in_texCoord;
|
|
attribute vec3 in_normal;
|
|
|
|
uniform mat4 projTransform;
|
|
uniform mat4 viewTransform;
|
|
uniform mat4 modelTransform;
|
|
uniform mat4 inverseViewTransform;
|
|
|
|
uniform vec3 lightPosition;
|
|
|
|
varying vec3 toLight;
|
|
varying vec3 surfaceNormal;
|
|
varying vec3 toCamera;
|
|
varying vec2 vertexTexCoord;
|
|
varying float visibility;
|
|
|
|
// constants
|
|
const float density = 0.02;
|
|
const float gradient = 1.5;
|
|
|
|
void main() {
|
|
vec4 worldPosition = modelTransform * vec4(in_position, 1);
|
|
vec4 positionRelativeToCamera = viewTransform * worldPosition;
|
|
gl_Position = projTransform * viewTransform * worldPosition;
|
|
surfaceNormal = (modelTransform * vec4(in_normal, 0)).xyz;
|
|
toLight = lightPosition - worldPosition.xyz;
|
|
toCamera = (inverseViewTransform * vec4(0, 0, 0, 1)).xyz - worldPosition.xyz;
|
|
vertexTexCoord = in_texCoord;
|
|
|
|
// fog
|
|
// TODO: make this relative to some actual distance in glcoords
|
|
float dist = length(positionRelativeToCamera.xyz) / 6.0;
|
|
visibility = exp(-pow((dist * density), gradient));
|
|
visibility = clamp(visibility, 0.0, 1.0);
|
|
}
|
|
</script>
|
|
<script type="application/glsl" id="fragment.glsl">
|
|
precision mediump float;
|
|
|
|
uniform vec3 lightColor;
|
|
uniform float shineDamper;
|
|
uniform float reflectivity;
|
|
|
|
uniform sampler2D sampler;
|
|
|
|
varying vec3 toLight;
|
|
varying vec3 surfaceNormal;
|
|
varying vec3 toCamera;
|
|
varying vec2 vertexTexCoord;
|
|
varying float visibility;
|
|
|
|
const vec3 skyColor = vec3(0.9, 0.9, 0.9);
|
|
const float ambientLight = 0.3;
|
|
|
|
void main() {
|
|
|
|
vec3 unitToLight = normalize(toLight);
|
|
vec3 unitSurfaceNormal = normalize(surfaceNormal);
|
|
|
|
float brightness = dot(unitToLight, unitSurfaceNormal);
|
|
brightness = max(brightness, 0.0);
|
|
vec3 diffuseLight = lightColor * brightness;
|
|
diffuseLight = max(diffuseLight, ambientLight);
|
|
|
|
vec3 lightDirection = -unitToLight;
|
|
vec3 reflectedDirection = reflect(lightDirection, unitSurfaceNormal);
|
|
float specular = dot(reflectedDirection, normalize(toCamera));
|
|
specular = max(specular, 0.0);
|
|
float damper = pow(specular, shineDamper);
|
|
vec3 specularColor = damper * reflectivity * lightColor;
|
|
|
|
// add color and light
|
|
vec4 diffuseColor = texture2D(sampler, vertexTexCoord);
|
|
vec4 finalColor = vec4(diffuseLight, 1) * diffuseColor + vec4(specularColor, 1);
|
|
|
|
finalColor = mix(vec4(skyColor, 1.0), finalColor, visibility);
|
|
|
|
gl_FragColor = finalColor;
|
|
}
|
|
</script>
|
|
<script type="application/javascript">
|
|
rtl.run();
|
|
</script>
|
|
</body>
|
|
</html> |