Issue #805: extracting data from JsvLib API response

src/examples/assembly-tm/FeatureViewConfig.ts

@@ -32,17 +32,17 @@ export const rowConfig: Array<RcsbFvRowConfigInterface> = [
 ];
 
 export const fvConfig: FeatureViewInterface<LoadMolstarInterface<unknown,unknown>,LoadMolstarReturnType> = {
-    boardId:"2xq2_board",
+    boardId:"7ynk_board",
     boardConfig: {
         rowTitleWidth: 190,
         includeAxis: true
     },
     rowConfig: rowConfig,
     sequenceSelectionChangeCallback: (plugin: StructureViewerPublicInterface<LoadMolstarInterface<unknown,unknown>,LoadMolstarReturnType>, stateManager: RcsbFvStateManager, sequenceRegion: Array<RcsbFvTrackDataElementInterface>) => {
-        stateManager.selectionState.clearSelection("select", {modelId:"2xq2_model", labelAsymId:"A"});
+        stateManager.selectionState.clearSelection("select", {modelId:"7ynk_model", labelAsymId:"A"});
         if(sequenceRegion.length > 0) {
             const regions = sequenceRegion.map(r => ({
-                modelId: "2xq2_model",
+                modelId: "7ynk_model",
                 labelAsymId: "A",
                 region: {begin: r.begin, end: r.end ?? r.begin, source: "sequence"} as RegionSelectionInterface
             }));
@@ -53,27 +53,27 @@ export const fvConfig: FeatureViewInterface<LoadMolstarInterface<unknown,unknown
                 end: r.region.end
             })), "select", "set");
         }else{
-            plugin.clearSelection("select", {modelId: "2xq2_model", labelAsymId: "A"})
+            plugin.clearSelection("select", {modelId: "7ynk_model", labelAsymId: "A"})
             plugin.resetCamera();
         }
     },
     sequenceElementClickCallback: (plugin: StructureViewerPublicInterface<LoadMolstarInterface<unknown,unknown>,LoadMolstarReturnType>, stateManager: RcsbFvStateManager, d: RcsbFvTrackDataElementInterface) => {
         if(d!=null)
-            plugin.cameraFocus("2xq2_model", "A", d.begin, d.end ?? d.begin);
+            plugin.cameraFocus("7ynk_model", "A", d.begin, d.end ?? d.begin);
     },
     sequenceHoverCallback: (plugin: StructureViewerPublicInterface<LoadMolstarInterface<unknown,unknown>,LoadMolstarReturnType>, stateManager: RcsbFvStateManager, elements: Array<RcsbFvTrackDataElementInterface>) => {
         if(elements == null || elements.length == 0)
             plugin.clearSelection("hover");
         else
             plugin.select(elements.map(e=>({
-                modelId: "2xq2_model",
+                modelId: "7ynk_model",
                 labelAsymId: "A",
                 begin: e.begin,
                 end: e.end ?? e.begin
             })), "hover", "set");
     },
     structureSelectionCallback: (plugin: StructureViewerPublicInterface<LoadMolstarInterface<unknown,unknown>,LoadMolstarReturnType>, pfv: RcsbFv, stateManager: RcsbFvStateManager) => {
-        const sel: SaguaroRegionList | undefined = stateManager.selectionState.getSelectionWithCondition("2xq2_model", "A", "select");
+        const sel: SaguaroRegionList | undefined = stateManager.selectionState.getSelectionWithCondition("7ynk_model", "A", "select");
         if(sel == null) {
             pfv.clearSelection("select");
             plugin.resetCamera();
@@ -82,7 +82,7 @@ export const fvConfig: FeatureViewInterface<LoadMolstarInterface<unknown,unknown
         }
     },
     structureHoverCallback: (plugin: StructureViewerPublicInterface<LoadMolstarInterface<unknown,unknown>,LoadMolstarReturnType>, pfv: RcsbFv, stateManager: RcsbFvStateManager) => {
-        const sel: SaguaroRegionList | undefined = stateManager.selectionState.getSelectionWithCondition("2xq2_model", "A", "hover");
+        const sel: SaguaroRegionList | undefined = stateManager.selectionState.getSelectionWithCondition("7ynk_model", "A", "hover");
         if(sel == null)
             pfv.clearSelection("hover");
         else

src/examples/assembly-tm/UniTmpHelper.ts

@@ -2,22 +2,30 @@ import { RcsbFvDisplayTypes } from "@rcsb/rcsb-saguaro";
 
 import { getColorByLocation, getLabelByLocation } from "./UniTmpColor";
 
-export async function fetchDescriptor(entryId: string) {
-    const response = await fetch(`https://htp.unitmp.org/api/v1/entry/${entryId}.json`);
+export async function fetchHtpDescriptor(entryId: string) {
+    return fetchDescriptor(`https://htp.unitmp.org/api/v1/entry/${entryId}.json`);
+}
+
+export async function fetchPdbtmJsvLibDescriptor(entryId: string) {
+    return fetchDescriptor(`https://pdbtm.unitmp.org/api/v1/jsvlib/${entryId}`);
+}
+
+async function fetchDescriptor(url: string) {
+    const response = await fetch(url);
     const descriptor = await response.json();
     return descriptor;
 }
 
-export function descriptorChainToTrackData(descriptor: any) {
+export function htpDescriptorToTrackData(descriptor: any) {
     const tracks = [] as any[];
 
     if (Array.isArray(descriptor.Topology.Region)) {
-        const trackData = createNewTrack('Topology', descriptor.Topology.Region);
+        const trackData = createNewTrack('Topology', descriptor.Topology.Region, displayParamsFromHtpRegion);
         tracks.push(trackData);
     }
 
     descriptor.Predictions.Prediction.forEach((prediction: any) => {
-        const trackData = createNewTrack(prediction['@attributes'].name, prediction.Region);
+        const trackData = createNewTrack(prediction['@attributes'].name, prediction.Region, displayParamsFromHtpRegion);
         tracks.push(trackData);
     });
 
@@ -25,7 +33,19 @@ export function descriptorChainToTrackData(descriptor: any) {
     return tracks;
 }
 
-function createNewTrack(rowTitle: string, regions: any[]) {
+export function jsvLibDescriptorToTrackData(descriptor: any) {
+    const tracks = [] as any[];
+
+    if (Array.isArray(descriptor.regions)) {
+        const trackData = createNewTrack(descriptor.code, descriptor.regions, displayParamsFromJsvLibRegion);
+        tracks.push(trackData);
+    }
+    console.log(tracks);
+    return tracks;
+}
+
+
+function createNewTrack(rowTitle: string, regions: any[], paramsConverter: (region: any) => { begin: number, end: number, location: string }) {
     const trackData = {
         trackHeight: 20,
         trackColor: "#F9F9F9",
@@ -37,11 +57,7 @@ function createNewTrack(rowTitle: string, regions: any[]) {
         return trackData;
     }
     regions.forEach((region: any) => {
-        trackData.displayConfig.push(createDisplayItem({
-            begin: parseInt(region['@attributes'].from),
-            end: parseInt(region['@attributes'].to),
-            location: region['@attributes'].loc
-        }));
+        trackData.displayConfig.push(createDisplayItem(paramsConverter(region)));
     });
 
     return trackData;
@@ -59,3 +75,19 @@ function createDisplayItem(params: any) {
         }]
     };
 }
+
+function displayParamsFromHtpRegion(region: any) {
+    return {
+        begin: parseInt(region['@attributes'].from),
+        end: parseInt(region['@attributes'].to),
+        location: region['@attributes'].loc
+    };
+}
+
+function displayParamsFromJsvLibRegion(region: any) {
+    return {
+        begin: parseInt(region.start) + 1,
+        end: parseInt(region.end) + 1,
+        location: region.type
+    };
+}

src/examples/assembly-tm/index.ts

@@ -10,13 +10,19 @@ import {
 } from "../../RcsbFvStructure/StructureViewers/MolstarViewer/MolstarActionManager";
 import {ViewerProps} from "@rcsb/rcsb-molstar/build/src/viewer";
 
-import { descriptorChainToTrackData, fetchDescriptor } from "./UniTmpHelper";
+import {
+    fetchHtpDescriptor,
+    fetchPdbtmJsvLibDescriptor,
+    htpDescriptorToTrackData,
+    jsvLibDescriptorToTrackData
+} from "./UniTmpHelper";
 import { updateSiteColors } from "./UniTmpColor";
 import { fvConfig, rowConfig } from "./FeatureViewConfig";
 
 
 const side1 = "Inside";
-const entry = "SC5AA_HUMAN";
+const htpEntry = "SC5AA_HUMAN";
+const pdbtmEntry = "7ynk_A";
 
 
 
@@ -32,7 +38,7 @@ const customConfig: CustomViewInterface<LoadMolstarInterface<unknown,unknown>,Lo
 
 const sequenceConfig = {
     title: "UniTmp example",
-    subtitle: `HTP entry ${entry}`,
+    subtitle: `HTP entry ${htpEntry}`,
     config: customConfig
 };
 
@@ -40,8 +46,8 @@ const molstarConfig: RcsbFvStructureConfigInterface<LoadMolstarInterface<unknown
     loadConfig: {
         loadMethod: LoadMethod.loadPdbId,
         loadParams: {
-            entryId: "2xq2",
-            id:"2xq2_model"
+            entryId: "7ynk",
+            id:"7ynk_model"
         }
     },
     structureViewerConfig: {
@@ -54,17 +60,20 @@ const molstarConfig: RcsbFvStructureConfigInterface<LoadMolstarInterface<unknown
 
 document.addEventListener("DOMContentLoaded", async function(event) {
     updateSiteColors(side1);
-    const descriptor = await fetchDescriptor(entry);
+    const htpDescriptor = await fetchHtpDescriptor(htpEntry);
+    const jsvlibDescriptor = await fetchPdbtmJsvLibDescriptor(pdbtmEntry);
 
-    console.log(descriptor);
+    console.log(htpDescriptor);
 
-    let sequence = descriptor.Sequence.Seq;
+    let sequence = htpDescriptor.Sequence.Seq;
     sequence = sequence.replace(/\s+/g, '');
 
-    fvConfig.boardConfig.length = parseInt(descriptor.Sequence['@attributes'].Length);
-    fvConfig.rowConfig[0].rowTitle = `${descriptor['@attributes'].id} sequence`;
+    fvConfig.boardConfig.length = parseInt(htpDescriptor.Sequence['@attributes'].Length);
+    fvConfig.rowConfig[0].rowTitle = `${htpDescriptor['@attributes'].id} sequence`;
     rowConfig[0].trackData![0].value = sequence;
-    rowConfig.push(...descriptorChainToTrackData(descriptor));
+    rowConfig.push(...htpDescriptorToTrackData(htpDescriptor));
+
+    rowConfig.push(...jsvLibDescriptorToTrackData(jsvlibDescriptor));
 
 
     const panel3d = new RcsbFv3DCustom({