UNPKG

@rcsb/rcsb-saguaro-3d

Version:
42 lines (41 loc) 2.08 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.MsaRowMarkComponent = 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_1 = tslib_1.__importDefault(require("react")); const classes = tslib_1.__importStar(require("../../../../../scss/MsaPfvStyle.module.scss")); const rxjs_1 = require("rxjs"); class MsaRowMarkComponent extends react_1.default.Component { constructor(props) { super(props); this.HOVER_COLOR = "rgb(51, 122, 183)"; this.ACTIVE_COLOR = "rgb(51, 122, 183)"; this.state = { visibility: undefined, borderLeftColor: undefined, markHoverColor: this.HOVER_COLOR }; } render() { return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)("div", { onClick: this.click.bind(this), onMouseOver: this.hover.bind(this), style: { visibility: this.state.visibility, cursor: "pointer", display: "inline-block", width: 6, height: 6, marginBottom: 4, marginRight: 5 }, children: (0, jsx_runtime_1.jsx)("div", { className: classes.msaRowMark, onMouseOut: () => this.markHover(false), onMouseOver: () => this.markHover(true), style: { borderLeftColor: this.props.isGlowing ? this.state.markHoverColor : (this.state.borderLeftColor) } }) }) })); } click() { rxjs_1.asyncScheduler.schedule(() => { var _a, _b; return (_b = (_a = this.props).clickCallback) === null || _b === void 0 ? void 0 : _b.call(_a); }); } hover() { var _a, _b; (_b = (_a = this.props).hoverCallback) === null || _b === void 0 ? void 0 : _b.call(_a); } markHover(flag) { if (flag) this.setState({ markHoverColor: this.ACTIVE_COLOR }); else this.setState({ markHoverColor: this.HOVER_COLOR }); } } exports.MsaRowMarkComponent = MsaRowMarkComponent;