@rcsb/rcsb-saguaro-3d
Version:
RCSB Molstar/Saguaro Web App
106 lines (105 loc) • 5.38 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.MsaRowTitleComponent = 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 MsaRowTitleCheckboxComponent_1 = require("./MsaRowTitleCheckboxComponent");
const RcsbIdParser_1 = require("../../../../../Utils/RcsbIdParser");
class MsaRowTitleComponent extends React.Component {
constructor(props) {
super(props);
this.INACTIVE_COLOR = "#ccc";
this.ACTIVE_COLOR = "rgb(51, 122, 183)";
this.state = {
expandTitle: false,
disabled: true,
titleColor: this.INACTIVE_COLOR,
blocked: false
};
this.configData = this.props.data;
}
render() {
var _a, _b;
return ((0, jsx_runtime_1.jsxs)("div", { style: { textAlign: "right", display: "flex", alignItems: "center" }, onMouseOver: () => this.hover(true), onMouseOut: () => this.hover(false), children: [(0, jsx_runtime_1.jsx)("div", { style: {
MozUserSelect: "none",
WebkitUserSelect: "none",
msUserSelect: "none",
color: this.state.titleColor,
cursor: this.state.blocked ? "wait" : "pointer",
maxWidth: ((_a = this.configData.rowTitleWidth) !== null && _a !== void 0 ? _a : 190) - 60,
overflow: "hidden",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
textAlign: "right"
}, onClick: (e) => this.click(e), title: (_b = this.props.targetAlignment.target_id) !== null && _b !== void 0 ? _b : undefined, children: this.props.targetAlignment.target_id }), (0, jsx_runtime_1.jsxs)("div", { style: { cursor: this.cursor(), width: 39 }, onClick: (e) => this.altClick(e), children: [(0, jsx_runtime_1.jsx)(MsaRowTitleCheckboxComponent_1.MsaRowTitleCheckboxComponent, Object.assign({ disabled: this.state.disabled }, (0, RcsbIdParser_1.parseEntityOrInstance)(this.props.targetAlignment.target_id), { tag: "aligned", stateManager: this.props.stateManager })), (0, jsx_runtime_1.jsx)(MsaRowTitleCheckboxComponent_1.MsaRowTitleCheckboxComponent, Object.assign({ disabled: this.state.disabled }, (0, RcsbIdParser_1.parseEntityOrInstance)(this.props.targetAlignment.target_id), { tag: "polymer", stateManager: this.props.stateManager })), (0, jsx_runtime_1.jsx)(MsaRowTitleCheckboxComponent_1.MsaRowTitleCheckboxComponent, Object.assign({ disabled: this.state.disabled }, (0, RcsbIdParser_1.parseEntityOrInstance)(this.props.targetAlignment.target_id), { tag: "non-polymer", stateManager: this.props.stateManager }))] })] }));
}
componentDidMount() {
this.subscribe();
this.modelChange();
}
componentWillUnmount() {
this.subscription.unsubscribe();
}
subscribe() {
this.subscription = this.props.stateManager.subscribe((o) => {
if (o.type == "model-change" && o.view == "1d-view")
this.block();
if (o.type == "model-change" && o.view == "3d-view")
this.modelChange();
});
}
block() {
this.setState({ blocked: true });
}
modelChange() {
var _a;
if (this.props.targetAlignment.target_id && ((_a = this.props.stateManager.assemblyModelSate.getMap()) === null || _a === void 0 ? void 0 : _a.has(this.props.targetAlignment.target_id))) {
if (this.state.disabled)
this.setState({ disabled: false, titleColor: this.ACTIVE_COLOR, blocked: false });
else
this.setState({ blocked: false });
}
else if (!this.state.disabled) {
this.setState({ disabled: true, titleColor: this.INACTIVE_COLOR, blocked: false });
}
else if (this.state.blocked) {
this.setState({ blocked: false });
}
}
hover(flag) {
if (this.state.disabled && flag)
this.setState({ titleColor: this.ACTIVE_COLOR });
else if (this.state.disabled && !flag)
this.setState({ titleColor: this.INACTIVE_COLOR });
}
click(e) {
const rcsbId = (0, RcsbIdParser_1.parseEntityOrInstance)(this.props.targetAlignment.target_id);
const entityTag = "entityId" in rcsbId ? `#entity-${rcsbId.entityId}` : "";
if (e.shiftKey) {
const newWin = window.open(`/structure/${rcsbId.entryId}${entityTag}`, "_blank");
if (!newWin || newWin.closed || typeof newWin.closed === 'undefined')
document.location.href = `/structure/${rcsbId.entryId}${entityTag}`;
}
else {
if (this.state.blocked)
return;
this.block();
this.props.titleClick();
}
}
cursor() {
if (this.state.blocked)
return "wait";
return this.state.disabled ? "pointer" : undefined;
}
altClick(e) {
if (this.state.disabled)
this.props.titleClick();
}
}
exports.MsaRowTitleComponent = MsaRowTitleComponent;