UNPKG

molstar

Version:

A comprehensive macromolecular library.

599 lines 35.7 kB
"use strict"; /** * Copyright (c) 2018-2021 mol* contributors, licensed under MIT, See LICENSE file for more info. * * @author Alexander Rose <alexander.rose@weirdbyte.de> */ Object.defineProperty(exports, "__esModule", { value: true }); exports.Renderer = exports.getStyle = exports.RendererParams = void 0; var util_1 = require("../mol-canvas3d/camera/util"); var linear_algebra_1 = require("../mol-math/linear-algebra"); var color_1 = require("../mol-util/color"); var mol_util_1 = require("../mol-util"); var param_definition_1 = require("../mol-util/param-definition"); var clipping_1 = require("../mol-theme/clipping"); var string_1 = require("../mol-util/string"); var misc_1 = require("../mol-math/misc"); var texture_1 = require("./webgl/texture"); var array_1 = require("../mol-util/array"); var interpolate_1 = require("../mol-math/interpolate"); exports.RendererParams = { backgroundColor: param_definition_1.ParamDefinition.Color((0, color_1.Color)(0x000000), { description: 'Background color of the 3D canvas' }), // the following are general 'material' parameters pickingAlphaThreshold: param_definition_1.ParamDefinition.Numeric(0.5, { min: 0.0, max: 1.0, step: 0.01 }, { description: 'The minimum opacity value needed for an object to be pickable.' }), interiorDarkening: param_definition_1.ParamDefinition.Numeric(0.5, { min: 0.0, max: 1.0, step: 0.01 }), interiorColorFlag: param_definition_1.ParamDefinition.Boolean(true, { label: 'Use Interior Color' }), interiorColor: param_definition_1.ParamDefinition.Color(color_1.Color.fromNormalizedRgb(0.3, 0.3, 0.3)), highlightColor: param_definition_1.ParamDefinition.Color(color_1.Color.fromNormalizedRgb(1.0, 0.4, 0.6)), selectColor: param_definition_1.ParamDefinition.Color(color_1.Color.fromNormalizedRgb(0.2, 1.0, 0.1)), highlightStrength: param_definition_1.ParamDefinition.Numeric(0.7, { min: 0.0, max: 1.0, step: 0.1 }), selectStrength: param_definition_1.ParamDefinition.Numeric(0.7, { min: 0.0, max: 1.0, step: 0.1 }), markerPriority: param_definition_1.ParamDefinition.Select(1, [[1, 'Highlight'], [2, 'Select']]), xrayEdgeFalloff: param_definition_1.ParamDefinition.Numeric(1, { min: 0.0, max: 3.0, step: 0.1 }), style: param_definition_1.ParamDefinition.MappedStatic('matte', { custom: param_definition_1.ParamDefinition.Group({ lightIntensity: param_definition_1.ParamDefinition.Numeric(0.6, { min: 0.0, max: 1.0, step: 0.01 }), ambientIntensity: param_definition_1.ParamDefinition.Numeric(0.4, { min: 0.0, max: 1.0, step: 0.01 }), metalness: param_definition_1.ParamDefinition.Numeric(0.0, { min: 0.0, max: 1.0, step: 0.01 }), roughness: param_definition_1.ParamDefinition.Numeric(1.0, { min: 0.0, max: 1.0, step: 0.01 }), reflectivity: param_definition_1.ParamDefinition.Numeric(0.5, { min: 0.0, max: 1.0, step: 0.01 }), }, { isExpanded: true }), flat: param_definition_1.ParamDefinition.Group({}), matte: param_definition_1.ParamDefinition.Group({}), glossy: param_definition_1.ParamDefinition.Group({}), metallic: param_definition_1.ParamDefinition.Group({}), plastic: param_definition_1.ParamDefinition.Group({}), }, { label: 'Lighting', description: 'Style in which the 3D scene is rendered/lighted' }), clip: param_definition_1.ParamDefinition.Group({ variant: param_definition_1.ParamDefinition.Select('instance', param_definition_1.ParamDefinition.arrayToOptions(['instance', 'pixel'])), objects: param_definition_1.ParamDefinition.ObjectList({ type: param_definition_1.ParamDefinition.Select('plane', param_definition_1.ParamDefinition.objectToOptions(clipping_1.Clipping.Type, function (t) { return (0, string_1.stringToWords)(t); })), invert: param_definition_1.ParamDefinition.Boolean(false), position: param_definition_1.ParamDefinition.Vec3((0, linear_algebra_1.Vec3)()), rotation: param_definition_1.ParamDefinition.Group({ axis: param_definition_1.ParamDefinition.Vec3(linear_algebra_1.Vec3.create(1, 0, 0)), angle: param_definition_1.ParamDefinition.Numeric(0, { min: -180, max: 180, step: 1 }, { description: 'Angle in Degrees' }), }, { isExpanded: true }), scale: param_definition_1.ParamDefinition.Vec3(linear_algebra_1.Vec3.create(1, 1, 1)), }, function (o) { return (0, string_1.stringToWords)(o.type); }) }) }; function getStyle(props) { switch (props.name) { case 'custom': return props.params; case 'flat': return { lightIntensity: 0, ambientIntensity: 1, metalness: 0, roughness: 0.4, reflectivity: 0.5 }; case 'matte': return { lightIntensity: 0.7, ambientIntensity: 0.3, metalness: 0, roughness: 1, reflectivity: 0.5 }; case 'glossy': return { lightIntensity: 0.7, ambientIntensity: 0.3, metalness: 0, roughness: 0.4, reflectivity: 0.5 }; case 'metallic': return { lightIntensity: 0.7, ambientIntensity: 0.7, metalness: 0.6, roughness: 0.6, reflectivity: 0.5 }; case 'plastic': return { lightIntensity: 0.7, ambientIntensity: 0.3, metalness: 0, roughness: 0.2, reflectivity: 0.5 }; } } exports.getStyle = getStyle; var tmpQuat = (0, linear_algebra_1.Quat)(); function getClip(props, clip) { var _a = (clip === null || clip === void 0 ? void 0 : clip.objects) || { type: (new Array(5)).fill(1), invert: (new Array(5)).fill(false), position: (new Array(5 * 3)).fill(0), rotation: (new Array(5 * 4)).fill(0), scale: (new Array(5 * 3)).fill(1), }, type = _a.type, invert = _a.invert, position = _a.position, rotation = _a.rotation, scale = _a.scale; for (var i = 0, il = props.objects.length; i < il; ++i) { var p = props.objects[i]; type[i] = clipping_1.Clipping.Type[p.type]; invert[i] = p.invert; linear_algebra_1.Vec3.toArray(p.position, position, i * 3); linear_algebra_1.Quat.toArray(linear_algebra_1.Quat.setAxisAngle(tmpQuat, p.rotation.axis, (0, misc_1.degToRad)(p.rotation.angle)), rotation, i * 4); linear_algebra_1.Vec3.toArray(p.scale, scale, i * 3); } return { variant: props.variant, objects: { count: props.objects.length, type: type, invert: invert, position: position, rotation: rotation, scale: scale } }; } var Renderer; (function (Renderer) { function create(ctx, props) { if (props === void 0) { props = {}; } var gl = ctx.gl, state = ctx.state, stats = ctx.stats, fragDepth = ctx.extensions.fragDepth; var p = param_definition_1.ParamDefinition.merge(exports.RendererParams, param_definition_1.ParamDefinition.getDefaultValues(exports.RendererParams), props); var style = getStyle(p.style); var clip = getClip(p.clip); var viewport = (0, util_1.Viewport)(); var drawingBufferSize = linear_algebra_1.Vec2.create(gl.drawingBufferWidth, gl.drawingBufferHeight); var bgColor = color_1.Color.toVec3Normalized((0, linear_algebra_1.Vec3)(), p.backgroundColor); var transparentBackground = false; var nullDepthTexture = (0, texture_1.createNullTexture)(gl); var sharedTexturesList = [ ['tDepth', nullDepthTexture] ]; var view = (0, linear_algebra_1.Mat4)(); var invView = (0, linear_algebra_1.Mat4)(); var modelView = (0, linear_algebra_1.Mat4)(); var invModelView = (0, linear_algebra_1.Mat4)(); var invProjection = (0, linear_algebra_1.Mat4)(); var modelViewProjection = (0, linear_algebra_1.Mat4)(); var invModelViewProjection = (0, linear_algebra_1.Mat4)(); var cameraDir = (0, linear_algebra_1.Vec3)(); var viewOffset = (0, linear_algebra_1.Vec2)(); var globalUniforms = { uModel: mol_util_1.ValueCell.create(linear_algebra_1.Mat4.identity()), uView: mol_util_1.ValueCell.create(view), uInvView: mol_util_1.ValueCell.create(invView), uModelView: mol_util_1.ValueCell.create(modelView), uInvModelView: mol_util_1.ValueCell.create(invModelView), uInvProjection: mol_util_1.ValueCell.create(invProjection), uProjection: mol_util_1.ValueCell.create((0, linear_algebra_1.Mat4)()), uModelViewProjection: mol_util_1.ValueCell.create(modelViewProjection), uInvModelViewProjection: mol_util_1.ValueCell.create(invModelViewProjection), uIsOrtho: mol_util_1.ValueCell.create(1), uViewOffset: mol_util_1.ValueCell.create(viewOffset), uPixelRatio: mol_util_1.ValueCell.create(ctx.pixelRatio), uViewport: mol_util_1.ValueCell.create(util_1.Viewport.toVec4((0, linear_algebra_1.Vec4)(), viewport)), uDrawingBufferSize: mol_util_1.ValueCell.create(drawingBufferSize), uCameraPosition: mol_util_1.ValueCell.create((0, linear_algebra_1.Vec3)()), uCameraDir: mol_util_1.ValueCell.create(cameraDir), uNear: mol_util_1.ValueCell.create(1), uFar: mol_util_1.ValueCell.create(10000), uFogNear: mol_util_1.ValueCell.create(1), uFogFar: mol_util_1.ValueCell.create(10000), uFogColor: mol_util_1.ValueCell.create(bgColor), uRenderWboit: mol_util_1.ValueCell.create(false), uMarkingDepthTest: mol_util_1.ValueCell.create(false), uTransparentBackground: mol_util_1.ValueCell.create(false), uClipObjectType: mol_util_1.ValueCell.create(clip.objects.type), uClipObjectInvert: mol_util_1.ValueCell.create(clip.objects.invert), uClipObjectPosition: mol_util_1.ValueCell.create(clip.objects.position), uClipObjectRotation: mol_util_1.ValueCell.create(clip.objects.rotation), uClipObjectScale: mol_util_1.ValueCell.create(clip.objects.scale), // the following are general 'material' uniforms uLightIntensity: mol_util_1.ValueCell.create(style.lightIntensity), uAmbientIntensity: mol_util_1.ValueCell.create(style.ambientIntensity), uMetalness: mol_util_1.ValueCell.create(style.metalness), uRoughness: mol_util_1.ValueCell.create(style.roughness), uReflectivity: mol_util_1.ValueCell.create(style.reflectivity), uPickingAlphaThreshold: mol_util_1.ValueCell.create(p.pickingAlphaThreshold), uInteriorDarkening: mol_util_1.ValueCell.create(p.interiorDarkening), uInteriorColorFlag: mol_util_1.ValueCell.create(p.interiorColorFlag), uInteriorColor: mol_util_1.ValueCell.create(color_1.Color.toVec3Normalized((0, linear_algebra_1.Vec3)(), p.interiorColor)), uHighlightColor: mol_util_1.ValueCell.create(color_1.Color.toVec3Normalized((0, linear_algebra_1.Vec3)(), p.highlightColor)), uSelectColor: mol_util_1.ValueCell.create(color_1.Color.toVec3Normalized((0, linear_algebra_1.Vec3)(), p.selectColor)), uHighlightStrength: mol_util_1.ValueCell.create(p.highlightStrength), uSelectStrength: mol_util_1.ValueCell.create(p.selectStrength), uMarkerPriority: mol_util_1.ValueCell.create(p.markerPriority), uXrayEdgeFalloff: mol_util_1.ValueCell.create(p.xrayEdgeFalloff), }; var globalUniformList = Object.entries(globalUniforms); var globalUniformsNeedUpdate = true; var renderObject = function (r, variant) { if (r.state.disposed || !r.state.visible || (!r.state.pickable && variant[0] === 'p')) { return; } var definesNeedUpdate = false; if (r.state.noClip) { if (r.values.dClipObjectCount.ref.value !== 0) { mol_util_1.ValueCell.update(r.values.dClipObjectCount, 0); definesNeedUpdate = true; } } else { if (r.values.dClipObjectCount.ref.value !== clip.objects.count) { mol_util_1.ValueCell.update(r.values.dClipObjectCount, clip.objects.count); definesNeedUpdate = true; } if (r.values.dClipVariant.ref.value !== clip.variant) { mol_util_1.ValueCell.update(r.values.dClipVariant, clip.variant); definesNeedUpdate = true; } } if (definesNeedUpdate) r.update(); var program = r.getProgram(variant); if (state.currentProgramId !== program.id) { // console.log('new program') globalUniformsNeedUpdate = true; program.use(); } if (globalUniformsNeedUpdate) { // console.log('globalUniformsNeedUpdate') program.setUniforms(globalUniformList); globalUniformsNeedUpdate = false; } if (r.values.dRenderMode) { // indicates direct-volume // culling done in fragment shader state.disable(gl.CULL_FACE); state.frontFace(gl.CCW); if (variant === 'colorBlended') { // depth test done manually in shader against `depthTexture` // still need to enable when fragDepth can be used to write depth if (r.values.dRenderMode.ref.value === 'volume' || !fragDepth) { state.disable(gl.DEPTH_TEST); state.depthMask(false); } else { state.enable(gl.DEPTH_TEST); state.depthMask(r.values.uAlpha.ref.value === 1.0); } } } else { if (r.values.dDoubleSided) { if (r.values.dDoubleSided.ref.value || r.values.hasReflection.ref.value) { state.disable(gl.CULL_FACE); } else { state.enable(gl.CULL_FACE); } } else { // webgl default state.disable(gl.CULL_FACE); } if (r.values.dFlipSided) { if (r.values.dFlipSided.ref.value) { state.frontFace(gl.CW); state.cullFace(gl.FRONT); } else { state.frontFace(gl.CCW); state.cullFace(gl.BACK); } } else { // webgl default state.frontFace(gl.CCW); state.cullFace(gl.BACK); } } r.render(variant, sharedTexturesList); }; var update = function (camera) { mol_util_1.ValueCell.update(globalUniforms.uView, camera.view); mol_util_1.ValueCell.update(globalUniforms.uInvView, linear_algebra_1.Mat4.invert(invView, camera.view)); mol_util_1.ValueCell.update(globalUniforms.uProjection, camera.projection); mol_util_1.ValueCell.update(globalUniforms.uInvProjection, linear_algebra_1.Mat4.invert(invProjection, camera.projection)); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uIsOrtho, camera.state.mode === 'orthographic' ? 1 : 0); mol_util_1.ValueCell.update(globalUniforms.uViewOffset, camera.viewOffset.enabled ? linear_algebra_1.Vec2.set(viewOffset, camera.viewOffset.offsetX * 16, camera.viewOffset.offsetY * 16) : linear_algebra_1.Vec2.set(viewOffset, 0, 0)); mol_util_1.ValueCell.update(globalUniforms.uCameraPosition, camera.state.position); mol_util_1.ValueCell.update(globalUniforms.uCameraDir, linear_algebra_1.Vec3.normalize(cameraDir, linear_algebra_1.Vec3.sub(cameraDir, camera.state.target, camera.state.position))); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uFar, camera.far); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uNear, camera.near); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uFogFar, camera.fogFar); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uFogNear, camera.fogNear); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uTransparentBackground, transparentBackground); }; var updateInternal = function (group, camera, depthTexture, renderWboit, markingDepthTest) { (0, array_1.arrayMapUpsert)(sharedTexturesList, 'tDepth', depthTexture || nullDepthTexture); mol_util_1.ValueCell.update(globalUniforms.uModel, group.view); mol_util_1.ValueCell.update(globalUniforms.uModelView, linear_algebra_1.Mat4.mul(modelView, group.view, camera.view)); mol_util_1.ValueCell.update(globalUniforms.uInvModelView, linear_algebra_1.Mat4.invert(invModelView, modelView)); mol_util_1.ValueCell.update(globalUniforms.uModelViewProjection, linear_algebra_1.Mat4.mul(modelViewProjection, modelView, camera.projection)); mol_util_1.ValueCell.update(globalUniforms.uInvModelViewProjection, linear_algebra_1.Mat4.invert(invModelViewProjection, modelViewProjection)); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uRenderWboit, renderWboit); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uMarkingDepthTest, markingDepthTest); state.enable(gl.SCISSOR_TEST); state.colorMask(true, true, true, true); var x = viewport.x, y = viewport.y, width = viewport.width, height = viewport.height; gl.viewport(x, y, width, height); gl.scissor(x, y, width, height); globalUniformsNeedUpdate = true; state.currentRenderItemId = -1; }; var renderPick = function (group, camera, variant, depthTexture) { state.disable(gl.BLEND); state.enable(gl.DEPTH_TEST); state.depthMask(true); updateInternal(group, camera, depthTexture, false, false); var renderables = group.renderables; for (var i = 0, il = renderables.length; i < il; ++i) { if (!renderables[i].state.colorOnly) { renderObject(renderables[i], variant); } } }; var renderDepth = function (group, camera, depthTexture) { state.disable(gl.BLEND); state.enable(gl.DEPTH_TEST); state.depthMask(true); updateInternal(group, camera, depthTexture, false, false); var renderables = group.renderables; for (var i = 0, il = renderables.length; i < il; ++i) { renderObject(renderables[i], 'depth'); } }; var renderMarkingDepth = function (group, camera, depthTexture) { state.disable(gl.BLEND); state.enable(gl.DEPTH_TEST); state.depthMask(true); updateInternal(group, camera, depthTexture, false, false); var renderables = group.renderables; for (var i = 0, il = renderables.length; i < il; ++i) { var r = renderables[i]; if (r.values.markerAverage.ref.value !== 1) { renderObject(renderables[i], 'markingDepth'); } } }; var renderMarkingMask = function (group, camera, depthTexture) { state.disable(gl.BLEND); state.enable(gl.DEPTH_TEST); state.depthMask(true); updateInternal(group, camera, depthTexture, false, !!depthTexture); var renderables = group.renderables; for (var i = 0, il = renderables.length; i < il; ++i) { var r = renderables[i]; if (r.values.markerAverage.ref.value > 0) { renderObject(renderables[i], 'markingMask'); } } }; var renderBlended = function (group, camera, depthTexture) { renderBlendedOpaque(group, camera, depthTexture); renderBlendedTransparent(group, camera, depthTexture); }; var renderBlendedOpaque = function (group, camera, depthTexture) { state.disable(gl.BLEND); state.enable(gl.DEPTH_TEST); state.depthMask(true); updateInternal(group, camera, depthTexture, false, false); var renderables = group.renderables; for (var i = 0, il = renderables.length; i < il; ++i) { var r = renderables[i]; if (r.state.opaque) { renderObject(r, 'colorBlended'); } } }; var renderBlendedTransparent = function (group, camera, depthTexture) { state.enable(gl.DEPTH_TEST); updateInternal(group, camera, depthTexture, false, false); var renderables = group.renderables; if (transparentBackground) { state.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); } else { state.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE_MINUS_SRC_ALPHA); } state.enable(gl.BLEND); state.depthMask(true); for (var i = 0, il = renderables.length; i < il; ++i) { var r = renderables[i]; if (!r.state.opaque && r.state.writeDepth) { renderObject(r, 'colorBlended'); } } state.depthMask(false); for (var i = 0, il = renderables.length; i < il; ++i) { var r = renderables[i]; if (!r.state.opaque && !r.state.writeDepth) { renderObject(r, 'colorBlended'); } } }; var renderBlendedVolumeOpaque = function (group, camera, depthTexture) { var _a; state.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); state.enable(gl.BLEND); updateInternal(group, camera, depthTexture, false, false); var renderables = group.renderables; for (var i = 0, il = renderables.length; i < il; ++i) { var r = renderables[i]; // TODO: simplify, handle in renderable.state??? // uAlpha is updated in "render" so we need to recompute it here var alpha = (0, interpolate_1.clamp)(r.values.alpha.ref.value * r.state.alphaFactor, 0, 1); if (alpha === 1 && r.values.transparencyAverage.ref.value !== 1 && !((_a = r.values.dXrayShaded) === null || _a === void 0 ? void 0 : _a.ref.value)) { renderObject(r, 'colorBlended'); } } }; var renderBlendedVolumeTransparent = function (group, camera, depthTexture) { var _a; state.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); state.enable(gl.BLEND); updateInternal(group, camera, depthTexture, false, false); var renderables = group.renderables; for (var i = 0, il = renderables.length; i < il; ++i) { var r = renderables[i]; // TODO: simplify, handle in renderable.state??? // uAlpha is updated in "render" so we need to recompute it here var alpha = (0, interpolate_1.clamp)(r.values.alpha.ref.value * r.state.alphaFactor, 0, 1); if (alpha < 1 || r.values.transparencyAverage.ref.value > 0 || ((_a = r.values.dXrayShaded) === null || _a === void 0 ? void 0 : _a.ref.value)) { renderObject(r, 'colorBlended'); } } }; var renderWboitOpaque = function (group, camera, depthTexture) { var _a, _b, _c; state.disable(gl.BLEND); state.enable(gl.DEPTH_TEST); state.depthMask(true); updateInternal(group, camera, depthTexture, false, false); var renderables = group.renderables; for (var i = 0, il = renderables.length; i < il; ++i) { var r = renderables[i]; // TODO: simplify, handle in renderable.state??? // uAlpha is updated in "render" so we need to recompute it here var alpha = (0, interpolate_1.clamp)(r.values.alpha.ref.value * r.state.alphaFactor, 0, 1); if (alpha === 1 && r.values.transparencyAverage.ref.value !== 1 && ((_a = r.values.dRenderMode) === null || _a === void 0 ? void 0 : _a.ref.value) !== 'volume' && ((_b = r.values.dPointStyle) === null || _b === void 0 ? void 0 : _b.ref.value) !== 'fuzzy' && !((_c = r.values.dXrayShaded) === null || _c === void 0 ? void 0 : _c.ref.value)) { renderObject(r, 'colorWboit'); } } }; var renderWboitTransparent = function (group, camera, depthTexture) { var _a, _b, _c; updateInternal(group, camera, depthTexture, true, false); var renderables = group.renderables; for (var i = 0, il = renderables.length; i < il; ++i) { var r = renderables[i]; // TODO: simplify, handle in renderable.state??? // uAlpha is updated in "render" so we need to recompute it here var alpha = (0, interpolate_1.clamp)(r.values.alpha.ref.value * r.state.alphaFactor, 0, 1); if (alpha < 1 || r.values.transparencyAverage.ref.value > 0 || ((_a = r.values.dRenderMode) === null || _a === void 0 ? void 0 : _a.ref.value) === 'volume' || ((_b = r.values.dPointStyle) === null || _b === void 0 ? void 0 : _b.ref.value) === 'fuzzy' || !!r.values.uBackgroundColor || ((_c = r.values.dXrayShaded) === null || _c === void 0 ? void 0 : _c.ref.value)) { renderObject(r, 'colorWboit'); } } }; return { clear: function (toBackgroundColor) { state.enable(gl.SCISSOR_TEST); state.enable(gl.DEPTH_TEST); state.colorMask(true, true, true, true); state.depthMask(true); if (transparentBackground) { state.clearColor(0, 0, 0, 0); } else if (toBackgroundColor) { state.clearColor(bgColor[0], bgColor[1], bgColor[2], 1); } else { state.clearColor(1, 1, 1, 1); } gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); }, clearDepth: function () { state.enable(gl.SCISSOR_TEST); state.enable(gl.DEPTH_TEST); state.depthMask(true); gl.clear(gl.DEPTH_BUFFER_BIT); }, update: update, renderPick: renderPick, renderDepth: renderDepth, renderMarkingDepth: renderMarkingDepth, renderMarkingMask: renderMarkingMask, renderBlended: renderBlended, renderBlendedOpaque: renderBlendedOpaque, renderBlendedTransparent: renderBlendedTransparent, renderBlendedVolumeOpaque: renderBlendedVolumeOpaque, renderBlendedVolumeTransparent: renderBlendedVolumeTransparent, renderWboitOpaque: renderWboitOpaque, renderWboitTransparent: renderWboitTransparent, setProps: function (props) { if (props.backgroundColor !== undefined && props.backgroundColor !== p.backgroundColor) { p.backgroundColor = props.backgroundColor; color_1.Color.toVec3Normalized(bgColor, p.backgroundColor); mol_util_1.ValueCell.update(globalUniforms.uFogColor, linear_algebra_1.Vec3.copy(globalUniforms.uFogColor.ref.value, bgColor)); } if (props.pickingAlphaThreshold !== undefined && props.pickingAlphaThreshold !== p.pickingAlphaThreshold) { p.pickingAlphaThreshold = props.pickingAlphaThreshold; mol_util_1.ValueCell.update(globalUniforms.uPickingAlphaThreshold, p.pickingAlphaThreshold); } if (props.interiorDarkening !== undefined && props.interiorDarkening !== p.interiorDarkening) { p.interiorDarkening = props.interiorDarkening; mol_util_1.ValueCell.update(globalUniforms.uInteriorDarkening, p.interiorDarkening); } if (props.interiorColorFlag !== undefined && props.interiorColorFlag !== p.interiorColorFlag) { p.interiorColorFlag = props.interiorColorFlag; mol_util_1.ValueCell.update(globalUniforms.uInteriorColorFlag, p.interiorColorFlag); } if (props.interiorColor !== undefined && props.interiorColor !== p.interiorColor) { p.interiorColor = props.interiorColor; mol_util_1.ValueCell.update(globalUniforms.uInteriorColor, color_1.Color.toVec3Normalized(globalUniforms.uInteriorColor.ref.value, p.interiorColor)); } if (props.highlightColor !== undefined && props.highlightColor !== p.highlightColor) { p.highlightColor = props.highlightColor; mol_util_1.ValueCell.update(globalUniforms.uHighlightColor, color_1.Color.toVec3Normalized(globalUniforms.uHighlightColor.ref.value, p.highlightColor)); } if (props.selectColor !== undefined && props.selectColor !== p.selectColor) { p.selectColor = props.selectColor; mol_util_1.ValueCell.update(globalUniforms.uSelectColor, color_1.Color.toVec3Normalized(globalUniforms.uSelectColor.ref.value, p.selectColor)); } if (props.highlightStrength !== undefined && props.highlightStrength !== p.highlightStrength) { p.highlightStrength = props.highlightStrength; mol_util_1.ValueCell.update(globalUniforms.uHighlightStrength, p.highlightStrength); } if (props.selectStrength !== undefined && props.selectStrength !== p.selectStrength) { p.selectStrength = props.selectStrength; mol_util_1.ValueCell.update(globalUniforms.uSelectStrength, p.selectStrength); } if (props.markerPriority !== undefined && props.markerPriority !== p.markerPriority) { p.markerPriority = props.markerPriority; mol_util_1.ValueCell.update(globalUniforms.uMarkerPriority, p.markerPriority); } if (props.xrayEdgeFalloff !== undefined && props.xrayEdgeFalloff !== p.xrayEdgeFalloff) { p.xrayEdgeFalloff = props.xrayEdgeFalloff; mol_util_1.ValueCell.update(globalUniforms.uXrayEdgeFalloff, p.xrayEdgeFalloff); } if (props.style !== undefined) { p.style = props.style; Object.assign(style, getStyle(props.style)); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uLightIntensity, style.lightIntensity); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uAmbientIntensity, style.ambientIntensity); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uMetalness, style.metalness); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uRoughness, style.roughness); mol_util_1.ValueCell.updateIfChanged(globalUniforms.uReflectivity, style.reflectivity); } if (props.clip !== undefined && !(0, mol_util_1.deepEqual)(props.clip, p.clip)) { p.clip = props.clip; Object.assign(clip, getClip(props.clip, clip)); mol_util_1.ValueCell.update(globalUniforms.uClipObjectPosition, clip.objects.position); mol_util_1.ValueCell.update(globalUniforms.uClipObjectRotation, clip.objects.rotation); mol_util_1.ValueCell.update(globalUniforms.uClipObjectScale, clip.objects.scale); mol_util_1.ValueCell.update(globalUniforms.uClipObjectType, clip.objects.type); } }, setViewport: function (x, y, width, height) { gl.viewport(x, y, width, height); gl.scissor(x, y, width, height); if (x !== viewport.x || y !== viewport.y || width !== viewport.width || height !== viewport.height) { util_1.Viewport.set(viewport, x, y, width, height); mol_util_1.ValueCell.update(globalUniforms.uViewport, linear_algebra_1.Vec4.set(globalUniforms.uViewport.ref.value, x, y, width, height)); } }, setTransparentBackground: function (value) { transparentBackground = value; }, setDrawingBufferSize: function (width, height) { if (width !== drawingBufferSize[0] || height !== drawingBufferSize[1]) { mol_util_1.ValueCell.update(globalUniforms.uDrawingBufferSize, linear_algebra_1.Vec2.set(drawingBufferSize, width, height)); } }, setPixelRatio: function (value) { mol_util_1.ValueCell.update(globalUniforms.uPixelRatio, value); }, props: p, get stats() { return { programCount: ctx.stats.resourceCounts.program, shaderCount: ctx.stats.resourceCounts.shader, attributeCount: ctx.stats.resourceCounts.attribute, elementsCount: ctx.stats.resourceCounts.elements, framebufferCount: ctx.stats.resourceCounts.framebuffer, renderbufferCount: ctx.stats.resourceCounts.renderbuffer, textureCount: ctx.stats.resourceCounts.texture, vertexArrayCount: ctx.stats.resourceCounts.vertexArray, drawCount: stats.drawCount, instanceCount: stats.instanceCount, instancedDrawCount: stats.instancedDrawCount, }; }, dispose: function () { // TODO } }; } Renderer.create = create; })(Renderer || (Renderer = {})); exports.Renderer = Renderer; //# sourceMappingURL=renderer.js.map