In this MP you will
This MP is elective, with no core components. It assumes you have already completed the Flight MP.
You will submit a webpage that has
Submit an HTML file and any number of js, glsl, json, css, and image files. Do not include spaces in file names as the submission server does not process them well.
You are welcome to use a JavaScript math library, such as the one used in in-class examples or others you might know.
This MP is an extension of the Flight MP; it should have all the inputs, algorithms, and operations of that MP.
Have the background be white or a pale off-white color. Use that same color for the fog.
Have fog that falls off with an exponential fall-off: v = e^{-fd} where v is how visible objects are, f is a fogginess parameter and d is distance between camera and fragment.
For the common projection matrix, d can
be approximated as 1 / gl_FragCoord.w
.
Initially the fog density parameter should be chosen such that some
terrain is visible but the presence of fog is obvious.
Fog should be applied after lighting. Compute the full lit color and mix that with the fog color based on the computed visibility parameter.
In your keydown
listener add handling a few keys:
g
should decrease fog density by a factor of ×0.8 each
time it is pressedh
should increase fog density by a factor of ×1.25 each
time it is pressedf
should toggle fog on and off without forgetting the
previous fog density when it is toggled off (that fog level will be used
again when the fg is toggled back on)Keep all of the previous key responses from Flight too.
On both your development machine and when submitted to the submission server and then viewed by clicking the HTML link, the resulting page should show a random terrain with visible fog. Holding down the WASD and arrow keys should fly around the terrain, with perceived fogginess decreasing as terrain is approached. Typing the FGH keys should change fog presence and density. One example might be the following: