Skip to content
Snippets Groups Projects
Commit b8d60cea authored by Alexander Rose's avatar Alexander Rose
Browse files

Canvas3d.fromCanvas attribs

- simplified antialias handling
- expose preserveDrawingBuffer
parent 25b89567
No related branches found
No related tags found
No related merge requests found
...@@ -150,14 +150,24 @@ namespace Canvas3D { ...@@ -150,14 +150,24 @@ namespace Canvas3D {
export interface DragEvent { current: Representation.Loci, buttons: ButtonsType, button: ButtonsType.Flag, modifiers: ModifiersKeys, pageStart: Vec2, pageEnd: Vec2 } export interface DragEvent { current: Representation.Loci, buttons: ButtonsType, button: ButtonsType.Flag, modifiers: ModifiersKeys, pageStart: Vec2, pageEnd: Vec2 }
export interface ClickEvent { current: Representation.Loci, buttons: ButtonsType, button: ButtonsType.Flag, modifiers: ModifiersKeys, page?: Vec2, position?: Vec3 } export interface ClickEvent { current: Representation.Loci, buttons: ButtonsType, button: ButtonsType.Flag, modifiers: ModifiersKeys, page?: Vec2, position?: Vec3 }
export function fromCanvas(canvas: HTMLCanvasElement, props: Partial<Canvas3DProps> = {}, attribs: Partial<{ antialias: boolean, forceAntialias: boolean, pixelScale: number, pickScale: number, enableWboit: boolean }> = {}) {
const antialias = !!attribs.forceAntialias || ((attribs.antialias ?? true) && !attribs.enableWboit); type Attribs = {
/** true by default to avoid issues with Safari (Jan 2021) */
antialias: boolean,
/** true to support multiple viewports with a single context */
preserveDrawingBuffer: boolean,
pixelScale: number,
pickScale: number,
enableWboit: boolean
}
export function fromCanvas(canvas: HTMLCanvasElement, props: Partial<Canvas3DProps> = {}, attribs: Partial<Attribs> = {}) {
const gl = getGLContext(canvas, { const gl = getGLContext(canvas, {
alpha: true, antialias: attribs.antialias ?? true,
antialias, preserveDrawingBuffer: attribs.preserveDrawingBuffer ?? true,
depth: true, alpha: true, // the renderer requires an alpha channel
preserveDrawingBuffer: true, depth: true, // the renderer requires a depth buffer
premultipliedAlpha: true, premultipliedAlpha: true, // the renderer outputs PMA
}); });
if (gl === null) throw new Error('Could not create a WebGL rendering context'); if (gl === null) throw new Error('Could not create a WebGL rendering context');
...@@ -199,14 +209,6 @@ namespace Canvas3D { ...@@ -199,14 +209,6 @@ namespace Canvas3D {
if (isDebugMode) console.log('context restored'); if (isDebugMode) console.log('context restored');
}, false); }, false);
// disable postprocessing anti-aliasing if canvas anti-aliasing is enabled
if (antialias && !props.postprocessing?.antialiasing) {
props.postprocessing = {
...DefaultCanvas3DParams.postprocessing,
antialiasing: { name: 'off', params: {} }
};
}
return create(webgl, input, passes, props, { pixelScale }); return create(webgl, input, passes, props, { pixelScale });
} }
......
/** /**
* Copyright (c) 2020 mol* contributors, licensed under MIT, See LICENSE file for more info. * Copyright (c) 2020-2021 mol* contributors, licensed under MIT, See LICENSE file for more info.
* *
* @author David Sehnal <david.sehnal@gmail.com> * @author David Sehnal <david.sehnal@gmail.com>
* @author Alexander Rose <alexander.rose@weirdbyte.de> * @author Alexander Rose <alexander.rose@weirdbyte.de>
...@@ -24,10 +24,10 @@ export const PluginConfig = { ...@@ -24,10 +24,10 @@ export const PluginConfig = {
General: { General: {
IsBusyTimeoutMs: item('plugin-config.is-busy-timeout', 750), IsBusyTimeoutMs: item('plugin-config.is-busy-timeout', 750),
DisableAntialiasing: item('plugin-config.disable-antialiasing', false), DisableAntialiasing: item('plugin-config.disable-antialiasing', false),
DisablePreserveDrawingBuffer: item('plugin-config.disable-preserve-drawing-buffer', false),
PixelScale: item('plugin-config.pixel-scale', 1), PixelScale: item('plugin-config.pixel-scale', 1),
PickScale: item('plugin-config.pick-scale', 0.25), PickScale: item('plugin-config.pick-scale', 0.25),
EnableWboit: item('plugin-config.enable-wboit', false), EnableWboit: item('plugin-config.enable-wboit', false),
ForceWboitAntialiasing: item('plugin-config.force-wboit-antialiasing', false),
}, },
State: { State: {
DefaultServer: item('plugin-state.server', 'https://webchem.ncbr.muni.cz/molstar-state'), DefaultServer: item('plugin-state.server', 'https://webchem.ncbr.muni.cz/molstar-state'),
......
/** /**
* Copyright (c) 2018-2020 mol* contributors, licensed under MIT, See LICENSE file for more info. * Copyright (c) 2018-2021 mol* contributors, licensed under MIT, See LICENSE file for more info.
* *
* @author David Sehnal <david.sehnal@gmail.com> * @author David Sehnal <david.sehnal@gmail.com>
* @author Alexander Rose <alexander.rose@weirdbyte.de> * @author Alexander Rose <alexander.rose@weirdbyte.de>
...@@ -189,11 +189,11 @@ export class PluginContext { ...@@ -189,11 +189,11 @@ export class PluginContext {
if (this.spec.layout && this.spec.layout.initial) this.layout.setProps(this.spec.layout.initial); if (this.spec.layout && this.spec.layout.initial) this.layout.setProps(this.spec.layout.initial);
const antialias = !(this.config.get(PluginConfig.General.DisableAntialiasing) ?? false); const antialias = !(this.config.get(PluginConfig.General.DisableAntialiasing) ?? false);
const preserveDrawingBuffer = !(this.config.get(PluginConfig.General.DisablePreserveDrawingBuffer) ?? false);
const pixelScale = this.config.get(PluginConfig.General.PixelScale) || 1; const pixelScale = this.config.get(PluginConfig.General.PixelScale) || 1;
const pickScale = this.config.get(PluginConfig.General.PickScale) || 0.25; const pickScale = this.config.get(PluginConfig.General.PickScale) || 0.25;
const enableWboit = this.config.get(PluginConfig.General.EnableWboit) || false; const enableWboit = this.config.get(PluginConfig.General.EnableWboit) || false;
const forceWboitAntialias = !(this.config.get(PluginConfig.General.ForceWboitAntialiasing) ?? false); (this.canvas3d as Canvas3D) = Canvas3D.fromCanvas(canvas, {}, { antialias, preserveDrawingBuffer, pixelScale, enableWboit, pickScale });
(this.canvas3d as Canvas3D) = Canvas3D.fromCanvas(canvas, {}, { antialias, forceAntialias: forceWboitAntialias, pixelScale, enableWboit, pickScale });
this.canvas3dInit.next(true); this.canvas3dInit.next(true);
let props = this.spec.components?.viewport?.canvas3d; let props = this.spec.components?.viewport?.canvas3d;
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment