index.ts 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. import { RcsbFv3DCustomInterface} from "../RcsbFv3D/RcsbFv3DCustom";
  2. import { DebugUtil } from "./tmdet-extension/debug-utils";
  3. import { createFeatureViewerConfing } from "./FeatureViewConfig";
  4. import { fetchDescriptor, registerRegionDescriptorData } from "./UniTmpHelper";
  5. import { TmFv3DCustom } from "./tmdet-viewer/TmFv3DCustom";
  6. import { updateSiteColors } from "./tmdet-extension/tmdet-color-theme";
  7. import { createRcsbFeatureViewer, TmFv1DElement } from "./tmdet-viewer/TmFv1DComponent";
  8. customElements.define("tm-saguaro-1d", TmFv1DElement);
  9. function createRcsb3DViewer(configParams: any) {
  10. document.addEventListener("DOMContentLoaded", (event) => {
  11. (async function(event) {
  12. updateSiteColors(configParams.side1);
  13. DebugUtil.enableLog();
  14. const panel3dConfig = await createConfig(configParams);
  15. DebugUtil.log('Panel config', JSON.stringify(panel3dConfig));
  16. const panel3d = new TmFv3DCustom(panel3dConfig);
  17. panel3d.render();
  18. })();
  19. });
  20. }
  21. async function createConfig(configParams: any): Promise<RcsbFv3DCustomInterface> {
  22. const pdbEntry = configParams.pdbEntry;
  23. const labelAsymId = configParams.labelAsymId;
  24. const params: any = {
  25. title: configParams.title,
  26. subtitle: configParams.subtitle,
  27. side1: configParams.side1,
  28. htpEntry: configParams.htpEntry,
  29. pdbEntry: configParams.pdbEntry,
  30. labelAsymId: labelAsymId,
  31. pdbtmEntry: `${pdbEntry}_${labelAsymId}`
  32. };
  33. if (pdbEntry) {
  34. console.log('annotation data:', configParams.annotationData);
  35. await registerRegionDescriptorData(configParams.annotationData, params.side1);
  36. }
  37. if (configParams.configData) {
  38. console.log('config data:', configParams.configData);
  39. params.fvConfigData = await fetchDescriptor(configParams.configData);
  40. }
  41. const { sequenceConfig, molstarConfig } = await createFeatureViewerConfing(params);
  42. const panel3dConfig: RcsbFv3DCustomInterface = {
  43. elementId: configParams.elementId,
  44. sequencePanelConfig: sequenceConfig,
  45. structurePanelConfig: molstarConfig
  46. };
  47. molstarConfig.structureViewerConfig.viewerProps.layoutShowSequence = true;
  48. (molstarConfig as any).loadConfig.loadParams.params = {
  49. preset: { modelIndex: 0 }
  50. }
  51. return panel3dConfig;
  52. }
  53. export {
  54. DebugUtil,
  55. createRcsb3DViewer,
  56. createRcsbFeatureViewer,
  57. };