pdbe-molstar 3.7.1 → 3.8.0

package/lib/ui/_layout.js

@@ -1,162 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Layout = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const file_1 = require("molstar/lib/mol-plugin-state/actions/file");
-const base_1 = require("molstar/lib/mol-plugin-ui/base");
-const use_behavior_1 = require("molstar/lib/mol-plugin-ui/hooks/use-behavior");
-const left_panel_1 = require("molstar/lib/mol-plugin-ui/left-panel");
-const plugin_1 = require("molstar/lib/mol-plugin-ui/plugin");
-const sequence_1 = require("molstar/lib/mol-plugin-ui/sequence");
-const task_1 = require("molstar/lib/mol-plugin-ui/task");
-const commands_1 = require("molstar/lib/mol-plugin/commands");
-const assets_1 = require("molstar/lib/mol-util/assets");
-const rxjs_1 = require("rxjs");
-/** Copy of `Layout` in molstar/src/mol-plugin-ui/plugin.tsx, TODO export from core Molstar and remove here */
-class Layout extends base_1.PluginUIComponent {
-    constructor() {
-        super(...arguments);
-        this.onDrop = (ev) => {
-            ev.preventDefault();
-            const files = [];
-            if (ev.dataTransfer.items) {
-                // Use DataTransferItemList interface to access the file(s)
-                for (let i = 0; i < ev.dataTransfer.items.length; i++) { // eslint-disable-line @typescript-eslint/prefer-for-of
-                    if (ev.dataTransfer.items[i].kind !== 'file')
-                        continue;
-                    const file = ev.dataTransfer.items[i].getAsFile();
-                    if (file)
-                        files.push(file);
-                }
-            }
-            else {
-                for (let i = 0; i < ev.dataTransfer.files.length; i++) { // eslint-disable-line @typescript-eslint/prefer-for-of
-                    const file = ev.dataTransfer.files[i];
-                    if (file)
-                        files.push(file);
-                }
-            }
-            const sessions = files.filter(f => {
-                const fn = f.name.toLowerCase();
-                return fn.endsWith('.molx') || fn.endsWith('.molj');
-            });
-            if (sessions.length > 0) {
-                commands_1.PluginCommands.State.Snapshots.OpenFile(this.plugin, { file: sessions[0] });
-            }
-            else {
-                this.plugin.runTask(this.plugin.state.data.applyAction(file_1.OpenFiles, {
-                    files: files.map(f => assets_1.Asset.File(f)),
-                    format: { name: 'auto', params: {} },
-                    visuals: true,
-                }));
-            }
-        };
-        this.onDragOver = (ev) => {
-            ev.preventDefault();
-        };
-        this.showDragOverlay = new rxjs_1.BehaviorSubject(false);
-        this.onDragEnter = (ev) => {
-            let hasFile = false;
-            if (ev.dataTransfer.items && ev.dataTransfer.items.length > 0) {
-                for (let i = 0; i < ev.dataTransfer.items.length; i++) { // eslint-disable-line @typescript-eslint/prefer-for-of
-                    if (ev.dataTransfer.items[i].kind !== 'file')
-                        continue;
-                    hasFile = true;
-                    break;
-                }
-            }
-            else {
-                for (let i = 0; i < ev.dataTransfer.types.length; i++) { // eslint-disable-line @typescript-eslint/prefer-for-of
-                    if (ev.dataTransfer.types[i] !== 'Files')
-                        continue;
-                    hasFile = true;
-                    break;
-                }
-            }
-            if (hasFile) {
-                this.showDragOverlay.next(true);
-            }
-        };
-    }
-    componentDidMount() {
-        this.subscribe(this.plugin.layout.events.updated, () => this.forceUpdate());
-    }
-    region(kind, Element) {
-        return (0, jsx_runtime_1.jsx)("div", { className: `msp-layout-region msp-layout-${kind}`, children: (0, jsx_runtime_1.jsx)("div", { className: 'msp-layout-static', children: Element ? (0, jsx_runtime_1.jsx)(Element, {}) : null }) });
-    }
-    get layoutVisibilityClassName() {
-        var _a, _b;
-        const layout = this.plugin.layout.state;
-        const controls = (_b = (_a = this.plugin.spec.components) === null || _a === void 0 ? void 0 : _a.controls) !== null && _b !== void 0 ? _b : {};
-        const classList = [];
-        if (controls.top === 'none' || !layout.showControls || layout.regionState.top === 'hidden') {
-            classList.push('msp-layout-hide-top');
-        }
-        if (controls.left === 'none' || !layout.showControls || layout.regionState.left === 'hidden') {
-            classList.push('msp-layout-hide-left');
-        }
-        else if (layout.regionState.left === 'collapsed') {
-            classList.push('msp-layout-collapse-left');
-        }
-        if (controls.right === 'none' || !layout.showControls || layout.regionState.right === 'hidden') {
-            classList.push('msp-layout-hide-right');
-        }
-        if (controls.bottom === 'none' || !layout.showControls || layout.regionState.bottom === 'hidden') {
-            classList.push('msp-layout-hide-bottom');
-        }
-        return classList.join(' ');
-    }
-    get layoutClassName() {
-        const layout = this.plugin.layout.state;
-        const classList = ['msp-plugin-content'];
-        if (layout.isExpanded) {
-            classList.push('msp-layout-expanded');
-        }
-        else {
-            classList.push('msp-layout-standard', `msp-layout-standard-${layout.controlsDisplay}`);
-        }
-        return classList.join(' ');
-    }
-    render() {
-        var _a, _b, _c, _d, _e, _f, _g;
-        const layout = this.plugin.layout.state;
-        const controls = ((_a = this.plugin.spec.components) === null || _a === void 0 ? void 0 : _a.controls) || {};
-        const viewport = ((_c = (_b = this.plugin.spec.components) === null || _b === void 0 ? void 0 : _b.viewport) === null || _c === void 0 ? void 0 : _c.view) || plugin_1.DefaultViewport;
-        const sequenceView = ((_e = (_d = this.plugin.spec.components) === null || _d === void 0 ? void 0 : _d.sequenceViewer) === null || _e === void 0 ? void 0 : _e.view) || sequence_1.SequenceView;
-        return (0, jsx_runtime_1.jsx)("div", { className: 'msp-plugin', children: (0, jsx_runtime_1.jsxs)("div", { className: this.layoutClassName, onDragEnter: this.onDragEnter, children: [(0, jsx_runtime_1.jsxs)("div", { className: this.layoutVisibilityClassName, children: [this.region('main', viewport), layout.showControls && controls.top !== 'none' && this.region('top', controls.top || sequenceView), layout.showControls && controls.left !== 'none' && this.region('left', controls.left || left_panel_1.LeftPanelControls), layout.showControls && controls.right !== 'none' && this.region('right', controls.right || plugin_1.ControlsWrapper), layout.showControls && controls.bottom !== 'none' && this.region('bottom', controls.bottom || plugin_1.Log)] }), !((_f = this.plugin.spec.components) === null || _f === void 0 ? void 0 : _f.hideTaskOverlay) && (0, jsx_runtime_1.jsx)(task_1.OverlayTaskProgress, {}), !((_g = this.plugin.spec.components) === null || _g === void 0 ? void 0 : _g.disableDragOverlay) && (0, jsx_runtime_1.jsx)(DragOverlay, { plugin: this.plugin, showDragOverlay: this.showDragOverlay })] }) });
-    }
-}
-exports.Layout = Layout;
-function dropFiles(ev, plugin, showDragOverlay) {
-    ev.preventDefault();
-    ev.stopPropagation();
-    showDragOverlay.next(false);
-    const files = [];
-    if (ev.dataTransfer.items) {
-        // Use DataTransferItemList interface to access the file(s)
-        for (let i = 0; i < ev.dataTransfer.items.length; i++) { // eslint-disable-line @typescript-eslint/prefer-for-of
-            if (ev.dataTransfer.items[i].kind !== 'file')
-                continue;
-            const file = ev.dataTransfer.items[i].getAsFile();
-            if (file)
-                files.push(file);
-        }
-    }
-    else {
-        for (let i = 0; i < ev.dataTransfer.files.length; i++) { // eslint-disable-line @typescript-eslint/prefer-for-of
-            const file = ev.dataTransfer.files[i];
-            if (file)
-                files.push(file);
-        }
-    }
-    plugin.managers.dragAndDrop.handle(files);
-}
-function DragOverlay({ plugin, showDragOverlay }) {
-    const show = (0, use_behavior_1.useBehavior)(showDragOverlay);
-    const preventDrag = (e) => {
-        e.dataTransfer.dropEffect = 'copy';
-        e.preventDefault();
-        e.stopPropagation();
-    };
-    return (0, jsx_runtime_1.jsx)("div", { className: 'msp-drag-drop-overlay', style: { display: show ? 'flex' : 'none' }, onDragEnter: preventDrag, onDragOver: preventDrag, onDragLeave: () => showDragOverlay.next(false), onDrop: e => dropFiles(e, plugin, showDragOverlay), children: "Load File(s)" });
-}