@rcsb/rcsb-saguaro-3d
Version:
RCSB Molstar/Saguaro Web App
195 lines (194 loc) • 8.66 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.MsaRowTitleCheckboxComponent = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
/*
* Copyright (c) 2021 RCSB PDB and contributors, licensed under MIT, See LICENSE file for more info.
* @author Joan Segura Mora <joan.segura@rcsb.org>
*/
const React = tslib_1.__importStar(require("react"));
const TagDelimiter_1 = require("@rcsb/rcsb-api-tools/lib/RcsbUtils/TagDelimiter");
const RcsbRequestContextManager_1 = require("@rcsb/rcsb-saguaro-app/lib/RcsbRequest/RcsbRequestContextManager");
class MsaRowTitleCheckboxComponent extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: this.props.tag == "aligned",
opacity: (this.props.disabled) && this.props.tag != "aligned" ? 0 : 1
};
}
render() {
return ((0, jsx_runtime_1.jsx)("div", { style: this.style(), onClick: () => { this.click(); }, title: this.title() }));
}
componentDidMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
this.subscribe();
this.requestInfo();
this.setState({ opacity: yield this.opacity() });
});
}
componentWillUnmount() {
this.subscription.unsubscribe();
}
componentDidUpdate(prevProps, prevState, snapshot) {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
if (!this.props.disabled && prevProps.disabled)
this.requestInfo();
});
}
subscribe() {
this.subscription = this.props.stateManager.subscribe((o) => {
if (o.type == "representation-change" && o.view == "3d-view" && o.data)
this.structureViewerRepresentationChange(o.data);
if (o.type == "component-info" && o.view == "3d-view" && o.data)
this.componentInfo(o.data);
});
}
structureViewerRepresentationChange(d) {
const row = d.label.split(TagDelimiter_1.TagDelimiter.entity);
const suffix = row.pop();
const entryId = row.join(TagDelimiter_1.TagDelimiter.entity);
const entityId = suffix.substring(0, 1);
if (this.compId() == `${entryId}${TagDelimiter_1.TagDelimiter.entity}${entityId}`) {
//TODO this is a one to many relationship
/*if( d.label.includes("polymer") && this.props.tag == "polymer" && d.isHidden == this.state.checked){
this.setState({checked:!this.state.checked});
}
if( !d.label.includes("polymer") && this.props.tag == "non-polymer" && d.isHidden == this.state.checked){
this.setState({checked:!this.state.checked});
}*/
}
}
click() {
if (this.props.disabled)
return;
this.setState({ checked: !this.state.checked }, () => {
this.props.stateManager.next({
view: "1d-view",
type: "representation-change",
data: {
pdb: "entityId" in this.props ? {
entryId: this.props.entryId,
entityId: this.props.entityId,
} : {
entryId: this.props.entryId,
instanceId: this.props.instanceId
},
isHidden: !this.state.checked,
tag: this.props.tag
}
});
});
}
style() {
const color = {
"checked": "rgb(51, 122, 183)",
"unchecked": "rgba(51,122,183,0.44)",
"disabled": "#ddd"
};
return {
width: 7,
height: 7,
opacity: this.state.opacity,
backgroundColor: this.props.disabled ? color.disabled : color[this.state.checked ? "checked" : "unchecked"],
border: 1,
borderStyle: "solid",
borderColor: this.props.disabled ? color.disabled : color.checked,
display: "inline-block",
marginLeft: 4,
cursor: this.props.disabled ? undefined : "pointer"
};
}
title() {
if (this.props.disabled)
return undefined;
switch (this.props.tag) {
case "aligned":
return `${this.state.checked ? "Hide" : "Show"} Aligned Polymer Chain`;
case "polymer":
return `${this.state.checked ? "Hide" : "Show"} Other Polymer Chains`;
case "non-polymer":
return `${this.state.checked ? "Hide" : "Show"} Non-polymer Chains`;
}
}
compId() {
if ("entityId" in this.props)
return `${this.props.entryId}${TagDelimiter_1.TagDelimiter.entity}${this.props.entityId}`;
else
return `${this.props.entryId}${TagDelimiter_1.TagDelimiter.instance}${this.props.instanceId}`;
}
getRcsbId(pdb) {
if ("entityId" in pdb)
return `${pdb.entryId}${TagDelimiter_1.TagDelimiter.entity}${pdb.entityId}`;
else
return `${pdb.entryId}${TagDelimiter_1.TagDelimiter.instance}${pdb.instanceId}`;
}
componentInfo(data) {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
if (this.compId() == this.getRcsbId(data.pdb) && this.props.tag == data.tag)
this.setState({ checked: data.isVisible, opacity: data.isComponent ? 1 : yield this.opacity() });
});
}
requestInfo() {
this.props.stateManager.next({
type: "component-info",
view: "1d-view",
data: {
pdb: "entityId" in this.props ? {
entryId: this.props.entryId,
entityId: this.props.entityId,
} : {
entryId: this.props.entryId,
instanceId: this.props.instanceId
},
tag: this.props.tag
}
});
}
opacity() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
if (this.props.tag == "aligned")
return 1;
return yield this.componentOpacity(this.props.tag);
});
}
componentOpacity(componentType) {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
if (!TagDelimiter_1.TagDelimiter.isRcsbId(this.props.entryId))
return 0;
switch (componentType) {
case "polymer":
return (yield this.polymerTest()) ? 1 : 0;
case "non-polymer":
return (yield this.nonPolymerTest()) ? 1 : 0;
}
});
}
polymerTest() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
var _a, _b, _c, _d, _e, _f, _g, _h;
const entryId = this.props.entryId;
const entryInfo = (yield RcsbRequestContextManager_1.rcsbRequestCtxManager.getEntryProperties(entryId))[0];
const polymerChains = Array.from(entryInfo.entityToInstance.values()).flat();
const assemblyChains = Array.from((_c = (_b = (_a = entryInfo.instanceToOperator) === null || _a === void 0 ? void 0 : _a.get(`${this.props.entryId}-1`)) === null || _b === void 0 ? void 0 : _b.keys()) !== null && _c !== void 0 ? _c : []).filter(chId => polymerChains.includes(chId));
if (assemblyChains && assemblyChains.length > 1)
return true;
if (entryInfo && ((_h = (_g = (_e = (_d = entryInfo.instanceToOperator) === null || _d === void 0 ? void 0 : _d.get(`${this.props.entryId}-1`)) === null || _e === void 0 ? void 0 : _e.get(((_f = entryInfo.entityToInstance.get(this.compId())) !== null && _f !== void 0 ? _f : [""])[0])) === null || _g === void 0 ? void 0 : _g.length) !== null && _h !== void 0 ? _h : 0) > 1)
return true;
return false;
});
}
nonPolymerTest() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
const entryId = this.props.entryId;
const entryInfo = (yield RcsbRequestContextManager_1.rcsbRequestCtxManager.getEntryProperties(entryId))[0];
if (entryInfo && Array.from(entryInfo.entityToPrd.values()).filter(v => v != "").length > 0)
return true;
if (entryInfo && entryInfo.nonPolymerEntityToInstance && entryInfo.nonPolymerEntityToInstance.size > 0)
return true;
return false;
});
}
}
exports.MsaRowTitleCheckboxComponent = MsaRowTitleCheckboxComponent;