Use correct viewport and clear correctly
This commit is contained in:
parent
148e77d995
commit
3af3635eea
|
@ -376,6 +376,7 @@ class ThreeDRenderer extends Renderer {
|
||||||
camera: PerspectiveCamera;
|
camera: PerspectiveCamera;
|
||||||
|
|
||||||
needsStencil: boolean = false;
|
needsStencil: boolean = false;
|
||||||
|
rightEye: boolean = false;
|
||||||
|
|
||||||
get isMulticolor(): boolean {
|
get isMulticolor(): boolean {
|
||||||
return false;
|
return false;
|
||||||
|
@ -386,8 +387,12 @@ class ThreeDRenderer extends Renderer {
|
||||||
}
|
}
|
||||||
|
|
||||||
get destAllocatedSize(): glmatrix.vec2 {
|
get destAllocatedSize(): glmatrix.vec2 {
|
||||||
|
let width = this.renderContext.canvas.width;
|
||||||
|
if (this.inVR) {
|
||||||
|
width = width / 2;
|
||||||
|
}
|
||||||
return glmatrix.vec2.clone([
|
return glmatrix.vec2.clone([
|
||||||
this.renderContext.canvas.width,
|
width,
|
||||||
this.renderContext.canvas.height,
|
this.renderContext.canvas.height,
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
@ -484,14 +489,27 @@ class ThreeDRenderer extends Renderer {
|
||||||
}
|
}
|
||||||
|
|
||||||
redrawVR(frame: VRFrameData): void {
|
redrawVR(frame: VRFrameData): void {
|
||||||
|
this.clearDestFramebuffer(true);
|
||||||
this.vrProjectionMatrix = frame.leftProjectionMatrix;
|
this.vrProjectionMatrix = frame.leftProjectionMatrix;
|
||||||
|
this.rightEye = false;
|
||||||
this.camera.setView(F32ArrayToMat4(frame.leftViewMatrix), frame.pose);
|
this.camera.setView(F32ArrayToMat4(frame.leftViewMatrix), frame.pose);
|
||||||
this.redraw();
|
this.redraw();
|
||||||
|
this.rightEye = true;
|
||||||
this.vrProjectionMatrix = frame.rightProjectionMatrix;
|
this.vrProjectionMatrix = frame.rightProjectionMatrix;
|
||||||
this.camera.setView(F32ArrayToMat4(frame.rightViewMatrix), frame.pose);
|
this.camera.setView(F32ArrayToMat4(frame.rightViewMatrix), frame.pose);
|
||||||
this.redraw();
|
this.redraw();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
setDrawViewport() {
|
||||||
|
let offset = 0;
|
||||||
|
if (this.rightEye) {
|
||||||
|
offset = this.destAllocatedSize[0];
|
||||||
|
}
|
||||||
|
const renderContext = this.renderContext;
|
||||||
|
const gl = renderContext.gl;
|
||||||
|
gl.viewport(offset, 0, this.destAllocatedSize[0], this.destAllocatedSize[1]);
|
||||||
|
}
|
||||||
|
|
||||||
pathTransformsForObject(objectIndex: number): PathTransformBuffers<Float32Array> {
|
pathTransformsForObject(objectIndex: number): PathTransformBuffers<Float32Array> {
|
||||||
const meshDescriptor = this.renderContext.appController.meshDescriptors[objectIndex];
|
const meshDescriptor = this.renderContext.appController.meshDescriptors[objectIndex];
|
||||||
const pathCount = this.pathCountForObject(objectIndex);
|
const pathCount = this.pathCountForObject(objectIndex);
|
||||||
|
@ -546,17 +564,20 @@ class ThreeDRenderer extends Renderer {
|
||||||
throw new PathfinderError("Unsupported antialiasing type!");
|
throw new PathfinderError("Unsupported antialiasing type!");
|
||||||
}
|
}
|
||||||
|
|
||||||
protected clearDestFramebuffer(): void {
|
protected clearDestFramebuffer(force: boolean): void {
|
||||||
const gl = this.renderContext.gl;
|
const gl = this.renderContext.gl;
|
||||||
|
|
||||||
gl.bindFramebuffer(gl.FRAMEBUFFER, this.destFramebuffer);
|
gl.bindFramebuffer(gl.FRAMEBUFFER, this.destFramebuffer);
|
||||||
gl.viewport(0, 0, this.destAllocatedSize[0], this.destAllocatedSize[1]);
|
// clear the entire viewport
|
||||||
|
gl.viewport(0, 0, this.renderContext.canvas.width, this.renderContext.canvas.height);
|
||||||
|
|
||||||
gl.clearColor(1.0, 1.0, 1.0, 1.0);
|
gl.clearColor(1.0, 1.0, 1.0, 1.0);
|
||||||
gl.clearDepth(1.0);
|
gl.clearDepth(1.0);
|
||||||
gl.depthMask(true);
|
gl.depthMask(true);
|
||||||
|
if (force || this.vrProjectionMatrix == null) {
|
||||||
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
|
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
protected getModelviewTransform(objectIndex: number): glmatrix.mat4 {
|
protected getModelviewTransform(objectIndex: number): glmatrix.mat4 {
|
||||||
const textFrameIndex = this.renderContext
|
const textFrameIndex = this.renderContext
|
||||||
|
|
|
@ -136,7 +136,7 @@ export class NoAAStrategy extends AntialiasingStrategy {
|
||||||
const renderContext = renderer.renderContext;
|
const renderContext = renderer.renderContext;
|
||||||
const gl = renderContext.gl;
|
const gl = renderContext.gl;
|
||||||
gl.bindFramebuffer(gl.FRAMEBUFFER, renderer.destFramebuffer);
|
gl.bindFramebuffer(gl.FRAMEBUFFER, renderer.destFramebuffer);
|
||||||
gl.viewport(0, 0, this.framebufferSize[0], this.framebufferSize[1]);
|
renderer.setDrawViewport();
|
||||||
gl.disable(gl.SCISSOR_TEST);
|
gl.disable(gl.SCISSOR_TEST);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -147,7 +147,7 @@ export class NoAAStrategy extends AntialiasingStrategy {
|
||||||
const gl = renderContext.gl;
|
const gl = renderContext.gl;
|
||||||
|
|
||||||
gl.bindFramebuffer(gl.FRAMEBUFFER, renderer.destFramebuffer);
|
gl.bindFramebuffer(gl.FRAMEBUFFER, renderer.destFramebuffer);
|
||||||
gl.viewport(0, 0, this.framebufferSize[0], this.framebufferSize[1]);
|
renderer.setDrawViewport();
|
||||||
gl.disable(gl.SCISSOR_TEST);
|
gl.disable(gl.SCISSOR_TEST);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -48,6 +48,8 @@ export abstract class Renderer {
|
||||||
|
|
||||||
lastTimings: Timings;
|
lastTimings: Timings;
|
||||||
|
|
||||||
|
inVR: boolean = false;
|
||||||
|
|
||||||
get emboldenAmount(): glmatrix.vec2 {
|
get emboldenAmount(): glmatrix.vec2 {
|
||||||
return glmatrix.vec2.create();
|
return glmatrix.vec2.create();
|
||||||
}
|
}
|
||||||
|
@ -141,13 +143,19 @@ export abstract class Renderer {
|
||||||
this.redraw();
|
this.redraw();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
setDrawViewport() {
|
||||||
|
const renderContext = this.renderContext;
|
||||||
|
const gl = renderContext.gl;
|
||||||
|
gl.viewport(0, 0, this.destAllocatedSize[0], this.destAllocatedSize[1]);
|
||||||
|
}
|
||||||
|
|
||||||
redraw(): void {
|
redraw(): void {
|
||||||
const renderContext = this.renderContext;
|
const renderContext = this.renderContext;
|
||||||
|
|
||||||
if (this.meshBuffers == null)
|
if (this.meshBuffers == null)
|
||||||
return;
|
return;
|
||||||
|
|
||||||
this.clearDestFramebuffer();
|
this.clearDestFramebuffer(false);
|
||||||
|
|
||||||
// Start timing rendering.
|
// Start timing rendering.
|
||||||
if (this.timerQueryPollInterval == null &&
|
if (this.timerQueryPollInterval == null &&
|
||||||
|
@ -426,7 +434,7 @@ export abstract class Renderer {
|
||||||
|
|
||||||
protected drawSceneryIfNecessary(): void {}
|
protected drawSceneryIfNecessary(): void {}
|
||||||
|
|
||||||
protected clearDestFramebuffer(): void {
|
protected clearDestFramebuffer(force: boolean): void {
|
||||||
const renderContext = this.renderContext;
|
const renderContext = this.renderContext;
|
||||||
const gl = renderContext.gl;
|
const gl = renderContext.gl;
|
||||||
|
|
||||||
|
|
|
@ -127,7 +127,7 @@ export default class SSAAStrategy extends AntialiasingStrategy {
|
||||||
const gl = renderContext.gl;
|
const gl = renderContext.gl;
|
||||||
|
|
||||||
gl.bindFramebuffer(gl.FRAMEBUFFER, renderer.destFramebuffer);
|
gl.bindFramebuffer(gl.FRAMEBUFFER, renderer.destFramebuffer);
|
||||||
gl.viewport(0, 0, renderer.destAllocatedSize[0], renderer.destAllocatedSize[1]);
|
renderer.setDrawViewport();
|
||||||
gl.disable(gl.DEPTH_TEST);
|
gl.disable(gl.DEPTH_TEST);
|
||||||
gl.disable(gl.BLEND);
|
gl.disable(gl.BLEND);
|
||||||
|
|
||||||
|
|
|
@ -178,7 +178,6 @@ export abstract class DemoView extends PathfinderView implements RenderContext {
|
||||||
private vrDisplay: VRDisplay | null;
|
private vrDisplay: VRDisplay | null;
|
||||||
private vrFrameData: VRFrameData | null;
|
private vrFrameData: VRFrameData | null;
|
||||||
private inVRRAF: boolean;
|
private inVRRAF: boolean;
|
||||||
private inVR: boolean;
|
|
||||||
|
|
||||||
/// NB: All subclasses are responsible for creating a renderer in their constructors.
|
/// NB: All subclasses are responsible for creating a renderer in their constructors.
|
||||||
constructor(areaLUT: HTMLImageElement,
|
constructor(areaLUT: HTMLImageElement,
|
||||||
|
@ -202,7 +201,6 @@ export abstract class DemoView extends PathfinderView implements RenderContext {
|
||||||
|
|
||||||
|
|
||||||
this.inVRRAF = false;
|
this.inVRRAF = false;
|
||||||
this.inVR = false;
|
|
||||||
this.vrDisplay = null;
|
this.vrDisplay = null;
|
||||||
if ("VRFrameData" in window) {
|
if ("VRFrameData" in window) {
|
||||||
this.vrFrameData = new VRFrameData;
|
this.vrFrameData = new VRFrameData;
|
||||||
|
@ -234,14 +232,14 @@ export abstract class DemoView extends PathfinderView implements RenderContext {
|
||||||
}
|
}
|
||||||
|
|
||||||
window.addEventListener('vrdisplaypresentchange', () => {
|
window.addEventListener('vrdisplaypresentchange', () => {
|
||||||
|
|
||||||
if (this.vrDisplay == null)
|
if (this.vrDisplay == null)
|
||||||
return;
|
return;
|
||||||
|
|
||||||
if (this.vrDisplay.isPresenting) {
|
if (this.vrDisplay.isPresenting) {
|
||||||
const that = this;
|
const that = this;
|
||||||
|
this.resized();
|
||||||
function vrCallback(): void {
|
function vrCallback(): void {
|
||||||
if (that.vrDisplay == null || !that.inVR) {
|
if (that.vrDisplay == null || !that.renderer.inVR) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
that.vrDisplay.requestAnimationFrame(vrCallback);
|
that.vrDisplay.requestAnimationFrame(vrCallback);
|
||||||
|
@ -251,7 +249,8 @@ export abstract class DemoView extends PathfinderView implements RenderContext {
|
||||||
}
|
}
|
||||||
this.vrDisplay.requestAnimationFrame(vrCallback);
|
this.vrDisplay.requestAnimationFrame(vrCallback);
|
||||||
} else {
|
} else {
|
||||||
this.inVR = false;
|
this.renderer.inVR = false;
|
||||||
|
this.resized();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -307,7 +306,7 @@ export abstract class DemoView extends PathfinderView implements RenderContext {
|
||||||
|
|
||||||
enterVR(): void {
|
enterVR(): void {
|
||||||
if (this.vrDisplay != null) {
|
if (this.vrDisplay != null) {
|
||||||
this.inVR = true;
|
this.renderer.inVR = true;
|
||||||
this.vrDisplay.requestPresent([{ source: this.canvas }]);
|
this.vrDisplay.requestPresent([{ source: this.canvas }]);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -318,7 +317,8 @@ export abstract class DemoView extends PathfinderView implements RenderContext {
|
||||||
if (!this.renderer.meshesAttached)
|
if (!this.renderer.meshesAttached)
|
||||||
return;
|
return;
|
||||||
|
|
||||||
if (!this.inVR || this.vrDisplay == null || this.vrFrameData == null) {
|
if (!this.renderer.inVR || this.vrDisplay == null ||
|
||||||
|
this.vrFrameData == null) {
|
||||||
this.renderer.redraw();
|
this.renderer.redraw();
|
||||||
} else {
|
} else {
|
||||||
if (!this.inVRRAF) {
|
if (!this.inVRRAF) {
|
||||||
|
|
|
@ -294,7 +294,7 @@ export abstract class XCAAStrategy extends AntialiasingStrategy {
|
||||||
const gl = renderContext.gl;
|
const gl = renderContext.gl;
|
||||||
|
|
||||||
gl.bindFramebuffer(gl.FRAMEBUFFER, renderer.destFramebuffer);
|
gl.bindFramebuffer(gl.FRAMEBUFFER, renderer.destFramebuffer);
|
||||||
gl.viewport(0, 0, this.destFramebufferSize[0], this.destFramebufferSize[1]);
|
renderer.setDrawViewport();
|
||||||
gl.disable(gl.SCISSOR_TEST);
|
gl.disable(gl.SCISSOR_TEST);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue