From c119a82d83baaf4b0e5a083ca9134f7e7a3c193f Mon Sep 17 00:00:00 2001
From: Alexander Rose <alexander.rose@weirdbyte.de>
Date: Sun, 8 Dec 2019 23:06:36 -0800
Subject: [PATCH] simplified fog shader handling
---
src/mol-canvas3d/passes/postprocessing.ts | 11 +----------
src/mol-gl/renderable/schema.ts | 2 --
src/mol-gl/renderer.ts | 9 ---------
src/mol-gl/shader/chunks/apply-fog.glsl.ts | 16 +++++++---------
.../shader/chunks/common-frag-params.glsl.ts | 1 -
src/mol-gl/shader/postprocessing.frag.ts | 9 ++++-----
src/mol-plugin-ui/viewport/simple-settings.tsx | 8 +++-----
7 files changed, 15 insertions(+), 41 deletions(-)
diff --git a/src/mol-canvas3d/passes/postprocessing.ts b/src/mol-canvas3d/passes/postprocessing.ts
index 1ec9cf0c9..7a4147230 100644
--- a/src/mol-canvas3d/passes/postprocessing.ts
+++ b/src/mol-canvas3d/passes/postprocessing.ts
@@ -30,7 +30,6 @@ const PostprocessingSchema = {
dOrthographic: DefineSpec('number'),
uNear: UniformSpec('f'),
uFar: UniformSpec('f'),
- dFogEnable: DefineSpec('boolean'),
uFogNear: UniformSpec('f'),
uFogFar: UniformSpec('f'),
uFogColor: UniformSpec('v3'),
@@ -56,8 +55,6 @@ export const PostprocessingParams = {
outlineEnable: PD.Boolean(false),
outlineScale: PD.Numeric(1, { min: 0, max: 10, step: 1 }),
outlineThreshold: PD.Numeric(0.8, { min: 0, max: 1, step: 0.01 }),
-
- fogEnable: PD.Boolean(true),
}
export type PostprocessingProps = PD.Values<typeof PostprocessingParams>
@@ -74,7 +71,6 @@ function getPostprocessingRenderable(ctx: WebGLContext, colorTexture: Texture, d
dOrthographic: ValueCell.create(0),
uNear: ValueCell.create(1),
uFar: ValueCell.create(10000),
- dFogEnable: ValueCell.create(p.fogEnable),
uFogNear: ValueCell.create(10000),
uFogFar: ValueCell.create(10000),
uFogColor: ValueCell.create(Vec3.create(1, 1, 1)),
@@ -103,7 +99,7 @@ export class PostprocessingPass {
props: PostprocessingProps
renderable: PostprocessingRenderable
- constructor(private webgl: WebGLContext, private camera: Camera, drawPass: DrawPass, props: Partial<PostprocessingProps>) {
+ constructor(private webgl: WebGLContext, private camera: Camera, private drawPass: DrawPass, props: Partial<PostprocessingProps>) {
const { gl } = webgl
this.target = createRenderTarget(webgl, gl.drawingBufferWidth, gl.drawingBufferHeight)
this.props = { ...PD.getDefaultValues(PostprocessingParams), ...props }
@@ -151,11 +147,6 @@ export class PostprocessingPass {
ValueCell.update(this.renderable.values.uOutlineThreshold, props.outlineThreshold)
}
- if (props.fogEnable !== undefined) {
- this.props.fogEnable = props.fogEnable
- ValueCell.update(this.renderable.values.dFogEnable, props.fogEnable)
- }
-
this.renderable.update()
}
diff --git a/src/mol-gl/renderable/schema.ts b/src/mol-gl/renderable/schema.ts
index 3c4a74594..c795631a9 100644
--- a/src/mol-gl/renderable/schema.ts
+++ b/src/mol-gl/renderable/schema.ts
@@ -181,8 +181,6 @@ export const GlobalUniformSchema = {
uHighlightColor: UniformSpec('v3'),
uSelectColor: UniformSpec('v3'),
-
- uFogFlag: UniformSpec('i'),
}
export type GlobalUniformSchema = typeof GlobalUniformSchema
export type GlobalUniformValues = Values<GlobalUniformSchema> // { [k in keyof GlobalUniformSchema]: ValueCell<any> }
diff --git a/src/mol-gl/renderer.ts b/src/mol-gl/renderer.ts
index b2f4eef00..84831d48e 100644
--- a/src/mol-gl/renderer.ts
+++ b/src/mol-gl/renderer.ts
@@ -63,8 +63,6 @@ export const RendererParams = {
highlightColor: PD.Color(Color.fromNormalizedRgb(1.0, 0.4, 0.6)),
selectColor: PD.Color(Color.fromNormalizedRgb(0.2, 1.0, 0.1)),
-
- fogFlag: PD.Boolean(true, { label: 'Use Fog' }),
}
export type RendererProps = PD.Values<typeof RendererParams>
@@ -128,8 +126,6 @@ namespace Renderer {
uHighlightColor: ValueCell.create(Color.toVec3Normalized(Vec3(), p.highlightColor)),
uSelectColor: ValueCell.create(Color.toVec3Normalized(Vec3(), p.selectColor)),
-
- uFogFlag: ValueCell.create(p.fogFlag ? 1 : 0),
}
const globalUniformList = Object.entries(globalUniforms)
@@ -309,11 +305,6 @@ namespace Renderer {
p.selectColor = props.selectColor
ValueCell.update(globalUniforms.uSelectColor, Color.toVec3Normalized(globalUniforms.uSelectColor.ref.value, p.selectColor))
}
-
- if (props.fogFlag !== undefined && props.fogFlag !== p.fogFlag) {
- p.fogFlag = props.fogFlag
- ValueCell.update(globalUniforms.uFogFlag, p.fogFlag ? 1 : 0)
- }
},
setViewport: (x: number, y: number, width: number, height: number) => {
gl.viewport(x, y, width, height)
diff --git a/src/mol-gl/shader/chunks/apply-fog.glsl.ts b/src/mol-gl/shader/chunks/apply-fog.glsl.ts
index fe13b547f..63ff5d82a 100644
--- a/src/mol-gl/shader/chunks/apply-fog.glsl.ts
+++ b/src/mol-gl/shader/chunks/apply-fog.glsl.ts
@@ -1,12 +1,10 @@
export default `
-if (uFogFlag == 1) {
- float depth = length(vViewPosition);
- float fogFactor = smoothstep(uFogNear, uFogFar, depth);
- if (uTransparentBackground == 0) {
- gl_FragColor.rgb = mix(gl_FragColor.rgb, uFogColor, fogFactor);
- } else {
- float fogAlpha = (1.0 - fogFactor) * gl_FragColor.a;
- gl_FragColor.a = fogAlpha;
- }
+float depth = length(vViewPosition);
+float fogFactor = smoothstep(uFogNear, uFogFar, depth);
+if (uTransparentBackground == 0) {
+ gl_FragColor.rgb = mix(gl_FragColor.rgb, uFogColor, fogFactor);
+} else {
+ float fogAlpha = (1.0 - fogFactor) * gl_FragColor.a;
+ gl_FragColor.a = fogAlpha;
}
`
\ No newline at end of file
diff --git a/src/mol-gl/shader/chunks/common-frag-params.glsl.ts b/src/mol-gl/shader/chunks/common-frag-params.glsl.ts
index 3fa91f2cd..1525fce4d 100644
--- a/src/mol-gl/shader/chunks/common-frag-params.glsl.ts
+++ b/src/mol-gl/shader/chunks/common-frag-params.glsl.ts
@@ -15,7 +15,6 @@ varying vec3 vViewPosition;
uniform vec2 uViewOffset;
-uniform int uFogFlag;
uniform float uFogNear;
uniform float uFogFar;
uniform vec3 uFogColor;
diff --git a/src/mol-gl/shader/postprocessing.frag.ts b/src/mol-gl/shader/postprocessing.frag.ts
index 5ba919877..86ccf4eac 100644
--- a/src/mol-gl/shader/postprocessing.frag.ts
+++ b/src/mol-gl/shader/postprocessing.frag.ts
@@ -105,11 +105,10 @@ void main(void) {
vec2 edgeDepth = calcEdgeDepth(coords);
float edgeFlag = step(edgeDepth.x, uOutlineThreshold);
color.rgb *= edgeFlag;
- #ifdef dFogEnable
- float viewDist = abs(getViewZ(edgeDepth.y));
- float fogFactor = smoothstep(uFogNear, uFogFar, viewDist) * (1.0 - edgeFlag);
- color.rgb = mix(color.rgb, uFogColor, fogFactor);
- #endif
+
+ float viewDist = abs(getViewZ(edgeDepth.y));
+ float fogFactor = smoothstep(uFogNear, uFogFar, viewDist) * (1.0 - edgeFlag);
+ color.rgb = mix(color.rgb, uFogColor, fogFactor);
#endif
// occlusion needs to be handled after outline to darken them properly
diff --git a/src/mol-plugin-ui/viewport/simple-settings.tsx b/src/mol-plugin-ui/viewport/simple-settings.tsx
index 8071722c9..8d55f0768 100644
--- a/src/mol-plugin-ui/viewport/simple-settings.tsx
+++ b/src/mol-plugin-ui/viewport/simple-settings.tsx
@@ -77,11 +77,9 @@ export class SimpleSettingsControl extends PluginUIComponent {
PluginCommands.Canvas3D.SetSettings.dispatch(this.plugin, { settings: {
postprocessing: { ...postprocessing, outlineEnable: p.value },
} });
- } else if (p.name === 'fog') {
- if (!this.plugin.canvas3d) return;
- const renderer = this.plugin.canvas3d.props.renderer;
+ } else if (p.name === 'fog') {;
PluginCommands.Canvas3D.SetSettings.dispatch(this.plugin, { settings: {
- renderer: { ...renderer, fogFlag: p.value },
+ cameraFog: p.value ? 50 : 1,
} });
}
}
@@ -119,7 +117,7 @@ export class SimpleSettingsControl extends PluginUIComponent {
renderStyle,
occlusion: this.plugin.canvas3d?.props.postprocessing.occlusionEnable,
outline: this.plugin.canvas3d?.props.postprocessing.outlineEnable,
- fog: this.plugin.canvas3d?.props.renderer.fogFlag
+ fog: this.plugin.canvas3d ? this.plugin.canvas3d.props.cameraFog > 1 : false
}
}
--
GitLab