molstar
Version:
A comprehensive macromolecular library.
89 lines (88 loc) • 4.04 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/**
* Copyright (c) 2025 mol* contributors, licensed under MIT, See LICENSE file for more info.
*
* @author David Sehnal <david.sehnal@gmail.com>
*/
import { download } from '../../mol-util/download';
import { BehaviorSubject } from 'rxjs';
import { Stories } from './stories';
import { useBehavior } from '../../mol-plugin-ui/hooks/use-behavior';
import { createRoot } from 'react-dom/client';
import { getMVSStoriesContext } from '../../apps/mvs-stories/context';
import '../../apps/mvs-stories/elements';
import './favicon.ico';
import '../../mol-plugin-ui/skin/light.scss';
import '../../apps/mvs-stories/styles.scss';
import './index.html';
function getContext(name) {
return getMVSStoriesContext({ name });
}
const CurrentStory = new BehaviorSubject(undefined);
function SelectStoryUI({ subject }) {
const current = useBehavior(subject);
const selectedId = (current === null || current === void 0 ? void 0 : current.kind) === 'built-in' ? current.id : (current === null || current === void 0 ? void 0 : current.kind) === 'url' ? 'url' : '';
return _jsxs("select", { onChange: e => {
const value = e.currentTarget.value;
const s = Stories.find(s => s.id === value);
if (!s)
return;
subject.next({ kind: 'built-in', id: s.id });
}, value: selectedId, children: [!current && _jsx("option", { value: '', children: "Select a story..." }), Stories.map(s => _jsxs("option", { value: s.id, children: ["Story: ", s.name] }, s.name)), (current === null || current === void 0 ? void 0 : current.kind) === 'url' && _jsx("option", { disabled: true, children: "------------------" }), (current === null || current === void 0 ? void 0 : current.kind) === 'url' && _jsx("option", { value: 'url', children: current.url })] });
}
function init() {
CurrentStory.subscribe(story => {
if (!story) {
history.replaceState({}, '', '');
}
else if (story.kind === 'url') {
history.replaceState({}, '', story ? `?story-url=${encodeURIComponent(story.url)}&data-format=${story.format}` : '');
getContext().dispatch({
kind: 'load-mvs',
format: story.format,
url: story.url,
});
}
else if (story.kind === 'built-in') {
history.replaceState({}, '', story ? `?story=${story.id}` : '');
const s = Stories.find(s => s.id === story.id);
if (s) {
getContext().dispatch({
kind: 'load-mvs',
data: s.buildStory(),
});
}
else {
console.warn('Story not found:', story.id);
CurrentStory.next({ kind: 'built-in', id: Stories[0].id });
}
}
});
const urlParams = new URLSearchParams(window.location.search);
const storyUrl = urlParams.get('story-url');
const dataFormat = urlParams.get('data-format');
const storyId = urlParams.get('story');
if (storyUrl) {
CurrentStory.next({ kind: 'url', url: storyUrl, format: dataFormat !== null && dataFormat !== void 0 ? dataFormat : 'mvsj' });
}
else if (storyId) {
CurrentStory.next({ kind: 'built-in', id: storyId });
}
else {
CurrentStory.next({ kind: 'built-in', id: Stories[0].id });
}
createRoot(document.getElementById('select-story')).render(_jsx(SelectStoryUI, { subject: CurrentStory }));
}
window.downloadStory = () => {
var _a;
if (((_a = CurrentStory.value) === null || _a === void 0 ? void 0 : _a.kind) !== 'built-in')
return;
const id = CurrentStory.value.id;
const story = Stories.find(s => s.id === id);
if (!story)
return;
const data = JSON.stringify(story.buildStory(), null, 2);
download(new Blob([data], { type: 'application/json' }), `${id}-story.mvsj`);
};
window.initStories = init;
window.CurrentStory = CurrentStory;