@rcsb/rcsb-saguaro
Version:
RCSB 1D Feature Viewer
174 lines (173 loc) • 6.87 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.RcsbAbstractDisplay = void 0;
const tslib_1 = require("tslib");
const RcsbAbstractTrack_1 = require("./RcsbAbstractTrack");
const classes = tslib_1.__importStar(require("../../scss/RcsbBoard.module.scss"));
const d3_selection_1 = require("d3-selection");
const RcsbD3EventDispatcher_1 = require("../RcsbD3/RcsbD3EventDispatcher");
const RcsbD3Constants_1 = require("../RcsbD3/RcsbD3Constants");
const RcsbFvContextManager_1 = require("../../RcsbFv/RcsbFvContextManager/RcsbFvContextManager");
const rxjs_1 = require("rxjs");
class RcsbAbstractDisplay extends RcsbAbstractTrack_1.RcsbAbstractTrack {
constructor(boardId, trackId) {
super();
this._displayColor = "#FF6666";
this.minRatio = 0;
this.selectDataInRangeFlag = false;
this.hideEmptyTracksFlag = false;
this.hidden = false;
this.elementSelection = (0, d3_selection_1.select)(RcsbD3Constants_1.RcsbD3Constants.EMPTY);
this.elementSubject = {
mouseclick: new rxjs_1.Subject(),
mouseenter: new rxjs_1.Subject(),
mouseleave: new rxjs_1.Subject(),
};
this.trackId = trackId;
}
setDisplayColor(color) {
this._displayColor = color;
}
setMinRatio(ratio) {
this.minRatio = ratio;
}
setSelectDataInRange(flag) {
this.selectDataInRangeFlag = flag;
}
setHideEmptyTrack(flag) {
this.hideEmptyTracksFlag = flag;
}
reset() {
this.g.selectAll("." + classes.rcsbElement).remove();
}
subscribeElementHighlight(action) {
this.elementSubject.mouseenter.subscribe(({ d, e }) => action.enter(d));
this.elementSubject.mouseleave.subscribe(({ d, e }) => action.leave(d));
}
plot(element) {
element.on(RcsbD3Constants_1.RcsbD3Constants.CLICK, (event, d) => {
var _a;
if (event.defaultPrevented)
return;
this.elementSubject.mouseclick.next({ d, e: event });
(_a = d.elementClickCallback) === null || _a === void 0 ? void 0 : _a.call(d, d, event);
RcsbD3EventDispatcher_1.RcsbD3EventDispatcher.elementClick(event, this.getBoardHighlight(), d);
});
element.on(RcsbD3Constants_1.RcsbD3Constants.MOUSE_ENTER, (event, d) => {
if (event.defaultPrevented)
return;
this.elementSubject.mouseenter.next({ d, e: event });
});
element.on(RcsbD3Constants_1.RcsbD3Constants.DBL_CLICK, (event, d) => {
if (event.defaultPrevented)
return;
});
element.on(RcsbD3Constants_1.RcsbD3Constants.MOUSE_LEAVE, (event, d) => {
if (event.defaultPrevented) {
return;
}
this.elementSubject.mouseleave.next({ d, e: event });
});
}
update(compKey) {
const where = { from: Math.floor(this.xScale.domain()[0]), to: Math.ceil(this.xScale.domain()[1]) };
if (typeof this.updateDataOnMove === "function") {
this.updateDataOnMove(where).then((result) => {
this.data(result);
if (this.data() != null) {
this._update(where, compKey);
}
else {
this.displayEmpty();
}
}).catch((error) => {
console.error(error);
});
}
else {
if (this.data() == null) {
this.displayEmpty();
return;
}
this._update(where, compKey);
}
}
_update(where, compKey) {
if (this.selectDataInRangeFlag) {
let dataElems = this.processData(this.data().filter((s, i) => {
if (s.end == null) {
return (s.begin >= where.from && s.begin <= where.to);
}
else {
return !(s.begin > where.to || s.end < where.from);
}
}));
if (this.hideEmptyTracksFlag) {
if (dataElems.length == 0 && !this.hidden) {
this.contextManager.next({
eventType: RcsbFvContextManager_1.EventType.TRACK_HIDE,
eventData: { trackId: this.trackId, visibility: false }
});
this.hidden = true;
}
else if (dataElems.length > 0 && this.hidden) {
this.contextManager.next({
eventType: RcsbFvContextManager_1.EventType.TRACK_HIDE,
eventData: { trackId: this.trackId, visibility: true }
});
this.hidden = false;
}
}
this.selectElements(dataElems, compKey)
.attr("class", classes.rcsbElement)
.classed(classes.rcsbElement + "_" + compKey, typeof compKey === "string")
.call(this.plot.bind(this));
}
else if ((this.minRatio == 0 || this.getRatio() > this.minRatio) && !this.isDataUpdated()) {
let dataElems = this.processData(this.data());
this.selectElements(dataElems, compKey)
.attr("class", classes.rcsbElement)
.classed(classes.rcsbElement + "_" + compKey, typeof compKey === "string")
.call(this.plot.bind(this));
this.setDataUpdated(true);
}
else if (this.minRatio > 0 && this.getRatio() <= this.minRatio) {
this.getElements().remove();
this.setDataUpdated(false);
}
}
displayEmpty() {
}
;
move() {
}
;
processData(dataElems) {
return dataElems;
}
selectElements(dataElems, compKey) {
const className = typeof compKey === "string" ? "." + classes.rcsbElement + "_" + compKey : "." + classes.rcsbElement;
const elements = this.g.selectAll(className).data(dataElems, RcsbAbstractDisplay.dataKey);
const newElems = elements.enter()
.append(RcsbD3Constants_1.RcsbD3Constants.G)
.attr("class", classes.rcsbElement)
.classed(classes.rcsbElement + "_" + compKey, typeof compKey === "string");
newElems.call(this.enter);
elements.exit().remove();
this.elementSelection = elements.merge(newElems);
return this.elementSelection;
}
enter(e) {
}
getElements() {
return this.elementSelection;
}
static dataKey(d) {
return d.begin + ":" + d.end;
}
getRatio() {
const xScale = this.xScale;
return (xScale.range()[1] - xScale.range()[0]) / (xScale.domain()[1] - xScale.domain()[0]);
}
}
exports.RcsbAbstractDisplay = RcsbAbstractDisplay;