Finish up slice viewer functionality

res/shaders/block_vertex.vs

@@ -6,14 +6,13 @@ uniform float u_voxelSize;
 uniform vec3 u_gridOffset;
 uniform bool u_nightVision;
 uniform float u_sliceHeight;
-uniform vec3 u_boundsMin;
-uniform vec3 u_boundsMax;
 
 attribute vec3 position;
 attribute vec3 normal;
 attribute vec4 occlusion;
 attribute vec2 texcoord;
 attribute vec2 blockTexcoord;
+attribute vec3 blockPosition;
 attribute float lighting;
 
 varying float v_lighting;
@@ -32,12 +31,22 @@ void main() {
     v_lighting = dot(light, abs(normal));
     v_blockLighting = lighting;
 
-    if(u_sliceHeight > 0.0 && (position.y + u_gridOffset.y) >= (u_sliceHeight + u_boundsMin.y))
+    v_sliced = blockPosition.y > u_sliceHeight ? 1.0 : 0.0;
+
+    // Disable ambient occlusion on the top layer of the slice view
+    bool isBlockOnTopLayer = (v_sliced < 0.5 && abs(blockPosition.y - u_sliceHeight) < 0.5);
+    if (isBlockOnTopLayer)
     {
-        v_sliced = 1.0;
-    } else {
-        v_sliced = 0.0;
+
+        if (normal.y > 0.5)
+        {
+            v_occlusion = vec4(1.0, 1.0, 1.0, 1.0);
+        }
+        else if (normal.x > 0.5 || normal.z > 0.5 || normal.x < -0.5 || normal.z < -0.5)
+        {
+            v_occlusion = vec4(1.0, v_occlusion.y, 1.0, v_occlusion.w);
+        }
     }
 
-    gl_Position = u_worldViewProjection * vec4((position.xyz + u_gridOffset) * u_voxelSize, 1.0);
+    gl_Position = u_worldViewProjection * vec4((position + u_gridOffset) * u_voxelSize, 1.0);
 }

src/buffer.ts

@@ -46,6 +46,7 @@ export type TBlockMeshBuffer = {
     texcoord: { numComponents: 2, data: Float32Array },
     normal: { numComponents: 3, data: Float32Array },
     blockTexcoord: { numComponents: 2, data: Float32Array },
+    blockPosition: { numComponents: 3, data: Float32Array, },
     lighting: { numComponents: 1, data: Float32Array },
     indices: { numComponents: 3, data: Uint32Array },
 };
@@ -164,6 +165,11 @@ export class ChunkedBufferGenerator {
                     newBuffer.lighting.data[lightingInsertIndex++] = faceLighting;
                 }
             }
