@rcsb/rcsb-saguaro-3d
Version:
RCSB Molstar/Saguaro Web App
72 lines (71 loc) • 3.24 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.RcsbFv3DAbstract = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const client_1 = require("react-dom/client");
const RcsbFv3DComponent_1 = require("./RcsbFv3DComponent");
const RcsbFvContextManager_1 = require("../RcsbFvContextManager/RcsbFvContextManager");
class RcsbFv3DAbstract {
constructor(config) {
this.ctxManager = new RcsbFvContextManager_1.RcsbFvContextManager();
this.fullScreenFlag = false;
this.overflowStyle = "";
this.elementId = config.elementId;
if (config.cssConfig)
this.cssConfig = config.cssConfig;
this.sequenceConfig = config.sequenceConfig;
this.structureConfig = config.structureConfig;
this.structureViewer = config.structureViewer;
this.structureViewerBehaviourObserver = config.structureViewerBehaviourObserver;
}
render() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
var _a;
if (this.elementId == null)
throw new Error("HTML element not found");
const element = (_a = document.getElementById(this.elementId)) !== null && _a !== void 0 ? _a : document.createElement("div");
if (element.getAttribute("id") == null) {
element.setAttribute("id", this.elementId);
document.body.append(element);
this.fullScreen("on");
}
this.reactRoot = (0, client_1.createRoot)(element);
return new Promise((resolve) => {
this.reactRoot.render((0, jsx_runtime_1.jsx)(RcsbFv3DComponent_1.RcsbFv3DComponent, { structurePanelConfig: this.structureConfig, sequencePanelConfig: this.sequenceConfig, id: this.elementId, ctxManager: this.ctxManager, cssConfig: this.cssConfig, unmount: this.unmount.bind(this), fullScreen: this.fullScreenFlag, structureViewer: this.structureViewer, structureViewerBehaviourObserver: this.structureViewerBehaviourObserver, resolve: resolve }));
});
});
}
unmount(removeHtmlElement, unmountCallback) {
const element = document.getElementById(this.elementId);
if (element != null) {
this.reactRoot.unmount();
if (removeHtmlElement) {
element.remove();
}
if (typeof unmountCallback === "function")
unmountCallback();
this.fullScreen("off");
}
}
updateConfig(config) {
this.ctxManager.next({ eventType: RcsbFvContextManager_1.EventType.UPDATE_CONFIG, eventData: config });
}
pluginCall(f) {
this.structureViewer.pluginCall(f);
}
fullScreen(mode) {
switch (mode) {
case "on":
this.fullScreenFlag = true;
this.overflowStyle = document.body.style.overflow;
document.body.style.overflow = "hidden";
break;
case "off":
this.fullScreenFlag = false;
document.body.style.overflow = this.overflowStyle;
break;
}
}
}
exports.RcsbFv3DAbstract = RcsbFv3DAbstract;