@rcsb/rcsb-saguaro-3d
Version:
RCSB Molstar/Saguaro Web App
47 lines (46 loc) • 2.36 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.RcsbFvStructure = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const React = tslib_1.__importStar(require("react"));
const RcsbFvConstants_1 = require("../RcsbFvConstants/RcsbFvConstants");
class RcsbFvStructure extends React.Component {
render() {
return ((0, jsx_runtime_1.jsx)("div", { id: this.props.componentId + "_" + RcsbFvConstants_1.RcsbFvDOMConstants.MOLSTAR_DIV, children: (0, jsx_runtime_1.jsx)("div", { id: RcsbFvStructure.componentId(this.props.componentId), style: { position: "absolute" } }) }));
}
componentDidMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
this.updateDimensions();
this.props.structureViewer.init(this.props.stateManager, this.props.structureViewerConfig);
this.props.structureViewerBehaviourObserver.observe(this.props.structureViewer, this.props.stateManager);
if (this.props.loadConfig)
yield this.props.structureViewer.load(this.props.loadConfig);
window.addEventListener('resize', this.updateDimensions.bind(this));
});
}
componentWillUnmount() {
this.props.structureViewerBehaviourObserver.unsubscribe();
}
updateDimensions() {
var _a;
const div = (_a = document.getElementById(this.props.componentId + "_" + RcsbFvConstants_1.RcsbFvDOMConstants.MOLSTAR_DIV)) === null || _a === void 0 ? void 0 : _a.parentElement;
if (div == null)
return;
const rect = div.getBoundingClientRect();
RcsbFvStructure.setSize(document.getElementById(this.props.componentId + "_" + RcsbFvConstants_1.RcsbFvDOMConstants.MOLSTAR_DIV), rect);
RcsbFvStructure.setSize(document.getElementById(this.props.componentId + "_" + RcsbFvConstants_1.RcsbFvDOMConstants.MOLSTAR_APP_ID), rect);
}
static setSize(element, rect) {
if (element == null)
return;
if (rect == null)
return;
element.style.width = rect.width + "px";
element.style.height = rect.height + "px";
}
static componentId(id) {
return `${id}_${RcsbFvConstants_1.RcsbFvDOMConstants.MOLSTAR_APP_ID}`;
}
}
exports.RcsbFvStructure = RcsbFvStructure;