molstar 4.2.0 → 4.4.0

package/lib/mol-canvas3d/helper/bounding-sphere-helper.d.ts

@@ -27,11 +27,6 @@ export declare class BoundingSphereHelper {
     syncVisibility(): void;
     clear(): void;
     get isEnabled(): boolean;
-    get props(): Readonly<PD.Values<{
-        sceneBoundingSpheres: PD.BooleanParam;
-        visibleSceneBoundingSpheres: PD.BooleanParam;
-        objectBoundingSpheres: PD.BooleanParam;
-        instanceBoundingSpheres: PD.BooleanParam;
-    }>>;
+    get props(): Readonly<DebugHelperProps>;
     setProps(props: Partial<DebugHelperProps>): void;
 }

package/lib/mol-canvas3d/helper/handle-helper.d.ts

@@ -23,6 +23,7 @@ export declare const HandleHelperParams: {
         doubleSided: boolean;
         flipSided: boolean;
         flatShaded: boolean;
+        celShaded: boolean;
         xrayShaded: boolean | "inverted";
         transparentBackfaces: "on" | "off" | "opaque";
         bumpFrequency: number;

package/lib/mol-canvas3d/helper/helper.d.ts

@@ -32,6 +32,7 @@ export declare const HelperParams: {
             doubleSided: any;
             flipSided: any;
             flatShaded: any;
+            celShaded: any;
             xrayShaded: any;
             transparentBackfaces: any;
             bumpFrequency: any;
@@ -70,6 +71,7 @@ export declare const DefaultHelperProps: PD.Values<{
             doubleSided: any;
             flipSided: any;
             flatShaded: any;
+            celShaded: any;
             xrayShaded: any;
             transparentBackfaces: any;
             bumpFrequency: any;

package/lib/mol-canvas3d/passes/dof.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Copyright (c) 2024 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ *
+ * @author Ludovic Autin <autin@scripps.edu>
+ * @author Alexander Rose <alexander.rose@weirdbyte.de>
+ */
+import { WebGLContext } from '../../mol-gl/webgl/context';
+import { Texture } from '../../mol-gl/webgl/texture';
+import { ParamDefinition as PD } from '../../mol-util/param-definition';
+import { Viewport } from '../camera/util';
+import { RenderTarget } from '../../mol-gl/webgl/render-target';
+import { ICamera } from '../../mol-canvas3d/camera';
+import { Sphere3D } from '../../mol-math/geometry';
+import { PostprocessingProps } from './postprocessing';
+export declare const DofParams: {
+    blurSize: PD.Numeric;
+    blurSpread: PD.Numeric;
+    inFocus: PD.Numeric;
+    PPM: PD.Numeric;
+    center: PD.Select<string>;
+    mode: PD.Select<string>;
+};
+export type DofProps = PD.Values<typeof DofParams>;
+export declare class DofPass {
+    private webgl;
+    static isEnabled(props: PostprocessingProps): boolean;
+    readonly target: RenderTarget;
+    private readonly renderable;
+    constructor(webgl: WebGLContext, width: number, height: number);
+    private updateState;
+    setSize(width: number, height: number): void;
+    update(camera: ICamera, input: Texture, depthOpaque: Texture, depthTransparent: Texture, props: DofProps, sphere: Sphere3D): void;
+    render(viewport: Viewport, target: undefined | RenderTarget): void;
+}

package/lib/mol-canvas3d/passes/dof.js

@@ -0,0 +1,163 @@
+/**
+ * Copyright (c) 2024 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ *
+ * @author Ludovic Autin <autin@scripps.edu>
+ * @author Alexander Rose <alexander.rose@weirdbyte.de>
+ */
+import { QuadSchema, QuadValues } from '../../mol-gl/compute/util';
+import { createComputeRenderable } from '../../mol-gl/renderable';
+import { TextureSpec, UniformSpec, DefineSpec } from '../../mol-gl/renderable/schema';
+import { ShaderCode } from '../../mol-gl/shader-code';
+import { createComputeRenderItem } from '../../mol-gl/webgl/render-item';
+import { createNullTexture } from '../../mol-gl/webgl/texture';
+import { Mat4, Vec2, Vec3, Vec4 } from '../../mol-math/linear-algebra';
+import { ValueCell } from '../../mol-util';
+import { ParamDefinition as PD } from '../../mol-util/param-definition';
+import { quad_vert } from '../../mol-gl/shader/quad.vert';
+import { dof_frag } from '../../mol-gl/shader/dof.frag';
+import { isTimingMode } from '../../mol-util/debug';
+export const DofParams = {
+    blurSize: PD.Numeric(9, { min: 1, max: 32, step: 1 }),
+    blurSpread: PD.Numeric(1.0, { min: 0.0, max: 10.0, step: 0.1 }),
+    inFocus: PD.Numeric(0.0, { min: -5000.0, max: 5000.0, step: 1.0 }, { description: 'Distance from the scene center that will be in focus' }),
+    PPM: PD.Numeric(20.0, { min: 0.0, max: 5000.0, step: 0.1 }, { description: 'Size of the area that will be in focus' }),
+    center: PD.Select('camera-target', PD.arrayToOptions(['scene-center', 'camera-target'])),
+    mode: PD.Select('plane', PD.arrayToOptions(['plane', 'sphere'])),
+};
+export class DofPass {
+    static isEnabled(props) {
+        return props.dof.name !== 'off';
+    }
+    constructor(webgl, width, height) {
+        this.webgl = webgl;
+        this.target = webgl.createRenderTarget(width, height, false);
+        const nullTexture = createNullTexture();
+        this.renderable = getDofRenderable(webgl, nullTexture, nullTexture, nullTexture);
+    }
+    updateState(viewport) {
+        const { gl, state } = this.webgl;
+        state.enable(gl.SCISSOR_TEST);
+        state.disable(gl.BLEND);
+        state.disable(gl.DEPTH_TEST);
+        state.depthMask(false);
+        const { x, y, width, height } = viewport;
+        state.viewport(x, y, width, height);
+        state.scissor(x, y, width, height);
+        state.clearColor(0, 0, 0, 1);
+        gl.clear(gl.COLOR_BUFFER_BIT);
+    }
+    setSize(width, height) {
+        const w = this.target.texture.getWidth();
+        const h = this.target.texture.getHeight();
+        if (width !== w || height !== h) {
+            this.target.setSize(width, height);
+            ValueCell.update(this.renderable.values.uTexSize, Vec2.set(this.renderable.values.uTexSize.ref.value, width, height));
+        }
+    }
+    update(camera, input, depthOpaque, depthTransparent, props, sphere) {
+        let needsUpdate = false;
+        if (this.renderable.values.tColor.ref.value !== input) {
+            ValueCell.update(this.renderable.values.tColor, input);
+            needsUpdate = true;
+        }
+        if (this.renderable.values.tDepthOpaque.ref.value !== depthOpaque) {
+            ValueCell.update(this.renderable.values.tDepthOpaque, depthOpaque);
+            needsUpdate = true;
+        }
+        if (this.renderable.values.tDepthTransparent.ref.value !== depthTransparent) {
+            ValueCell.update(this.renderable.values.tDepthTransparent, depthTransparent);
+            needsUpdate = true;
+        }
+        const orthographic = camera.state.mode === 'orthographic' ? 1 : 0;
+        const invProjection = this.renderable.values.uInvProjection.ref.value;
+        Mat4.invert(invProjection, camera.projection);
+        const [w, h] = this.renderable.values.uTexSize.ref.value;
+        const v = camera.viewport;
+        ValueCell.update(this.renderable.values.uProjection, camera.projection);
+        ValueCell.update(this.renderable.values.uInvProjection, invProjection);
+        ValueCell.update(this.renderable.values.uMode, props.mode === 'sphere' ? 1 : 0);
+        Vec4.set(this.renderable.values.uBounds.ref.value, v.x / w, v.y / h, (v.x + v.width) / w, (v.y + v.height) / h);
+        ValueCell.update(this.renderable.values.uBounds, this.renderable.values.uBounds.ref.value);
+        ValueCell.updateIfChanged(this.renderable.values.uNear, camera.near);
+        ValueCell.updateIfChanged(this.renderable.values.uFar, camera.far);
+        ValueCell.updateIfChanged(this.renderable.values.dOrthographic, orthographic);
+        if (this.renderable.values.dBlurSize.ref.value !== props.blurSize) {
+            ValueCell.update(this.renderable.values.dBlurSize, props.blurSize);
+            needsUpdate = true;
+        }
+        const wolrdCenter = (props.center === 'scene-center' ? sphere.center : camera.state.target);
+        const distance = Vec3.distance(camera.state.position, wolrdCenter);
+        const inFocus = distance + props.inFocus;
+        ValueCell.updateIfChanged(this.renderable.values.uInFocus, inFocus);
+        // transform center in view space
+        const center = this.renderable.values.uCenter.ref.value;
+        Vec3.transformMat4(center, wolrdCenter, camera.view);
+        ValueCell.update(this.renderable.values.uCenter, center);
+        ValueCell.updateIfChanged(this.renderable.values.uBlurSpread, props.blurSpread);
+        ValueCell.updateIfChanged(this.renderable.values.uPPM, props.PPM);
+        if (needsUpdate) {
+            this.renderable.update();
+        }
+    }
+    render(viewport, target) {
+        if (isTimingMode)
+            this.webgl.timer.mark('DofPass.render');
+        if (target) {
+            target.bind();
+        }
+        else {
+            this.webgl.unbindFramebuffer();
+        }
+        this.updateState(viewport);
+        this.renderable.render();
+        if (isTimingMode)
+            this.webgl.timer.markEnd('DofPass.render');
+    }
+}
+//
+const DofSchema = {
+    ...QuadSchema,
+    tDepthOpaque: TextureSpec('texture', 'rgba', 'ubyte', 'nearest'),
+    tDepthTransparent: TextureSpec('texture', 'rgba', 'ubyte', 'nearest'),
+    tColor: TextureSpec('texture', 'rgba', 'ubyte', 'nearest'),
+    uTexSize: UniformSpec('v2'),
+    uProjection: UniformSpec('m4'),
+    uInvProjection: UniformSpec('m4'),
+    uBounds: UniformSpec('v4'),
+    uCenter: UniformSpec('v3'),
+    uMode: UniformSpec('i'),
+    dOrthographic: DefineSpec('number'),
+    uNear: UniformSpec('f'),
+    uFar: UniformSpec('f'),
+    dBlurSize: DefineSpec('number'),
+    uBlurSpread: UniformSpec('f'),
+    uInFocus: UniformSpec('f'),
+    uPPM: UniformSpec('f'),
+};
+const DofShaderCode = ShaderCode('dof', quad_vert, dof_frag);
+function getDofRenderable(ctx, colorTexture, depthTextureOpaque, depthTextureTransparent) {
+    const width = colorTexture.getWidth();
+    const height = colorTexture.getHeight();
+    const values = {
+        ...QuadValues,
+        tDepthOpaque: ValueCell.create(depthTextureOpaque),
+        tDepthTransparent: ValueCell.create(depthTextureTransparent),
+        tColor: ValueCell.create(colorTexture),
+        uTexSize: ValueCell.create(Vec2.create(width, height)),
+        uProjection: ValueCell.create(Mat4.identity()),
+        uInvProjection: ValueCell.create(Mat4.identity()),
+        uBounds: ValueCell.create(Vec4()),
+        uCenter: ValueCell.create(Vec3()),
+        uMode: ValueCell.create(0),
+        dOrthographic: ValueCell.create(0),
+        uNear: ValueCell.create(1),
+        uFar: ValueCell.create(10000),
+        dBlurSize: ValueCell.create(5),
+        uBlurSpread: ValueCell.create(300.0),
+        uInFocus: ValueCell.create(20.0),
+        uPPM: ValueCell.create(20.0),
+    };
+    const schema = { ...DofSchema };
+    const renderItem = createComputeRenderItem(ctx, 'triangles', DofShaderCode, schema, values);
+    return createComputeRenderable(renderItem, values);
+}

package/lib/mol-canvas3d/passes/draw.d.ts

@@ -18,6 +18,7 @@ import { DpoitPass } from './dpoit';
 import { AntialiasingPass, PostprocessingPass, PostprocessingProps } from './postprocessing';
 import { MarkingPass, MarkingProps } from './marking';
 import { AssetManager } from '../../mol-util/assets';
+import { DofPass } from './dof';
 import { BloomPass } from './bloom';
 type Props = {
     postprocessing: PostprocessingProps;
@@ -49,6 +50,7 @@ export declare class DrawPass {
     readonly postprocessing: PostprocessingPass;
     readonly antialiasing: AntialiasingPass;
     readonly bloom: BloomPass;
+    readonly dof: DofPass;
     private transparencyMode;
     setTransparency(transparency: 'wboit' | 'dpoit' | 'blended'): void;
     get transparency(): TransparencyMode;

package/lib/mol-canvas3d/passes/draw.js

@@ -15,6 +15,7 @@ import { AntialiasingPass, PostprocessingPass } from './postprocessing';
 import { MarkingPass } from './marking';
 import { createCopyRenderable } from '../../mol-gl/compute/util';
 import { isDebugMode, isTimingMode } from '../../mol-util/debug';
+import { DofPass } from './dof';
 import { BloomPass } from './bloom';
 export class DrawPass {
     setTransparency(transparency) {
@@ -58,6 +59,7 @@ export class DrawPass {
         this.postprocessing = new PostprocessingPass(webgl, assetManager, this);
         this.antialiasing = new AntialiasingPass(webgl, width, height);
         this.bloom = new BloomPass(webgl, width, height);
+        this.dof = new DofPass(webgl, width, height);
         this.copyFboTarget = createCopyRenderable(webgl, this.colorTarget.texture);
         this.copyFboPostprocessing = createCopyRenderable(webgl, this.postprocessing.target.texture);
         this.setTransparency(transparency);
@@ -90,6 +92,7 @@ export class DrawPass {
         this.marking.setSize(width, height);
         this.postprocessing.setSize(width, height);
         this.antialiasing.setSize(width, height);
+        this.dof.setSize(width, height);
         this.bloom.setSize(width, height);
     }
     _renderDpoit(renderer, camera, scene, iterations, transparentBackground, postprocessingProps) {
@@ -102,7 +105,7 @@ export class DrawPass {
             renderer.renderDpoitOpaque(scene.primitives, camera, null);
         }
         if (PostprocessingPass.isEnabled(postprocessingProps)) {
-            if (PostprocessingPass.isTransparentOutlineEnabled(postprocessingProps)) {
+            if (PostprocessingPass.isTransparentOutlineEnabled(postprocessingProps) || DofPass.isEnabled(postprocessingProps)) {
                 this.depthTargetTransparent.bind();
                 renderer.clearDepth(true);
                 if (scene.opacityAverage < 1) {
@@ -147,7 +150,7 @@ export class DrawPass {
             renderer.renderWboitOpaque(scene.primitives, camera, null);
         }
         if (PostprocessingPass.isEnabled(postprocessingProps)) {
-            if (PostprocessingPass.isTransparentOutlineEnabled(postprocessingProps)) {
+            if (PostprocessingPass.isTransparentOutlineEnabled(postprocessingProps) || DofPass.isEnabled(postprocessingProps)) {
                 this.depthTargetTransparent.bind();
                 renderer.clearDepth(true);
                 if (scene.opacityAverage < 1) {
@@ -208,7 +211,7 @@ export class DrawPass {
                 else {
                     (_a = this.colorTarget.depthRenderbuffer) === null || _a === void 0 ? void 0 : _a.detachFramebuffer(this.postprocessing.target.framebuffer);
                 }
-                if (PostprocessingPass.isTransparentOutlineEnabled(postprocessingProps)) {
+                if (PostprocessingPass.isTransparentOutlineEnabled(postprocessingProps) || DofPass.isEnabled(postprocessingProps)) {
                     this.depthTargetTransparent.bind();
                     renderer.clearDepth(true);
                     if (scene.opacityAverage < 1) {
@@ -248,11 +251,12 @@ export class DrawPass {
         }
     }
     _render(renderer, camera, scene, helper, toDrawingBuffer, transparentBackground, props) {
-        var _a;
+        var _a, _b;
         const volumeRendering = scene.volumes.renderables.length > 0;
         const postprocessingEnabled = PostprocessingPass.isEnabled(props.postprocessing);
         const antialiasingEnabled = AntialiasingPass.isEnabled(props.postprocessing);
         const markingEnabled = MarkingPass.isEnabled(props.marking);
+        const dofEnabled = DofPass.isEnabled(props.postprocessing);
         const { x, y, width, height } = camera.viewport;
         renderer.setViewport(x, y, width, height);
         renderer.update(camera, scene);
@@ -305,13 +309,29 @@ export class DrawPass {
             renderer.update(helper.camera.camera, helper.camera.scene);
             renderer.renderBlended(helper.camera.scene, helper.camera.camera);
         }
+        let needsTargetCopy = false;
         if (antialiasingEnabled) {
             const input = PostprocessingPass.isEnabled(props.postprocessing)
                 ? this.postprocessing.target.texture
                 : this.colorTarget.texture;
-            this.antialiasing.render(camera, input, toDrawingBuffer, props.postprocessing);
+            this.antialiasing.render(camera, input, toDrawingBuffer && !dofEnabled, props.postprocessing);
         }
-        else if (toDrawingBuffer) {
+        else if (toDrawingBuffer && !DofPass.isEnabled(props.postprocessing)) {
+            needsTargetCopy = true;
+        }
+        if (props.postprocessing.dof.name === 'on') {
+            const input = AntialiasingPass.isEnabled(props.postprocessing)
+                ? this.antialiasing.target.texture
+                : PostprocessingPass.isEnabled(props.postprocessing)
+                    ? this.postprocessing.target.texture
+                    : this.colorTarget.texture;
+            this.dof.update(camera, input, ((_a = this.depthTargetOpaque) === null || _a === void 0 ? void 0 : _a.texture) || this.depthTextureOpaque, this.depthTextureTransparent, props.postprocessing.dof.params, scene.boundingSphereVisible);
+            this.dof.render(camera.viewport, toDrawingBuffer ? undefined : this.getColorTarget(props.postprocessing));
+        }
+        else if (toDrawingBuffer && !AntialiasingPass.isEnabled(props.postprocessing)) {
+            needsTargetCopy = true;
+        }
+        if (needsTargetCopy) {
             this.drawTarget.bind();
             this.webgl.state.disable(this.webgl.gl.DEPTH_TEST);
             if (postprocessingEnabled) {
@@ -330,7 +350,7 @@ export class DrawPass {
                 renderer.renderEmissive(scene.primitives, camera, null);
             }
             if (!emissiveBloom || scene.emissiveAverage > 0) {
-                this.bloom.update(this.colorTarget.texture, this.bloom.emissiveTarget.texture, ((_a = this.depthTargetOpaque) === null || _a === void 0 ? void 0 : _a.texture) || this.depthTextureOpaque, props.postprocessing.bloom.params);
+                this.bloom.update(this.colorTarget.texture, this.bloom.emissiveTarget.texture, ((_b = this.depthTargetOpaque) === null || _b === void 0 ? void 0 : _b.texture) || this.depthTextureOpaque, props.postprocessing.bloom.params);
                 this.bloom.render(camera.viewport, toDrawingBuffer ? undefined : this.getColorTarget(props.postprocessing));
             }
         }
@@ -364,7 +384,10 @@ export class DrawPass {
             this.webgl.timer.markEnd('DrawPass.render');
     }
     getColorTarget(postprocessingProps) {
-        if (AntialiasingPass.isEnabled(postprocessingProps)) {
+        if (DofPass.isEnabled(postprocessingProps)) {
+            return this.dof.target;
+        }
+        else if (AntialiasingPass.isEnabled(postprocessingProps)) {
             return this.antialiasing.target;
         }
         else if (PostprocessingPass.isEnabled(postprocessingProps)) {

package/lib/mol-canvas3d/passes/image.d.ts

@@ -19,6 +19,7 @@ export declare const ImageParams: {
         mode: string;
         sampleLevel: number;
         reduceFlicker: boolean;
+        reuseOcclusion: boolean;
     }>>;
     postprocessing: PD.Group<PD.Normalize<{
         occlusion: PD.NamedParams<PD.Normalize<unknown>, "off"> | PD.NamedParams<PD.Normalize<{
@@ -27,6 +28,7 @@ export declare const ImageParams: {
             radius: any;
             bias: any;
             blurKernelSize: any;
+            blurDepthBias: any;
             resolutionScale: any;
             color: any;
         }>, "on">;
@@ -42,6 +44,14 @@ export declare const ImageParams: {
             color: any;
             includeTransparent: any;
         }>, "on">;
+        dof: PD.NamedParams<PD.Normalize<unknown>, "off"> | PD.NamedParams<PD.Normalize<{
+            blurSize: any;
+            blurSpread: any;
+            inFocus: any;
+            PPM: any;
+            center: any;
+            mode: any;
+        }>, "on">;
         antialiasing: PD.NamedParams<PD.Normalize<unknown>, "off"> | PD.NamedParams<PD.Normalize<{
             edgeThreshold: any;
             maxSearchSteps: any;

package/lib/mol-canvas3d/passes/multi-sample.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) 2019-2022 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ * Copyright (c) 2019-2024 mol* contributors, licensed under MIT, See LICENSE file for more info.
  *
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
@@ -18,6 +18,7 @@ export declare const MultiSampleParams: {
     mode: PD.Select<string>;
     sampleLevel: PD.Numeric;
     reduceFlicker: PD.BooleanParam;
+    reuseOcclusion: PD.BooleanParam;
 };
 export type MultiSampleProps = PD.Values<typeof MultiSampleParams>;
 type Props = {

package/lib/mol-canvas3d/passes/multi-sample.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) 2019-2022 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ * Copyright (c) 2019-2024 mol* contributors, licensed under MIT, See LICENSE file for more info.
  *
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
@@ -37,6 +37,7 @@ export const MultiSampleParams = {
     mode: PD.Select('temporal', [['off', 'Off'], ['on', 'On'], ['temporal', 'Temporal']]),
     sampleLevel: PD.Numeric(2, { min: 0, max: 5, step: 1 }, { description: 'Take level^2 samples.' }),
     reduceFlicker: PD.Boolean(true, { description: 'Reduce flicker in "temporal" mode.' }),
+    reuseOcclusion: PD.Boolean(true, { description: 'Reuse occlusion data. It is faster but has some artefacts.' }),
 };
 export class MultiSamplePass {
     static isEnabled(props) {
@@ -114,7 +115,7 @@ export class MultiSamplePass {
             const sampleWeight = baseSampleWeight + roundingRange * uniformCenteredDistribution;
             ValueCell.update(compose.values.uWeight, sampleWeight);
             // render scene
-            if (i === 0) {
+            if (i === 0 || !props.multiSample.reuseOcclusion) {
                 drawPass.postprocessing.setOcclusionOffset(0, 0);
             }
             else {
@@ -193,7 +194,7 @@ export class MultiSamplePass {
                 Camera.setViewOffset(camera.viewOffset, width, height, offset[0], offset[1], width, height);
                 camera.update();
                 // render scene
-                if (sampleIndex === 0) {
+                if (sampleIndex === 0 || !props.multiSample.reuseOcclusion) {
                     drawPass.postprocessing.setOcclusionOffset(0, 0);
                 }
                 else {

package/lib/mol-canvas3d/passes/postprocessing.d.ts

@@ -45,6 +45,7 @@ export declare const PostprocessingParams: {
         radius: number;
         bias: number;
         blurKernelSize: number;
+        blurDepthBias: number;
         resolutionScale: number;
         color: Color;
     }>, "on">>;
@@ -60,6 +61,14 @@ export declare const PostprocessingParams: {
         color: Color;
         includeTransparent: boolean;
     }>, "on">>;
+    dof: PD.Mapped<PD.NamedParams<PD.Normalize<unknown>, "off"> | PD.NamedParams<PD.Normalize<{
+        blurSize: number;
+        blurSpread: number;
+        inFocus: number;
+        PPM: number;
+        center: string;
+        mode: string;
+    }>, "on">>;
     antialiasing: PD.Mapped<PD.NamedParams<PD.Normalize<unknown>, "off"> | PD.NamedParams<PD.Normalize<{
         edgeThreshold: number;
         maxSearchSteps: number;

package/lib/mol-canvas3d/passes/postprocessing.js

@@ -25,6 +25,7 @@ import { isTimingMode } from '../../mol-util/debug';
 import { BackgroundParams, BackgroundPass } from './background';
 import { shadows_frag } from '../../mol-gl/shader/shadows.frag';
 import { CasParams, CasPass } from './cas';
+import { DofParams } from './dof';
 import { BloomParams } from './bloom';
 export const OutlinesSchema = {
     ...QuadSchema,
@@ -154,6 +155,7 @@ const SsaoBlurSchema = {
     uTexSize: UniformSpec('v2'),
     uKernel: UniformSpec('f[]'),
     dOcclusionKernelSize: DefineSpec('number'),
+    uBlurDepthBias: UniformSpec('f'),
     uBlurDirectionX: UniformSpec('f'),
     uBlurDirectionY: UniformSpec('f'),
     uInvProjection: UniformSpec('m4'),
@@ -169,6 +171,7 @@ function getSsaoBlurRenderable(ctx, ssaoDepthTexture, direction) {
         uTexSize: ValueCell.create(Vec2.create(ssaoDepthTexture.getWidth(), ssaoDepthTexture.getHeight())),
         uKernel: ValueCell.create(getBlurKernel(15)),
         dOcclusionKernelSize: ValueCell.create(15),
+        uBlurDepthBias: ValueCell.create(0.5),
         uBlurDirectionX: ValueCell.create(direction === 'horizontal' ? 1 : 0),
         uBlurDirectionY: ValueCell.create(direction === 'vertical' ? 1 : 0),
         uInvProjection: ValueCell.create(Mat4.identity()),
@@ -291,6 +294,7 @@ export const PostprocessingParams = {
             radius: PD.Numeric(5, { min: 0, max: 20, step: 0.1 }, { description: 'Final occlusion radius is 2^x', hideIf: p => (p === null || p === void 0 ? void 0 : p.multiScale.name) === 'on' }),
             bias: PD.Numeric(0.8, { min: 0, max: 3, step: 0.1 }),
             blurKernelSize: PD.Numeric(15, { min: 1, max: 25, step: 2 }),
+            blurDepthBias: PD.Numeric(0.5, { min: 0, max: 1, step: 0.01 }),
             resolutionScale: PD.Numeric(1, { min: 0.1, max: 1, step: 0.05 }, { description: 'Adjust resolution of occlusion calculation' }),
             color: PD.Color(Color(0x000000)),
         }),
@@ -314,6 +318,10 @@ export const PostprocessingParams = {
         }),
         off: PD.Group({})
     }, { cycle: true, description: 'Draw outline around 3D objects' }),
+    dof: PD.MappedStatic('off', {
+        on: PD.Group(DofParams),
+        off: PD.Group({})
+    }, { cycle: true, description: 'DOF' }),
     antialiasing: PD.MappedStatic('smaa', {
         fxaa: PD.Group(FxaaParams),
         smaa: PD.Group(SmaaParams),
@@ -475,6 +483,8 @@ export class PostprocessingPass {
             ValueCell.updateIfChanged(this.ssaoBlurSecondPassRenderable.values.uFar, camera.far);
             ValueCell.update(this.ssaoBlurFirstPassRenderable.values.uInvProjection, invProjection);
             ValueCell.update(this.ssaoBlurSecondPassRenderable.values.uInvProjection, invProjection);
+            ValueCell.update(this.ssaoBlurFirstPassRenderable.values.uBlurDepthBias, props.occlusion.params.blurDepthBias);
+            ValueCell.update(this.ssaoBlurSecondPassRenderable.values.uBlurDepthBias, props.occlusion.params.blurDepthBias);
             if (this.ssaoBlurFirstPassRenderable.values.dOrthographic.ref.value !== orthographic) {
                 needsUpdateSsaoBlur = true;
                 ValueCell.update(this.ssaoBlurFirstPassRenderable.values.dOrthographic, orthographic);

package/lib/mol-data/db/column.d.ts

@@ -137,7 +137,7 @@ declare namespace Column {
     function view<T>(column: Column<T>, indices: ArrayLike<number>, checkIndentity?: boolean): Column<T>;
     /** A map of the 1st occurence of each value. */
     function createFirstIndexMap<T>(column: Column<T>): Map<T, number>;
-    function createIndexer<T, R extends number = number>(column: Column<T>): (e: T) => R;
+    function createIndexer<T, R extends number = number>(column: Column<T>): ((e: T) => R);
     function mapToArray<T, S>(column: Column<T>, f: (v: T) => S, ctor?: ArrayCtor<S>): ArrayLike<S>;
     function areEqual<T>(a: Column<T>, b: Column<T>): boolean;
     function indicesOf<T>(c: Column<T>, test: (e: T) => boolean): number[];

package/lib/mol-geo/geometry/base.d.ts

@@ -24,7 +24,7 @@ export declare const VisualQualityInfo: {
     lowest: {};
 };
 export type VisualQuality = keyof typeof VisualQualityInfo;
-export declare const VisualQualityNames: ("auto" | "medium" | "high" | "low" | "custom" | "highest" | "higher" | "lower" | "lowest")[];
+export declare const VisualQualityNames: VisualQuality[];
 export declare const VisualQualityOptions: ["auto" | "medium" | "high" | "low" | "custom" | "highest" | "higher" | "lower" | "lowest", string][];
 export declare const ColorSmoothingParams: {
     smoothColors: PD.Mapped<PD.NamedParams<PD.Normalize<unknown>, "auto"> | PD.NamedParams<PD.Normalize<{

package/lib/mol-geo/geometry/cylinders/cylinders.d.ts

@@ -50,6 +50,7 @@ export declare namespace Cylinders {
         sizeAspectRatio: PD.Numeric;
         doubleSided: PD.BooleanParam;
         ignoreLight: PD.BooleanParam;
+        celShaded: PD.BooleanParam;
         xrayShaded: PD.Select<boolean | "inverted">;
         transparentBackfaces: PD.Select<"on" | "off" | "opaque">;
         solidInterior: PD.BooleanParam;

package/lib/mol-geo/geometry/cylinders/cylinders.js

@@ -117,6 +117,7 @@ export var Cylinders;
         sizeAspectRatio: PD.Numeric(1, { min: 0, max: 3, step: 0.01 }),
         doubleSided: PD.Boolean(false, BaseGeometry.CustomQualityParamInfo),
         ignoreLight: PD.Boolean(false, BaseGeometry.ShadingCategory),
+        celShaded: PD.Boolean(false, BaseGeometry.ShadingCategory),
         xrayShaded: PD.Select(false, [[false, 'Off'], [true, 'On'], ['inverted', 'Inverted']], BaseGeometry.ShadingCategory),
         transparentBackfaces: PD.Select('off', PD.arrayToOptions(['off', 'on', 'opaque']), BaseGeometry.ShadingCategory),
         solidInterior: PD.Boolean(true, BaseGeometry.ShadingCategory),
@@ -199,6 +200,7 @@ export var Cylinders;
             uSizeFactor: ValueCell.create(props.sizeFactor * props.sizeAspectRatio),
             uDoubleSided: ValueCell.create(props.doubleSided),
             dIgnoreLight: ValueCell.create(props.ignoreLight),
+            dCelShaded: ValueCell.create(props.celShaded),
             dXrayShaded: ValueCell.create(props.xrayShaded === 'inverted' ? 'inverted' : props.xrayShaded === true ? 'on' : 'off'),
             dTransparentBackfaces: ValueCell.create(props.transparentBackfaces),
             dSolidInterior: ValueCell.create(props.solidInterior),
@@ -217,6 +219,7 @@ export var Cylinders;
         ValueCell.updateIfChanged(values.uSizeFactor, props.sizeFactor * props.sizeAspectRatio);
         ValueCell.updateIfChanged(values.uDoubleSided, props.doubleSided);
         ValueCell.updateIfChanged(values.dIgnoreLight, props.ignoreLight);
+        ValueCell.updateIfChanged(values.dCelShaded, props.celShaded);
         ValueCell.updateIfChanged(values.dXrayShaded, props.xrayShaded === 'inverted' ? 'inverted' : props.xrayShaded === true ? 'on' : 'off');
         ValueCell.updateIfChanged(values.dTransparentBackfaces, props.transparentBackfaces);
         ValueCell.updateIfChanged(values.dSolidInterior, props.solidInterior);

package/lib/mol-geo/geometry/direct-volume/direct-volume.d.ts

@@ -34,6 +34,7 @@ export declare namespace DirectVolume {
     function createEmpty(directVolume?: DirectVolume): DirectVolume;
     const Params: {
         ignoreLight: PD.BooleanParam;
+        celShaded: PD.BooleanParam;
         xrayShaded: PD.Select<boolean | "inverted">;
         controlPoints: PD.LineGraph;
         stepsPerCell: PD.Numeric;

package/lib/mol-geo/geometry/direct-volume/direct-volume.js

@@ -110,6 +110,7 @@ export var DirectVolume;
     DirectVolume.Params = {
         ...BaseGeometry.Params,
         ignoreLight: PD.Boolean(false, BaseGeometry.ShadingCategory),
+        celShaded: PD.Boolean(false, BaseGeometry.ShadingCategory),
         xrayShaded: PD.Select(false, [[false, 'Off'], [true, 'On'], ['inverted', 'Inverted']], BaseGeometry.ShadingCategory),
         controlPoints: PD.LineGraph([
             Vec2.create(0.19, 0.0), Vec2.create(0.2, 0.05), Vec2.create(0.25, 0.05), Vec2.create(0.26, 0.0),
@@ -215,6 +216,7 @@ export var DirectVolume;
             dPackedGroup: directVolume.packedGroup,
             dAxisOrder: ValueCell.create(directVolume.axisOrder.ref.value.join('')),
             dIgnoreLight: ValueCell.create(props.ignoreLight),
+            dCelShaded: ValueCell.create(props.celShaded),
             dXrayShaded: ValueCell.create(props.xrayShaded === 'inverted' ? 'inverted' : props.xrayShaded === true ? 'on' : 'off'),
         };
     }
@@ -226,6 +228,7 @@ export var DirectVolume;
     function updateValues(values, props) {
         BaseGeometry.updateValues(values, props);
         ValueCell.updateIfChanged(values.dIgnoreLight, props.ignoreLight);
+        ValueCell.updateIfChanged(values.dCelShaded, props.celShaded);
         ValueCell.updateIfChanged(values.dXrayShaded, props.xrayShaded === 'inverted' ? 'inverted' : props.xrayShaded === true ? 'on' : 'off');
         const controlPoints = getControlPointsFromVec2Array(props.controlPoints);
         createTransferFunctionTexture(controlPoints, values.tTransferTex);

package/lib/mol-geo/geometry/image/image.d.ts

@@ -16,7 +16,7 @@ export declare const InterpolationTypes: {
     bspline: string;
 };
 export type InterpolationTypes = keyof typeof InterpolationTypes;
-export declare const InterpolationTypeNames: ("nearest" | "bspline" | "catmulrom" | "mitchell")[];
+export declare const InterpolationTypeNames: InterpolationTypes[];
 export { Image };
 interface Image {
     readonly kind: 'image';

package/lib/mol-geo/geometry/lines/lines.d.ts

@@ -42,7 +42,6 @@ export declare namespace Lines {
         alpha: PD.Numeric;
         quality: PD.Select<"auto" | "medium" | "high" | "low" | "custom" | "highest" | "higher" | "lower" | "lowest">;
         material: PD.Group<PD.Normalize<{
-            /** Wide line */
             metalness: number;
             roughness: number;
             bumpiness: number;

package/lib/mol-geo/geometry/mesh/mesh.d.ts

@@ -63,6 +63,7 @@ export declare namespace Mesh {
         flipSided: PD.BooleanParam;
         flatShaded: PD.BooleanParam;
         ignoreLight: PD.BooleanParam;
+        celShaded: PD.BooleanParam;
         xrayShaded: PD.Select<boolean | "inverted">;
         transparentBackfaces: PD.Select<"on" | "off" | "opaque">;
         bumpFrequency: PD.Numeric;