@abi-software/mapintegratedvuer 1.7.0 → 1.7.1-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/mapintegratedvuer",
-  "version": "1.7.0",
+  "version": "1.7.1-beta.0",
   "license": "Apache-2.0",
   "scripts": {
     "serve": "vite --host --force",
@@ -50,11 +50,11 @@
     "*.js"
   ],
   "dependencies": {
-    "@abi-software/flatmapvuer": "1.7.0",
-    "@abi-software/map-side-bar": "2.6.0",
-    "@abi-software/map-utilities": "1.3.0",
+    "@abi-software/flatmapvuer": "1.7.2",
+    "@abi-software/map-side-bar": "2.6.2",
+    "@abi-software/map-utilities": "1.3.1",
     "@abi-software/plotvuer": "^1.0.3",
-    "@abi-software/scaffoldvuer": "1.7.0",
+    "@abi-software/scaffoldvuer": "1.7.1",
     "@abi-software/simulationvuer": "1.0.1",
     "@abi-software/sparc-annotation": "0.3.2",
     "@abi-software/svg-sprite": "^1.0.1",

package/src/App.vue

@@ -20,6 +20,7 @@
                 <el-button @click="setMultiFlatmap()" size="small">Set MultiFlatmap</el-button>
                 <el-button @click="setLegacyMultiFlatmap()" size="small">Set Legacy MultiFlatmap</el-button>
                 <el-button @click="setScaffold()" size="small">Set To Scaffold</el-button>
+                <el-button @click="setWholebody()" size="small">Set to Wholebody</el-button>
                 <el-button @click="setFlatmap()" size="small">Set Flatmap</el-button>
                 <el-button @click="setSearch()" size="small">Set Search</el-button>
               </el-row>
@@ -166,6 +167,15 @@ export default {
         }
       );
     },
+    setWholebody: function() {
+      this.$refs.map.setCurrentEntry(
+        {
+          type: "Scaffold",
+          label: "Human",
+          isBodyScaffold: true
+        }
+      );
+    },
     setSearch: function() {
       this.$refs.map.openSearch([], "10.26275/1uno-tynt");
     },

package/src/components/MapContent.vue

@@ -27,7 +27,7 @@ import { useSettingsStore } from '../stores/settings';
 import { useSplitFlowStore } from '../stores/splitFlow';
 import { findSpeciesKey } from './scripts/utilities.js';
 import { MapSvgSpriteColor} from '@abi-software/svg-sprite';
-import { initialState } from "./scripts/utilities.js";
+import { initialState, getBodyScaffoldInfo } from "./scripts/utilities.js";
 import RetrieveContextCardMixin from "../mixins/RetrieveContextCardMixin.js"
 import {
   ElLoading as Loading
@@ -155,6 +155,9 @@ export default {
         } else if (document.msExitFullscreen) { /* IE/Edge */
           document.msExitFullscreen();
         }
+
+        let mapApp = this.$refs.MapApp;
+        this.replacePopupsOnFullscreen(mapApp, document.body);
       }
     },
     /**
@@ -172,6 +175,15 @@ export default {
       } else if (parent.msRequestFullscreen) { /* IE/Edge */
         mapApp.msRequestFullscreen();
       }
