Skip to content

Commit 309b67e

Browse files
cabaniercabanier
authored
Merge pull request #216 from cabanier/depth-sensing
update occlusion sample to new depth API
2 parents 037f2a9 + 975bd63 commit 309b67e

File tree

4 files changed

+45
-13
lines changed

4 files changed

+45
-13
lines changed

‎js/render/core/renderer.js‎

Lines changed: 17 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -106,12 +106,13 @@ export function createWebGLContext(glAttribs) {
106106
}
107107

108108
export class RenderView {
109-
constructor(projectionMatrix, viewTransform, viewport = null, eye = 'left') {
109+
constructor(projectionMatrix, viewTransform, viewport = null, eye = 'left', depthdata = null) {
110110
this.projectionMatrix = projectionMatrix;
111111
this.viewport = viewport;
112112
// If an eye isn't given the left eye is assumed.
113113
this._eye = eye;
114114
this._eyeIndex = (eye == 'left' ? 0 : 1);
115+
this.depthdata = depthdata;
115116

116117
// Compute the view matrix
117118
if (viewTransform instanceof Float32Array) {
@@ -722,8 +723,8 @@ export class Renderer {
722723
gl.viewport(vp.x, vp.y, vp.width, vp.height);
723724
gl.uniformMatrix4fv(program.uniform.LEFT_PROJECTION_MATRIX, false, views[0].projectionMatrix);
724725
gl.uniformMatrix4fv(program.uniform.LEFT_VIEW_MATRIX, false, views[0].viewMatrix);
725-
gl.uniformMatrix4fv(program.uniform.RIGHT_PROJECTION_MATRIX, false, views[0].projectionMatrix);
726-
gl.uniformMatrix4fv(program.uniform.RIGHT_VIEW_MATRIX, false, views[0].viewMatrix);
726+
gl.uniformMatrix4fv(program.uniform.RIGHT_PROJECTION_MATRIX, false, views[1].projectionMatrix);
727+
gl.uniformMatrix4fv(program.uniform.RIGHT_VIEW_MATRIX, false, views[1].viewMatrix);
727728
gl.uniform3fv(program.uniform.CAMERA_POSITION, this._cameraPositions[0]);
728729
gl.uniform1i(program.uniform.EYE_INDEX, views[0].eyeIndex);
729730
}
@@ -762,6 +763,19 @@ export class Renderer {
762763
gl.uniformMatrix4fv(program.uniform.LEFT_VIEW_MATRIX, false, views[0].viewMatrix);
763764
gl.uniformMatrix4fv(program.uniform.RIGHT_PROJECTION_MATRIX, false, views[1].projectionMatrix);
764765
gl.uniformMatrix4fv(program.uniform.RIGHT_VIEW_MATRIX, false, views[1].viewMatrix);
766+
767+
// for older browser that don't support projectionMatrix and transform on the depth data
768+
gl.uniformMatrix4fv(program.uniform.LEFT_DEPTH_PROJECTION_MATRIX, false, views[0].projectionMatrix);
769+
gl.uniformMatrix4fv(program.uniform.LEFT_DEPTH_VIEW_MATRIX, false, views[0].viewMatrix);
770+
gl.uniformMatrix4fv(program.uniform.RIGHT_DEPTH_PROJECTION_MATRIX, false, views[1].projectionMatrix);
771+
gl.uniformMatrix4fv(program.uniform.RIGHT_DEPTH_VIEW_MATRIX, false, views[1].viewMatrix);
772+
773+
if (view.depthdata && views[0].depthdata.projectionMatrix) {
774+
gl.uniformMatrix4fv(program.uniform.LEFT_DEPTH_PROJECTION_MATRIX, false, views[0].depthdata.projectionMatrix);
775+
gl.uniformMatrix4fv(program.uniform.LEFT_DEPTH_VIEW_MATRIX, false, views[0].depthdata.transform.inverse.matrix);
776+
gl.uniformMatrix4fv(program.uniform.RIGHT_DEPTH_PROJECTION_MATRIX, false, views[1].depthdata.projectionMatrix);
777+
gl.uniformMatrix4fv(program.uniform.RIGHT_DEPTH_VIEW_MATRIX, false, views[1].depthdata.transform.inverse.matrix);
778+
}
765779
}
766780
// TODO(AB): modify shaders which use CAMERA_POSITION and EYE_INDEX to work with Multiview
767781
gl.uniform3fv(program.uniform.CAMERA_POSITION, this._cameraPositions[i]);

‎js/render/nodes/cube-sea-occlusion.js‎

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ class CubeSeaMaterial extends Material {
3131

3232
this.baseColor = this.defineSampler('baseColor');
3333
this.depthColor = this.defineSampler('depthColor');
34+
3435
}
3536

3637
get materialName() {
@@ -71,6 +72,7 @@ class CubeSeaMaterial extends Material {
7172
7273
out vec2 vTexCoord;
7374
out vec3 vLight;
75+
out vec4 vWorldPosition;
7476
7577
const vec3 lightDir = vec3(0.75, 0.5, 1.0);
7678
const vec3 ambientColor = vec3(0.5, 0.5, 0.5);
@@ -81,8 +83,9 @@ class CubeSeaMaterial extends Material {
8183
float lightFactor = max(dot(normalize(lightDir), normalRotated), 0.0);
8284
vLight = ambientColor + (lightColor * lightFactor);
8385
vTexCoord = TEXCOORD_0;
84-
return (VIEW_ID == 0u) ? left_proj * left_view * model * vec4(POSITION, 1.0) :
85-
right_proj * right_view * model * vec4(POSITION, 1.0);
86+
vWorldPosition = model * vec4(POSITION, 1.0);
87+
return (VIEW_ID == 0u) ? left_proj * left_view * vWorldPosition :
88+
right_proj * right_view * vWorldPosition;
8689
}`;
8790
}
8891

@@ -96,6 +99,8 @@ class CubeSeaMaterial extends Material {
9699
uniform sampler2DArray depthColor;
97100
in vec2 vTexCoord;
98101
in vec3 vLight;
102+
in vec4 vWorldPosition;
103+
uniform mat4 LEFT_DEPTH_PROJECTION_MATRIX, LEFT_DEPTH_VIEW_MATRIX, RIGHT_DEPTH_PROJECTION_MATRIX, RIGHT_DEPTH_VIEW_MATRIX;
99104
100105
float Depth_GetCameraDepthInMillimeters(const sampler2DArray depthTexture,
101106
const vec2 depthUv) {
@@ -204,7 +209,10 @@ class CubeSeaMaterial extends Material {
204209
}
205210
206211
vec4 fragment_main() {
207-
vec2 depthUv = vec2(gl_FragCoord.x/1680.0, gl_FragCoord.y/1760.0);
212+
vec4 depthPosition = (VIEW_ID == 0u) ? LEFT_DEPTH_PROJECTION_MATRIX * LEFT_DEPTH_VIEW_MATRIX * vWorldPosition :
213+
RIGHT_DEPTH_PROJECTION_MATRIX * RIGHT_DEPTH_VIEW_MATRIX * vWorldPosition;
214+
vec2 depthPositionHC = depthPosition.xy / depthPosition.w;
215+
depthPositionHC = vec2 (depthPositionHC.x + 1.0, depthPositionHC.y + 1.0 ) * 0.5;
208216
209217
vec4 o_FragColor = vec4(vLight, 1) * texture(baseColor, vTexCoord);
210218
if (o_FragColor.a == 0.0) {
@@ -215,10 +223,10 @@ class CubeSeaMaterial extends Material {
215223
float assetDepthMm = gl_FragCoord.z * 1000.0;
216224
217225
float occlusion = Depth_GetBlurredOcclusionAroundUV(
218-
depthColor, depthUv, assetDepthMm);
226+
depthColor, depthPositionHC, assetDepthMm);
219227
220228
//float occlusion = Depth_GetOcclusion(depthColor,
221-
// depthUv, assetDepthMm);
229+
// depthPositionHC, assetDepthMm);
222230
223231
float objectMaskEroded = pow(occlusion, 10.0);
224232

‎js/render/scenes/scene.js‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,12 +26,13 @@ import {vec3, quat} from '../math/gl-matrix.js';
2626
import {Ray} from '../math/ray.js';
2727

2828
export class WebXRView extends RenderView {
29-
constructor(view, layer, viewport) {
29+
constructor(view, layer, viewport, depthdata) {
3030
super(
3131
view ? view.projectionMatrix : null,
3232
view ? view.transform : null,
3333
viewport ? viewport : ((layer && view) ? layer.getViewport(view) : null),
34-
view ? view.eye : 'left'
34+
view ? view.eye : 'left',
35+
depthdata
3536
);
3637
}
3738
}

‎layers-samples/proj-multiview-occlusion.html‎

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -159,6 +159,7 @@
159159
depthSensing: {
160160
usagePreference: ["gpu-optimized"],
161161
dataFormatPreference: ["unsigned-short"],
162+
matchDepthView: false
162163
}}).then((session) => {
163164
xrButton.setSession(session);
164165
session.isImmersive = true;
@@ -254,10 +255,18 @@
254255
let views = [];
255256
for (let view of pose.views) {
256257
let viewport = null;
258+
let depthData = null;
257259
if (session.isImmersive) {
258-
const depthData = xrGLFactory.getDepthInformation(view);
259-
if (depthData.isValid) {
260+
depthData = xrGLFactory.getDepthInformation(view);
261+
if (depthData) {
260262
renderer.addExternalTexture('scene_depth', depthData.texture, true);
263+
264+
if ((depthData.depthNear !== session.renderState.depthNear) || (depthData.depthFar !== session.renderState.depthFar)) {
265+
session.updateRenderState({
266+
'depthNear': depthData.depthNear,
267+
'depthFar': depthData.depthFar
268+
});
269+
}
261270
}
262271

263272
glLayer = xrGLFactory.getViewSubImage(session.renderState.layers[0], view);
@@ -291,7 +300,7 @@
291300
} else {
292301
viewport = glLayer.getViewport(view);
293302
}
294-
views.push(new WebXRView(view, glLayer, viewport));
303+
views.push(new WebXRView(view, glLayer, viewport, depthData));
295304
}
296305

297306
scene.drawViewArray(views);

0 commit comments

Comments
 (0)