+
+            const blockPosition = blocks[blockIndex].voxel.position.toArray();
+            for (let j = 0; j < AppConstants.VoxelMeshBufferComponentOffsets.POSITION; ++j) {
+                newBuffer.blockPosition.data[i * AppConstants.VoxelMeshBufferComponentOffsets.POSITION + j] = blockPosition[j % 3];
+            }
         }
 
         return {
@@ -422,6 +428,10 @@ export class BufferGenerator {
                 numComponents: AppConstants.ComponentSize.TEXCOORD,
                 data: new Float32Array(numBlocks * AppConstants.VoxelMeshBufferComponentOffsets.TEXCOORD),
             },
+            blockPosition: {
+                numComponents: AppConstants.ComponentSize.POSITION,
+                data: new Float32Array(numBlocks * AppConstants.VoxelMeshBufferComponentOffsets.POSITION),
+            },
             lighting: {
                 numComponents: AppConstants.ComponentSize.LIGHTING,
                 data: new Float32Array(numBlocks * AppConstants.VoxelMeshBufferComponentOffsets.LIGHTING),

src/camera.ts

@@ -15,7 +15,6 @@ export class ArcballCamera {
     private _zNear: number;
     private _zFar: number;
     private _aspect: number;
-    private _sliceHeight: number;
 
     private _distance: SmoothVariable;// = new SmoothVariable(this._defaultDistance, 0.025);
     private _azimuth: SmoothVariable;// = new SmoothVariable(this._defaultAzimuth, 0.025);
@@ -48,7 +47,6 @@ export class ArcballCamera {
         this._azimuth = new SmoothVariable(AppConfig.Get.CAMERA_DEFAULT_AZIMUTH_RADIANS, AppConfig.Get.CAMERA_SMOOTHING);
         this._elevation = new SmoothVariable(AppConfig.Get.CAMERA_DEFAULT_ELEVATION_RADIANS, AppConfig.Get.CAMERA_SMOOTHING);
         this._target = new SmoothVectorVariable(new Vector3(0, 0, 0), AppConfig.Get.CAMERA_SMOOTHING);
-        this._sliceHeight = 0;
 
         this._elevation.setClamp(0.001, Math.PI - 0.001);
         this._distance.setClamp(1.0, 100.0);
@@ -82,14 +80,6 @@ export class ArcballCamera {
         this._isPerspective = mode === 'perspective';
     }
 
-    public setSliceHeight(sliceHeight: number) {
-        this._sliceHeight = sliceHeight;
-    }
-
-    public getSliceHeight(): number {
-        return this._sliceHeight;
-    }
-
     private _angleSnap = false;
     public toggleAngleSnap() {
         this._angleSnap = !this._angleSnap;

src/renderer.ts

@@ -1,16 +1,15 @@
-import { Bounds } from './bounds';
 import * as twgl from 'twgl.js';
 
+import { Bounds } from './bounds';
 import { ArcballCamera } from './camera';
 import { RGBA, RGBAUtil } from './colour';
 import { AppConfig } from './config';
 import { DebugGeometryTemplates } from './geometry';
 import { MaterialType, SolidMaterial, TexturedMaterial } from './mesh';
 import { RenderBuffer } from './render_buffer';
 import { ShaderManager } from './shaders';
-import { EImageChannel, Texture } from './texture';
+import { EImageChannel } from './texture';
 import { ASSERT } from './util/error_util';
-import { LOG } from './util/log_util';
 import { Vector3 } from './vector';
 import { RenderMeshParams, RenderNextBlockMeshChunkParams, RenderNextVoxelMeshChunkParams } from './worker_types';
 
@@ -64,6 +63,7 @@ export class Renderer {
     private _meshToUse: MeshType = MeshType.None;
     private _voxelSize: number = 1.0;
     private _gridOffset: Vector3 = new Vector3(0, 0, 0);
+    private _sliceHeight: number = 0.0;
 
     private _modelsAvailable: number;
 
@@ -75,13 +75,14 @@ export class Renderer {
     }>;
     public _voxelBuffer?: twgl.BufferInfo[];
     private _blockBuffer?: twgl.BufferInfo[];
-    private _blockBounds: Bounds = new Bounds(new Vector3(0, 0, 0), new Vector3(0, 0, 0));
+    private _blockBounds: Bounds;
     private _debugBuffers: { [meshType: string]: { [bufferComponent: string]: RenderBuffer } };
     private _axisBuffer: RenderBuffer;
 
     private _isGridComponentEnabled: { [bufferComponent: string]: boolean };
     private _axesEnabled: boolean;
     private _nightVisionEnabled: boolean;
+    private _sliceViewEnabled: boolean;
 
     private _gridBuffers: {
         x: { [meshType: string]: RenderBuffer };
@@ -118,6 +119,9 @@ export class Renderer {
         this._isGridComponentEnabled = {};
         this._axesEnabled = false;
         this._nightVisionEnabled = true;
+        this._sliceViewEnabled = false;
+
+        this._blockBounds = new Bounds(new Vector3(0, 0, 0), new Vector3(0, 0, 0));
 
         this._axisBuffer = new RenderBuffer([
             { name: 'position', numComponents: 3 },
@@ -152,6 +156,34 @@ export class Renderer {
 
     // /////////////////////////////////////////////////////////////////////////
 
+    public isSliceViewerEnabled() {
+        return this._sliceViewEnabled;
+    }
+
+    public toggleSliceViewerEnabled() {
+        this._sliceViewEnabled = !this._sliceViewEnabled;
+    }
+
+    public canIncrementSliceHeight() {
+        return this._blockBounds.max.y > this._sliceHeight;
+    }
+
+    public canDecrementSliceHeight() {
+        return this._blockBounds.min.y < this._sliceHeight;
+    }
+
+    public incrementSliceHeight() {
+        if (this.canIncrementSliceHeight()) {
+            ++this._sliceHeight;
+        }
+    }
+
+    public decrementSliceHeight() {
+        if (this.canDecrementSliceHeight()) {
+            --this._sliceHeight;
+        }
+    }
+
     private _lightingAvailable: boolean = false;
     public setLightingAvailable(isAvailable: boolean) {
         this._lightingAvailable = isAvailable;
@@ -355,13 +387,8 @@ export class Renderer {
         if (params.isFirstChunk) {
             this._blockBuffer = [];
 
-            const min = new Vector3(0, 0, 0);
-            min.setFrom(params.bounds['_min']);
-
-            const max = new Vector3(0, 0, 0);
-            max.setFrom(params.bounds['_max']);
-
-            this._blockBounds = new Bounds(min, max);
+            this._sliceHeight = params.bounds.min.y;
+            this._blockBounds = params.bounds;
         }
 
         this._blockBuffer?.push(twgl.createBufferInfoFromArrays(this._gl, params.buffer.buffer));
@@ -496,9 +523,7 @@ export class Renderer {
             u_atlasSize: this._atlasSize,
             u_gridOffset: this._gridOffset.toArray(),
             u_nightVision: this.isNightVisionEnabled(),
-            u_sliceHeight: ArcballCamera.Get.getSliceHeight(),
-            u_boundsMin: this._blockBounds.min.toArray(),
-            u_boundsMax: this._blockBounds.max.toArray(),
+            u_sliceHeight: this._sliceViewEnabled ? this._sliceHeight : Infinity,
         };
         this._blockBuffer?.forEach((buffer) => {
             this._gl.useProgram(shader.program);

src/ui/layout.ts

@@ -353,18 +353,34 @@ export class UI {
             },
             'sliceHeight': {
                 elements: {
-                    'plus': new ToolbarItemElement({icon: 'plus'})
+                    'slice': new ToolbarItemElement({icon: 'slice'})
                         .onClick(() => {
-                            // FIXME: check current value and limits
-                            ArcballCamera.Get.setSliceHeight(ArcballCamera.Get.getSliceHeight() + 1);
+                            Renderer.Get.toggleSliceViewerEnabled();
+                        })
+                        .isEnabled(() => {
+                            return Renderer.Get.getActiveMeshType() === MeshType.BlockMesh;
+                        })
+                        .isActive(() => {
+                            return Renderer.Get.isSliceViewerEnabled();
+                        }),
+                    'plus': new ToolbarItemElement({ icon: 'plus' })
+                        .onClick(() => {
+                            Renderer.Get.incrementSliceHeight();
+                        })
+                        .isEnabled(() => {
+                            return Renderer.Get.isSliceViewerEnabled() &&
+                                Renderer.Get.canIncrementSliceHeight();
                         }),
                     'minus': new ToolbarItemElement({icon: 'minus'})
                         .onClick(() => {
-                            // FIXME: check current value and limits
-                            ArcballCamera.Get.setSliceHeight(ArcballCamera.Get.getSliceHeight() - 1);
+                            Renderer.Get.decrementSliceHeight();
+                        })
+                        .isEnabled(() => {
+                            return Renderer.Get.isSliceViewerEnabled() &&
+                                Renderer.Get.canDecrementSliceHeight();
                         }),
                 },
-                elementsOrder: ['plus', 'minus'],
+                elementsOrder: ['slice', 'plus', 'minus'],
             },
         },
         groupsOrder: ['viewmode', 'debug', 'sliceHeight'],