@jbrowse/plugin-linear-genome-view
Version:
JBrowse 2 linear genome view
52 lines (51 loc) • 2.91 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const ui_1 = require("@jbrowse/core/ui");
const ErrorBoundary_1 = require("@jbrowse/core/ui/ErrorBoundary");
const material_1 = require("@mui/material");
const mobx_react_1 = require("mobx-react");
const mobx_state_tree_1 = require("mobx-state-tree");
const mui_1 = require("tss-react/mui");
const Gridlines_1 = __importDefault(require("./Gridlines"));
const TrackLabelContainer_1 = __importDefault(require("./TrackLabelContainer"));
const TrackRenderingContainer_1 = __importDefault(require("./TrackRenderingContainer"));
const useStyles = (0, mui_1.makeStyles)()({
root: {
marginTop: 2,
overflow: 'hidden',
position: 'relative',
},
unpinnedTrack: {
background: 'none',
},
resizeHandle: {
height: 3,
boxSizing: 'border-box',
position: 'relative',
},
});
const TrackContainer = (0, mobx_react_1.observer)(function ({ model, track, }) {
const { classes, cx } = useStyles();
const display = track.displays[0];
const { draggingTrackId, showTrackOutlines } = model;
const ref = (0, react_1.useRef)(null);
return ((0, jsx_runtime_1.jsxs)(material_1.Paper, { ref: ref, className: cx(classes.root, track.pinned ? null : classes.unpinnedTrack), variant: showTrackOutlines ? 'outlined' : undefined, elevation: showTrackOutlines ? undefined : 0, onClick: event => {
var _a;
if (event.detail === 2 && !track.displays[0].featureIdUnderMouse) {
const left = ((_a = ref.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().left) || 0;
model.zoomTo(model.bpPerPx / 2, event.clientX - left, true);
}
}, children: [track.pinned ? (0, jsx_runtime_1.jsx)(Gridlines_1.default, { model: model, offset: 1 }) : null, (0, jsx_runtime_1.jsx)(TrackLabelContainer_1.default, { track: track, view: model }), (0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { FallbackComponent: e => (0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: e.error }), children: (0, jsx_runtime_1.jsx)(TrackRenderingContainer_1.default, { model: model, track: track, onDragEnter: () => {
if ((0, mobx_state_tree_1.isAlive)(display) &&
draggingTrackId !== undefined &&
draggingTrackId !== display.id) {
model.moveTrack(draggingTrackId, track.id);
}
} }) }), (0, jsx_runtime_1.jsx)(ui_1.ResizeHandle, { onDrag: display.resizeHeight, className: classes.resizeHandle })] }));
});
exports.default = TrackContainer;