Merge pull request #17 from LinkunGao/pwa

Pwa

frontend/assets/data/topics.json

@@ -21,7 +21,7 @@
     "icon": "mdi-heart-broken",
     "subTopics": {
       "1": {
-        "title": "<25% FG",
+        "title": "A",
         "heading": "Almost entirely fat",
         "icon": "mdi-home-heart",
         "dataFile": "breast-main",
@@ -30,7 +30,7 @@
         "model": { "name": "normal" }
       },
       "2": {
-        "title": "25%-50% FG",
+        "title": "B",
         "heading": "Scattered fibroglandular densities",
         "icon": "mdi-home-heart",
         "dataFile": "breast-main",
@@ -39,7 +39,7 @@
         "model": { "name": "density_2" }
       },
       "3": {
-        "title": "51%-75% FG",
+        "title": "C",
         "heading": "Heterogeneously dense",
         "icon": "mdi-home-heart",
         "dataFile": "breast-main",
@@ -48,7 +48,7 @@
         "model": { "name": "density_3" }
       },
       "4": {
-        "title": ">75% FG",
+        "title": "D",
         "heading": "Extremely dense",
         "icon": "mdi-home-heart",
         "dataFile": "breast-main",
@@ -63,13 +63,76 @@
     "heading": "Breast Benign Conditions",
     "icon": "mdi-lightning-bolt",
     "subTopics": {
+      "cyst": {
+        "title": "Cyst",
+        "heading": "Cyst",
+        "icon": "mdi-home-heart",
+        "dataFile": "breast-main",
+        "category": "success",
+        "subTitle": "subSuccess",
+        "model": { "name": "cyst" }
+      },
+      "fibroadenoma": {
+        "title": "Fibroadenoma",
+        "heading": "Fibroadenoma",
+        "icon": "mdi-home-heart",
+        "dataFile": "breast-main",
+        "category": "success",
+        "subTitle": "subSuccess",
+        "model": { "name": "fibroadenoma" }
+      },
+      "calcifications": {
+        "title": "Calcifications",
+        "heading": "Calcifications",
+        "icon": "mdi-home-heart",
+        "dataFile": "breast-main",
+        "category": "success",
+        "subTitle": "subSuccess",
+        "model": { "name": "calcifications" }
+      },
+      "fat_necrosis": {
+        "title": "Fat necrosis",
+        "heading": "Fat necrosis",
+        "icon": "mdi-home-heart",
+        "dataFile": "breast-main",
+        "category": "success",
+        "subTitle": "subSuccess",
+        "model": { "name": "fat_necrosis" }
+      }
     }
   },
   "cancer": {
     "title": "Cancer",
     "heading": "Breast Cancer",
     "icon": "mdi-heart-off",
     "subTopics": {
+      "dcis": {
+        "title": "DCIS",
+        "heading": "DCIS",
+        "icon": "mdi-home-heart",
+        "dataFile": "breast-main",
+        "category": "success",
+        "subTitle": "subSuccess",
+        "model": { "name": "dcis" }
+      },
+      "lobular": {
+        "title": "Lobular",
+        "heading": "Lobular",
+        "icon": "mdi-home-heart",
+        "dataFile": "breast-main",
+        "category": "success",
+        "subTitle": "subSuccess",
+        "model": { "name": "lobular" }
+      },
+      "ductal": {
+        "title": "Ductal",
+        "heading": "Ductal",
+        "icon": "mdi-home-heart",
+        "dataFile": "breast-main",
+        "category": "success",
+        "subTitle": "subSuccess",
+        "model": { "name": "ductal" }
+      }
     }
   }
 }

frontend/components/model/Model.vue

@@ -69,9 +69,9 @@ export default {
   },
 
   created: async function () {
-    this.$nuxt.$on("send-emitter-data", (data) => {
-      console.log(data);
-    });
+    // this.$nuxt.$on("send-emitter-data", (data) => {
+    //   console.log(data);
+    // });
   },
 
   computed: {
@@ -90,20 +90,14 @@ export default {
     this.modelData = this.$modelData();
     this.container = this.$refs.baseDomObject;
     this.modelName = this.$model().name;
-    this.$nuxt.$emit("onNavChange", this.modelName);
 
+    if(["cyst", "fibroadenoma", "calcifications", "fat_necrosis", "dcis", "lobular", "ductal"].includes(this.modelName)){
+      this.modelName = "normal";
+    }
 
-    
-
-    // setTimeout(() => {
-    //   this.mdAndUp
-    //     ? (baseContainer.style.height = "100vh")
-    //     : (baseContainer.style.height = "100vw");
-    //   this.container.appendChild(baseContainer);
-    //   this.start();
-    // }, 100);
+    this.$nuxt.$emit("onNavChange", this.modelName);
     this.container.appendChild(this.baseContainer);
-      this.start();
+    this.start();
 
     window.addEventListener("resize", () => {
       setTimeout(() => {
@@ -219,7 +213,7 @@ export default {
     },
     removeContainerListener() {
       if(this.mouseActions !== null){
-        this.container.addEventListener("mousemove", this.mouseActions.mouseMove);
+        this.container.removeEventListener("mousemove", this.mouseActions.mouseMove);
         this.container.removeEventListener("mousedown", this.mouseActions.mouseDown);
         this.container.removeEventListener("mouseup", this.mouseActions.mouseUp);
       }

frontend/components/model/PanelControls.vue

@@ -58,6 +58,9 @@ export default {
     this.container.appendChild(this.baseContainer);
     // Write code after mount this component
     this.modelName = this.$model().name;
+    if(["cyst", "fibroadenoma", "calcifications", "fat_necrosis", "dcis", "lobular", "ductal"].includes(this.modelName)){
+      this.modelName = "normal";
+    }
     
     this.start();
 
@@ -69,7 +72,7 @@ export default {
   },
 
   methods: {
-    async start() {
+    start() {
       this.loadNrrd(this.modelUrlsArray[this.modelName][0], this.modelName+"right_mri");
     },
 

frontend/plugins/copper.js

@@ -78,6 +78,7 @@ const raycaster = (scene, container, nrrdSliceZ, nrrdMesh, nrrdMaxIndex) => {
   }
   const mouseMove = (event) => {
     const a = scene.pickSpecifiedModel(nrrdMesh, {x: event.offsetX, y: event.offsetY});
+
     if(!!a.intersectedObject){
       if(!findMesh){
         scene.controls.noRotate = true;