@abi-software/mapintegratedvuer 1.3.4-beta.0 → 1.3.4-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/mapintegratedvuer",
-  "version": "1.3.4-beta.0",
+  "version": "1.3.4-beta.2",
   "license": "Apache-2.0",
   "scripts": {
     "serve": "vite --host --force",
@@ -50,11 +50,11 @@
     "*.js"
   ],
   "dependencies": {
-    "@abi-software/flatmapvuer": "1.3.2-beta.0",
+    "@abi-software/flatmapvuer": "^1.3.2-beta.2",
     "@abi-software/map-side-bar": "^2.3.1",
     "@abi-software/map-utilities": "^1.0.0",
     "@abi-software/plotvuer": "1.0.0",
-    "@abi-software/scaffoldvuer": "^1.3.2",
+    "@abi-software/scaffoldvuer": "^1.3.3-beta.0",
     "@abi-software/simulationvuer": "1.0.0",
     "@abi-software/svg-sprite": "1.0.0",
     "@element-plus/icons-vue": "^2.3.1",

package/src/App.vue

@@ -23,6 +23,9 @@
                 <el-button @click="setFlatmap()" size="small">Set Flatmap</el-button>
                 <el-button @click="setSearch()" size="small">Set Search</el-button>
               </el-row>
+              <el-row class="row" :gutter="20">
+                <el-button @click="changeViewingMode('Annotation')" size="small">Switch to Annotation View</el-button>
+              </el-row>
             </div>
             <template #reference>
 
@@ -99,6 +102,9 @@ export default {
     }
   },
   methods: {
+    changeViewingMode: function(modeName) {
+      this.$refs.map.changeViewingMode(modeName);
+    },
     saveSettings: function() {
       this.mapSettings.push(this.$refs.map.getState());
     },

package/src/components/ContentVuer.vue

@@ -138,6 +138,9 @@ export default {
     onResize: function () {
       this.$refs.viewer?.onResize();
     },
+    changeViewingMode: function(modeName) {
+      this.$refs.viewer?.changeViewingMode(modeName);
+    },
   },
   data: function () {
     return {

package/src/components/MapContent.vue

@@ -280,6 +280,9 @@ export default {
         'category': this.startingMap
       });
     },
+    changeViewingMode: function(modeName) {
+      this.$refs.flow.changeViewingMode(modeName);
+    },
   },
   computed: {
     ...mapStores(useSettingsStore, useSplitFlowStore),
@@ -308,6 +311,7 @@ export default {
       this.options.rootUrl ? this.settingsStore.updateRootUrl(this.options.rootUrl) : null
     }
     this.splitFlowStore?.reset();
+    this.splitFlowStore?.getAvailableTerms(this.settingsStore.sparcApi);
   },
   mounted: async function() {
     EventBus.on("updateShareLinkRequested", () => {

package/src/components/SplitFlow.vue

@@ -502,6 +502,11 @@ export default {
         activeCanvas.click();
       }
     },
+    changeViewingMode: function(modeName) {
+      let splitdialog = this.$refs.splitdialog;
+      const activeContents = splitdialog.getActiveContents();
+      activeContents.forEach(content => content.changeViewingMode(modeName));
+    },
   },
   created: function () {
     this._facets = [];

package/src/components/viewers/Flatmap.vue

@@ -100,7 +100,6 @@ export default {
       let provClone = {id: this.entry.id, prov: this.getFlatmapImp().provenance}; //create clone of provenance and add id
       EventBus.emit("mapImpProv", provClone); // send clone to context card
       this.$emit("flatmap-provenance-ready", provClone);
-      this.getAvailableTerms();
       if (this.entry.resource === "FunctionalConnectivity"){
         this.flatmapReadyForMarkerUpdates(flatmap);
       }
@@ -159,6 +158,10 @@ export default {
         flatmap.clearSearchResults();
       }
     },
+    changeViewingMode: function (modeName) {
+      const flatmap = this.$refs.flatmap.mapImp;
+      flatmap.changeViewingMode(modeName);
+    },
   },
   computed: {
     facetSpecies() {
@@ -166,7 +169,6 @@ export default {
     },
   },
   mounted: function() {
-    this.getAvailableTerms();
     EventBus.on("markerUpdate", () => {
       this.flatmapMarkerUpdate(undefined);
     });

package/src/components/viewers/MultiFlatmap.vue

@@ -404,6 +404,13 @@ export default {
       }
       return false;
     },
+    /**
+     * Change the view mode of the current flatmap
+     */
+    changeViewingMode: function (modeName) {
+      const flatmap = this.$refs.multiflatmap.getCurrentFlatmap();
+      flatmap.changeViewingMode(modeName);
+    },
   },
   computed: {
     facetSpecies() {
@@ -427,9 +434,7 @@ export default {
     },
   },
   mounted: function () {
-    this.getAvailableTerms();
     this.getFeaturedDatasets();
-
     EventBus.on('show-connectivity', (payload) => {
       const { featureIds, offset } = payload;
       if (this.flatmapReady && this.$refs.multiflatmap) {
@@ -480,7 +485,7 @@ export default {
     z-index: 1;
     div {
       scale: 0.5;
-      transform: translate(45px, -7px);
+      width: 0;
     }
   }
 }

package/src/components/viewers/Scaffold.vue

@@ -183,6 +183,12 @@ export default {
     updateWithViewUrl: function(viewUrl) {
       this.$refs.scaffold.updateViewURL(viewUrl);
     },
+    /**
+     * Change the view mode of the current scaffold
+     */
+    changeViewingMode: function (modeName) {
+      this.$refs.scaffold.changeViewingMode(modeName);
+    },
   },
   computed: {
     warningMessage: function() {

package/src/mixins/ContentMixin.js

@@ -1,5 +1,4 @@
 import {
-  getAvailableTermsForSpecies,
   getInteractiveAction,
   getNerveNames,
   getParentsRegion,
@@ -35,6 +34,9 @@ export default {
   },
   computed: {
     ...mapStores(useSettingsStore, useSplitFlowStore),
+    idNamePair() {
+      return this.splitFlowStore.idNamePair;
+    },
     syncMode() {
       return this.splitFlowStore.syncMode;
     },
@@ -397,31 +399,6 @@ export default {
     requestSynchronisedEvent: function () {
       return;
     },
-    getAvailableTerms: function () {
-      //Use the default list of uberons before we get the list from
-      //the api
-      let terms = getAvailableTermsForSpecies();
-      for (let i = 0; i < terms.length; i++) {
-        this.idNamePair[terms[i].id] = terms[i].name;
-      }
-      if (this.apiLocation) {
-        if (this._controller) this._controller.abort();
-        this._controller = new AbortController();
-        let signal = this._controller.signal;
-        fetch(`${this.apiLocation}get-organ-curies`, {
-          signal,
-        })
-          .then(response => response.json())
-          .then(data => {
-            this._controller = undefined;
-            data.uberon.array.forEach(pair => {
-              this.idNamePair[pair.id.toUpperCase()] =
-                pair.name.charAt(0).toUpperCase() + pair.name.slice(1);
-            });
-            return;
-          });
-      }
-    },
     flatmapMarkerUpdate() {
       return;
     },
@@ -536,7 +513,6 @@ export default {
       multiflatmapRef: null,
       flatmapRef: null,
       scaffoldRef: null,
-      idNamePair: {},
       scaffoldLoaded: false,
       isInHelp: false,
       hoverDelay: undefined

package/src/stores/splitFlow.js

@@ -1,4 +1,7 @@
 import { defineStore } from 'pinia';
+import {
+  getAvailableTermsForSpecies,
+} from "../components/SimulatedData.js";
 
 /* eslint-disable no-alert, no-console */
 const presetLayouts = (view) => {
@@ -130,6 +133,7 @@ const findKeyWithId = (layout, id) => {
 const getOriginalState = () => {
   return {
     activeView: "singlepanel",
+    idNamePair: {},
     viewIcons: [
       { icon: "singlepanel", name: "Single view", min: 1 },
       { icon: "2horpanel", name: "Horizontal split", min: 2 },
@@ -195,6 +199,30 @@ export const useSplitFlowStore = defineStore('splitFlow', {
         this.customLayout[sourceKey].id = payload.target;
       }
     },
+    getAvailableTerms(apiLocation) {
+      let terms = getAvailableTermsForSpecies();
+      for (let i = 0; i < terms.length; i++) {
+        this.idNamePair[terms[i].id] = terms[i].name;
+      }
+      if (apiLocation) {
+        if (this._controller) this._controller.abort();
+        this._controller = new AbortController();
+        let signal = this._controller.signal;
+        console.log("getAvailableTerms")
+        fetch(`${apiLocation}get-organ-curies`, {
+          signal,
+        })
+          .then(response => response.json())
+          .then(data => {
+            this._controller = undefined;
+            data.uberon.array.forEach(pair => {
+              this.idNamePair[pair.id.toUpperCase()] =
+                pair.name.charAt(0).toUpperCase() + pair.name.slice(1);
+            });
+            return;
+          });
+      }
+    },
     toggleGlobalCallback(flag) {
       this.globalCallback = flag;
     },