diff --git a/src/mol-geo/representation/structure/bond.ts b/src/mol-geo/representation/structure/bond.ts
index 974452efb0b4b97dbc80c9534c0e523e7a479c80..28327d08dbf9b90a64c4e2f610196030a56efacd 100644
--- a/src/mol-geo/representation/structure/bond.ts
+++ b/src/mol-geo/representation/structure/bond.ts
@@ -134,6 +134,7 @@ export default function BondUnitsRepresentation(): UnitsRepresentation<BondProps
dDoubleSided: ValueCell.create(defaults(props.doubleSided, true)),
dFlatShaded: ValueCell.create(defaults(props.flatShaded, false)),
dFlipSided: ValueCell.create(defaults(props.flipSided, false)),
+ dUseFog: ValueCell.create(defaults(props.useFog, true)),
}
const state: RenderableState = {
depthMask: defaults(props.depthMask, true),
diff --git a/src/mol-geo/representation/structure/index.ts b/src/mol-geo/representation/structure/index.ts
index 523c6303b2c4598d0badae1d5b0bc560887702fe..756fc6eceeff37779ba932c54315e3dd5f168bce 100644
--- a/src/mol-geo/representation/structure/index.ts
+++ b/src/mol-geo/representation/structure/index.ts
@@ -34,7 +34,8 @@ export const DefaultStructureProps = {
alpha: 1,
visible: true,
doubleSided: false,
- depthMask: true
+ depthMask: true,
+ useFog: true,
}
export type StructureProps = Partial<typeof DefaultStructureProps>
diff --git a/src/mol-geo/representation/structure/point.ts b/src/mol-geo/representation/structure/point.ts
index b635c3a43ea6435b77c8f5f86cf2ca4c09f791db..a5ea8bdf66ee987ac079dee5a89f601a1c4034c6 100644
--- a/src/mol-geo/representation/structure/point.ts
+++ b/src/mol-geo/representation/structure/point.ts
@@ -110,7 +110,8 @@ export default function PointUnitsRepresentation(): UnitsRepresentation<PointPro
drawCount: ValueCell.create(vertices.length / 3),
instanceCount: ValueCell.create(instanceCount),
- dPointSizeAttenuation: ValueCell.create(true)
+ dPointSizeAttenuation: ValueCell.create(true),
+ dUseFog: ValueCell.create(defaults(props.useFog, true)),
}
const state: RenderableState = {
depthMask: defaults(props.depthMask, true),
diff --git a/src/mol-geo/representation/structure/spacefill.ts b/src/mol-geo/representation/structure/spacefill.ts
index e6c132d5d00313f7f6cbc18507386d8190196bad..d93a6d00a5fd1b1ebbed4911452bdd6c3520cbd2 100644
--- a/src/mol-geo/representation/structure/spacefill.ts
+++ b/src/mol-geo/representation/structure/spacefill.ts
@@ -97,6 +97,7 @@ export default function SpacefillUnitsRepresentation(): UnitsRepresentation<Spac
dDoubleSided: ValueCell.create(defaults(props.doubleSided, true)),
dFlatShaded: ValueCell.create(defaults(props.flatShaded, false)),
dFlipSided: ValueCell.create(defaults(props.flipSided, false)),
+ dUseFog: ValueCell.create(defaults(props.useFog, true)),
}
const state: RenderableState = {
depthMask: defaults(props.depthMask, true),
diff --git a/src/mol-geo/representation/volume/surface.ts b/src/mol-geo/representation/volume/surface.ts
index 5b333987aec0b45e588573a5c5573de65d389efa..0d133c89d65beeff58c5a3b4f484b60b8377f979 100644
--- a/src/mol-geo/representation/volume/surface.ts
+++ b/src/mol-geo/representation/volume/surface.ts
@@ -45,7 +45,8 @@ export const DefaultSurfaceProps = {
flatShaded: true,
flipSided: true,
doubleSided: true,
- depthMask: true
+ depthMask: true,
+ useFog: true
}
export type SurfaceProps = Partial<typeof DefaultSurfaceProps>
@@ -89,6 +90,7 @@ export default function Surface(): VolumeElementRepresentation<SurfaceProps> {
dDoubleSided: ValueCell.create(defaults(props.doubleSided, true)),
dFlatShaded: ValueCell.create(defaults(props.flatShaded, true)),
dFlipSided: ValueCell.create(false),
+ dUseFog: ValueCell.create(defaults(props.useFog, true)),
}
const state: RenderableState = {
depthMask: defaults(props.depthMask, true),
diff --git a/src/mol-gl/_spec/renderer.spec.ts b/src/mol-gl/_spec/renderer.spec.ts
index 5cb1fd6d7633ba9ecfe645cf072930c042e9dfac..a087482875d11e5b43642f04255784af5be22a4d 100644
--- a/src/mol-gl/_spec/renderer.spec.ts
+++ b/src/mol-gl/_spec/renderer.spec.ts
@@ -71,7 +71,8 @@ function createPoints() {
drawCount: ValueCell.create(3),
instanceCount: ValueCell.create(1),
- dPointSizeAttenuation: ValueCell.create(true)
+ dPointSizeAttenuation: ValueCell.create(true),
+ dUseFog: ValueCell.create(true),
}
const state: RenderableState = {
visible: true,
diff --git a/src/mol-gl/renderable/schema.ts b/src/mol-gl/renderable/schema.ts
index b84d827f76b9b26cc8d1fe647c1243383f24770e..adfa5985b56104dc556ab8938b7d672fdc9a8ab7 100644
--- a/src/mol-gl/renderable/schema.ts
+++ b/src/mol-gl/renderable/schema.ts
@@ -129,6 +129,10 @@ export const GlobalUniformSchema = {
uHighlightColor: UniformSpec('v3'),
uSelectColor: UniformSpec('v3'),
+
+ uFogNear: UniformSpec('f'),
+ uFogFar: UniformSpec('f'),
+ uFogColor: UniformSpec('v3'),
}
export type GlobalUniformSchema = typeof GlobalUniformSchema
export type GlobalUniformValues = { [k in keyof GlobalUniformSchema]: ValueCell<any> }
@@ -158,6 +162,7 @@ export const BaseSchema = {
instanceCount: ValueSpec('number'),
dColorType: DefineSpec('string', ['uniform', 'attribute', 'instance', 'element', 'element_instance']),
+ dUseFog: DefineSpec('boolean'),
}
export type BaseSchema = typeof BaseSchema
export type BaseValues = Values<BaseSchema>
\ No newline at end of file
diff --git a/src/mol-gl/renderer.ts b/src/mol-gl/renderer.ts
index 996eb233ec85775ed392f86e42a280db8c19b17e..885ae9f820c6fbad9e503b636e61077e033352b6 100644
--- a/src/mol-gl/renderer.ts
+++ b/src/mol-gl/renderer.ts
@@ -58,6 +58,7 @@ namespace Renderer {
const lightAmbient = Vec3.create(0.5, 0.5, 0.5)
const highlightColor = Vec3.create(1.0, 0.4, 0.6)
const selectColor = Vec3.create(0.2, 1.0, 0.1)
+ const fogColor = Vec3.create(0.0, 0.0, 0.0)
function setClearColor(color: Color) {
const [ r, g, b ] = Color.toRgbNormalized(color)
@@ -77,7 +78,11 @@ namespace Renderer {
uLightAmbient: ValueCell.create(Vec3.clone(lightAmbient)),
uHighlightColor: ValueCell.create(Vec3.clone(highlightColor)),
- uSelectColor: ValueCell.create(Vec3.clone(selectColor))
+ uSelectColor: ValueCell.create(Vec3.clone(selectColor)),
+
+ uFogNear: ValueCell.create(camera.near),
+ uFogFar: ValueCell.create(camera.far / 50),
+ uFogColor: ValueCell.create(Vec3.clone(fogColor)),
}
let currentProgramId = -1
diff --git a/src/mol-gl/shader/chunks/apply-fog.glsl b/src/mol-gl/shader/chunks/apply-fog.glsl
new file mode 100644
index 0000000000000000000000000000000000000000..3b8896f5c85b694c25d7c05f45250343fff31af3
--- /dev/null
+++ b/src/mol-gl/shader/chunks/apply-fog.glsl
@@ -0,0 +1,6 @@
+// #ifdef dUseFog
+ // float depth = length(vViewPosition);
+ float depth = gl_FragCoord.z / gl_FragCoord.w;
+ float fogFactor = smoothstep(uFogNear, uFogFar, depth);
+ gl_FragColor.rgb = mix(gl_FragColor.rgb, uFogColor, fogFactor);
+// #endif
\ No newline at end of file
diff --git a/src/mol-gl/shader/chunks/assign-position.glsl b/src/mol-gl/shader/chunks/assign-position.glsl
new file mode 100644
index 0000000000000000000000000000000000000000..06231cf7ff806afbd988c00961471fe9cb3b81dd
--- /dev/null
+++ b/src/mol-gl/shader/chunks/assign-position.glsl
@@ -0,0 +1,4 @@
+mat4 modelView = uView * uModel * aTransform;
+vec4 mvPosition = modelView * vec4(aPosition, 1.0);
+vViewPosition = mvPosition.xyz;
+gl_Position = uProjection * mvPosition;
\ No newline at end of file
diff --git a/src/mol-gl/shader/chunks/common-frag-params.glsl b/src/mol-gl/shader/chunks/common-frag-params.glsl
index e8ee6e1e2dc011c72ad23f1343b733b244a7178b..7470f1041311568d7010e15b2f73c67d09651585 100644
--- a/src/mol-gl/shader/chunks/common-frag-params.glsl
+++ b/src/mol-gl/shader/chunks/common-frag-params.glsl
@@ -1,7 +1,11 @@
uniform int uObjectId;
uniform int uInstanceCount;
uniform int uElementCount;
+
uniform vec3 uHighlightColor;
uniform vec3 uSelectColor;
+varying float vMarker;
-varying float vMarker;
\ No newline at end of file
+uniform float uFogNear;
+uniform float uFogFar;
+uniform vec3 uFogColor;
\ No newline at end of file
diff --git a/src/mol-gl/shader/mesh.frag b/src/mol-gl/shader/mesh.frag
index 096b018d3623f3bf687e8dd7ffce9273942f4e85..cc387cb22b293464889921d6f48c91bdd9b1a7f2 100644
--- a/src/mol-gl/shader/mesh.frag
+++ b/src/mol-gl/shader/mesh.frag
@@ -77,5 +77,6 @@ void main() {
gl_FragColor.a = uAlpha;
#pragma glslify: import('./chunks/apply-marker-color.glsl')
+ #pragma glslify: import('./chunks/apply-fog.glsl')
#endif
}
\ No newline at end of file
diff --git a/src/mol-gl/shader/mesh.vert b/src/mol-gl/shader/mesh.vert
index 1bec9786931f0063c06792d441f8b4af9b5ed123..0f7b837d2cd7569c1997ff057ca32cc4fc2f4e5a 100644
--- a/src/mol-gl/shader/mesh.vert
+++ b/src/mol-gl/shader/mesh.vert
@@ -28,11 +28,7 @@ varying vec3 vViewPosition;
void main(){
#pragma glslify: import('./chunks/assign-color-varying.glsl')
#pragma glslify: import('./chunks/assign-marker-varying.glsl')
-
- mat4 modelView = uView * uModel * aTransform;
- vec4 mvPosition = modelView * vec4(aPosition, 1.0);
- vViewPosition = mvPosition.xyz;
- gl_Position = uProjection * mvPosition;
+ #pragma glslify: import('./chunks/assign-position.glsl')
#ifndef dFlatShaded
mat3 normalMatrix = transpose(inverse(mat3(modelView)));
diff --git a/src/mol-gl/shader/point.frag b/src/mol-gl/shader/point.frag
index 59c3972a8025e68044b18b766958b6af822c87be..ae18b4a35f8ac2bf100ba5b52873c1bb5ab4d1e5 100644
--- a/src/mol-gl/shader/point.frag
+++ b/src/mol-gl/shader/point.frag
@@ -14,5 +14,9 @@ uniform float uAlpha;
void main(){
#pragma glslify: import('./chunks/assign-material-color.glsl')
+
gl_FragColor = vec4(material, uAlpha);
+
+ #pragma glslify: import('./chunks/apply-marker-color.glsl')
+ #pragma glslify: import('./chunks/apply-fog.glsl')
}
\ No newline at end of file
diff --git a/src/mol-gl/shader/point.vert b/src/mol-gl/shader/point.vert
index 30b98c44c721896aa4ec60709320f59d3fe13a58..8e2c29ef11cc3192c00496a06bcd8d6558fe297e 100644
--- a/src/mol-gl/shader/point.vert
+++ b/src/mol-gl/shader/point.vert
@@ -26,9 +26,7 @@ attribute float aElementId;
void main(){
#pragma glslify: import('./chunks/assign-color-varying.glsl')
-
- mat4 modelView = uView * uModel * aTransform;
- vec4 mvPosition = modelView * vec4(aPosition, 1.0);
+ #pragma glslify: import('./chunks/assign-position.glsl')
#if defined(dSizeType_uniform)
float size = uSize;
diff --git a/src/mol-view/camera/base.ts b/src/mol-view/camera/base.ts
index 3b9b78fec861384a01e59b086488accd35af7317..f97a19563cec004de30e6d1b764144cfcd277630 100644
--- a/src/mol-view/camera/base.ts
+++ b/src/mol-view/camera/base.ts
@@ -18,6 +18,9 @@ export interface Camera {
direction: Vec3,
up: Vec3,
+ near: number,
+ far: number,
+
translate: (v: Vec3) => void,
reset: () => void,
lookAt: (target: Vec3) => void,
@@ -30,7 +33,9 @@ export const DefaultCameraProps = {
position: Vec3.zero(),
direction: Vec3.create(0, 0, -1),
up: Vec3.create(0, 1, 0),
- viewport: Viewport.create(-1, -1, 1, 1)
+ viewport: Viewport.create(-1, -1, 1, 1),
+ near: 0.1,
+ far: 10000,
}
export type CameraProps = Partial<typeof DefaultCameraProps>
@@ -89,6 +94,12 @@ export namespace Camera {
direction,
up,
+ get far() { return p.far },
+ set far(value: number) { p.far = value },
+
+ get near() { return p.near },
+ set near(value: number) { p.near = value },
+
translate,
reset,
lookAt,
diff --git a/src/mol-view/camera/orthographic.ts b/src/mol-view/camera/orthographic.ts
index e94778a5049a795a95301187acbd685450e40586..0ffdd02fcbce683e436c0030ffe0517135c6ceda 100644
--- a/src/mol-view/camera/orthographic.ts
+++ b/src/mol-view/camera/orthographic.ts
@@ -1,5 +1 @@
-/**
- * Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
- *
- * @author Alexander Rose <alexander.rose@weirdbyte.de>
- */
\ No newline at end of file
+// TODO
\ No newline at end of file
diff --git a/src/mol-view/camera/perspective.ts b/src/mol-view/camera/perspective.ts
index 88745f75464e94e2efa1b11fb4f5a65fc2642d2b..1117fa3b1f6e931fc09a12c79bb3b0bd68b64da9 100644
--- a/src/mol-view/camera/perspective.ts
+++ b/src/mol-view/camera/perspective.ts
@@ -15,8 +15,6 @@ export interface PerspectiveCamera extends Camera {
export const DefaultPerspectiveCameraProps = {
fov: Math.PI / 4,
- near: 0.1,
- far: 10000,
...DefaultCameraProps
}
export type PerspectiveCameraProps = Partial<typeof DefaultPerspectiveCameraProps>
@@ -48,12 +46,6 @@ export namespace PerspectiveCamera {
...camera,
update,
- get far() { return far },
- set far(value: number) { far = value },
-
- get near() { return near },
- set near(value: number) { near = value },
-
get fov() { return fov },
set fov(value: number) { fov = value },
}