+
+      this.replacePopupsOnFullscreen(document.body, mapApp);
+    },
+    replacePopupsOnFullscreen: function (containerA, containerB) {
+      const allTeleportedPopovers = containerA.querySelectorAll('[id^="el-popper-container"]');
+
+      allTeleportedPopovers.forEach((teleportedPopover) => {
+        containerB.append(teleportedPopover);
+      });
     },
     setState: function(state){
       return this.$refs.flow.setState(state);
@@ -189,7 +201,7 @@ export default {
      */
     setCurrentEntry: async function(state) {
       if (state && state.type) {
-        if (state.type === "Scaffold" && state.url) {
+        if (state.type === "Scaffold" && (state.url || state.isBodyScaffold)) {
           //State for scaffold containing the following items:
           //  label - Setting the name of the dialog
           //  region - Which region/group currently focusing on
@@ -204,52 +216,67 @@ export default {
             state: state.state,
             viewUrl: state.viewUrl
           };
-          // Add content from scicrunch for the context card
-          const contextCardInfo = await this.retrieveContextCardFromUrl(state.url);
-          newView = {...newView, ...contextCardInfo};
+          if (state.isBodyScaffold) {
+            const data = await getBodyScaffoldInfo(this.options.sparcApi, state.label);
+            newView = { ...newView, ...data.datasetInfo, resource: data.url };
+          } else {
+            // Add content from scicrunch for the context card
+            const contextCardInfo = await this.retrieveContextCardFromUrl(state.url);
+            newView = { ...newView, ...contextCardInfo };
+          }
           this.$refs.flow.createNewEntry(newView);
         } else if (state.type === "MultiFlatmap") {
-          //State for scaffold containing the following items:
-          //  label - Setting the name of the dialog
-          //  taxo - taxo of species to set
-          //  biologicalSex - biological sex to be displayed (PATO)
-          //  organ - Target organ, flatmap will conduct a local search
-          //          using this
-
-          //Look for the key in the available species array,
-          //it will use the taxo and biologicalSex as hints.
-          const key = findSpeciesKey(state);
-          if (key) {
-            const currentState = this.getState();
-            if (currentState && currentState.entries) {
-              for (let i = 0; i < currentState.entries.length; i++) {
-                const entry =  currentState.entries[i];
-                if (entry.type === "MultiFlatmap") {
-                  entry.resource = key;
-                  entry.state = {species: key};
-                  if (state.organ || state.uuid) {
-                    entry.state.state = { searchTerm: state.organ, uuid: state.uuid };
-                    //if it contains an uuid, use the taxo to help identify if the uuid
-                    //is current
-                    if (state.uuid) entry.state.state.entry = state.taxo;
+          if (state.resource) {
+            //State for new multiflatmap containing the following items:
+            //  label - Setting the name of the dialog
+            //  resource - the url to metadata
+            //  state - state to restore (viewport)
+            const newView = {
+              type: state.type,
+              resource: state.resource,
+              state: state.state,
+              label: state.label
+            };
+            this.$refs.flow.createNewEntry(newView);
+          } else {
+            //State for multiflatmap containing the following items:
+            //  taxo - taxo of species to set
+            //  biologicalSex - biological sex to be displayed (PATO)
+            //  organ - Target organ, flatmap will conduct a local search
+            //          using this
+  
+            //Look for the key in the available species array,
+            //it will use the taxo and biologicalSex as hints.
+            const key = findSpeciesKey(state);
+            if (key) {
+              const currentState = this.getState();
+              if (currentState && currentState.entries) {
+                for (let i = 0; i < currentState.entries.length; i++) {
+                  const entry = currentState.entries[i];
+                  if (entry.type === "MultiFlatmap") {
+                    entry.resource = key;
+                    entry.state = { species: key };
+                    if (state.organ || state.uuid) {
+                      entry.state.state = { searchTerm: state.organ, uuid: state.uuid };
+                      //if it contains an uuid, use the taxo to help identify if the uuid
+                      //is current
+                      if (state.uuid) entry.state.state.entry = state.taxo;
+                    }
+                    this.$refs.flow.setState(currentState);
+                    //Do not create a new entry, instead set the multiflatmap viewer
+                    //to the primary slot
+                    this.$refs.flow.setIdToPrimaryPane(entry.id);
+                    break;
                   }
-                  this.$refs.flow.setState(currentState);
-                  //Do not create a new entry, instead set the multiflatmap viewer
-                  //to the primary slot
-                  this.$refs.flow.setIdToPrimaryPane(entry.id);
-                  break;
                 }
               }
             }
           }
-        }
-        else if (state.type === "Flatmap") {
-          //State for scaffold containing the following items:
+        } else if (state.type === "Flatmap") {
+          //State for flatmap containing the following items:
           //  label - Setting the name of the dialog
-          //  region - Which region/group currently focusing on
           //  resource - the url to metadata
           //  state - state to restore (viewport)
-          //  viewUrl - relative path of the view file to metadata
           const newView = {
             type: state.type,
             resource: state.resource,

package/src/components/scripts/utilities.js

@@ -88,11 +88,11 @@ const capitalise = term => {
  */
 const availableSpecies = () => {
   return {
-    "Human Female": { taxo: "NCBITaxon:9606", biologicalSex: "PATO:0000383", iconClass: "mapicon-icon_human", displayLatestChanges: true, displayWarning: true },
-    "Human Male": { taxo: "NCBITaxon:9606", biologicalSex: "PATO:0000384", iconClass: "mapicon-icon_human", displayLatestChanges: true, displayWarning: true },
-    "Rat": { taxo: "NCBITaxon:10114", iconClass: "mapicon-icon_rat", displayLatestChanges: true, displayWarning: true },
-    "Mouse": { taxo: "NCBITaxon:10090", iconClass: "mapicon-icon_mouse", displayLatestChanges: true, displayWarning: true },
-    "Pig": { taxo: "NCBITaxon:9823", iconClass: "mapicon-icon_pig", displayLatestChanges: true, displayWarning: true },
+    "Human Female": { taxo: "NCBITaxon:9606", biologicalSex: "PATO:0000383", iconClass: "mapicon-icon_human", displayLatestChanges: true, displayWarning: false },
+    "Human Male": { taxo: "NCBITaxon:9606", biologicalSex: "PATO:0000384", iconClass: "mapicon-icon_human", displayLatestChanges: true, displayWarning: false },
+    "Rat": { taxo: "NCBITaxon:10114", iconClass: "mapicon-icon_rat", displayLatestChanges: true, displayWarning: false },
+    "Mouse": { taxo: "NCBITaxon:10090", iconClass: "mapicon-icon_mouse", displayLatestChanges: true, displayWarning: false },
+    "Pig": { taxo: "NCBITaxon:9823", iconClass: "mapicon-icon_pig", displayLatestChanges: true, displayWarning: false },
     "Cat": { taxo: "NCBITaxon:9685", iconClass: "mapicon-icon_cat", displayLatestChanges: true, displayWarning: true },
   }
 }