MoonShot (OpenGL ES 2.0 / WebGL Demo)

The "MoonShot" demo application shows an interactive flight over a synthetic moon surface. You can change the speed and direction of the spacecraft in order to avoid a collision with one of the stone bricks...
The surface of the moon is created by a procedural terrain generation. The currently visible area consists of an array of sectors with terrain height values. When the spacecraft leaves one sector a new row of terrain data is created. A similar techique is used for creating the flying stone bricks. They are created by using spheres where the radius of each vertex is modulated by a height map. Creating the surface sectors and creating the stone wireframe model is done by the CPU.
The vertex shader is responsible for calculating the current position, the lighting and the fog. The fog is used to darken the terrain sectors and stones which are too far away from the current viewing postion.
Finally, the fragment shader program is doing the texture mapping and lighting of the fragments.

Navigation: Press 'I' to increase the speed, press 'D' to decrease the speed, press 'L' to fly to the left or press 'R' to fly to the right. Alternatively, you can just click with the mouse and move down/up to accelerate/decelerate or left/right to fly into the corresponding direction. If you want to see the wireframe model press 'Space'.

Console output: