首頁 探索 說明
登入
web
/
TmMolStar
3
0
複刻 0
檔案 問題管理 0 合併請求 0 Wiki
瀏覽代碼

interface example

bioinsilico 3 年之前
父節點
a8cc2d9b98
當前提交
5ce3cb7c4a
共有 7 個文件被更改，包括 11814 次插入 和 320 次删除
統一視圖 顯示文件統計
  1. 11644 295
      package-lock.json
  2. 5 4
      package.json
  3. 12 0
      src/examples/assembly-interface/index.html
  4. 110 0
      src/examples/assembly-interface/index.ts
  5. 28 19
      src/examples/assembly/index.ts
  6. 2 1
      tsconfig.examples.json
  7. 13 1
      webpack.examples.config.js

文件差異過大導致無法顯示
+ 11644 - 295
package-lock.json


+ 5 - 4
package.json
查看文件 

@@ -1,6 +1,6 @@
 
 {
 
 {
 
   "name": "@rcsb/rcsb-saguaro-3d",
 
   "name": "@rcsb/rcsb-saguaro-3d",
 
-  "version": "1.2.0",
 
+  "version": "1.2.0-interfaces",
 
   "description": "RCSB Molstar/Saguaro Web App",
 
   "description": "RCSB Molstar/Saguaro Web App",
 
   "main": "build/dist/app.js",
 
   "main": "build/dist/app.js",
 
   "files": [
 
   "files": [
 
@@ -16,12 +16,13 @@
 
     "buildExamples": "npm run cleanExamples && npm run tscExamples && npm run cpStyles && npm run copyExample && npm run packExamples && npm run clean",
 
     "buildExamples": "npm run cleanExamples && npm run tscExamples && npm run cpStyles && npm run copyExample && npm run packExamples && npm run clean",
 
     "cpStyles": "ncp src/styles build/src/styles",
 
     "cpStyles": "ncp src/styles build/src/styles",
 
     "copyConfig": "ncp build/src/config.js build/dist/config.js",
 
     "copyConfig": "ncp build/src/config.js build/dist/config.js",
 
-    "copyExample": "npm run copyExample_1 && npm run copyExample_2 && npm run copyExample_3 && npm run copyExample_4 && npm run copyExample_5",
 
+    "copyExample": "npm run copyExample_1 && npm run copyExample_2 && npm run copyExample_3 && npm run copyExample_4 && npm run copyExample_5 && npm run copyExample_6",
 
     "copyExample_1": "ncp src/examples/single-chain/index.html build/src/examples/single-chain/index.html",
 
     "copyExample_1": "ncp src/examples/single-chain/index.html build/src/examples/single-chain/index.html",
 
     "copyExample_2": "ncp src/examples/structural-alignment/index.html build/src/examples/structural-alignment/index.html",
 
     "copyExample_2": "ncp src/examples/structural-alignment/index.html build/src/examples/structural-alignment/index.html",
 
     "copyExample_3": "ncp src/examples/assembly/index.html build/src/examples/assembly/index.html",
 
     "copyExample_3": "ncp src/examples/assembly/index.html build/src/examples/assembly/index.html",
 
     "copyExample_4": "ncp src/examples/multiple-chain/index.html build/src/examples/multiple-chain/index.html",
 
     "copyExample_4": "ncp src/examples/multiple-chain/index.html build/src/examples/multiple-chain/index.html",
 
     "copyExample_5": "ncp src/examples/css-config/index.html build/src/examples/css-config/index.html",
 
     "copyExample_5": "ncp src/examples/css-config/index.html build/src/examples/css-config/index.html",
 
+    "copyExample_6": "ncp src/examples/assembly-interface/index.html build/src/examples/assembly-interface/index.html",
 
     "buildDoc": "npx typedoc --mode file --out docs --exclude src/examples src && sed -i '' '/---/d' docs/index.html",
 
     "buildDoc": "npx typedoc --mode file --out docs --exclude src/examples src && sed -i '' '/---/d' docs/index.html",
 
     "clean": "del-cli build/src",
 
     "clean": "del-cli build/src",
 
     "cleanAll": "npm run clean && del-cli build/dist",
 
     "cleanAll": "npm run clean && del-cli build/dist",
 
@@ -84,10 +85,10 @@
 
     "webpack-cli": "^4.9.1"
 
     "webpack-cli": "^4.9.1"
 
   },
 
   },
 
   "dependencies": {
 
   "dependencies": {
 
+    "@rcsb/rcsb-api-tools": "^2.2.1-interface.12",
 
     "@rcsb/rcsb-molstar": "^2.0.0-dev.10",
 
     "@rcsb/rcsb-molstar": "^2.0.0-dev.10",
 
     "@rcsb/rcsb-saguaro": "^2.0.0",
 
     "@rcsb/rcsb-saguaro": "^2.0.0",
 
-    "@rcsb/rcsb-saguaro-api": "^2.1.0",
 
-    "@rcsb/rcsb-saguaro-app": "^3.4.0",
 
+    "@rcsb/rcsb-saguaro-app": "file:../rcsb-saguaro-app",
 
     "molstar": "^2.4.1",
 
     "molstar": "^2.4.1",
 
     "react-select": "^3.0.8"
 
     "react-select": "^3.0.8"
 
   },
 
   },

+ 12 - 0
src/examples/assembly-interface/index.html
查看文件 

@@ -0,0 +1,12 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">
 
+    <script src="./index.js" type="text/javascript"></script>
 
+    <title>Saguaro 3D</title>
 
+</head>
 
+<body>
 
+
 
+
 
+</body>
 
+</html>

+ 110 - 0
src/examples/assembly-interface/index.ts
查看文件 

@@ -0,0 +1,110 @@
 
+
 
+import './index.html';
 
+import {RcsbFv3DAssembly} from "../../RcsbFv3D/RcsbFv3DAssembly";
 
+import {
 
+    AlignmentResponse,
 
+    AnnotationFeatures,
 
+    Type
 
+} from "@rcsb/rcsb-api-tools/build/RcsbGraphQL/Types/Borrego/GqlTypes";
 
+import {SequenceCollectorDataInterface} from "@rcsb/rcsb-saguaro-app/build/dist/RcsbCollectTools/SequenceCollector/SequenceCollector";
 
+import {RcsbFvDisplayTypes, RcsbFvRowConfigInterface} from "@rcsb/rcsb-saguaro";
 
+import {PolymerEntityInstanceInterface} from "@rcsb/rcsb-saguaro-app/build/dist/RcsbCollectTools/Translators/PolymerEntityInstancesCollector";
 
+import {RcsbFvContextManager} from "@rcsb/rcsb-saguaro-app";
 
+import {InterfaceInstanceTranslate} from "@rcsb/rcsb-saguaro-app/build/dist/RcsbUtils/InterfaceInstanceTranslate";
 
+
 
+document.addEventListener("DOMContentLoaded", function(event) {
 
+
 
+    function getJsonFromUrl() {
 
+        const url = location.search;
 
+        var query = url.substr(1);
 
+        var result: any = {};
 
+        query.split("&").forEach(function(part) {
 
+            var item = part.split("=");
 
+            result[item[0]] = decodeURIComponent(item[1]);
 
+        });
 
+        return result;
 
+    }
 
+
 
+    const args: {pdbId:string} = getJsonFromUrl().pdbId ? getJsonFromUrl() : {pdbId:"4hhb"};
 
+
 
+    const sequenceConfig = {
 
+        entryId: args.pdbId,
 
+        title: "Title " + args.pdbId,
 
+        subtitle: "Subtitle for " + args.pdbId
 
+    };
 
+
 
+    const panel3d = new RcsbFv3DAssembly({
 
+        elementId: "pfv",
 
+        config: sequenceConfig,
 
+        instanceSequenceConfig:{
 
+            dropdownTitle: "CHAIN",
 
+            module: "interface"
 
+        },
 
+        additionalConfig: {
 
+            boardConfig: {
 
+                elementClickCallBack: (e) => {
 
+                    console.log(`Element clicked ${e?.type}`)
 
+                }
 
+            },
 
+            externalTrackBuilder:externalTrackBuilder()
 
+        },
 
+        useOperatorsFlag: true
 
+    });
 
+    panel3d.render();
 
+
 
+});
 
+
 
+function externalTrackBuilder(){
 
+    let myComputedTrack: RcsbFvRowConfigInterface = {
 
+        trackId: "blockTrack",
 
+        trackHeight: 20,
 
+        trackColor: "#F9F9F9",
 
+        titleFlagColor: "#48a1b3",
 
+        displayType: RcsbFvDisplayTypes.BLOCK,
 
+        displayColor: "#56e0f5",
 
+        rowTitle: "COMPUTED",
 
+        trackData: []
 
+    };
 
+    return {
 
+        processAlignmentAndFeatures(data: { annotations?: Array<AnnotationFeatures>; alignments?: AlignmentResponse }): Promise<void> {
 
+            return new Promise<void>(resolve => {
 
+                myComputedTrack.trackData = [];
 
+                data.annotations?.forEach(a=>{
 
+                    a.features?.forEach(f=>{
 
+                        if(f!=null && f.type === Type.Site){
 
+                            if(f.feature_positions)
 
+                                myComputedTrack.trackData?.push( ...f.feature_positions?.map(p=>({
 
+                                    begin:p?.beg_seq_id ?? 0,
 
+                                    end:p?.end_seq_id ?? undefined
 
+                                })))
 
+                        }
 
+                    })
 
+                });
 
+                resolve(void 0);
 
+            })
 
+
 
+        },
 
+        addTo(tracks: { alignmentTracks?: SequenceCollectorDataInterface; annotationTracks?: Array<RcsbFvRowConfigInterface>; rcsbContext?: Partial<PolymerEntityInstanceInterface>; }): Promise<void> {
 
+            return new Promise<void>(resolve => {
 
+                if (tracks.rcsbContext?.asymId === "A" && myComputedTrack?.trackData && myComputedTrack.trackData.length > 0) {
 
+                    tracks.annotationTracks?.push(myComputedTrack);
 
+                }
 
+                resolve(void 0);
 
+            })
 
+        },
 
+        filterFeatures(data: {annotations: Array<AnnotationFeatures>; rcsbContext:Partial<PolymerEntityInstanceInterface>}): Promise<Array<AnnotationFeatures>> {
 
+            return new Promise<Array<AnnotationFeatures>>(async resolve => {
 
+                (await Promise.all(data.annotations.map(async ann=>{
 
+                    if(ann.target_id && data.rcsbContext?.asymId) {
 
+                        const interfaceToInstance: InterfaceInstanceTranslate = await RcsbFvContextManager.getInterfaceToInstance(ann.target_id);
 
+                        return interfaceToInstance.getOperatorIds(ann.target_id, data.rcsbContext.asymId);
 
+                    }
 
+                }))).forEach((value,index,array)=>{
 
+                    if(value)
 
+                        console.log(value);
 
+                });
 
+                resolve(data.annotations);
 
+            });
 
+        }
 
+    }
 
+}

+ 28 - 19
src/examples/assembly/index.ts
查看文件 

@@ -5,7 +5,7 @@ import {
 
     AlignmentResponse,
 
     AlignmentResponse,
 
     AnnotationFeatures,
 
     AnnotationFeatures,
 
     Type
 
     Type
 
-} from "@rcsb/rcsb-saguaro-api/build/RcsbGraphQL/Types/Borrego/GqlTypes";
 
+} from "@rcsb/rcsb-api-tools/build/RcsbGraphQL/Types/Borrego/GqlTypes";
 
 import {SequenceCollectorDataInterface} from "@rcsb/rcsb-saguaro-app/build/dist/RcsbCollectTools/SequenceCollector/SequenceCollector";
 
 import {SequenceCollectorDataInterface} from "@rcsb/rcsb-saguaro-app/build/dist/RcsbCollectTools/SequenceCollector/SequenceCollector";
 
 import {RcsbFvDisplayTypes, RcsbFvRowConfigInterface} from "@rcsb/rcsb-saguaro";
 
 import {RcsbFvDisplayTypes, RcsbFvRowConfigInterface} from "@rcsb/rcsb-saguaro";
 
 import {PolymerEntityInstanceInterface} from "@rcsb/rcsb-saguaro-app/build/dist/RcsbCollectTools/Translators/PolymerEntityInstancesCollector";
 
 import {PolymerEntityInstanceInterface} from "@rcsb/rcsb-saguaro-app/build/dist/RcsbCollectTools/Translators/PolymerEntityInstancesCollector";
 
@@ -63,27 +63,36 @@ function externalTrackBuilder(){
 
         trackData: []
 
         trackData: []
 
     };
 
     };
 
     return {
 
     return {
 
-        processAlignmentAndFeatures(data: { annotations?: Array<AnnotationFeatures>; alignments?: AlignmentResponse }): void {
 
-            myComputedTrack.trackData = [];
 
-            data.annotations?.forEach(a=>{
 
-                a.features?.forEach(f=>{
 
-                    if(f!=null && f.type === Type.Site){
 
-                        if(f.feature_positions)
 
-                           myComputedTrack.trackData?.push( ...f.feature_positions?.map(p=>({
 
-                               begin:p?.beg_seq_id ?? 0,
 
-                               end:p?.end_seq_id ?? undefined
 
-                           })))
 
-                    }
 
-                })
 
+        processAlignmentAndFeatures(data: { annotations?: Array<AnnotationFeatures>; alignments?: AlignmentResponse }): Promise<void> {
 
+            return new Promise<void>(resolve => {
 
+                myComputedTrack.trackData = [];
 
+                data.annotations?.forEach(a=>{
 
+                    a.features?.forEach(f=>{
 
+                        if(f!=null && f.type === Type.Site){
 
+                            if(f.feature_positions)
 
+                                myComputedTrack.trackData?.push( ...f.feature_positions?.map(p=>({
 
+                                    begin:p?.beg_seq_id ?? 0,
 
+                                    end:p?.end_seq_id ?? undefined
 
+                                })))
 
+                        }
 
+                    })
 
+                });
 
+                resolve(void 0);
 
             })
 
             })
 
+
 
         },
 
         },
 
-        addTo(tracks: { alignmentTracks?: SequenceCollectorDataInterface; annotationTracks?: Array<RcsbFvRowConfigInterface>; rcsbContext?: Partial<PolymerEntityInstanceInterface>; }): void {
 
-            if(tracks.rcsbContext?.asymId === "A" && myComputedTrack?.trackData && myComputedTrack.trackData.length > 0) {
 
-                tracks.annotationTracks?.push(myComputedTrack);
 
-            }
 
+        addTo(tracks: { alignmentTracks?: SequenceCollectorDataInterface; annotationTracks?: Array<RcsbFvRowConfigInterface>; rcsbContext?: Partial<PolymerEntityInstanceInterface>; }): Promise<void> {
 
+            return new Promise<void>(resolve => {
 
+                if (tracks.rcsbContext?.asymId === "A" && myComputedTrack?.trackData && myComputedTrack.trackData.length > 0) {
 
+                    tracks.annotationTracks?.push(myComputedTrack);
 
+                }
 
+                resolve(void 0);
 
+            })
 
         },
 
         },
 
-        filterFeatures(annotations: Array<AnnotationFeatures>): Array<AnnotationFeatures> {
 
-            return annotations;
 
+        filterFeatures(data: {annotations: Array<AnnotationFeatures>; rcsbContext:Partial<PolymerEntityInstanceInterface>}): Promise<Array<AnnotationFeatures>> {
 
+            return new Promise<Array<AnnotationFeatures>>(resolve => {
 
+                resolve(data.annotations);
 
+            })
 
         }
 
         }
 
     }
 
     }
 
 }
 
 }

+ 2 - 1
tsconfig.examples.json
查看文件 

@@ -16,7 +16,8 @@
 
     "src/examples/multiple-chain/index.tsx",
 
     "src/examples/multiple-chain/index.tsx",
 
     "src/examples/structural-alignment/index.tsx",
 
     "src/examples/structural-alignment/index.tsx",
 
     "src/examples/css-config/index.tsx",
 
     "src/examples/css-config/index.tsx",
 
-    "src/examples/assembly/index.ts"
 
+    "src/examples/assembly/index.ts",
 
+    "src/examples/assembly-interface/index.ts"
 
   ],
 
   ],
 
   "exclude": [
 
   "exclude": [
 
     "node_modules"
 
     "node_modules"

+ 13 - 1
webpack.examples.config.js
查看文件 

@@ -45,6 +45,18 @@ const commonConfig = {
 
 const out_path = "build/examples";
 
 const out_path = "build/examples";
 
 const examples = [];
 
 const examples = [];
 
 
 
+examples.push({
 
+    ...commonConfig,
 
+    entry: {
 
+        "index": './build/src/examples/assembly-interface/index.js'
 
+    },
 
+    output: {
 
+        filename: '[name].js',
 
+        path: path.resolve(__dirname, out_path+'/assembly-interface/')
 
+    }
 
+});
 
+
 
+/*
 
 examples.push({
 
 examples.push({
 
     ...commonConfig,
 
     ...commonConfig,
 
     entry: {
 
     entry: {
 
@@ -98,6 +110,6 @@ examples.push({
 
         filename: '[name].js',
 
         filename: '[name].js',
 
         path: path.resolve(__dirname, out_path+'/css-config/')
 
         path: path.resolve(__dirname, out_path+'/css-config/')
 
     }
 
     }
 
-});
 
+});*/
 
 
 
 module.exports = examples;
 
 module.exports = examples;

部分文件因文件數量過多而無法顯示