drugflow-molstar 0.2.0 → 0.2.2

package/lib/index.js

@@ -1,1239 +1,1274 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var spec_1 = require("./spec");
-var commands_1 = require("Molstar/mol-plugin/commands");
-var mol_state_1 = require("Molstar/mol-state");
-var loci_1 = require("Molstar/mol-model/loci");
-var rx_event_helper_1 = require("Molstar/mol-util/rx-event-helper");
-var helpers_1 = require("./helpers");
-var pdbe_structure_controls_1 = require("./ui/pdbe-structure-controls");
-var pdbe_viewport_controls_1 = require("./ui/pdbe-viewport-controls");
-var mol_state_2 = require("Molstar/mol-state");
-var structure_focus_representation_1 = require("Molstar/mol-plugin/behavior/dynamic/selection/structure-focus-representation");
-var spec_2 = require("Molstar/mol-plugin/spec");
-var transformers_1 = require("Molstar/mol-plugin/behavior/dynamic/volume-streaming/transformers");
-var structure_representation_params_1 = require("Molstar/mol-plugin-state/helpers/structure-representation-params");
-var subscribe_events_1 = require("./subscribe-events");
-var pdbe_left_panel_1 = require("./ui/pdbe-left-panel");
-var superposition_1 = require("./superposition");
-var custom_events_1 = require("./custom-events");
-var assets_1 = require("Molstar/mol-util/assets");
-var config_1 = require("Molstar/mol-plugin/config");
-var color_1 = require("Molstar/mol-util/color/color");
-var component_1 = require("Molstar/mol-plugin-state/manager/structure/component");
-var param_definition_1 = require("Molstar/mol-util/param-definition");
-var behavior_1 = require("./domain-annotations/behavior");
-var pdbe_1 = require("Molstar/extensions/pdbe");
-var behavior_2 = require("Molstar/extensions/model-archive/quality-assessment/behavior");
-var structure_overpaint_1 = require("Molstar/mol-plugin-state/helpers/structure-overpaint");
-var superposition_focus_representation_1 = require("./superposition-focus-representation");
-var superposition_viewport_1 = require("./ui/superposition-viewport");
-var representation_1 = require("Molstar/mol-plugin/behavior/dynamic/representation");
-var camera_1 = require("molstar/lib/mol-plugin/behavior/dynamic/camera");
-var mp4_export_1 = require("Molstar/extensions/mp4-export");
-var geo_export_1 = require("Molstar/extensions/geo-export");
-var element_symbol_1 = require("Molstar/mol-theme/color/element-symbol");
-var model_index_1 = require("Molstar/mol-plugin-state/animation/built-in/model-index");
-var camera_spin_1 = require("Molstar/mol-plugin-state/animation/built-in/camera-spin");
-var state_snapshots_1 = require("Molstar/mol-plugin-state/animation/built-in/state-snapshots");
-var state_interpolation_1 = require("Molstar/mol-plugin-state/animation/built-in/state-interpolation");
-var spin_structure_1 = require("Molstar/mol-plugin-state/animation/built-in/spin-structure");
-var camera_rock_1 = require("Molstar/mol-plugin-state/animation/built-in/camera-rock");
-var assembly_unwind_1 = require("Molstar/mol-plugin-state/animation/built-in/assembly-unwind");
-var builder_1 = require("molstar/lib/mol-script/language/builder");
-var names_1 = require("molstar/lib/mol-util/color/names");
-var units_visual_1 = require("molstar/lib/mol-repr/structure/units-visual");
-var param_definition_2 = require("molstar/lib/mol-util/param-definition");
-var representation_2 = require("molstar/lib/mol-repr/structure/representation");
-var structure_selection_query_1 = require("molstar/lib/mol-plugin-state/helpers/structure-selection-query");
-var representation_3 = require("molstar/lib/mol-repr/representation");
-var box_1 = require("molstar/lib/mol-geo/geometry/mesh/builder/box");
-var mesh_builder_1 = require("molstar/lib/mol-geo/geometry/mesh/mesh-builder");
-var linear_algebra_1 = require("molstar/lib/mol-math/linear-algebra");
-var int_1 = require("molstar/lib/mol-data/int");
-var location_iterator_1 = require("molstar/lib/mol-geo/util/location-iterator");
-var location_1 = require("molstar/lib/mol-model/location");
-var loci_2 = require("molstar/lib/mol-model/loci");
-var structure_1 = require("molstar/lib/mol-model/structure");
-var mol_task_1 = require("molstar/lib/mol-task");
-require('Molstar/mol-plugin-ui/skin/dark.scss');
-var PDBeMolstarPlugin = /** @class */ (function () {
-    function PDBeMolstarPlugin() {
-        var _this = this;
-        this._ev = rx_event_helper_1.RxEventHelper.create();
-        this.events = {
-            loadComplete: this._ev()
-        };
-        this.assemblyRef = '';
-        this.isHighlightColorUpdated = false;
-        this.isSelectedColorUpdated = false;
-        this.get_quick_querys = function (structure, pdb_string) {
-            var ligand_queries = _this.get_ligand_queries(pdb_string);
-            var chain_queries = _this.get_chain_queries(structure.data);
-            var pocket_queries = _this.get_pocket_queries(ligand_queries, 5);
-            var water = structure_selection_query_1.StructureSelectionQueries.water;
-            return {
-                ligands: ligand_queries,
-                chains: chain_queries,
-                pockets: pocket_queries,
-                water: [water]
-            };
-        };
-        this.get_pocket_queries = function (ligand_queries, radius) {
-            // 同名的ligand_query会被合并
-            var queries = [];
-            for (var i = 0; i < ligand_queries.length; i++) {
-                var label = _this.get_ligand_query_name(ligand_queries[i]);
-                var core = builder_1.MolScriptBuilder.struct.generator.atomGroups({
-                    'residue-test': builder_1.MolScriptBuilder.core.set.has([builder_1.MolScriptBuilder.set.apply(builder_1.MolScriptBuilder, [label]), builder_1.MolScriptBuilder.ammp('auth_comp_id')])
-                });
-                var surrounding = builder_1.MolScriptBuilder.struct.modifier.union([
-                    builder_1.MolScriptBuilder.struct.modifier.exceptBy({
-                        0: builder_1.MolScriptBuilder.struct.modifier.includeSurroundings({
-                            0: core,
-                            radius: radius,
-                            'as-whole-residues': true
-                        }),
-                        by: core
-                    })
-                ]);
-                var ligand_expand_q = (0, structure_selection_query_1.StructureSelectionQuery)('Surrounding Residues (5 \u212B) of ' + label, surrounding, {
-                    description: 'Select residues within 5 \u212B of ' + label,
-                    category: structure_selection_query_1.StructureSelectionCategory.Manipulate,
-                    referencesCurrent: true
-                });
-                queries.push({ query: ligand_expand_q, expression: surrounding, label: label });
-            }
-            return queries;
-        };
-        this.ownResidueQuery = function (chain_name, residue_name_list, residue_id, category, priority) {
-            if (priority === void 0) {
-                priority = 0;
-            }
-            var description = '[' + residue_name_list[0] + ']|' + chain_name + ':' + residue_name_list[0] + ':' + residue_id;
-            return (0, structure_selection_query_1.StructureSelectionQuery)(description, builder_1.MolScriptBuilder.struct.modifier.union([
-                builder_1.MolScriptBuilder.struct.generator.atomGroups({
-                    'chain-test': builder_1.MolScriptBuilder.core.rel.eq([builder_1.MolScriptBuilder.ammp('auth_asym_id'), chain_name]),
-                    'residue-test': builder_1.MolScriptBuilder.core.rel.eq([builder_1.MolScriptBuilder.ammp('auth_seq_id'), Number(residue_id)])
-                    // 'residue-test-comp': MS.core.set.has([MS.set.apply(MS, residue_name_list), MS.ammp('auth_comp_id')])
-                })
-            ]), { category: category, priority: priority, description: description });
-        };
-        this.applyVisualParams = function () {
-            var TagRefs = {
-                'structure-component-static-polymer': 'polymer',
-                'structure-component-static-ligand': 'het',
-                'structure-component-static-branched': 'carbs',
-                'structure-component-static-water': 'water',
-                'structure-component-static-coarse': 'coarse',
-                'non-standard': 'nonStandard'
-            };
-            var componentGroups = _this.plugin.managers.structure.hierarchy.currentComponentGroups;
-            componentGroups.forEach(function (compGrp) {
-                var _c;
-                var compGrpIndex = compGrp.length - 1;
-                var key = compGrp[compGrpIndex].key;
-                var rm = false;
-                if (key && _this.initParams.hideStructure) {
-                    var structType = TagRefs[key];
-                    if (structType && ((_c = _this.initParams.hideStructure) === null || _c === void 0 ? void 0 : _c.indexOf(structType)) > -1)
-                        rm = true;
-                }
-                if (rm) {
-                    _this.plugin.managers.structure.hierarchy.remove([compGrp[compGrpIndex]]);
-                }
-                if (!rm && _this.initParams.visualStyle) {
-                    if (compGrp[compGrpIndex] && compGrp[compGrpIndex].representations) {
-                        compGrp[compGrpIndex].representations.forEach(function (rep) {
-                            var currentParams = (0, structure_representation_params_1.createStructureRepresentationParams)(_this.plugin, void 0, { type: _this.initParams.visualStyle });
-                            _this.plugin.managers.structure.component.updateRepresentations([compGrp[compGrpIndex]], rep, currentParams);
-                        });
-                    }
-                }
-            });
-        };
-        this.canvas = {
-            toggleControls: function (isVisible) {
-                if (typeof isVisible === 'undefined')
-                    isVisible = !_this.plugin.layout.state.showControls;
-                commands_1.PluginCommands.Layout.Update(_this.plugin, { state: { showControls: isVisible } });
-            },
-            toggleExpanded: function (isExpanded) {
-                if (typeof isExpanded === 'undefined')
-                    isExpanded = !_this.plugin.layout.state.isExpanded;
-                commands_1.PluginCommands.Layout.Update(_this.plugin, { state: { isExpanded: isExpanded } });
-            },
-            setBgColor: function (color) {
-                if (!color)
-                    return;
-                _this.canvas.applySettings({ color: color });
-            },
-            applySettings: function (settings) {
-                if (!settings)
-                    return;
-                var rendererParams = {};
-                if (settings.color)
-                    rendererParams['backgroundColor'] = color_1.Color.fromRgb(settings.color.r, settings.color.g, settings.color.b);
-                if (settings.lighting)
-                    rendererParams['style'] = { name: settings.lighting };
-                var renderer = _this.plugin.canvas3d.props.renderer;
-                commands_1.PluginCommands.Canvas3D.SetSettings(_this.plugin, { settings: { renderer: tslib_1.__assign(tslib_1.__assign({}, renderer), rendererParams) } });
-            },
-            toggleSelect: function (isSelect) {
-                _this.plugin.selectionMode = !isSelect;
-            }
-        };
-        this.visual = {
-            highlight: function (params) {
-                var loci = _this.getLociForParams(params.data, params.structureNumber);
-                if (loci_1.Loci.isEmpty(loci))
-                    return;
-                if (params.color) {
-                    _this.visual.setColor({ highlight: params.color });
-                }
-                _this.plugin.managers.interactivity.lociHighlights.highlightOnly({ loci: loci });
-                if (params.focus)
-                    _this.plugin.managers.camera.focusLoci(loci);
-            },
-            clearHighlight: function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                return tslib_1.__generator(this, function (_c) {
-                    this.plugin.managers.interactivity.lociHighlights.highlightOnly({ loci: loci_1.EmptyLoci });
-                    if (this.isHighlightColorUpdated)
-                        this.visual.reset({ highlightColor: true });
-                    return [2 /*return*/];
-                });
-            }); },
-            hideSelect: function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var sel, components, _i, sel_1, s;
-                return tslib_1.__generator(this, function (_c) {
-                    sel = this.plugin.managers.structure.hierarchy.getStructuresWithSelection();
-                    components = [];
-                    for (_i = 0, sel_1 = sel; _i < sel_1.length; _i++) {
-                        s = sel_1[_i];
-                        components.push.apply(components, s.components);
-                    }
-                    if (components.length === 0)
-                        return [2 /*return*/];
-                    this.plugin.managers.structure.component.modifyByCurrentSelection(components, 'subtract');
-                    return [2 /*return*/];
-                });
-            }); },
-            showSelect: function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var sel, components, _i, sel_1, s;
-                return tslib_1.__generator(this, function (_c) {
-                    sel = this.plugin.managers.structure.hierarchy.getStructuresWithSelection();
-                    components = [];
-                    for (_i = 0, sel_1 = sel; _i < sel_1.length; _i++) {
-                        s = sel_1[_i];
-                        components.push.apply(components, s.components);
-                    }
-                    if (components.length === 0)
-                        return [2 /*return*/];
-                    this.plugin.managers.structure.component.modifyByCurrentSelection(components, 'union');
-                    console.log(components);
-                    return [2 /*return*/];
-                });
-            }); },
-            changeProps: function (val) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                return tslib_1.__generator(this, function (_c) {
-                    //todo 切换选中粒度
-                    this.plugin.managers.interactivity.setProps({ granularity: val });
-                    return [2 /*return*/];
-                });
-            }); },
-            select: function (params) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var _c, _d, param, loci, repr, defaultParams, defaultValues, values, structures, updatedStructureData, comps, lastCompsIndex, recentRepComp, uniformColor, e_1_1;
-                var e_1, _e;
-                return tslib_1.__generator(this, function (_f) {
-                    switch (_f.label) {
-                        case 0:
-                            _f.trys.push([0, 7, 8, 13]);
-                            _c = tslib_1.__asyncValues(params.data);
-                            _f.label = 1;
-                        case 1: return [4 /*yield*/, _c.next()];
-                        case 2:
-                            if (!(_d = _f.sent(), !_d.done)) return [3 /*break*/, 6];
-                            param = _d.value;
-                            loci = this.getLociForParams([param], params.structureNumber);
-                            if (loci_1.Loci.isEmpty(loci))
-                                return [2 /*return*/];
-                            // set default selection color to minimise change display
-                            // this.visual.setColor({select: param.color ? param.color : { r:255, g:112, b:3}});
-                            // apply selection
-                            this.plugin.managers.interactivity.lociSelects.selectOnly({ loci: loci });
-                            if (!(param.sideChain || param.representation)) return [3 /*break*/, 4];
-                            repr = 'ball-and-stick';
-                            if (param.representation)
-                                repr = param.representation;
-                            defaultParams = component_1.StructureComponentManager.getAddParams(this.plugin, { allowNone: false, hideSelection: true, checkExisting: true });
-                            defaultValues = param_definition_1.ParamDefinition.getDefaultValues(defaultParams);
-                            defaultValues.options = { label: 'selection-by-script', checkExisting: params.structureNumber ? false : true };
-                            values = tslib_1.__assign(tslib_1.__assign({}, defaultValues), { representation: repr });
-                            structures = this.plugin.managers.structure.hierarchy.getStructuresWithSelection();
-                            return [4 /*yield*/, this.plugin.managers.structure.component.add(values, structures)];
-                        case 3:
-                            _f.sent();
-                            // Apply uniform theme
-                            if (param.representationColor) {
-                                updatedStructureData = this.plugin.managers.structure.hierarchy.current.structures;
-                                if (params.structureNumber) {
-                                    updatedStructureData = [this.plugin.managers.structure.hierarchy.current.structures[params.structureNumber - 1]];
-                                }
-                                comps = updatedStructureData[0].components;
-                                lastCompsIndex = comps.length - 1;
-                                recentRepComp = [comps[lastCompsIndex]];
-                                uniformColor = param.representationColor ? this.normalizeColor(param.representationColor) : color_1.Color.fromRgb(255, 112, 3);
-                                this.plugin.managers.structure.component.updateRepresentationsTheme(recentRepComp, { color: 'uniform', colorParams: { value: uniformColor } });
-                            }
-                            params.addedRepr = true;
-                            _f.label = 4;
-                        case 4:
-                            // focus loci
-                            if (param.focus)
-                                this.plugin.managers.camera.focusLoci(loci);
-                            _f.label = 5;
-                        case 5: return [3 /*break*/, 1];
-                        case 6: return [3 /*break*/, 13];
-                        case 7:
-                            e_1_1 = _f.sent();
-                            e_1 = { error: e_1_1 };
-                            return [3 /*break*/, 13];
-                        case 8:
-                            _f.trys.push([8, , 11, 12]);
-                            if (!(_d && !_d.done && (_e = _c.return))) return [3 /*break*/, 10];
-                            return [4 /*yield*/, _e.call(_c)];
-                        case 9:
-                            _f.sent();
-                            _f.label = 10;
-                        case 10: return [3 /*break*/, 12];
-                        case 11:
-                            if (e_1) throw e_1.error;
-                            return [7 /*endfinally*/];
-                        case 12: return [7 /*endfinally*/];
-                        case 13:
-                            // reset selection color
-                            this.visual.reset({ selectColor: true });
-                            // save selection params to optimise clear
-                            this.selectedParams = params;
-                            return [2 /*return*/];
-                    }
-                });
-            }); },
-            clearSelection: function (structureNumber) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var structIndex, selReprCells, _c, _d, c, selReprCells_1, selReprCells_1_1, selReprCell, e_2_1;
-                var e_2, _e;
-                return tslib_1.__generator(this, function (_f) {
-                    switch (_f.label) {
-                        case 0:
-                            structIndex = structureNumber ? structureNumber - 1 : 0;
-                            this.plugin.managers.interactivity.lociSelects.deselectAll();
-                            // reset theme to default
-                            if (this.selectedParams && this.selectedParams.nonSelectedColor) {
-                                this.visual.reset({ theme: true });
-                            }
-                            // remove overpaints
-                            return [4 /*yield*/, (0, structure_overpaint_1.clearStructureOverpaint)(this.plugin, this.plugin.managers.structure.hierarchy.current.structures[structIndex].components)];
-                        case 1:
-                            // remove overpaints
-                            _f.sent();
-                            if (!(this.selectedParams && this.selectedParams.addedRepr)) return [3 /*break*/, 15];
-                            selReprCells = [];
-                            for (_c = 0, _d = this.plugin.managers.structure.hierarchy.current.structures[structIndex].components; _c < _d.length; _c++) {
-                                c = _d[_c];
-                                if (c.cell && c.cell.params && c.cell.params.values && c.cell.params.values.label === 'selection-by-script')
-                                    selReprCells.push(c.cell);
-                            }
-                            if (!(selReprCells.length > 0)) return [3 /*break*/, 15];
-                            _f.label = 2;
-                        case 2:
-                            _f.trys.push([2, 8, 9, 14]);
-                            selReprCells_1 = tslib_1.__asyncValues(selReprCells);
-                            _f.label = 3;
-                        case 3: return [4 /*yield*/, selReprCells_1.next()];
-                        case 4:
-                            if (!(selReprCells_1_1 = _f.sent(), !selReprCells_1_1.done)) return [3 /*break*/, 7];
-                            selReprCell = selReprCells_1_1.value;
-                            return [4 /*yield*/, commands_1.PluginCommands.State.RemoveObject(this.plugin, { state: selReprCell.parent, ref: selReprCell.transform.ref })];
-                        case 5:
-                            _f.sent();
-                            _f.label = 6;
-                        case 6: return [3 /*break*/, 3];
-                        case 7: return [3 /*break*/, 14];
-                        case 8:
-                            e_2_1 = _f.sent();
-                            e_2 = { error: e_2_1 };
-                            return [3 /*break*/, 14];
-                        case 9:
-                            _f.trys.push([9, , 12, 13]);
-                            if (!(selReprCells_1_1 && !selReprCells_1_1.done && (_e = selReprCells_1.return))) return [3 /*break*/, 11];
-                            return [4 /*yield*/, _e.call(selReprCells_1)];
-                        case 10:
-                            _f.sent();
-                            _f.label = 11;
-                        case 11: return [3 /*break*/, 13];
-                        case 12:
-                            if (e_2) throw e_2.error;
-                            return [7 /*endfinally*/];
-                        case 13: return [7 /*endfinally*/];
-                        case 14:
-                            ;
-                            _f.label = 15;
-                        case 15:
-                            this.selectedParams = undefined;
-                            return [2 /*return*/];
-                    }
-                });
-            }); },
-            update: function (options, fullLoad) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var param, settings, dataSource;
-                return tslib_1.__generator(this, function (_c) {
-                    if (!options)
-                        return [2 /*return*/];
-                    // for(let param in this.initParams){
-                    //     if(options[param]) this.initParams[param] = options[param];
-                    // }
-                    this.initParams = tslib_1.__assign({}, spec_1.DefaultParams);
-                    for (param in spec_1.DefaultParams) {
-                        if (typeof options[param] !== 'undefined')
-                            this.initParams[param] = options[param];
-                    }
-                    if (!this.initParams.moleculeId && !this.initParams.customData)
-                        return [2 /*return*/, false];
-                    if (this.initParams.customData && this.initParams.customData.url && !this.initParams.customData.format)
-                        return [2 /*return*/, false];
-                    this.plugin.customState.initParams = this.initParams;
-                    // Set background colour
-                    if (this.initParams.bgColor || this.initParams.lighting) {
-                        settings = {};
-                        if (this.initParams.bgColor)
-                            settings.color = this.initParams.bgColor;
-                        if (this.initParams.lighting)
-                            settings.lighting = this.initParams.lighting;
-                        this.canvas.applySettings(settings);
-                    }
-                    dataSource = this.getMoleculeSrcUrl();
-                    if (dataSource) {
-                        this.load({ url: dataSource.url, format: dataSource.format, assemblyId: this.initParams.assemblyId, isBinary: dataSource.isBinary }, fullLoad);
-                    }
-                    return [2 /*return*/];
-                });
-            }); },
-            visibility: function (data) {
-                if (!data)
-                    return;
-                var refMap = {
-                    polymer: 'structure-component-static-polymer',
-                    het: 'structure-component-static-ligand',
-                    water: 'structure-component-static-water',
-                    carbs: 'structure-component-static-branched',
-                    maps: 'volume-streaming-info'
-                };
-                for (var visual in data) {
-                    var tagName = refMap[visual];
-                    var componentRef = mol_state_2.StateSelection.findTagInSubtree(_this.plugin.state.data.tree, mol_state_1.StateTransform.RootRef, tagName);
-                    if (componentRef) {
-                        var compVisual = _this.plugin.state.data.select(componentRef)[0];
-                        if (compVisual && compVisual.obj) {
-                            var currentlyVisible = (compVisual.state && compVisual.state.isHidden) ? false : true;
-                            if (data[visual] !== currentlyVisible) {
-                                commands_1.PluginCommands.State.ToggleVisibility(_this.plugin, { state: _this.state, ref: componentRef });
-                            }
-                        }
-                    }
-                }
-            },
-            toggleSpin: function (isSpinning, resetCamera) {
-                if (!_this.plugin.canvas3d)
-                    return;
-                var trackball = _this.plugin.canvas3d.props.trackball;
-                var toggleSpinParam = trackball.animate.name === 'spin' ? { name: 'off', params: {} } : { name: 'spin', params: { speed: 1 } };
-                if (typeof isSpinning !== 'undefined') {
-                    toggleSpinParam = { name: 'off', params: {} };
-                    if (isSpinning)
-                        toggleSpinParam = { name: 'spin', params: { speed: 1 } };
-                }
-                commands_1.PluginCommands.Canvas3D.SetSettings(_this.plugin, { settings: { trackball: tslib_1.__assign(tslib_1.__assign({}, trackball), { animate: toggleSpinParam }) } });
-                if (resetCamera)
-                    commands_1.PluginCommands.Camera.Reset(_this.plugin, {});
-            },
-            focus: function (params, structureNumber) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var loci;
-                return tslib_1.__generator(this, function (_c) {
-                    loci = this.getLociForParams(params, structureNumber);
-                    this.plugin.managers.camera.focusLoci(loci);
-                    return [2 /*return*/];
-                });
-            }); },
-            setColor: function (param) {
-                if (!_this.plugin.canvas3d)
-                    return;
-                var renderer = _this.plugin.canvas3d.props.renderer;
-                var rParam = {};
-                if (param.highlight)
-                    rParam['highlightColor'] = _this.normalizeColor(param.highlight);
-                if (param.select)
-                    rParam['selectColor'] = _this.normalizeColor(param.select);
-                commands_1.PluginCommands.Canvas3D.SetSettings(_this.plugin, { settings: { renderer: tslib_1.__assign(tslib_1.__assign({}, renderer), rParam) } });
-                if (rParam.highlightColor)
-                    _this.isHighlightColorUpdated = true;
-            },
-            reset: function (params) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var defaultTheme_1, componentGroups, renderer, rParam;
-                var _this = this;
-                return tslib_1.__generator(this, function (_c) {
-                    switch (_c.label) {
-                        case 0:
-                            if (!params.camera) return [3 /*break*/, 2];
-                            return [4 /*yield*/, commands_1.PluginCommands.Camera.Reset(this.plugin, { durationMs: 250 })];
-                        case 1:
-                            _c.sent();
-                            _c.label = 2;
-                        case 2:
-                            if (params.theme) {
-                                defaultTheme_1 = { color: this.initParams.alphafoldView ? 'plddt-confidence' : 'default' };
-                                componentGroups = this.plugin.managers.structure.hierarchy.currentComponentGroups;
-                                componentGroups.forEach(function (compGrp) {
-                                    _this.plugin.managers.structure.component.updateRepresentationsTheme(compGrp, defaultTheme_1);
-                                });
-                            }
-                            if (params.highlightColor || params.selectColor) {
-                                if (!this.plugin.canvas3d)
-                                    return [2 /*return*/];
-                                renderer = this.plugin.canvas3d.props.renderer;
-                                rParam = {};
-                                if (params.highlightColor)
-                                    rParam['highlightColor'] = this.defaultRendererProps.highlightColor;
-                                if (params.selectColor)
-                                    rParam['selectColor'] = this.defaultRendererProps.selectColor;
-                                commands_1.PluginCommands.Canvas3D.SetSettings(this.plugin, { settings: { renderer: tslib_1.__assign(tslib_1.__assign({}, renderer), rParam) } });
-                                if (rParam.highlightColor)
-                                    this.isHighlightColorUpdated = false;
-                            }
-                            return [2 /*return*/];
-                    }
-                });
-            }); }
-        };
-        this.ArbitrarySphereVisuals = {
-            'arbitrary-sphere': function (ctx, getParams) { return (0, representation_2.UnitsRepresentation)('Arbitrary sphere mesh', ctx, getParams, _this.ArbitrarySphereVisual); }
-        };
-        this.ArbitrarySphereParams = tslib_1.__assign(tslib_1.__assign({}, units_visual_1.UnitsMeshParams), { x: param_definition_2.ParamDefinition.Numeric(0), y: param_definition_2.ParamDefinition.Numeric(0), z: param_definition_2.ParamDefinition.Numeric(0), l1: param_definition_2.ParamDefinition.Numeric(1), l2: param_definition_2.ParamDefinition.Numeric(1), l3: param_definition_2.ParamDefinition.Numeric(1) });
-        this.ArbitrarySphereVisual = function (materialId) {
-            return (0, units_visual_1.UnitsMeshVisual)({
-                defaultProps: param_definition_2.ParamDefinition.getDefaultValues(_this.ArbitrarySphereParams),
-                createGeometry: _this.createArbitrarySphereMesh,
-                createLocationIterator: function (structureGroup) {
-                    return (0, location_iterator_1.LocationIterator)(1, structureGroup.group.units.length, 1, function () { return location_1.NullLocation; });
-                },
-                getLoci: function (pickingId, structureGroup, id) {
-                    var objectId = pickingId.objectId;
-                    if (objectId !== id)
-                        return loci_1.EmptyLoci;
-                    return (0, loci_2.DataLoci)('arbitrary-sphere-data-loci', void 0, [0], void 0, function () { return "Yo, I'm a sphere!"; });
-                },
-                eachLocation: function (loci, structureGroup, apply) {
-                    if (loci.kind === 'data-loci' && loci.tag === 'arbitrary-sphere-data-loci') {
-                        return apply(int_1.Interval.ofBounds(0, 1));
-                    }
-                    return false;
-                },
-                setUpdateState: function (state, newProps, currentProps) {
-                    state.createGeometry = (newProps.x !== currentProps.x ||
-                        newProps.y !== currentProps.y ||
-                        newProps.z !== currentProps.z ||
-                        newProps.l1 !== currentProps.l1 ||
-                        newProps.l2 !== currentProps.l2 ||
-                        newProps.l3 !== currentProps.l3);
-                }
-            }, materialId);
-        };
-        this.ConfalPyramidsRepresentation = function (ctx, getParams) {
-            return representation_3.Representation.createMulti('Confal Pyramids', ctx, getParams, representation_2.StructureRepresentationStateBuilder, _this.ArbitrarySphereVisuals);
-        };
-        this.ArbitrarySphereRepresentationProvider = (0, representation_2.StructureRepresentationProvider)({
-            name: 'arbitrary-sphere',
-            label: 'Arbitrary sphere',
-            description: 'Displays an arbitrary sphere at given coordinates',
-            factory: this.ConfalPyramidsRepresentation,
-            getParams: function (ctx, structure) { return param_definition_2.ParamDefinition.clone(_this.ArbitrarySphereParams); },
-            defaultValues: param_definition_2.ParamDefinition.getDefaultValues(this.ArbitrarySphereParams),
-            defaultColorTheme: { name: 'uniform' },
-            defaultSizeTheme: { name: 'uniform' },
-            isApplicable: function (structure) { return true; }
-        });
-        this.createArbitrarySphereMesh = function (ctx, unit, structure, theme, props, mesh) {
-            var mb = mesh_builder_1.MeshBuilder.createState(16, 16, mesh);
-            mb.currentGroup = 0;
-            var min = (0, linear_algebra_1.Vec3)();
-            var max = (0, linear_algebra_1.Vec3)();
-            min[0] = props.x - (props.l1 / 2);
-            min[1] = props.y - (props.l2 / 2);
-            min[2] = props.z - (props.l3 / 2);
-            max[0] = props.x + (props.l1 / 2);
-            max[1] = props.y + (props.l2 / 2);
-            max[2] = props.z + (props.l3 / 2);
-            // addSphere(mb, position, props.radius, 2)
-            (0, box_1.addBoundingBox)(mb, { min: min, max: max }, 0.1, 1, 1);
-            return mesh_builder_1.MeshBuilder.getMesh(mb);
-        };
-    }
-    PDBeMolstarPlugin.prototype.render = function (target, options) {
-        var _c;
-        return tslib_1.__awaiter(this, void 0, void 0, function () {
-            var param, defaultPDBeSpec, pdbePluginSpec, _d, settings, dataSource;
-            return tslib_1.__generator(this, function (_e) {
-                switch (_e.label) {
-                    case 0:
-                        if (!options)
-                            return [2 /*return*/];
-                        this.initParams = tslib_1.__assign({}, spec_1.DefaultParams);
-                        for (param in spec_1.DefaultParams) {
-                            if (typeof options[param] !== 'undefined')
-                                this.initParams[param] = options[param];
-                        }
-                        defaultPDBeSpec = (0, spec_1.DefaultPluginUISpec)();
-                        pdbePluginSpec = {
-                            actions: tslib_1.__spreadArray([], defaultPDBeSpec.actions || [], true),
-                            behaviors: tslib_1.__spreadArray([], defaultPDBeSpec.behaviors, true),
-                            animations: tslib_1.__spreadArray([], defaultPDBeSpec.animations || [], true),
-                            customParamEditors: defaultPDBeSpec.customParamEditors,
-                            config: defaultPDBeSpec.config
-                        };
-                        if (!this.initParams.ligandView && !this.initParams.superposition && this.initParams.selectInteraction) {
-                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(structure_focus_representation_1.StructureFocusRepresentation));
-                        }
-                        if (this.initParams.superposition) {
-                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(superposition_focus_representation_1.SuperpositionFocusRepresentation), spec_2.PluginSpec.Behavior(behavior_2.MAQualityAssessment, { autoAttach: true, showTooltip: true }));
-                        }
-                        // Add custom properties
-                        if (this.initParams.domainAnnotation) {
-                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(behavior_1.PDBeDomainAnnotations, { autoAttach: true, showTooltip: false }));
-                        }
-                        if (this.initParams.validationAnnotation) {
-                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(pdbe_1.PDBeStructureQualityReport, { autoAttach: true, showTooltip: false }));
-                        }
-                        pdbePluginSpec.layout = {
-                            initial: {
-                                isExpanded: this.initParams.landscape ? false : this.initParams.expanded,
-                                showControls: !this.initParams.hideControls
-                            }
-                        };
-                        pdbePluginSpec.components = {
-                            controls: {
-                                left: pdbe_left_panel_1.LeftPanelControls,
-                                // right: DefaultStructureTools,
-                                top: 'none',
-                                bottom: 'none'
-                            },
-                            viewport: {
-                                controls: pdbe_viewport_controls_1.PDBeViewportControls,
-                                view: this.initParams.superposition ? superposition_viewport_1.SuperpostionViewport : void 0
-                            },
-                            remoteState: 'none',
-                            structureTools: this.initParams.superposition ? pdbe_structure_controls_1.PDBeSuperpositionStructureTools : this.initParams.ligandView ? pdbe_structure_controls_1.PDBeLigandViewStructureTools : pdbe_structure_controls_1.PDBeStructureTools
-                        };
-                        if (this.initParams.alphafoldView) {
-                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(behavior_2.MAQualityAssessment, { autoAttach: true, showTooltip: true }));
-                        }
-                        if (this.initParams.sequencePanel) {
-                            if ((_c = pdbePluginSpec.components.controls) === null || _c === void 0 ? void 0 : _c.top)
-                                delete pdbePluginSpec.components.controls.top;
-                        }
-                        pdbePluginSpec.config = [
-                            [
-                                config_1.PluginConfig.Structure.DefaultRepresentationPresetParams,
-                                {
-                                    theme: {
-                                        globalName: (this.initParams.alphafoldView) ? 'plddt-confidence' : undefined,
-                                        carbonColor: { name: 'element-symbol', params: {} },
-                                        focus: {
-                                            name: 'element-symbol',
-                                            params: { carbonColor: { name: 'element-symbol', params: {} } }
-                                        }
-                                    }
-                                }
-                            ]
-                        ];
-                        element_symbol_1.ElementSymbolColorThemeParams.carbonColor.defaultValue = { name: 'element-symbol', params: {} };
-                        // Add animation props
-                        if (!this.initParams.ligandView && !this.initParams.superposition) {
-                            pdbePluginSpec['animations'] = [model_index_1.AnimateModelIndex, camera_spin_1.AnimateCameraSpin, camera_rock_1.AnimateCameraRock, state_snapshots_1.AnimateStateSnapshots, assembly_unwind_1.AnimateAssemblyUnwind, spin_structure_1.AnimateStructureSpin, state_interpolation_1.AnimateStateInterpolation];
-                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(mp4_export_1.Mp4Export));
-                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(geo_export_1.GeometryExport));
-                        }
-                        if (this.initParams.hideCanvasControls) {
-                            if (this.initParams.hideCanvasControls.indexOf('expand') > -1)
-                                pdbePluginSpec.config.push([config_1.PluginConfig.Viewport.ShowExpand, false]);
-                            if (this.initParams.hideCanvasControls.indexOf('selection') > -1)
-                                pdbePluginSpec.config.push([config_1.PluginConfig.Viewport.ShowSelectionMode, false]);
-                            if (this.initParams.hideCanvasControls.indexOf('animation') > -1)
-                                pdbePluginSpec.config.push([config_1.PluginConfig.Viewport.ShowAnimation, false]);
-                        }
-                        ;
-                        if (this.initParams.landscape && pdbePluginSpec.layout && pdbePluginSpec.layout.initial)
-                            pdbePluginSpec.layout.initial['controlsDisplay'] = 'landscape';
-                        if (this.initParams.reactive && pdbePluginSpec.layout && pdbePluginSpec.layout.initial)
-                            pdbePluginSpec.layout.initial['controlsDisplay'] = 'reactive';
-                        // override default event bindings
-                        if (this.initParams.selectBindings) {
-                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(representation_1.SelectLoci, { bindings: this.initParams.selectBindings }));
-                        }
-                        if (this.initParams.focusBindings) {
-                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(camera_1.FocusLoci, { bindings: this.initParams.focusBindings }));
-                        }
-                        this.targetElement = typeof target === 'string' ? document.getElementById(target) : target;
-                        // Create/ Initialise Plugin
-                        _d = this;
-                        return [4 /*yield*/, (0, spec_1.createPluginUI)(this.targetElement, pdbePluginSpec)];
-                    case 1:
-                        // Create/ Initialise Plugin
-                        _d.plugin = _e.sent();
-                        this.plugin.customState.initParams = tslib_1.__assign({}, this.initParams);
-                        this.plugin.customState.events = {
-                            segmentUpdate: this._ev(),
-                            superpositionInit: this._ev(),
-                            isBusy: this._ev()
-                        };
-                        // Set background colour
-                        if (this.initParams.bgColor || this.initParams.lighting) {
-                            settings = {};
-                            if (this.initParams.bgColor)
-                                settings.color = this.initParams.bgColor;
-                            if (this.initParams.lighting)
-                                settings.lighting = this.initParams.lighting;
-                            this.canvas.applySettings(settings);
-                        }
-                        // Set selection granularity
-                        if (this.initParams.granularity) {
-                            this.plugin.managers.interactivity.setProps({ granularity: this.initParams.granularity });
-                        }
-                        // Set default highlight and selection colors
-                        if (this.initParams.highlightColor || this.initParams.selectColor) {
-                            this.visual.setColor({ highlight: this.initParams.highlightColor, select: this.initParams.selectColor });
-                        }
-                        // Save renderer defaults
-                        this.defaultRendererProps = tslib_1.__assign({}, this.plugin.canvas3d.props.renderer);
-                        if (this.initParams.superposition) {
-                            // Set left panel tab
-                            this.plugin.behaviors.layout.leftPanelTabName.next('segments');
-                            // Initialise superposition
-                            (0, superposition_1.initSuperposition)(this.plugin);
-                        }
-                        else {
-                            // Collapse left panel and set left panel tab to none
-                            commands_1.PluginCommands.Layout.Update(this.plugin, { state: { regionState: tslib_1.__assign(tslib_1.__assign({}, this.plugin.layout.state.regionState), { left: 'collapsed' }) } });
-                            this.plugin.behaviors.layout.leftPanelTabName.next('none');
-                            dataSource = this.getMoleculeSrcUrl();
-                            if (dataSource) {
-                                this.load({ url: dataSource.url, format: dataSource.format, assemblyId: this.initParams.assemblyId, isBinary: dataSource.isBinary, pdb_string: dataSource.pdb_string });
-                            }
-                            // Binding to other PDB Component events
-                            if (this.initParams.subscribeEvents) {
-                                (0, subscribe_events_1.subscribeToComponentEvents)(this);
-                            }
-                            // Event handling
-                            custom_events_1.CustomEvents.add(this.plugin, this.targetElement);
-                        }
-                        this.plugin.representation.structure.registry.add(this.ArbitrarySphereRepresentationProvider);
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    PDBeMolstarPlugin.prototype.getMoleculeSrcUrl = function () {
-        var supportedFormats = ['mmcif', 'pdb', 'sdf'];
-        var id = this.initParams.moleculeId;
-        // if(!id && !this.initParams.customData){
-        //     throw new Error(`Mandatory parameters missing!`);
-        // }
-        var query = 'full';
-        var sep = '?';
-        if (this.initParams.ligandView) {
-            var queryParams = ['data_source=pdb-h'];
-            if (!this.initParams.ligandView.label_comp_id_list) {
-                if (this.initParams.ligandView.label_comp_id) {
-                    queryParams.push('label_comp_id=' + this.initParams.ligandView.label_comp_id);
-                }
-                else if (this.initParams.ligandView.auth_seq_id) {
-                    queryParams.push('auth_seq_id=' + this.initParams.ligandView.auth_seq_id);
-                }
-                if (this.initParams.ligandView.auth_asym_id)
-                    queryParams.push('auth_asym_id=' + this.initParams.ligandView.auth_asym_id);
-            }
-            query = 'residueSurroundings?' + queryParams.join('&');
-            sep = '&';
-        }
-        var url = "".concat(this.initParams.pdbeUrl, "model-server/v1/").concat(id, "/").concat(query).concat(sep, "encoding=").concat(this.initParams.encoding).concat(this.initParams.lowPrecisionCoords ? '&lowPrecisionCoords=1' : '');
-        var isBinary = this.initParams.encoding === 'bcif' ? true : false;
-        var format = 'mmcif';
-        var pdb_string = undefined;
-        if (this.initParams.customData) {
-            if (!this.initParams.customData.url && !this.initParams.customData.pdb_string) {
-                throw new Error("Provide all custom data parameters");
-            }
-            if (!this.initParams.customData.format) {
-                throw new Error("Provide all custom data parameters");
-            }
-            url = this.initParams.customData.url;
-            format = this.initParams.customData.format;
-            if (format === 'cif' || format === 'bcif')
-                format = 'mmcif';
-            // Validate supported format
-            if (supportedFormats.indexOf(format) === -1) {
-                throw new Error("".concat(format, " not supported."));
-            }
-            pdb_string = this.initParams.customData.pdb_string;
-            isBinary = this.initParams.customData.binary ? this.initParams.customData.binary : false;
-        }
-        else {
-            console.log('no custom data');
-            return undefined;
-        }
-        return {
-            url: url,
-            format: format,
-            isBinary: isBinary,
-            pdb_string: pdb_string
-        };
-    };
-    Object.defineProperty(PDBeMolstarPlugin.prototype, "state", {
-        get: function () {
-            return this.plugin.state.data;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    PDBeMolstarPlugin.prototype.add_mouse_event = function (func) {
-        this.plugin.behaviors.interaction.click.subscribe(function (e) {
-            func(e);
-        });
-    };
-    PDBeMolstarPlugin.prototype.add_shape = function (structure, params) {
-        // params: {x: -10, y: -11, z: 10, radius: 8}
-        Object.assign(params, { color: names_1.ColorNames.orange });
-        return this.plugin.builders.structure.representation.addRepresentation(structure, {
-            type: 'arbitrary-sphere',
-            typeParams: params,
-            colorParams: { value: params.color }
-        });
-    };
-    PDBeMolstarPlugin.prototype.remove_shape = function (selector) {
-        var _c, _d;
-        selector.obj.data.repr.destroy();
-        (_c = this.plugin.canvas3d) === null || _c === void 0 ? void 0 : _c.remove(selector.obj.data.repr);
-        (_d = this.plugin.canvas3d) === null || _d === void 0 ? void 0 : _d.update();
-    };
-    PDBeMolstarPlugin.prototype.get_ligand_queries = function (pdb_string) {
-        var ligand_info_list = this.parse_ligand_info(pdb_string);
-        var queries = [];
-        try {
-            for (var i = 0; i < ligand_info_list.length; i++) {
-                queries.push(this.ownResidueQuery(ligand_info_list[i].chain_name, [ligand_info_list[i].residue_name], ligand_info_list[i].residue_id, 'Ligand/Non-standard Residue', 200));
-            }
-            return queries;
-        }
-        catch (e) {
-            console.error('e', e);
-        }
-    };
-    PDBeMolstarPlugin.prototype.get_chain_queries = function (s) {
-        var uniqueEntities = new Map();
-        var l = structure_1.StructureElement.Location.create();
-        l.structure = s;
-        for (var _a = 0, _b = s.unitSymmetryGroups; _a < _b.length; _a++) {
-            var ug = _b[_a];
-            l.unit = ug.units[0];
-            l.element = ug.elements[0];
-            var entityType = structure_1.StructureProperties.entity.type(l);
-            if (entityType === 'polymer' || entityType === 'branched') {
-                var description = structure_1.StructureProperties.entity.pdbx_description(l);
-                uniqueEntities.set(description.join(', '), description);
-            }
-        }
-        var queries = [];
-        uniqueEntities.forEach(function (names, label) {
-            var description = ''.concat(label);
-            var expression = builder_1.MolScriptBuilder.struct.modifier.union([
-                builder_1.MolScriptBuilder.struct.generator.atomGroups({
-                    'entity-test': builder_1.MolScriptBuilder.core.list.equal([builder_1.MolScriptBuilder.list.apply(builder_1.MolScriptBuilder, names), builder_1.MolScriptBuilder.ammp('entityDescription')])
-                })
-            ]);
-            var query = (0, structure_selection_query_1.StructureSelectionQuery)(''.concat(label), expression, { category: 'Polymer/Carbohydrate Entities', priority: 300, description: description });
-            queries.push({ query: query, expression: expression, label: label });
-        });
-        return queries;
-    };
-    PDBeMolstarPlugin.prototype.get_ligand_query_name = function (query) {
-        var label = query.label;
-        var match = label.match(/\[(.*?)\]/);
-        var extracted = match ? match[1] : null;
-        return extracted;
-    };
-    PDBeMolstarPlugin.prototype.change_repr = function (selector, params, state) {
-        var _c, _d;
-        if (params === void 0) { params = undefined; }
-        if (state === void 0) { state = undefined; }
-        return tslib_1.__awaiter(this, void 0, void 0, function () {
-            var s, e_3;
-            return tslib_1.__generator(this, function (_e) {
-                switch (_e.label) {
-                    case 0:
-                        s = selector;
-                        if (!params) return [3 /*break*/, 4];
-                        if (selector.obj.data.repr) {
-                            selector.obj.data.repr.destroy();
-                            (_c = this.plugin.canvas3d) === null || _c === void 0 ? void 0 : _c.update();
-                        }
-                        _e.label = 1;
-                    case 1:
-                        _e.trys.push([1, 3, , 4]);
-                        return [4 /*yield*/, this.plugin.builders.structure.representation.addRepresentation(selector, params)];
-                    case 2:
-                        s = _e.sent();
-                        return [3 /*break*/, 4];
-                    case 3:
-                        e_3 = _e.sent();
-                        console.log(e_3);
-                        return [3 /*break*/, 4];
-                    case 4:
-                        if (state) {
-                            s.obj.data.repr.setState(state);
-                        }
-                        (_d = this.plugin.canvas3d) === null || _d === void 0 ? void 0 : _d.update();
-                        return [2 /*return*/, s];
-                }
-            });
-        });
-    };
-    PDBeMolstarPlugin.prototype.add_repr_on_select_expression = function (structure, select_expression, label, params) {
-        if (params === void 0) { params = { type: 'ball-and-stick' }; }
-        return tslib_1.__awaiter(this, void 0, void 0, function () {
-            var selector, new_selector;
-            return tslib_1.__generator(this, function (_c) {
-                switch (_c.label) {
-                    case 0: return [4 /*yield*/, this.plugin.builders.structure.tryCreateComponentFromExpression(structure, select_expression, label)];
-                    case 1:
-                        selector = _c.sent();
-                        return [4 /*yield*/, this.plugin.builders.structure.representation.addRepresentation(selector, params)];
-                    case 2:
-                        new_selector = _c.sent();
-                        return [2 /*return*/, new_selector];
-                }
-            });
-        });
-    };
-    PDBeMolstarPlugin.prototype.highlight_and_focuson_query = function (structure, query) {
-        var _this = this;
-        var data = structure.data;
-        if (!data)
-            return;
-        this.plugin.runTask(mol_task_1.Task.create('Structure Selection', function (runtime) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-            var selection, loci;
-            return tslib_1.__generator(this, function (_c) {
-                switch (_c.label) {
-                    case 0: return [4 /*yield*/, query.getSelection(this.plugin, runtime, structure.data)];
-                    case 1:
-                        selection = _c.sent();
-                        loci = structure_1.StructureSelection.toLociWithSourceUnits(selection);
-                        this.plugin.managers.interactivity.lociHighlights.highlightOnly({ loci: loci });
-                        this.plugin.managers.camera.focusLoci(loci);
-                        return [2 /*return*/];
-                }
-            });
-        }); }));
-    };
-    PDBeMolstarPlugin.prototype.createLigandStructure = function (isBranched) {
-        var e_4, _c;
-        var _d;
-        return tslib_1.__awaiter(this, void 0, void 0, function () {
-            var _e, _f, comp, e_4_1, structure, ligandQuery, ligandVis, ligandSurr, ligRef, cell, ligLoci;
-            var _this = this;
-            return tslib_1.__generator(this, function (_g) {
-                switch (_g.label) {
-                    case 0:
-                        if (this.assemblyRef === '')
-                            return [2 /*return*/];
-                        _g.label = 1;
-                    case 1:
-                        _g.trys.push([1, 7, 8, 13]);
-                        _e = tslib_1.__asyncValues(this.plugin.managers.structure.hierarchy.currentComponentGroups);
-                        _g.label = 2;
-                    case 2: return [4 /*yield*/, _e.next()];
-                    case 3:
-                        if (!(_f = _g.sent(), !_f.done)) return [3 /*break*/, 6];
-                        comp = _f.value;
-                        return [4 /*yield*/, commands_1.PluginCommands.State.RemoveObject(this.plugin, { state: comp[0].cell.parent, ref: comp[0].cell.transform.ref, removeParentGhosts: true })];
-                    case 4:
-                        _g.sent();
-                        _g.label = 5;
-                    case 5: return [3 /*break*/, 2];
-                    case 6: return [3 /*break*/, 13];
-                    case 7:
-                        e_4_1 = _g.sent();
-                        e_4 = { error: e_4_1 };
-                        return [3 /*break*/, 13];
-                    case 8:
-                        _g.trys.push([8, , 11, 12]);
-                        if (!(_f && !_f.done && (_c = _e.return))) return [3 /*break*/, 10];
-                        return [4 /*yield*/, _c.call(_e)];
-                    case 9:
-                        _g.sent();
-                        _g.label = 10;
-                    case 10: return [3 /*break*/, 12];
-                    case 11:
-                        if (e_4) throw e_4.error;
-                        return [7 /*endfinally*/];
-                    case 12: return [7 /*endfinally*/];
-                    case 13:
-                        structure = this.state.select(this.assemblyRef)[0];
-                        if (isBranched) {
-                            ligandQuery = helpers_1.LigandView.branchedQuery((_d = this.initParams.ligandView) === null || _d === void 0 ? void 0 : _d.label_comp_id_list);
-                        }
-                        else {
-                            ligandQuery = helpers_1.LigandView.query(this.initParams.ligandView);
-                        }
-                        return [4 /*yield*/, this.plugin.builders.structure.tryCreateComponentFromExpression(structure, ligandQuery.core, 'pivot', { label: 'Ligand' })];
-                    case 14:
-                        ligandVis = _g.sent();
-                        if (!ligandVis) return [3 /*break*/, 16];
-                        return [4 /*yield*/, this.plugin.builders.structure.representation.addRepresentation(ligandVis, { type: 'ball-and-stick', color: 'element-symbol', colorParams: { carbonColor: { name: 'element-symbol', params: {} } }, size: 'uniform', sizeParams: { value: 2.5 } }, { tag: 'ligand-vis' })];
-                    case 15:
-                        _g.sent();
-                        _g.label = 16;
-                    case 16: return [4 /*yield*/, this.plugin.builders.structure.tryCreateComponentFromExpression(structure, ligandQuery.surroundings, 'rest', { label: 'Surroundings' })];
-                    case 17:
-                        ligandSurr = _g.sent();
-                        if (!ligandSurr) return [3 /*break*/, 19];
-                        return [4 /*yield*/, this.plugin.builders.structure.representation.addRepresentation(ligandSurr, { type: 'ball-and-stick', color: 'element-symbol', colorParams: { carbonColor: { name: 'element-symbol', params: {} } }, size: 'uniform', sizeParams: { value: 0.8 } })];
-                    case 18:
-                        _g.sent();
-                        _g.label = 19;
-                    case 19:
-                        ligRef = mol_state_2.StateSelection.findTagInSubtree(this.plugin.state.data.tree, mol_state_1.StateTransform.RootRef, 'ligand-vis');
-                        if (!ligRef)
-                            return [2 /*return*/];
-                        cell = this.plugin.state.data.cells.get(ligRef);
-                        if (cell) {
-                            ligLoci = cell.obj.data.repr.getLoci();
-                            this.plugin.managers.structure.focus.setFromLoci(ligLoci);
-                            setTimeout(function () {
-                                var _c;
-                                // focus-add is not handled in camera behavior, doing it here
-                                var current = (_c = _this.plugin.managers.structure.focus.current) === null || _c === void 0 ? void 0 : _c.loci;
-                                if (current)
-                                    _this.plugin.managers.camera.focusLoci(current);
-                            }, 500);
-                        }
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    PDBeMolstarPlugin.prototype.load = function (_c, fullLoad) {
-        var url = _c.url, _d = _c.format, format = _d === void 0 ? 'mmcif' : _d, _e = _c.isBinary, isBinary = _e === void 0 ? false : _e, _f = _c.assemblyId, assemblyId = _f === void 0 ? '' : _f, _g = _c.pdb_string, pdb_string = _g === void 0 ? '' : _g;
-        if (fullLoad === void 0) { fullLoad = true; }
-        return tslib_1.__awaiter(this, void 0, void 0, function () {
-            var isHetView, downloadOptions, isBranchedView, data, trajectory, _h, _j, pivotIndex, pivot, asm, defaultMapParams, pdbeMapParams;
-            return tslib_1.__generator(this, function (_k) {
-                switch (_k.label) {
-                    case 0:
-                        if (fullLoad)
-                            this.clear();
-                        isHetView = this.initParams.ligandView ? true : false;
-                        downloadOptions = void 0;
-                        isBranchedView = false;
-                        if (this.initParams.ligandView && this.initParams.ligandView.label_comp_id_list) {
-                            isBranchedView = true;
-                            downloadOptions = { body: JSON.stringify(this.initParams.ligandView.label_comp_id_list), headers: [['Content-type', 'application/json']] };
-                        }
-                        data = null;
-                        if (!pdb_string) return [3 /*break*/, 2];
-                        return [4 /*yield*/, this.plugin.builders.data.rawData({ data: pdb_string }, { state: { isGhost: true } })];
-                    case 1:
-                        data = _k.sent();
-                        return [3 /*break*/, 4];
-                    case 2: return [4 /*yield*/, this.plugin.builders.data.download({ url: assets_1.Asset.Url(url, downloadOptions), isBinary: isBinary }, { state: { isGhost: true } })];
-                    case 3:
-                        data = _k.sent();
-                        _k.label = 4;
-                    case 4: return [4 /*yield*/, this.plugin.builders.structure.parseTrajectory(data, format)];
-                    case 5:
-                        trajectory = _k.sent();
-                        _h = this;
-                        return [4 /*yield*/, this.plugin.builders.structure.createModel(trajectory)];
-                    case 6:
-                        _h.model = _k.sent();
-                        _j = this;
-                        return [4 /*yield*/, this.plugin.builders.structure.createStructure(this.model, { name: 'model', params: {} })];
-                    case 7:
-                        _j.structure = _k.sent();
-                        if (!!isHetView) return [3 /*break*/, 9];
-                        return [4 /*yield*/, this.plugin.builders.structure.hierarchy.applyPreset(trajectory, this.initParams.defaultPreset, {
-                                structure: assemblyId ? (assemblyId === 'preferred') ? void 0 : { name: 'assembly', params: { id: assemblyId } } : { name: 'model', params: {} },
-                                showUnitcell: false,
-                                representationPreset: 'auto'
-                            })];
-                    case 8:
-                        _k.sent();
-                        if (this.initParams.hideStructure || this.initParams.visualStyle) {
-                            this.applyVisualParams();
-                        }
-                        _k.label = 9;
-                    case 9:
-                        // show selection if param is set
-                        if (this.initParams.selection) {
-                            this.visual.select(this.initParams.selection);
-                        }
-                        pivotIndex = this.plugin.managers.structure.hierarchy.selection.structures.length - 1;
-                        pivot = this.plugin.managers.structure.hierarchy.selection.structures[pivotIndex];
-                        if (pivot && pivot.cell.parent)
-                            this.assemblyRef = pivot.cell.transform.ref;
-                        if (!this.initParams.loadMaps) return [3 /*break*/, 11];
-                        if (this.assemblyRef === '')
-                            return [2 /*return*/];
-                        asm = this.state.select(this.assemblyRef)[0].obj;
-                        defaultMapParams = transformers_1.InitVolumeStreaming.createDefaultParams(asm, this.plugin);
-                        pdbeMapParams = helpers_1.PDBeVolumes.mapParams(defaultMapParams, this.initParams.mapSettings, '');
-                        if (!pdbeMapParams) return [3 /*break*/, 11];
-                        return [4 /*yield*/, this.plugin.runTask(this.state.applyAction(transformers_1.InitVolumeStreaming, pdbeMapParams, this.assemblyRef))];
-                    case 10:
-                        _k.sent();
-                        if (pdbeMapParams.method !== 'em' && !this.initParams.ligandView)
-                            helpers_1.PDBeVolumes.displayUsibilityMessage(this.plugin);
-                        _k.label = 11;
-                    case 11:
-                        if (!isHetView) return [3 /*break*/, 13];
-                        return [4 /*yield*/, this.createLigandStructure(isBranchedView)];
-                    case 12:
-                        _k.sent();
-                        _k.label = 13;
-                    case 13:
-                        this.events.loadComplete.next(true);
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    PDBeMolstarPlugin.prototype.getLociForParams = function (params, structureNumber) {
-        var assemblyRef = this.assemblyRef;
-        if (structureNumber) {
-            assemblyRef = this.plugin.managers.structure.hierarchy.current.structures[structureNumber - 1].cell.transform.ref;
-        }
-        if (assemblyRef === '')
-            return loci_1.EmptyLoci;
-        var data = this.plugin.state.data.select(assemblyRef)[0].obj.data;
-        if (!data)
-            return loci_1.EmptyLoci;
-        return helpers_1.QueryHelper.getInteractivityLoci(params, data);
-    };
-    PDBeMolstarPlugin.prototype.getLociByPLDDT = function (score, structureNumber) {
-        var assemblyRef = this.assemblyRef;
-        if (structureNumber) {
-            assemblyRef = this.plugin.managers.structure.hierarchy.current.structures[structureNumber - 1].cell.transform.ref;
-        }
-        if (assemblyRef === '')
-            return loci_1.EmptyLoci;
-        var data = this.plugin.state.data.select(assemblyRef)[0].obj.data;
-        if (!data)
-            return loci_1.EmptyLoci;
-        return helpers_1.AlphafoldView.getLociByPLDDT(score, data);
-    };
-    PDBeMolstarPlugin.prototype.normalizeColor = function (colorVal, defaultColor) {
-        var color = color_1.Color.fromRgb(170, 170, 170);
-        try {
-            if (typeof colorVal.r !== 'undefined') {
-                color = color_1.Color.fromRgb(colorVal.r, colorVal.g, colorVal.b);
-            }
-            else if (colorVal[0] === '#') {
-                color = (0, color_1.Color)(Number("0x".concat(colorVal.substr(1))));
-            }
-            else {
-                color = (0, color_1.Color)(colorVal);
-            }
-        }
-        catch (e) {
-            if (defaultColor)
-                color = defaultColor;
-        }
-        return color;
-    };
-    PDBeMolstarPlugin.prototype.clear = function () {
-        return tslib_1.__awaiter(this, void 0, void 0, function () {
-            return tslib_1.__generator(this, function (_c) {
-                this.plugin.clear();
-                this.assemblyRef = '';
-                this.selectedParams = void 0;
-                this.isHighlightColorUpdated = false;
-                this.isSelectedColorUpdated = false;
-                return [2 /*return*/];
-            });
-        });
-    };
-    PDBeMolstarPlugin.prototype.parse_ligand_info = function (pdb_string) {
-        // 解析所有的配体信息
-        // chain_name
-        // name
-        // count
-        var ret_list = [];
-        var lines = pdb_string.split('\n');
-        var ligand_dict = {};
-        for (var _c = 0, lines_1 = lines; _c < lines_1.length; _c++) {
-            var line = lines_1[_c];
-            if (line.startsWith('HETATM')) {
-                var ligand_name = line.substr(17, 3).trim();
-                if (ligand_name === 'HOH') {
-                    continue;
-                }
-                var residue_id = line.substr(22, 5).trim();
-                var chain_name = line.substr(21, 1).trim();
-                var x = line.substr(30, 8).trim();
-                var y = line.substr(38, 8).trim();
-                var z = line.substr(46, 8).trim();
-                if (ligand_dict[chain_name + ':' + ligand_name] === undefined) {
-                    ligand_dict[chain_name + ':' + ligand_name] = {
-                        'chain_name': chain_name,
-                        'name': chain_name + ':' + ligand_name + ':' + residue_id,
-                        'residue_name': ligand_name,
-                        'residue_id': residue_id,
-                        'count': 1,
-                        'show_option': true,
-                        'coords': [[Number(x), Number(y), Number(z)]]
-                    };
-                }
-                else {
-                    ligand_dict[chain_name + ':' + ligand_name].count += 1;
-                    ligand_dict[chain_name + ':' + ligand_name].coords.push([Number(x), Number(y), Number(z)]);
-                }
-            }
-        }
-        for (var key in ligand_dict) {
-            var max_min_dict = this.calc_max_min(ligand_dict[key]);
-            ligand_dict[key]['max_min_coord'] = max_min_dict;
-            ret_list.push(ligand_dict[key]);
-        }
-        return ret_list;
-    };
-    PDBeMolstarPlugin.prototype.calc_max_min = function (ligand_dict) {
-        var coords = ligand_dict.coords;
-        var x_list = [];
-        var y_list = [];
-        var z_list = [];
-        for (var _c = 0, coords_1 = coords; _c < coords_1.length; _c++) {
-            var coord = coords_1[_c];
-            x_list.push(coord[0]);
-            y_list.push(coord[1]);
-            z_list.push(coord[2]);
-        }
-        return {
-            'max_x': Math.max.apply(Math, x_list),
-            'min_x': Math.min.apply(Math, x_list),
-            'max_y': Math.max.apply(Math, y_list),
-            'min_y': Math.min.apply(Math, y_list),
-            'max_z': Math.max.apply(Math, z_list),
-            'min_z': Math.min.apply(Math, z_list)
-        };
-    };
-    return PDBeMolstarPlugin;
-}());
-window.PDBeMolstarPlugin = PDBeMolstarPlugin;
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var spec_1 = require("./spec");
+var commands_1 = require("Molstar/mol-plugin/commands");
+var mol_state_1 = require("Molstar/mol-state");
+var loci_1 = require("Molstar/mol-model/loci");
+var rx_event_helper_1 = require("Molstar/mol-util/rx-event-helper");
+var helpers_1 = require("./helpers");
+var pdbe_structure_controls_1 = require("./ui/pdbe-structure-controls");
+var pdbe_viewport_controls_1 = require("./ui/pdbe-viewport-controls");
+var mol_state_2 = require("Molstar/mol-state");
+var structure_focus_representation_1 = require("Molstar/mol-plugin/behavior/dynamic/selection/structure-focus-representation");
+var spec_2 = require("Molstar/mol-plugin/spec");
+var transformers_1 = require("Molstar/mol-plugin/behavior/dynamic/volume-streaming/transformers");
+var structure_representation_params_1 = require("Molstar/mol-plugin-state/helpers/structure-representation-params");
+var subscribe_events_1 = require("./subscribe-events");
+var pdbe_left_panel_1 = require("./ui/pdbe-left-panel");
+var superposition_1 = require("./superposition");
+var custom_events_1 = require("./custom-events");
+var assets_1 = require("Molstar/mol-util/assets");
+var config_1 = require("Molstar/mol-plugin/config");
+var color_1 = require("Molstar/mol-util/color/color");
+var component_1 = require("Molstar/mol-plugin-state/manager/structure/component");
+var param_definition_1 = require("Molstar/mol-util/param-definition");
+var behavior_1 = require("./domain-annotations/behavior");
+var pdbe_1 = require("Molstar/extensions/pdbe");
+var behavior_2 = require("Molstar/extensions/model-archive/quality-assessment/behavior");
+var structure_overpaint_1 = require("Molstar/mol-plugin-state/helpers/structure-overpaint");
+var superposition_focus_representation_1 = require("./superposition-focus-representation");
+var superposition_viewport_1 = require("./ui/superposition-viewport");
+var representation_1 = require("Molstar/mol-plugin/behavior/dynamic/representation");
+var camera_1 = require("molstar/lib/mol-plugin/behavior/dynamic/camera");
+var mp4_export_1 = require("Molstar/extensions/mp4-export");
+var geo_export_1 = require("Molstar/extensions/geo-export");
+var element_symbol_1 = require("Molstar/mol-theme/color/element-symbol");
+var model_index_1 = require("Molstar/mol-plugin-state/animation/built-in/model-index");
+var camera_spin_1 = require("Molstar/mol-plugin-state/animation/built-in/camera-spin");
+var state_snapshots_1 = require("Molstar/mol-plugin-state/animation/built-in/state-snapshots");
+var state_interpolation_1 = require("Molstar/mol-plugin-state/animation/built-in/state-interpolation");
+var spin_structure_1 = require("Molstar/mol-plugin-state/animation/built-in/spin-structure");
+var camera_rock_1 = require("Molstar/mol-plugin-state/animation/built-in/camera-rock");
+var assembly_unwind_1 = require("Molstar/mol-plugin-state/animation/built-in/assembly-unwind");
+var builder_1 = require("molstar/lib/mol-script/language/builder");
+var names_1 = require("molstar/lib/mol-util/color/names");
+var units_visual_1 = require("molstar/lib/mol-repr/structure/units-visual");
+var param_definition_2 = require("molstar/lib/mol-util/param-definition");
+var representation_2 = require("molstar/lib/mol-repr/structure/representation");
+var structure_selection_query_1 = require("molstar/lib/mol-plugin-state/helpers/structure-selection-query");
+var representation_3 = require("molstar/lib/mol-repr/representation");
+var box_1 = require("molstar/lib/mol-geo/geometry/mesh/builder/box");
+var mesh_builder_1 = require("molstar/lib/mol-geo/geometry/mesh/mesh-builder");
+var linear_algebra_1 = require("molstar/lib/mol-math/linear-algebra");
+var int_1 = require("molstar/lib/mol-data/int");
+var location_iterator_1 = require("molstar/lib/mol-geo/util/location-iterator");
+var location_1 = require("molstar/lib/mol-model/location");
+var loci_2 = require("molstar/lib/mol-model/loci");
+var structure_1 = require("molstar/lib/mol-model/structure");
+var mol_task_1 = require("molstar/lib/mol-task");
+require('Molstar/mol-plugin-ui/skin/dark.scss');
+var PDBeMolstarPlugin = /** @class */ (function () {
+    function PDBeMolstarPlugin() {
+        var _this = this;
+        this._ev = rx_event_helper_1.RxEventHelper.create();
+        this.events = {
+            loadComplete: this._ev()
+        };
+        this.assemblyRef = '';
+        this.isHighlightColorUpdated = false;
+        this.isSelectedColorUpdated = false;
+        this.get_quick_querys = function (structure, pdb_string) {
+            var ligand_queries = _this.get_ligand_queries(pdb_string);
+            var chain_queries = _this.get_chain_queries(pdb_string);
+            var pocket_queries = _this.get_pocket_queries(ligand_queries, 5);
+            var water = structure_selection_query_1.StructureSelectionQueries.water;
+            return {
+                ligands: ligand_queries,
+                chains: chain_queries,
+                pockets: pocket_queries,
+                water: [water]
+            };
+        };
+        this.get_pocket_queries = function (ligand_queries, radius) {
+            // 同名的ligand_query会被合并
+            var queries = [];
+            for (var i = 0; i < ligand_queries.length; i++) {
+                var label = _this.get_ligand_query_name(ligand_queries[i]);
+                var core = builder_1.MolScriptBuilder.struct.generator.atomGroups({
+                    'residue-test': builder_1.MolScriptBuilder.core.set.has([builder_1.MolScriptBuilder.set.apply(builder_1.MolScriptBuilder, [label]), builder_1.MolScriptBuilder.ammp('auth_comp_id')])
+                });
+                var surrounding = builder_1.MolScriptBuilder.struct.modifier.union([
+                    builder_1.MolScriptBuilder.struct.modifier.exceptBy({
+                        0: builder_1.MolScriptBuilder.struct.modifier.includeSurroundings({
+                            0: core,
+                            radius: radius,
+                            'as-whole-residues': true
+                        }),
+                        by: core
+                    })
+                ]);
+                var ligand_expand_q = (0, structure_selection_query_1.StructureSelectionQuery)('Surrounding Residues (5 \u212B) of ' + label, surrounding, {
+                    description: 'Select residues within 5 \u212B of ' + label,
+                    category: structure_selection_query_1.StructureSelectionCategory.Manipulate,
+                    referencesCurrent: true
+                });
+                queries.push({ query: ligand_expand_q, expression: surrounding, label: label });
+            }
+            return queries;
+        };
+        this.ownResidueQuery = function (chain_name, residue_name_list, residue_id, category, priority) {
+            if (priority === void 0) {
+                priority = 0;
+            }
+            var description = '[' + residue_name_list[0] + ']|' + chain_name + ':' + residue_name_list[0] + ':' + residue_id;
+            return (0, structure_selection_query_1.StructureSelectionQuery)(description, builder_1.MolScriptBuilder.struct.modifier.union([
+                builder_1.MolScriptBuilder.struct.generator.atomGroups({
+                    'chain-test': builder_1.MolScriptBuilder.core.rel.eq([builder_1.MolScriptBuilder.ammp('auth_asym_id'), chain_name]),
+                    'residue-test': builder_1.MolScriptBuilder.core.rel.eq([builder_1.MolScriptBuilder.ammp('auth_seq_id'), Number(residue_id)])
+                    // 'residue-test-comp': MS.core.set.has([MS.set.apply(MS, residue_name_list), MS.ammp('auth_comp_id')])
+                })
+            ]), { category: category, priority: priority, description: description });
+        };
+        this.applyVisualParams = function () {
+            var TagRefs = {
+                'structure-component-static-polymer': 'polymer',
+                'structure-component-static-ligand': 'het',
+                'structure-component-static-branched': 'carbs',
+                'structure-component-static-water': 'water',
+                'structure-component-static-coarse': 'coarse',
+                'non-standard': 'nonStandard'
+            };
+            var componentGroups = _this.plugin.managers.structure.hierarchy.currentComponentGroups;
+            componentGroups.forEach(function (compGrp) {
+                var _a;
+                var compGrpIndex = compGrp.length - 1;
+                var key = compGrp[compGrpIndex].key;
+                var rm = false;
+                if (key && _this.initParams.hideStructure) {
+                    var structType = TagRefs[key];
+                    if (structType && ((_a = _this.initParams.hideStructure) === null || _a === void 0 ? void 0 : _a.indexOf(structType)) > -1)
+                        rm = true;
+                }
+                if (rm) {
+                    _this.plugin.managers.structure.hierarchy.remove([compGrp[compGrpIndex]]);
+                }
+                if (!rm && _this.initParams.visualStyle) {
+                    if (compGrp[compGrpIndex] && compGrp[compGrpIndex].representations) {
+                        compGrp[compGrpIndex].representations.forEach(function (rep) {
+                            var currentParams = (0, structure_representation_params_1.createStructureRepresentationParams)(_this.plugin, void 0, { type: _this.initParams.visualStyle });
+                            _this.plugin.managers.structure.component.updateRepresentations([compGrp[compGrpIndex]], rep, currentParams);
+                        });
+                    }
+                }
+            });
+        };
+        this.canvas = {
+            toggleControls: function (isVisible) {
+                if (typeof isVisible === 'undefined')
+                    isVisible = !_this.plugin.layout.state.showControls;
+                commands_1.PluginCommands.Layout.Update(_this.plugin, { state: { showControls: isVisible } });
+            },
+            toggleExpanded: function (isExpanded) {
+                if (typeof isExpanded === 'undefined')
+                    isExpanded = !_this.plugin.layout.state.isExpanded;
+                commands_1.PluginCommands.Layout.Update(_this.plugin, { state: { isExpanded: isExpanded } });
+            },
+            setBgColor: function (color) {
+                if (!color)
+                    return;
+                _this.canvas.applySettings({ color: color });
+            },
+            applySettings: function (settings) {
+                if (!settings)
+                    return;
+                var rendererParams = {};
+                if (settings.color)
+                    rendererParams['backgroundColor'] = color_1.Color.fromRgb(settings.color.r, settings.color.g, settings.color.b);
+                if (settings.lighting)
+                    rendererParams['style'] = { name: settings.lighting };
+                var renderer = _this.plugin.canvas3d.props.renderer;
+                commands_1.PluginCommands.Canvas3D.SetSettings(_this.plugin, { settings: { renderer: tslib_1.__assign(tslib_1.__assign({}, renderer), rendererParams) } });
+            },
+            toggleSelect: function (isSelect) {
+                _this.plugin.selectionMode = !isSelect;
+            }
+        };
+        this.visual = {
+            highlight: function (params) {
+                var loci = _this.getLociForParams(params.data, params.structureNumber);
+                if (loci_1.Loci.isEmpty(loci))
+                    return;
+                if (params.color) {
+                    _this.visual.setColor({ highlight: params.color });
+                }
+                _this.plugin.managers.interactivity.lociHighlights.highlightOnly({ loci: loci });
+                if (params.focus)
+                    _this.plugin.managers.camera.focusLoci(loci);
+            },
+            clearHighlight: function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                return tslib_1.__generator(this, function (_a) {
+                    this.plugin.managers.interactivity.lociHighlights.highlightOnly({ loci: loci_1.EmptyLoci });
+                    if (this.isHighlightColorUpdated)
+                        this.visual.reset({ highlightColor: true });
+                    return [2 /*return*/];
+                });
+            }); },
+            hideSelect: function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                var sel, components, _i, sel_1, s;
+                return tslib_1.__generator(this, function (_a) {
+                    sel = this.plugin.managers.structure.hierarchy.getStructuresWithSelection();
+                    components = [];
+                    for (_i = 0, sel_1 = sel; _i < sel_1.length; _i++) {
+                        s = sel_1[_i];
+                        components.push.apply(components, s.components);
+                    }
+                    if (components.length === 0)
+                        return [2 /*return*/];
+                    this.plugin.managers.structure.component.modifyByCurrentSelection(components, 'subtract');
+                    return [2 /*return*/];
+                });
+            }); },
+            showSelect: function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                var sel, components, _i, sel_1, s;
+                return tslib_1.__generator(this, function (_a) {
+                    sel = this.plugin.managers.structure.hierarchy.getStructuresWithSelection();
+                    components = [];
+                    for (_i = 0, sel_1 = sel; _i < sel_1.length; _i++) {
+                        s = sel_1[_i];
+                        components.push.apply(components, s.components);
+                    }
+                    if (components.length === 0)
+                        return [2 /*return*/];
+                    this.plugin.managers.structure.component.modifyByCurrentSelection(components, 'union');
+                    console.log(components);
+                    return [2 /*return*/];
+                });
+            }); },
+            changeProps: function (val) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                return tslib_1.__generator(this, function (_a) {
+                    //todo 切换选中粒度
+                    this.plugin.managers.interactivity.setProps({ granularity: val });
+                    return [2 /*return*/];
+                });
+            }); },
+            select: function (params) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                var _a, _b, param, loci, repr, defaultParams, defaultValues, values, structures, updatedStructureData, comps, lastCompsIndex, recentRepComp, uniformColor, e_1_1;
+                var e_1, _c;
+                return tslib_1.__generator(this, function (_d) {
+                    switch (_d.label) {
+                        case 0:
+                            _d.trys.push([0, 7, 8, 13]);
+                            _a = tslib_1.__asyncValues(params.data);
+                            _d.label = 1;
+                        case 1: return [4 /*yield*/, _a.next()];
+                        case 2:
+                            if (!(_b = _d.sent(), !_b.done)) return [3 /*break*/, 6];
+                            param = _b.value;
+                            loci = this.getLociForParams([param], params.structureNumber);
+                            if (loci_1.Loci.isEmpty(loci))
+                                return [2 /*return*/];
+                            // set default selection color to minimise change display
+                            // this.visual.setColor({select: param.color ? param.color : { r:255, g:112, b:3}});
+                            // apply selection
+                            this.plugin.managers.interactivity.lociSelects.selectOnly({ loci: loci });
+                            if (!(param.sideChain || param.representation)) return [3 /*break*/, 4];
+                            repr = 'ball-and-stick';
+                            if (param.representation)
+                                repr = param.representation;
+                            defaultParams = component_1.StructureComponentManager.getAddParams(this.plugin, { allowNone: false, hideSelection: true, checkExisting: true });
+                            defaultValues = param_definition_1.ParamDefinition.getDefaultValues(defaultParams);
+                            defaultValues.options = { label: 'selection-by-script', checkExisting: params.structureNumber ? false : true };
+                            values = tslib_1.__assign(tslib_1.__assign({}, defaultValues), { representation: repr });
+                            structures = this.plugin.managers.structure.hierarchy.getStructuresWithSelection();
+                            return [4 /*yield*/, this.plugin.managers.structure.component.add(values, structures)];
+                        case 3:
+                            _d.sent();
+                            // Apply uniform theme
+                            if (param.representationColor) {
+                                updatedStructureData = this.plugin.managers.structure.hierarchy.current.structures;
+                                if (params.structureNumber) {
+                                    updatedStructureData = [this.plugin.managers.structure.hierarchy.current.structures[params.structureNumber - 1]];
+                                }
+                                comps = updatedStructureData[0].components;
+                                lastCompsIndex = comps.length - 1;
+                                recentRepComp = [comps[lastCompsIndex]];
+                                uniformColor = param.representationColor ? this.normalizeColor(param.representationColor) : color_1.Color.fromRgb(255, 112, 3);
+                                this.plugin.managers.structure.component.updateRepresentationsTheme(recentRepComp, { color: 'uniform', colorParams: { value: uniformColor } });
+                            }
+                            params.addedRepr = true;
+                            _d.label = 4;
+                        case 4:
+                            // focus loci
+                            if (param.focus)
+                                this.plugin.managers.camera.focusLoci(loci);
+                            _d.label = 5;
+                        case 5: return [3 /*break*/, 1];
+                        case 6: return [3 /*break*/, 13];
+                        case 7:
+                            e_1_1 = _d.sent();
+                            e_1 = { error: e_1_1 };
+                            return [3 /*break*/, 13];
+                        case 8:
+                            _d.trys.push([8, , 11, 12]);
+                            if (!(_b && !_b.done && (_c = _a.return))) return [3 /*break*/, 10];
+                            return [4 /*yield*/, _c.call(_a)];
+                        case 9:
+                            _d.sent();
+                            _d.label = 10;
+                        case 10: return [3 /*break*/, 12];
+                        case 11:
+                            if (e_1) throw e_1.error;
+                            return [7 /*endfinally*/];
+                        case 12: return [7 /*endfinally*/];
+                        case 13:
+                            // reset selection color
+                            this.visual.reset({ selectColor: true });
+                            // save selection params to optimise clear
+                            this.selectedParams = params;
+                            return [2 /*return*/];
+                    }
+                });
+            }); },
+            clearSelection: function (structureNumber) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                var structIndex, selReprCells, _a, _b, c, selReprCells_1, selReprCells_1_1, selReprCell, e_2_1;
+                var e_2, _c;
+                return tslib_1.__generator(this, function (_d) {
+                    switch (_d.label) {
+                        case 0:
+                            structIndex = structureNumber ? structureNumber - 1 : 0;
+                            this.plugin.managers.interactivity.lociSelects.deselectAll();
+                            // reset theme to default
+                            if (this.selectedParams && this.selectedParams.nonSelectedColor) {
+                                this.visual.reset({ theme: true });
+                            }
+                            // remove overpaints
+                            return [4 /*yield*/, (0, structure_overpaint_1.clearStructureOverpaint)(this.plugin, this.plugin.managers.structure.hierarchy.current.structures[structIndex].components)];
+                        case 1:
+                            // remove overpaints
+                            _d.sent();
+                            if (!(this.selectedParams && this.selectedParams.addedRepr)) return [3 /*break*/, 15];
+                            selReprCells = [];
+                            for (_a = 0, _b = this.plugin.managers.structure.hierarchy.current.structures[structIndex].components; _a < _b.length; _a++) {
+                                c = _b[_a];
+                                if (c.cell && c.cell.params && c.cell.params.values && c.cell.params.values.label === 'selection-by-script')
+                                    selReprCells.push(c.cell);
+                            }
+                            if (!(selReprCells.length > 0)) return [3 /*break*/, 15];
+                            _d.label = 2;
+                        case 2:
+                            _d.trys.push([2, 8, 9, 14]);
+                            selReprCells_1 = tslib_1.__asyncValues(selReprCells);
+                            _d.label = 3;
+                        case 3: return [4 /*yield*/, selReprCells_1.next()];
+                        case 4:
+                            if (!(selReprCells_1_1 = _d.sent(), !selReprCells_1_1.done)) return [3 /*break*/, 7];
+                            selReprCell = selReprCells_1_1.value;
+                            return [4 /*yield*/, commands_1.PluginCommands.State.RemoveObject(this.plugin, { state: selReprCell.parent, ref: selReprCell.transform.ref })];
+                        case 5:
+                            _d.sent();
+                            _d.label = 6;
+                        case 6: return [3 /*break*/, 3];
+                        case 7: return [3 /*break*/, 14];
+                        case 8:
+                            e_2_1 = _d.sent();
+                            e_2 = { error: e_2_1 };
+                            return [3 /*break*/, 14];
+                        case 9:
+                            _d.trys.push([9, , 12, 13]);
+                            if (!(selReprCells_1_1 && !selReprCells_1_1.done && (_c = selReprCells_1.return))) return [3 /*break*/, 11];
+                            return [4 /*yield*/, _c.call(selReprCells_1)];
+                        case 10:
+                            _d.sent();
+                            _d.label = 11;
+                        case 11: return [3 /*break*/, 13];
+                        case 12:
+                            if (e_2) throw e_2.error;
+                            return [7 /*endfinally*/];
+                        case 13: return [7 /*endfinally*/];
+                        case 14:
+                            ;
+                            _d.label = 15;
+                        case 15:
+                            this.selectedParams = undefined;
+                            return [2 /*return*/];
+                    }
+                });
+            }); },
+            update: function (options, fullLoad) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                var param, settings, dataSource;
+                return tslib_1.__generator(this, function (_a) {
+                    if (!options)
+                        return [2 /*return*/];
+                    // for(let param in this.initParams){
+                    //     if(options[param]) this.initParams[param] = options[param];
+                    // }
+                    this.initParams = tslib_1.__assign({}, spec_1.DefaultParams);
+                    for (param in spec_1.DefaultParams) {
+                        if (typeof options[param] !== 'undefined')
+                            this.initParams[param] = options[param];
+                    }
+                    if (!this.initParams.moleculeId && !this.initParams.customData)
+                        return [2 /*return*/, false];
+                    if (this.initParams.customData && this.initParams.customData.url && !this.initParams.customData.format)
+                        return [2 /*return*/, false];
+                    this.plugin.customState.initParams = this.initParams;
+                    // Set background colour
+                    if (this.initParams.bgColor || this.initParams.lighting) {
+                        settings = {};
+                        if (this.initParams.bgColor)
+                            settings.color = this.initParams.bgColor;
+                        if (this.initParams.lighting)
+                            settings.lighting = this.initParams.lighting;
+                        this.canvas.applySettings(settings);
+                    }
+                    dataSource = this.getMoleculeSrcUrl();
+                    if (dataSource) {
+                        this.load({ url: dataSource.url, format: dataSource.format, assemblyId: this.initParams.assemblyId, isBinary: dataSource.isBinary }, fullLoad);
+                    }
+                    return [2 /*return*/];
+                });
+            }); },
+            visibility: function (data) {
+                if (!data)
+                    return;
+                var refMap = {
+                    polymer: 'structure-component-static-polymer',
+                    het: 'structure-component-static-ligand',
+                    water: 'structure-component-static-water',
+                    carbs: 'structure-component-static-branched',
+                    maps: 'volume-streaming-info'
+                };
+                for (var visual in data) {
+                    var tagName = refMap[visual];
+                    var componentRef = mol_state_2.StateSelection.findTagInSubtree(_this.plugin.state.data.tree, mol_state_1.StateTransform.RootRef, tagName);
+                    if (componentRef) {
+                        var compVisual = _this.plugin.state.data.select(componentRef)[0];
+                        if (compVisual && compVisual.obj) {
+                            var currentlyVisible = (compVisual.state && compVisual.state.isHidden) ? false : true;
+                            if (data[visual] !== currentlyVisible) {
+                                commands_1.PluginCommands.State.ToggleVisibility(_this.plugin, { state: _this.state, ref: componentRef });
+                            }
+                        }
+                    }
+                }
+            },
+            toggleSpin: function (isSpinning, resetCamera) {
+                if (!_this.plugin.canvas3d)
+                    return;
+                var trackball = _this.plugin.canvas3d.props.trackball;
+                var toggleSpinParam = trackball.animate.name === 'spin' ? { name: 'off', params: {} } : { name: 'spin', params: { speed: 1 } };
+                if (typeof isSpinning !== 'undefined') {
+                    toggleSpinParam = { name: 'off', params: {} };
+                    if (isSpinning)
+                        toggleSpinParam = { name: 'spin', params: { speed: 1 } };
+                }
+                commands_1.PluginCommands.Canvas3D.SetSettings(_this.plugin, { settings: { trackball: tslib_1.__assign(tslib_1.__assign({}, trackball), { animate: toggleSpinParam }) } });
+                if (resetCamera)
+                    commands_1.PluginCommands.Camera.Reset(_this.plugin, {});
+            },
+            focus: function (params, structureNumber) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                var loci;
+                return tslib_1.__generator(this, function (_a) {
+                    loci = this.getLociForParams(params, structureNumber);
+                    this.plugin.managers.camera.focusLoci(loci);
+                    return [2 /*return*/];
+                });
+            }); },
+            setColor: function (param) {
+                if (!_this.plugin.canvas3d)
+                    return;
+                var renderer = _this.plugin.canvas3d.props.renderer;
+                var rParam = {};
+                if (param.highlight)
+                    rParam['highlightColor'] = _this.normalizeColor(param.highlight);
+                if (param.select)
+                    rParam['selectColor'] = _this.normalizeColor(param.select);
+                commands_1.PluginCommands.Canvas3D.SetSettings(_this.plugin, { settings: { renderer: tslib_1.__assign(tslib_1.__assign({}, renderer), rParam) } });
+                if (rParam.highlightColor)
+                    _this.isHighlightColorUpdated = true;
+            },
+            reset: function (params) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                var defaultTheme_1, componentGroups, renderer, rParam;
+                var _this = this;
+                return tslib_1.__generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            if (!params.camera) return [3 /*break*/, 2];
+                            return [4 /*yield*/, commands_1.PluginCommands.Camera.Reset(this.plugin, { durationMs: 250 })];
+                        case 1:
+                            _a.sent();
+                            _a.label = 2;
+                        case 2:
+                            if (params.theme) {
+                                defaultTheme_1 = { color: this.initParams.alphafoldView ? 'plddt-confidence' : 'default' };
+                                componentGroups = this.plugin.managers.structure.hierarchy.currentComponentGroups;
+                                componentGroups.forEach(function (compGrp) {
+                                    _this.plugin.managers.structure.component.updateRepresentationsTheme(compGrp, defaultTheme_1);
+                                });
+                            }
+                            if (params.highlightColor || params.selectColor) {
+                                if (!this.plugin.canvas3d)
+                                    return [2 /*return*/];
+                                renderer = this.plugin.canvas3d.props.renderer;
+                                rParam = {};
+                                if (params.highlightColor)
+                                    rParam['highlightColor'] = this.defaultRendererProps.highlightColor;
+                                if (params.selectColor)
+                                    rParam['selectColor'] = this.defaultRendererProps.selectColor;
+                                commands_1.PluginCommands.Canvas3D.SetSettings(this.plugin, { settings: { renderer: tslib_1.__assign(tslib_1.__assign({}, renderer), rParam) } });
+                                if (rParam.highlightColor)
+                                    this.isHighlightColorUpdated = false;
+                            }
+                            return [2 /*return*/];
+                    }
+                });
+            }); }
+        };
+        this.ArbitrarySphereVisuals = {
+            'arbitrary-sphere': function (ctx, getParams) { return (0, representation_2.UnitsRepresentation)('Arbitrary sphere mesh', ctx, getParams, _this.ArbitrarySphereVisual); }
+        };
+        this.ArbitrarySphereParams = tslib_1.__assign(tslib_1.__assign({}, units_visual_1.UnitsMeshParams), { x: param_definition_2.ParamDefinition.Numeric(0), y: param_definition_2.ParamDefinition.Numeric(0), z: param_definition_2.ParamDefinition.Numeric(0), l1: param_definition_2.ParamDefinition.Numeric(1), l2: param_definition_2.ParamDefinition.Numeric(1), l3: param_definition_2.ParamDefinition.Numeric(1) });
+        this.ArbitrarySphereVisual = function (materialId) {
+            return (0, units_visual_1.UnitsMeshVisual)({
+                defaultProps: param_definition_2.ParamDefinition.getDefaultValues(_this.ArbitrarySphereParams),
+                createGeometry: _this.createArbitrarySphereMesh,
+                createLocationIterator: function (structureGroup) {
+                    return (0, location_iterator_1.LocationIterator)(1, structureGroup.group.units.length, 1, function () { return location_1.NullLocation; });
+                },
+                getLoci: function (pickingId, structureGroup, id) {
+                    var objectId = pickingId.objectId;
+                    if (objectId !== id)
+                        return loci_1.EmptyLoci;
+                    return (0, loci_2.DataLoci)('arbitrary-sphere-data-loci', void 0, [0], void 0, function () { return "Yo, I'm a sphere!"; });
+                },
+                eachLocation: function (loci, structureGroup, apply) {
+                    if (loci.kind === 'data-loci' && loci.tag === 'arbitrary-sphere-data-loci') {
+                        return apply(int_1.Interval.ofBounds(0, 1));
+                    }
+                    return false;
+                },
+                setUpdateState: function (state, newProps, currentProps) {
+                    state.createGeometry = (newProps.x !== currentProps.x ||
+                        newProps.y !== currentProps.y ||
+                        newProps.z !== currentProps.z ||
+                        newProps.l1 !== currentProps.l1 ||
+                        newProps.l2 !== currentProps.l2 ||
+                        newProps.l3 !== currentProps.l3);
+                }
+            }, materialId);
+        };
+        this.ConfalPyramidsRepresentation = function (ctx, getParams) {
+            return representation_3.Representation.createMulti('Confal Pyramids', ctx, getParams, representation_2.StructureRepresentationStateBuilder, _this.ArbitrarySphereVisuals);
+        };
+        this.ArbitrarySphereRepresentationProvider = (0, representation_2.StructureRepresentationProvider)({
+            name: 'arbitrary-sphere',
+            label: 'Arbitrary sphere',
+            description: 'Displays an arbitrary sphere at given coordinates',
+            factory: this.ConfalPyramidsRepresentation,
+            getParams: function (ctx, structure) { return param_definition_2.ParamDefinition.clone(_this.ArbitrarySphereParams); },
+            defaultValues: param_definition_2.ParamDefinition.getDefaultValues(this.ArbitrarySphereParams),
+            defaultColorTheme: { name: 'uniform' },
+            defaultSizeTheme: { name: 'uniform' },
+            isApplicable: function (structure) { return true; }
+        });
+        this.createArbitrarySphereMesh = function (ctx, unit, structure, theme, props, mesh) {
+            var mb = mesh_builder_1.MeshBuilder.createState(16, 16, mesh);
+            mb.currentGroup = 0;
+            var min = (0, linear_algebra_1.Vec3)();
+            var max = (0, linear_algebra_1.Vec3)();
+            min[0] = props.x - (props.l1 / 2);
+            min[1] = props.y - (props.l2 / 2);
+            min[2] = props.z - (props.l3 / 2);
+            max[0] = props.x + (props.l1 / 2);
+            max[1] = props.y + (props.l2 / 2);
+            max[2] = props.z + (props.l3 / 2);
+            // addSphere(mb, position, props.radius, 2)
+            (0, box_1.addBoundingBox)(mb, { min: min, max: max }, 0.1, 1, 1);
+            return mesh_builder_1.MeshBuilder.getMesh(mb);
+        };
+    }
+    PDBeMolstarPlugin.prototype.render = function (target, options) {
+        var _a;
+        return tslib_1.__awaiter(this, void 0, void 0, function () {
+            var param, defaultPDBeSpec, pdbePluginSpec, _b, settings, dataSource;
+            return tslib_1.__generator(this, function (_c) {
+                switch (_c.label) {
+                    case 0:
+                        if (!options)
+                            return [2 /*return*/];
+                        this.initParams = tslib_1.__assign({}, spec_1.DefaultParams);
+                        for (param in spec_1.DefaultParams) {
+                            if (typeof options[param] !== 'undefined')
+                                this.initParams[param] = options[param];
+                        }
+                        defaultPDBeSpec = (0, spec_1.DefaultPluginUISpec)();
+                        pdbePluginSpec = {
+                            actions: tslib_1.__spreadArray([], defaultPDBeSpec.actions || [], true),
+                            behaviors: tslib_1.__spreadArray([], defaultPDBeSpec.behaviors, true),
+                            animations: tslib_1.__spreadArray([], defaultPDBeSpec.animations || [], true),
+                            customParamEditors: defaultPDBeSpec.customParamEditors,
+                            config: defaultPDBeSpec.config
+                        };
+                        if (!this.initParams.ligandView && !this.initParams.superposition && this.initParams.selectInteraction) {
+                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(structure_focus_representation_1.StructureFocusRepresentation));
+                        }
+                        if (this.initParams.superposition) {
+                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(superposition_focus_representation_1.SuperpositionFocusRepresentation), spec_2.PluginSpec.Behavior(behavior_2.MAQualityAssessment, { autoAttach: true, showTooltip: true }));
+                        }
+                        // Add custom properties
+                        if (this.initParams.domainAnnotation) {
+                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(behavior_1.PDBeDomainAnnotations, { autoAttach: true, showTooltip: false }));
+                        }
+                        if (this.initParams.validationAnnotation) {
+                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(pdbe_1.PDBeStructureQualityReport, { autoAttach: true, showTooltip: false }));
+                        }
+                        pdbePluginSpec.layout = {
+                            initial: {
+                                isExpanded: this.initParams.landscape ? false : this.initParams.expanded,
+                                showControls: !this.initParams.hideControls
+                            }
+                        };
+                        pdbePluginSpec.components = {
+                            controls: {
+                                left: pdbe_left_panel_1.LeftPanelControls,
+                                // right: DefaultStructureTools,
+                                top: 'none',
+                                bottom: 'none'
+                            },
+                            viewport: {
+                                controls: pdbe_viewport_controls_1.PDBeViewportControls,
+                                view: this.initParams.superposition ? superposition_viewport_1.SuperpostionViewport : void 0
+                            },
+                            remoteState: 'none',
+                            structureTools: this.initParams.superposition ? pdbe_structure_controls_1.PDBeSuperpositionStructureTools : this.initParams.ligandView ? pdbe_structure_controls_1.PDBeLigandViewStructureTools : pdbe_structure_controls_1.PDBeStructureTools
+                        };
+                        if (this.initParams.alphafoldView) {
+                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(behavior_2.MAQualityAssessment, { autoAttach: true, showTooltip: true }));
+                        }
+                        if (this.initParams.sequencePanel) {
+                            if ((_a = pdbePluginSpec.components.controls) === null || _a === void 0 ? void 0 : _a.top)
+                                delete pdbePluginSpec.components.controls.top;
+                        }
+                        pdbePluginSpec.config = [
+                            [
+                                config_1.PluginConfig.Structure.DefaultRepresentationPresetParams,
+                                {
+                                    theme: {
+                                        globalName: (this.initParams.alphafoldView) ? 'plddt-confidence' : undefined,
+                                        carbonColor: { name: 'element-symbol', params: {} },
+                                        focus: {
+                                            name: 'element-symbol',
+                                            params: { carbonColor: { name: 'element-symbol', params: {} } }
+                                        }
+                                    }
+                                }
+                            ]
+                        ];
+                        element_symbol_1.ElementSymbolColorThemeParams.carbonColor.defaultValue = { name: 'element-symbol', params: {} };
+                        // Add animation props
+                        if (!this.initParams.ligandView && !this.initParams.superposition) {
+                            pdbePluginSpec['animations'] = [model_index_1.AnimateModelIndex, camera_spin_1.AnimateCameraSpin, camera_rock_1.AnimateCameraRock, state_snapshots_1.AnimateStateSnapshots, assembly_unwind_1.AnimateAssemblyUnwind, spin_structure_1.AnimateStructureSpin, state_interpolation_1.AnimateStateInterpolation];
+                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(mp4_export_1.Mp4Export));
+                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(geo_export_1.GeometryExport));
+                        }
+                        if (this.initParams.hideCanvasControls) {
+                            if (this.initParams.hideCanvasControls.indexOf('expand') > -1)
+                                pdbePluginSpec.config.push([config_1.PluginConfig.Viewport.ShowExpand, false]);
+                            if (this.initParams.hideCanvasControls.indexOf('selection') > -1)
+                                pdbePluginSpec.config.push([config_1.PluginConfig.Viewport.ShowSelectionMode, false]);
+                            if (this.initParams.hideCanvasControls.indexOf('animation') > -1)
+                                pdbePluginSpec.config.push([config_1.PluginConfig.Viewport.ShowAnimation, false]);
+                        }
+                        ;
+                        if (this.initParams.landscape && pdbePluginSpec.layout && pdbePluginSpec.layout.initial)
+                            pdbePluginSpec.layout.initial['controlsDisplay'] = 'landscape';
+                        if (this.initParams.reactive && pdbePluginSpec.layout && pdbePluginSpec.layout.initial)
+                            pdbePluginSpec.layout.initial['controlsDisplay'] = 'reactive';
+                        // override default event bindings
+                        if (this.initParams.selectBindings) {
+                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(representation_1.SelectLoci, { bindings: this.initParams.selectBindings }));
+                        }
+                        if (this.initParams.focusBindings) {
+                            pdbePluginSpec.behaviors.push(spec_2.PluginSpec.Behavior(camera_1.FocusLoci, { bindings: this.initParams.focusBindings }));
+                        }
+                        this.targetElement = typeof target === 'string' ? document.getElementById(target) : target;
+                        // Create/ Initialise Plugin
+                        _b = this;
+                        return [4 /*yield*/, (0, spec_1.createPluginUI)(this.targetElement, pdbePluginSpec)];
+                    case 1:
+                        // Create/ Initialise Plugin
+                        _b.plugin = _c.sent();
+                        this.plugin.customState.initParams = tslib_1.__assign({}, this.initParams);
+                        this.plugin.customState.events = {
+                            segmentUpdate: this._ev(),
+                            superpositionInit: this._ev(),
+                            isBusy: this._ev()
+                        };
+                        // Set background colour
+                        if (this.initParams.bgColor || this.initParams.lighting) {
+                            settings = {};
+                            if (this.initParams.bgColor)
+                                settings.color = this.initParams.bgColor;
+                            if (this.initParams.lighting)
+                                settings.lighting = this.initParams.lighting;
+                            this.canvas.applySettings(settings);
+                        }
+                        // Set selection granularity
+                        if (this.initParams.granularity) {
+                            this.plugin.managers.interactivity.setProps({ granularity: this.initParams.granularity });
+                        }
+                        // Set default highlight and selection colors
+                        if (this.initParams.highlightColor || this.initParams.selectColor) {
+                            this.visual.setColor({ highlight: this.initParams.highlightColor, select: this.initParams.selectColor });
+                        }
+                        // Save renderer defaults
+                        this.defaultRendererProps = tslib_1.__assign({}, this.plugin.canvas3d.props.renderer);
+                        if (this.initParams.superposition) {
+                            // Set left panel tab
+                            this.plugin.behaviors.layout.leftPanelTabName.next('segments');
+                            // Initialise superposition
+                            (0, superposition_1.initSuperposition)(this.plugin);
+                        }
+                        else {
+                            // Collapse left panel and set left panel tab to none
+                            commands_1.PluginCommands.Layout.Update(this.plugin, { state: { regionState: tslib_1.__assign(tslib_1.__assign({}, this.plugin.layout.state.regionState), { left: 'collapsed' }) } });
+                            this.plugin.behaviors.layout.leftPanelTabName.next('none');
+                            dataSource = this.getMoleculeSrcUrl();
+                            if (dataSource) {
+                                this.load({ url: dataSource.url, format: dataSource.format, assemblyId: this.initParams.assemblyId, isBinary: dataSource.isBinary, pdb_string: dataSource.pdb_string });
+                            }
+                            // Binding to other PDB Component events
+                            if (this.initParams.subscribeEvents) {
+                                (0, subscribe_events_1.subscribeToComponentEvents)(this);
+                            }
+                            // Event handling
+                            custom_events_1.CustomEvents.add(this.plugin, this.targetElement);
+                        }
+                        this.plugin.representation.structure.registry.add(this.ArbitrarySphereRepresentationProvider);
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    PDBeMolstarPlugin.prototype.getMoleculeSrcUrl = function () {
+        var supportedFormats = ['mmcif', 'pdb', 'sdf'];
+        var id = this.initParams.moleculeId;
+        // if(!id && !this.initParams.customData){
+        //     throw new Error(`Mandatory parameters missing!`);
+        // }
+        var query = 'full';
+        var sep = '?';
+        if (this.initParams.ligandView) {
+            var queryParams = ['data_source=pdb-h'];
+            if (!this.initParams.ligandView.label_comp_id_list) {
+                if (this.initParams.ligandView.label_comp_id) {
+                    queryParams.push('label_comp_id=' + this.initParams.ligandView.label_comp_id);
+                }
+                else if (this.initParams.ligandView.auth_seq_id) {
+                    queryParams.push('auth_seq_id=' + this.initParams.ligandView.auth_seq_id);
+                }
+                if (this.initParams.ligandView.auth_asym_id)
+                    queryParams.push('auth_asym_id=' + this.initParams.ligandView.auth_asym_id);
+            }
+            query = 'residueSurroundings?' + queryParams.join('&');
+            sep = '&';
+        }
+        var url = "".concat(this.initParams.pdbeUrl, "model-server/v1/").concat(id, "/").concat(query).concat(sep, "encoding=").concat(this.initParams.encoding).concat(this.initParams.lowPrecisionCoords ? '&lowPrecisionCoords=1' : '');
+        var isBinary = this.initParams.encoding === 'bcif' ? true : false;
+        var format = 'mmcif';
+        var pdb_string = undefined;
+        if (this.initParams.customData) {
+            if (!this.initParams.customData.url && !this.initParams.customData.pdb_string) {
+                throw new Error("Provide all custom data parameters");
+            }
+            if (!this.initParams.customData.format) {
+                throw new Error("Provide all custom data parameters");
+            }
+            url = this.initParams.customData.url;
+            format = this.initParams.customData.format;
+            if (format === 'cif' || format === 'bcif')
+                format = 'mmcif';
+            // Validate supported format
+            if (supportedFormats.indexOf(format) === -1) {
+                throw new Error("".concat(format, " not supported."));
+            }
+            pdb_string = this.initParams.customData.pdb_string;
+            isBinary = this.initParams.customData.binary ? this.initParams.customData.binary : false;
+        }
+        else {
+            console.log('no custom data');
+            return undefined;
+        }
+        return {
+            url: url,
+            format: format,
+            isBinary: isBinary,
+            pdb_string: pdb_string
+        };
+    };
+    Object.defineProperty(PDBeMolstarPlugin.prototype, "state", {
+        get: function () {
+            return this.plugin.state.data;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    PDBeMolstarPlugin.prototype.add_mouse_event = function (func) {
+        this.plugin.behaviors.interaction.click.subscribe(function (e) {
+            func(e);
+        });
+    };
+    PDBeMolstarPlugin.prototype.add_shape = function (structure, params) {
+        // params: {x: -10, y: -11, z: 10, radius: 8}
+        Object.assign(params, { color: names_1.ColorNames.orange });
+        return this.plugin.builders.structure.representation.addRepresentation(structure, {
+            type: 'arbitrary-sphere',
+            typeParams: params,
+            colorParams: { value: params.color }
+        });
+    };
+    PDBeMolstarPlugin.prototype.remove_shape = function (selector) {
+        var _a, _b;
+        selector.obj.data.repr.destroy();
+        (_a = this.plugin.canvas3d) === null || _a === void 0 ? void 0 : _a.remove(selector.obj.data.repr);
+        (_b = this.plugin.canvas3d) === null || _b === void 0 ? void 0 : _b.update();
+    };
+    PDBeMolstarPlugin.prototype.get_ligand_queries = function (pdb_string) {
+        var ligand_info_list = this.parse_ligand_info(pdb_string);
+        var queries = [];
+        try {
+            for (var i = 0; i < ligand_info_list.length; i++) {
+                queries.push(this.ownResidueQuery(ligand_info_list[i].chain_name, [ligand_info_list[i].residue_name], ligand_info_list[i].residue_id, 'Ligand/Non-standard Residue', 200));
+            }
+            return queries;
+        }
+        catch (e) {
+            console.error('e', e);
+        }
+    };
+    PDBeMolstarPlugin.prototype.ownChainQuery = function (chain_name, category, priority) {
+        if (priority === void 0) {
+            priority = 0;
+        }
+        var description = chain_name;
+        return (0, structure_selection_query_1.StructureSelectionQuery)(description, builder_1.MolScriptBuilder.struct.modifier.union([
+            builder_1.MolScriptBuilder.struct.generator.atomGroups({
+                'chain-test': builder_1.MolScriptBuilder.core.rel.eq([builder_1.MolScriptBuilder.ammp('auth_asym_id'), chain_name]),
+            })
+        ]), { category: category, priority: priority, description: description });
+    };
+    PDBeMolstarPlugin.prototype.get_chain_queries = function (pdb_string) {
+        var chain_info_list = this.parse_chain_info(pdb_string);
+        var queries = [];
+        try {
+            for (var i = 0; i < chain_info_list.length; i++) {
+                queries.push(this.ownChainQuery(chain_info_list[i].chain_main_name, 'Chain', 200));
+            }
+            return queries;
+        }
+        catch (e) {
+            console.error('e', e);
+            return queries;
+        }
+    };
+    PDBeMolstarPlugin.prototype.get_ligand_query_name = function (query) {
+        var label = query.label;
+        var match = label.match(/\[(.*?)\]/);
+        var extracted = match ? match[1] : null;
+        return extracted;
+    };
+    PDBeMolstarPlugin.prototype.change_repr = function (selector, params, state) {
+        var _a, _b;
+        if (params === void 0) { params = undefined; }
+        if (state === void 0) { state = undefined; }
+        return tslib_1.__awaiter(this, void 0, void 0, function () {
+            var s, e_3;
+            return tslib_1.__generator(this, function (_c) {
+                switch (_c.label) {
+                    case 0:
+                        s = selector;
+                        if (!params) return [3 /*break*/, 4];
+                        if (selector.obj.data.repr) {
+                            selector.obj.data.repr.destroy();
+                            (_a = this.plugin.canvas3d) === null || _a === void 0 ? void 0 : _a.update();
+                        }
+                        _c.label = 1;
+                    case 1:
+                        _c.trys.push([1, 3, , 4]);
+                        return [4 /*yield*/, this.plugin.builders.structure.representation.addRepresentation(selector, params)];
+                    case 2:
+                        s = _c.sent();
+                        return [3 /*break*/, 4];
+                    case 3:
+                        e_3 = _c.sent();
+                        console.log(e_3);
+                        return [3 /*break*/, 4];
+                    case 4:
+                        if (state) {
+                            s.obj.data.repr.setState(state);
+                        }
+                        (_b = this.plugin.canvas3d) === null || _b === void 0 ? void 0 : _b.update();
+                        return [2 /*return*/, s];
+                }
+            });
+        });
+    };
+    PDBeMolstarPlugin.prototype.add_repr_on_select_expression = function (structure, select_expression, label, params, comp) {
+        if (params === void 0) { params = { type: 'ball-and-stick' }; }
+        if (comp === void 0) { comp = undefined; }
+        return tslib_1.__awaiter(this, void 0, void 0, function () {
+            var component, repr_selector;
+            return tslib_1.__generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        component = undefined;
+                        if (!!comp) return [3 /*break*/, 2];
+                        return [4 /*yield*/, this.plugin.builders.structure.tryCreateComponentFromExpression(structure, select_expression, label, { 'label': label })];
+                    case 1:
+                        component = _a.sent();
+                        return [3 /*break*/, 3];
+                    case 2:
+                        component = comp;
+                        _a.label = 3;
+                    case 3: return [4 /*yield*/, this.plugin.builders.structure.representation.addRepresentation(component, params)];
+                    case 4:
+                        repr_selector = _a.sent();
+                        if (!comp) {
+                            return [2 /*return*/, { 'comp': component, 'selector': repr_selector }];
+                        }
+                        else {
+                            return [2 /*return*/, { 'comp': undefined, 'selector': repr_selector }];
+                        }
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    PDBeMolstarPlugin.prototype.highlight_and_focuson_query = function (structure, query) {
+        var _this = this;
+        var data = structure.data;
+        if (!data)
+            return;
+        this.plugin.runTask(mol_task_1.Task.create('Structure Selection', function (runtime) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+            var selection, loci;
+            return tslib_1.__generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0: return [4 /*yield*/, query.getSelection(this.plugin, runtime, structure.data)];
+                    case 1:
+                        selection = _a.sent();
+                        loci = structure_1.StructureSelection.toLociWithSourceUnits(selection);
+                        this.plugin.managers.interactivity.lociHighlights.highlightOnly({ loci: loci });
+                        this.plugin.managers.camera.focusLoci(loci);
+                        return [2 /*return*/];
+                }
+            });
+        }); }));
+    };
+    PDBeMolstarPlugin.prototype.createLigandStructure = function (isBranched) {
+        var e_4, _a;
+        var _b;
+        return tslib_1.__awaiter(this, void 0, void 0, function () {
+            var _c, _d, comp, e_4_1, structure, ligandQuery, ligandVis, ligandSurr, ligRef, cell, ligLoci;
+            var _this = this;
+            return tslib_1.__generator(this, function (_e) {
+                switch (_e.label) {
+                    case 0:
+                        if (this.assemblyRef === '')
+                            return [2 /*return*/];
+                        _e.label = 1;
+                    case 1:
+                        _e.trys.push([1, 7, 8, 13]);
+                        _c = tslib_1.__asyncValues(this.plugin.managers.structure.hierarchy.currentComponentGroups);
+                        _e.label = 2;
+                    case 2: return [4 /*yield*/, _c.next()];
+                    case 3:
+                        if (!(_d = _e.sent(), !_d.done)) return [3 /*break*/, 6];
+                        comp = _d.value;
+                        return [4 /*yield*/, commands_1.PluginCommands.State.RemoveObject(this.plugin, { state: comp[0].cell.parent, ref: comp[0].cell.transform.ref, removeParentGhosts: true })];
+                    case 4:
+                        _e.sent();
+                        _e.label = 5;
+                    case 5: return [3 /*break*/, 2];
+                    case 6: return [3 /*break*/, 13];
+                    case 7:
+                        e_4_1 = _e.sent();
+                        e_4 = { error: e_4_1 };
+                        return [3 /*break*/, 13];
+                    case 8:
+                        _e.trys.push([8, , 11, 12]);
+                        if (!(_d && !_d.done && (_a = _c.return))) return [3 /*break*/, 10];
+                        return [4 /*yield*/, _a.call(_c)];
+                    case 9:
+                        _e.sent();
+                        _e.label = 10;
+                    case 10: return [3 /*break*/, 12];
+                    case 11:
+                        if (e_4) throw e_4.error;
+                        return [7 /*endfinally*/];
+                    case 12: return [7 /*endfinally*/];
+                    case 13:
+                        structure = this.state.select(this.assemblyRef)[0];
+                        if (isBranched) {
+                            ligandQuery = helpers_1.LigandView.branchedQuery((_b = this.initParams.ligandView) === null || _b === void 0 ? void 0 : _b.label_comp_id_list);
+                        }
+                        else {
+                            ligandQuery = helpers_1.LigandView.query(this.initParams.ligandView);
+                        }
+                        return [4 /*yield*/, this.plugin.builders.structure.tryCreateComponentFromExpression(structure, ligandQuery.core, 'pivot', { label: 'Ligand' })];
+                    case 14:
+                        ligandVis = _e.sent();
+                        if (!ligandVis) return [3 /*break*/, 16];
+                        return [4 /*yield*/, this.plugin.builders.structure.representation.addRepresentation(ligandVis, { type: 'ball-and-stick', color: 'element-symbol', colorParams: { carbonColor: { name: 'element-symbol', params: {} } }, size: 'uniform', sizeParams: { value: 2.5 } }, { tag: 'ligand-vis' })];
+                    case 15:
+                        _e.sent();
+                        _e.label = 16;
+                    case 16: return [4 /*yield*/, this.plugin.builders.structure.tryCreateComponentFromExpression(structure, ligandQuery.surroundings, 'rest', { label: 'Surroundings' })];
+                    case 17:
+                        ligandSurr = _e.sent();
+                        if (!ligandSurr) return [3 /*break*/, 19];
+                        return [4 /*yield*/, this.plugin.builders.structure.representation.addRepresentation(ligandSurr, { type: 'ball-and-stick', color: 'element-symbol', colorParams: { carbonColor: { name: 'element-symbol', params: {} } }, size: 'uniform', sizeParams: { value: 0.8 } })];
+                    case 18:
+                        _e.sent();
+                        _e.label = 19;
+                    case 19:
+                        ligRef = mol_state_2.StateSelection.findTagInSubtree(this.plugin.state.data.tree, mol_state_1.StateTransform.RootRef, 'ligand-vis');
+                        if (!ligRef)
+                            return [2 /*return*/];
+                        cell = this.plugin.state.data.cells.get(ligRef);
+                        if (cell) {
+                            ligLoci = cell.obj.data.repr.getLoci();
+                            this.plugin.managers.structure.focus.setFromLoci(ligLoci);
+                            setTimeout(function () {
+                                var _a;
+                                // focus-add is not handled in camera behavior, doing it here
+                                var current = (_a = _this.plugin.managers.structure.focus.current) === null || _a === void 0 ? void 0 : _a.loci;
+                                if (current)
+                                    _this.plugin.managers.camera.focusLoci(current);
+                            }, 500);
+                        }
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    PDBeMolstarPlugin.prototype.load = function (_a, fullLoad) {
+        var url = _a.url, _b = _a.format, format = _b === void 0 ? 'mmcif' : _b, _c = _a.isBinary, isBinary = _c === void 0 ? false : _c, _d = _a.assemblyId, assemblyId = _d === void 0 ? '' : _d, _e = _a.pdb_string, pdb_string = _e === void 0 ? '' : _e, _f = _a.if_render, if_render = _f === void 0 ? true : _f;
+        if (fullLoad === void 0) { fullLoad = true; }
+        return tslib_1.__awaiter(this, void 0, void 0, function () {
+            var isHetView, downloadOptions, isBranchedView, data, trajectory, _g, _h, asm, defaultMapParams, pdbeMapParams, pivotIndex, pivot;
+            return tslib_1.__generator(this, function (_j) {
+                switch (_j.label) {
+                    case 0:
+                        if (fullLoad)
+                            this.clear();
+                        isHetView = this.initParams.ligandView ? true : false;
+                        downloadOptions = void 0;
+                        isBranchedView = false;
+                        if (this.initParams.ligandView && this.initParams.ligandView.label_comp_id_list) {
+                            isBranchedView = true;
+                            downloadOptions = { body: JSON.stringify(this.initParams.ligandView.label_comp_id_list), headers: [['Content-type', 'application/json']] };
+                        }
+                        data = null;
+                        if (!pdb_string) return [3 /*break*/, 2];
+                        return [4 /*yield*/, this.plugin.builders.data.rawData({ data: pdb_string }, { state: { isGhost: true } })];
+                    case 1:
+                        data = _j.sent();
+                        return [3 /*break*/, 4];
+                    case 2: return [4 /*yield*/, this.plugin.builders.data.download({ url: assets_1.Asset.Url(url, downloadOptions), isBinary: isBinary }, { state: { isGhost: true } })];
+                    case 3:
+                        data = _j.sent();
+                        _j.label = 4;
+                    case 4: return [4 /*yield*/, this.plugin.builders.structure.parseTrajectory(data, format)];
+                    case 5:
+                        trajectory = _j.sent();
+                        _g = this;
+                        return [4 /*yield*/, this.plugin.builders.structure.createModel(trajectory)];
+                    case 6:
+                        _g.model = _j.sent();
+                        _h = this;
+                        return [4 /*yield*/, this.plugin.builders.structure.createStructure(this.model, { name: 'model', params: {} })];
+                    case 7:
+                        _h.structure = _j.sent();
+                        if (!if_render) return [3 /*break*/, 13];
+                        if (!!isHetView) return [3 /*break*/, 9];
+                        return [4 /*yield*/, this.plugin.builders.structure.hierarchy.applyPreset(trajectory, this.initParams.defaultPreset, {
+                                structure: assemblyId ? (assemblyId === 'preferred') ? void 0 : { name: 'assembly', params: { id: assemblyId } } : { name: 'model', params: {} },
+                                showUnitcell: false,
+                                representationPreset: 'auto'
+                            })];
+                    case 8:
+                        _j.sent();
+                        if (this.initParams.hideStructure || this.initParams.visualStyle) {
+                            this.applyVisualParams();
+                        }
+                        _j.label = 9;
+                    case 9:
+                        // show selection if param is set
+                        if (this.initParams.selection) {
+                            this.visual.select(this.initParams.selection);
+                        }
+                        if (!this.initParams.loadMaps) return [3 /*break*/, 11];
+                        if (this.assemblyRef === '')
+                            return [2 /*return*/];
+                        asm = this.state.select(this.assemblyRef)[0].obj;
+                        defaultMapParams = transformers_1.InitVolumeStreaming.createDefaultParams(asm, this.plugin);
+                        pdbeMapParams = helpers_1.PDBeVolumes.mapParams(defaultMapParams, this.initParams.mapSettings, '');
+                        if (!pdbeMapParams) return [3 /*break*/, 11];
+                        return [4 /*yield*/, this.plugin.runTask(this.state.applyAction(transformers_1.InitVolumeStreaming, pdbeMapParams, this.assemblyRef))];
+                    case 10:
+                        _j.sent();
+                        if (pdbeMapParams.method !== 'em' && !this.initParams.ligandView)
+                            helpers_1.PDBeVolumes.displayUsibilityMessage(this.plugin);
+                        _j.label = 11;
+                    case 11:
+                        if (!isHetView) return [3 /*break*/, 13];
+                        return [4 /*yield*/, this.createLigandStructure(isBranchedView)];
+                    case 12:
+                        _j.sent();
+                        _j.label = 13;
+                    case 13:
+                        pivotIndex = this.plugin.managers.structure.hierarchy.selection.structures.length - 1;
+                        pivot = this.plugin.managers.structure.hierarchy.selection.structures[pivotIndex];
+                        if (pivot && pivot.cell.parent)
+                            this.assemblyRef = pivot.cell.transform.ref;
+                        this.events.loadComplete.next(true);
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    PDBeMolstarPlugin.prototype.getLociForParams = function (params, structureNumber) {
+        var assemblyRef = this.assemblyRef;
+        if (structureNumber) {
+            assemblyRef = this.plugin.managers.structure.hierarchy.current.structures[structureNumber - 1].cell.transform.ref;
+        }
+        if (assemblyRef === '')
+            return loci_1.EmptyLoci;
+        var data = this.plugin.state.data.select(assemblyRef)[0].obj.data;
+        if (!data)
+            return loci_1.EmptyLoci;
+        return helpers_1.QueryHelper.getInteractivityLoci(params, data);
+    };
+    PDBeMolstarPlugin.prototype.getLociByPLDDT = function (score, structureNumber) {
+        var assemblyRef = this.assemblyRef;
+        if (structureNumber) {
+            assemblyRef = this.plugin.managers.structure.hierarchy.current.structures[structureNumber - 1].cell.transform.ref;
+        }
+        if (assemblyRef === '')
+            return loci_1.EmptyLoci;
+        var data = this.plugin.state.data.select(assemblyRef)[0].obj.data;
+        if (!data)
+            return loci_1.EmptyLoci;
+        return helpers_1.AlphafoldView.getLociByPLDDT(score, data);
+    };
+    PDBeMolstarPlugin.prototype.normalizeColor = function (colorVal, defaultColor) {
+        var color = color_1.Color.fromRgb(170, 170, 170);
+        try {
+            if (typeof colorVal.r !== 'undefined') {
+                color = color_1.Color.fromRgb(colorVal.r, colorVal.g, colorVal.b);
+            }
+            else if (colorVal[0] === '#') {
+                color = (0, color_1.Color)(Number("0x".concat(colorVal.substr(1))));
+            }
+            else {
+                color = (0, color_1.Color)(colorVal);
+            }
+        }
+        catch (e) {
+            if (defaultColor)
+                color = defaultColor;
+        }
+        return color;
+    };
+    PDBeMolstarPlugin.prototype.clear = function () {
+        return tslib_1.__awaiter(this, void 0, void 0, function () {
+            return tslib_1.__generator(this, function (_a) {
+                this.plugin.clear();
+                this.assemblyRef = '';
+                this.selectedParams = void 0;
+                this.isHighlightColorUpdated = false;
+                this.isSelectedColorUpdated = false;
+                return [2 /*return*/];
+            });
+        });
+    };
+    PDBeMolstarPlugin.prototype.parse_ligand_info = function (pdb_string) {
+        // 解析所有的配体信息
+        // chain_name
+        // name
+        // count
+        var ret_list = [];
+        var lines = pdb_string.split('\n');
+        var ligand_dict = {};
+        for (var _a = 0, lines_1 = lines; _a < lines_1.length; _a++) {
+            var line = lines_1[_a];
+            if (line.startsWith('HETATM')) {
+                var ligand_name = line.substr(17, 3).trim();
+                if (ligand_name === 'HOH') {
+                    continue;
+                }
+                var residue_id = line.substr(22, 5).trim();
+                var chain_name = line.substr(21, 1).trim();
+                var x = line.substr(30, 8).trim();
+                var y = line.substr(38, 8).trim();
+                var z = line.substr(46, 8).trim();
+                if (ligand_dict[chain_name + ':' + ligand_name + ':' + residue_id] === undefined) {
+                    ligand_dict[chain_name + ':' + ligand_name + ':' + residue_id] = {
+                        'chain_name': chain_name,
+                        'name': chain_name + ':' + ligand_name + ':' + residue_id,
+                        'residue_name': ligand_name,
+                        'residue_id': residue_id,
+                        'count': 1,
+                        'show_option': true,
+                        'coords': [[Number(x), Number(y), Number(z)]]
+                    };
+                }
+                else {
+                    ligand_dict[chain_name + ':' + ligand_name + ':' + residue_id].count += 1;
+                    ligand_dict[chain_name + ':' + ligand_name + ':' + residue_id].coords.push([Number(x), Number(y), Number(z)]);
+                }
+            }
+        }
+        for (var key in ligand_dict) {
+            var max_min_dict = this.calc_max_min(ligand_dict[key]);
+            ligand_dict[key]['max_min_coord'] = max_min_dict;
+            ret_list.push(ligand_dict[key]);
+        }
+        return ret_list;
+    };
+    PDBeMolstarPlugin.prototype.parse_chain_info = function (pdb_string) {
+        // 解析所有的链信息
+        var lines = pdb_string.split('\n');
+        // 获得链中的residue信息
+        var chain_dict = {};
+        for (var _a = 0, lines_2 = lines; _a < lines_2.length; _a++) {
+            var line = lines_2[_a];
+            if (line.startsWith('ATOM')) {
+                var residue_name = line.substr(17, 3).trim();
+                var chain_name = line.substr(21, 1).trim();
+                if (chain_dict[chain_name] === undefined) {
+                    chain_dict[chain_name] = [];
+                }
+                chain_dict[chain_name].push(residue_name);
+            }
+        }
+        var ret_list = [];
+        for (var chain_name in chain_dict) {
+            ret_list.push({ 'chain_full_name': chain_name, 'chain_main_name': chain_name, 'chain_cont': chain_dict[chain_name] });
+        }
+        return ret_list;
+    };
+    PDBeMolstarPlugin.prototype.calc_max_min = function (ligand_dict) {
+        var coords = ligand_dict.coords;
+        var x_list = [];
+        var y_list = [];
+        var z_list = [];
+        for (var _a = 0, coords_1 = coords; _a < coords_1.length; _a++) {
+            var coord = coords_1[_a];
+            x_list.push(coord[0]);
+            y_list.push(coord[1]);
+            z_list.push(coord[2]);
+        }
+        return {
+            'max_x': Math.max.apply(Math, x_list),
+            'min_x': Math.min.apply(Math, x_list),
+            'max_y': Math.max.apply(Math, y_list),
+            'min_y': Math.min.apply(Math, y_list),
+            'max_z': Math.max.apply(Math, z_list),
+            'min_z': Math.min.apply(Math, z_list)
+        };
+    };
+    return PDBeMolstarPlugin;
+}());
+window.PDBeMolstarPlugin = PDBeMolstarPlugin;