@abi-software/flatmapvuer 1.10.1-beta.2 → 1.10.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/flatmapvuer",
-  "version": "1.10.1-beta.2",
+  "version": "1.10.1",
   "license": "Apache-2.0",
   "files": [
     "dist/*",
@@ -43,7 +43,7 @@
     "./src/*": "./src/*"
   },
   "dependencies": {
-    "@abi-software/map-utilities": "^1.6.1-beta.0",
+    "@abi-software/map-utilities": "^1.6.0",
     "@abi-software/sparc-annotation": "0.3.2",
     "@abi-software/svg-sprite": "^1.0.1",
     "@element-plus/icons-vue": "^2.3.1",

package/src/components/FlatmapVuer.vue

@@ -633,29 +633,15 @@ import {
   refreshFlatmapKnowledgeCache,
   getKnowledgeSource,
   getReferenceConnectivitiesByAPI,
-  filterPathsByOriginFromKnowledge,
-  filterPathsByDestinationFromKnowledge,
-  filterPathsByViaFromKnowledge,
 } from '../services/flatmapKnowledge.js'
 import { capitalise } from './utilities.js'
 import yellowstar from '../icons/yellowstar'
 import ResizeSensor from 'css-element-queries/src/ResizeSensor'
-import * as flatmap from 'https://cdn.jsdelivr.net/npm/@abi-software/flatmap-viewer@4.2.5/+esm'
+import * as flatmap from 'https://cdn.jsdelivr.net/npm/@abi-software/flatmap-viewer@4.2.4/+esm'
 import { AnnotationService } from '@abi-software/sparc-annotation'
 import { mapState } from 'pinia'
 import { useMainStore } from '@/store/index'
-import {
-  queryPathsByOrigin,
-  queryPathsByViaLocation,
-  queryPathsByDestination,
-  extractOriginItems,
-  extractDestinationItems,
-  extractViaItems,
-  queryAllConnectedPaths,
-  DrawToolbar,
-  Tooltip,
-  TreeControls
-} from '@abi-software/map-utilities'
+import { DrawToolbar, Tooltip, TreeControls } from '@abi-software/map-utilities'
 import '@abi-software/map-utilities/dist/style.css'
 import EventBus from './EventBus.js'
 
@@ -754,13 +740,8 @@ export default {
     return { annotator }
   },
   methods: {
-    enableFeatureResetOnClick: function (enable) {
-      if (this.mapImp) {
-        this.mapImp.enableFeatureResetOnClick(enable)
-      }
-    },
     /**
-     *
+     * 
      * @param filter format should follow #makeStyleFilter (flatmap-viewer)
      */
     setVisibilityFilter: function (filter) {
@@ -1754,8 +1735,9 @@ export default {
               const clickedItem = singleSelection ? data : data[0]
               this.setConnectivityDataSource(this.viewingMode, clickedItem);
               if (this.viewingMode === 'Neuron Connection') {
-                // do nothing here
-                // the method to highlight paths is moved to checkAndCreatePopups function
+                this.retrieveConnectedPaths([clickedItem.models]).then((paths) => {
+                  this.zoomToFeatures(paths)
+                })
               } else {
                 this.currentActive = clickedItem.models ? clickedItem.models : '' // This is for FC map
                 // This is for annotation mode - draw connectivity between features/paths
@@ -1788,6 +1770,7 @@ export default {
               data &&
               data.type !== 'marker' &&
               eventType === 'click' &&
+              !(this.viewingMode === 'Neuron Connection') &&
               // Disable popup when drawing
               !this.activeDrawTool
             ) {
@@ -1958,14 +1941,6 @@ export default {
       }
       return featureIds;
     },
-    getFlatmapKnowledge: function () {
-      let flatmapKnowledge = [];
-      const flatmapKnowledgeRaw = sessionStorage.getItem('flatmap-knowledge');
-      if (flatmapKnowledgeRaw) {
-        flatmapKnowledge = JSON.parse(flatmapKnowledgeRaw);
-      }
-      return flatmapKnowledge;
-    },
     emitConnectivityError: function (errorData) {
       this.$emit('connectivity-error', {
         data: {
@@ -2001,7 +1976,7 @@ export default {
      * _checkNeuronClicked shows a neuron path pop up if a path was recently clicked._
      * @arg {Object} `data`
      */
-    checkAndCreatePopups: async function (data, connectivityExplorerClicked) {
+    checkAndCreatePopups: async function (data) {
       // Call flatmap database to get the connection data
       if (this.viewingMode === 'Annotation') {
         const features = data.filter(d => d.feature).map(d => d.feature)
@@ -2048,104 +2023,6 @@ export default {
         } else {
           this.annotation = {}
         }
-      }
-      // clicking on a connectivity explorer card will be same as exploration mode
-      // since the card should be opened
-      else if (this.viewingMode === 'Neuron Connection' && !connectivityExplorerClicked) {
-        const resources = data.map(tooltip => tooltip.resource[0]);
-        let pathsQueryAPI = this.retrieveConnectedPaths(resources); // TODO: to replace with queryAllConnectedPaths
-
-        // filter out paths
-        const featureId = resources.find(resource => !resource.startsWith('ilxtr:'));
-        if (featureId) {
-          // fallback if it cannot find in anatomical nodes
-          const transformResources = Array.isArray(resources) ? [...resources] : [resources];
-          if (transformResources.length === 1) {
-            transformResources.push([]);
-          }
-
-          const featureId = data[0].feature?.featureId;
-          const annotation = this.mapImp.annotations.get(featureId);
-          const anatomicalNodes = annotation?.['anatomical-nodes'];
-          const uniqueResource = anatomicalNodes ? JSON.parse(anatomicalNodes[0]) : transformResources;
-
-          if (this.connectionType === 'Origin') {
-            // Competency Query API
-            // pathsQueryAPI = queryPathsByOrigin(this.flatmapAPI, this.mapImp.knowledgeSource, resources);
-
-            // search by unique placement before competency API is ready for this
-            pathsQueryAPI = filterPathsByOriginFromKnowledge(uniqueResource);
-          } else if (this.connectionType === 'Via') {
-            // Competency Query API
-            // pathsQueryAPI = queryPathsByViaLocation(this.flatmapAPI, this.mapImp.knowledgeSource, resources);
-
-            // search by unique placement before competency API is ready for this
-            pathsQueryAPI = filterPathsByViaFromKnowledge(uniqueResource);
-          } else if (this.connectionType === 'Destination') {
-            // Competency Query API
-            // pathsQueryAPI = queryPathsByDestination(this.flatmapAPI, this.mapImp.knowledgeSource, resources);
-
-            // search by unique placement before competency API is ready for this
-            pathsQueryAPI = filterPathsByDestinationFromKnowledge(uniqueResource);
-          } else {
-            pathsQueryAPI = queryAllConnectedPaths(this.flatmapAPI, this.mapImp.knowledgeSource, resources);
-          }
-          this.connectivityfilters.push({
-            facet: JSON.stringify(uniqueResource),
-            facetPropPath: `flatmap.connectivity.source.${this.connectionType.toLowerCase()}`,
-            label: JSON.stringify(uniqueResource),
-            term: this.connectionType
-          })
-          // TODO: to remove "neuron-connection-click"
-          this.$emit('neuron-connection-feature-click', this.connectivityfilters);
-        }
-
-        // TODO: to clean up after verification
-        // pathsQueryAPI.then(async (paths) => {
-        //   if (paths.length) {
-        //     const filteredPaths = paths.filter(path => (path in this.mapImp.pathways.paths))
-        //     const filteredPathsWithData = [];
-        //     let prom1 = [];
-        //     let prom2 = [];
-
-        //     for (let i = 0; i < filteredPaths.length; i++) {
-        //       const path = filteredPaths[i];
-        //       const modelFeatureIds = this.mapImp.modelFeatureIds(path);
-        //       const feature = this.mapImp.featureProperties(modelFeatureIds[0]);
-        //       if (feature) {
-        //         const pathData = {
-        //           resource: [feature.models],
-        //           feature: feature,
-        //           label: feature.label,
-        //           provenanceTaxonomy: feature.taxons,
-        //           alert: feature.alert,
-        //         };
-        //         filteredPathsWithData.push(pathData);
-        //         prom1.push({
-        //           title: pathData.label,
-        //           featureId: [path]
-        //         })
-        //       }
-        //     }
-        //     this.tooltipEntry = await Promise.all(prom1)
-        //     // Emit placeholders first.
-        //     this.$emit('connectivity-info-open', this.tooltipEntry);
-
-        //     /**
-        //      * This event is emitted to highlight the same paths on other display maps.
-        //      */
-        //     this.$emit('neuron-connection-click', paths);
-
-        //     // loading data
-        //     for (let i = 0; i < filteredPathsWithData.length; i++) {
-        //       const pathData = filteredPathsWithData[i];
-        //       const tooltipEntryData = await this.getKnowledgeTooltip(pathData);
-        //       prom2.push(tooltipEntryData)
-        //     }
-        //     this.tooltipEntry = await Promise.all(prom2)
-        //     this.displayTooltip(filteredPaths)
-        //   }
-        // })
       } else {
         // load and store knowledge
         loadAndStoreKnowledge(this.mapImp, this.flatmapQueries);
@@ -2160,7 +2037,6 @@ export default {
         // this should only for flatmap paths not all features
         if (this.tooltipEntry.length) {
           this.$emit('connectivity-info-open', this.tooltipEntry);
-
           // While having placeholders displayed, get details for all paths and then replace.
           for (let index = 0; index < data.length; index++) {
             prom1.push(await this.getKnowledgeTooltip(data[index]))
@@ -2173,9 +2049,6 @@ export default {
         }
       }
     },
-    resetConnectivityfilters: function () {
-      this.connectivityfilters = [];
-    },
     getKnowledgeTooltip: async function (data) {
       //require data.resource && data.feature.source
       const results = await this.flatmapQueries.retrieveFlatmapKnowledgeForEvent(this.mapImp, data)
@@ -2892,9 +2765,7 @@ export default {
           if (key === "kind") {
             main.label = "Pathways"
             for (const facet of value) {
-              const pathway = this.pathways.find(path => {
-                return !['other', 'centreline'].includes(path.type) && path.type === facet
-              })
+              const pathway = this.pathways.find(path => path.type === facet)
               if (pathway) {
                 main.children.push({
                   key: `${main.key}.${facet}`,
@@ -2932,38 +2803,18 @@ export default {
             filterOptions.push(main)
           }
         }
-        const connectionFilters = [];
-        const flatmapKnowledge = this.getFlatmapKnowledge();
-        const originItems = extractOriginItems(flatmapKnowledge);
-        const viaItems = extractViaItems(flatmapKnowledge);
-        const destinationItems = extractDestinationItems(flatmapKnowledge);
-
-        const transformItem = (facet, item) => {
-          const label = JSON.stringify(item);
-          return {
-            key: `flatmap.connectivity.source.${facet}.${label}`,
-            label: label
-          };
-        }
-
-        for (const facet of ["origin", "via", "destination"]) {
-          let childrenList = []
-          if (facet === 'origin') {
-            childrenList = originItems.map((item) => transformItem(facet, item));
-          } else if (facet === 'via') {
-            childrenList = viaItems.map((item) => transformItem(facet, item));
-          } else if (facet === 'destination') {
-            childrenList = destinationItems.map((item) => transformItem(facet, item));
-          }
-
-          connectionFilters.push({
-            key: `flatmap.connectivity.source.${facet}`,
-            label: facet,
-            children: childrenList,
-          })
-        }
-
-        filterOptions.push(...connectionFilters)
+        // let hardcode = {
+        //   key: "flatmap.connectivity.source",
+        //   label: "Connectivity",
+        //   children: []
+        // }
+        // for (const facet of ["Origins", "Components", "Destinations"]) {
+        //   hardcode.children.push({
+        //     key: `flatmap.connectivity.source.${facet}`,
+        //     label: facet
+        //   })
+        // }
+        // filterOptions.push(hardcode)
         return filterOptions
       }
     },
@@ -2980,7 +2831,9 @@ export default {
       this.mapImp.setBackgroundOpacity(1)
       this.backgroundChangeCallback(this.currentBackground)
       this.pathways = this.mapImp.pathTypes()
-      this.pathways = this.pathways.filter(path => !['other', 'centreline'].includes(path.type))
+      this.pathways = this.pathways.filter(path => {
+        return path.enabled && path.type !== 'other'
+      })
       //Disable layers for now
       //this.layers = this.mapImp.getLayers();
       this.processSystems(this.mapImp.getSystems())
@@ -3040,7 +2893,7 @@ export default {
      * @arg {String} `term`,
      * @arg {String} `displayInfo`
      */
-    searchAndShowResult: function (term, displayInfo, connectivityExplorerClicked) {
+    searchAndShowResult: function (term, displayInfo) {
       if (this.mapImp) {
         if (term === undefined || term === '') {
           this.mapImp.clearSearchResults()
@@ -3071,8 +2924,13 @@ export default {
                   provenanceTaxonomy: feature.taxons,
                   alert: feature.alert,
                 }
-                // Show popup for all modes
-                this.checkAndCreatePopups([data], connectivityExplorerClicked)
+                if (this.viewingMode === "Exploration" || this.viewingMode === "Annotation") {
+                  this.checkAndCreatePopups([data])
+                } else if (this.viewingMode === 'Neuron Connection') {
+                  this.retrieveConnectedPaths(data.resource).then((paths) => {
+                    this.zoomToFeatures(paths)
+                  })
+                }
                 this.mapImp.showPopup(featureId, capitalise(feature.label), {
                   className: 'custom-popup',
                   positionAtLastClick: false,
@@ -3087,21 +2945,6 @@ export default {
       }
       return false
     },
-    /**
-     * @public
-     * Public method to highlight connected paths for neuron connection mode,
-     * to highlight paths for other display maps on spit screen.
-     * @arg {Array} `paths`
-     */
-    highlightConnectedPaths: function (paths) {
-      if (paths.length) {
-        // filter paths for this map
-        const filteredPaths = paths.filter(path => (path in this.mapImp.pathways.paths))
-        // this.zoomToFeatures is replaced with selectGeoJSONFeatures to highlight paths
-        const featureIdsToHighlight = this.mapImp.modelFeatureIdList(filteredPaths);
-        this.mapImp.selectGeoJSONFeatures(featureIdsToHighlight);
-      }
-    },
     /**
      * @public
      * Function to show search suggestions
@@ -3115,9 +2958,6 @@ export default {
     onActionClick: function (data) {
       EventBus.emit('onActionClick', data)
     },
-    setConnectionType: function (type) {
-      this.connectionType = type;
-    },
   },
   props: {
     /**
@@ -3417,7 +3257,6 @@ export default {
         'Neuron Connection': 'Discover Neuron connections by selecting a neuron and viewing its associated network connections',
         'Annotation': ['View feature annotations', 'Add, comment on and view feature annotations']
       },
-      connectionType: 'All',
       offlineAnnotationEnabled: false,
       offlineAnnotations: [],
       annotationFrom: 'Anyone',
@@ -3464,7 +3303,6 @@ export default {
       }),
       searchTerm: "",
       taxonLeaveDelay: undefined,
-      connectivityfilters: [],
     }
   },
   computed: {

package/src/components/MultiFlatmapVuer.vue

@@ -70,8 +70,6 @@
       @connectivity-info-open="onConnectivityInfoOpen"
       @connectivity-info-close="onConnectivityInfoClose"
       @connectivity-error="onConnectivityError"
-      @neuron-connection-click="onNeuronConnectionClick"
-      @neuron-connection-feature-click="onNeuronConnectionFeatureClick"
       @open-map="$emit('open-map', $event)"
       @pathway-selection-changed="onSelectionsDataChanged"
       :minZoom="minZoom"
@@ -101,7 +99,7 @@
 import { markRaw } from 'vue'
 import EventBus from './EventBus'
 import FlatmapVuer from './FlatmapVuer.vue'
-import * as flatmap from 'https://cdn.jsdelivr.net/npm/@abi-software/flatmap-viewer@4.2.5/+esm'
+import * as flatmap from 'https://cdn.jsdelivr.net/npm/@abi-software/flatmap-viewer@4.2.4/+esm'
 import {
   ElCol as Col,
   ElOption as Option,
@@ -307,12 +305,6 @@ export default {
     onConnectivityError: function (errorInfo) {
       this.$emit('connectivity-error', errorInfo);
     },
-    onNeuronConnectionClick: function (payload) {
-      this.$emit('neuron-connection-click', payload);
-    },
-    onNeuronConnectionFeatureClick: function (payload) {
-      this.$emit('neuron-connection-feature-click', payload);
-    },
     onSelectionsDataChanged: function (data) {
       this.$emit('pathway-selection-changed', data);
     },
@@ -565,10 +557,6 @@ export default {
       let map = this.getCurrentFlatmap()
       map.changeViewingMode(modeName)
     },
-    setConnectionType: function (type) {
-      let map = this.getCurrentFlatmap();
-      map.setConnectionType(type);
-    },
   },
   props: {
     /**

package/src/services/flatmapKnowledge.js

@@ -1,9 +1,3 @@
-import {
-  findPathsByOriginItem,
-  findPathsByDestinationItem,
-  findPathsByViaItem,
-} from '@abi-software/map-utilities';
-
 async function getReferenceConnectivitiesFromStorage(resource) {
   const flatmapKnowledgeRaw = sessionStorage.getItem('flatmap-knowledge');
 
@@ -32,43 +26,6 @@ async function getReferenceConnectivitiesByAPI(mapImp, resource, flatmapQueries)
   return featureIds;
 }
 
-function getFlatmapKnowledge() {
-  const flatmapKnowledgeRaw = sessionStorage.getItem('flatmap-knowledge');
-
-  if (flatmapKnowledgeRaw) {
-    const flatmapKnowledge = JSON.parse(flatmapKnowledgeRaw);
-    return flatmapKnowledge;
-  }
-  return [];
-}
-
-async function filterPathsByOriginFromKnowledge(resource) {
-  const flatmapKnowledge = getFlatmapKnowledge();
-  const results = findPathsByOriginItem(flatmapKnowledge, resource);
-  if (Array.isArray(results)) {
-    return results.map(x => x.id);
-  }
-  return [];
-}
-
-async function filterPathsByDestinationFromKnowledge(resource) {
-  const flatmapKnowledge = getFlatmapKnowledge();
-  const results = findPathsByDestinationItem(flatmapKnowledge, resource);
-  if (Array.isArray(results)) {
-    return results.map(x => x.id);
-  }
-  return [];
-}
-
-async function filterPathsByViaFromKnowledge(resource) {
-  const flatmapKnowledge = getFlatmapKnowledge();
-  const results = findPathsByViaItem(flatmapKnowledge, resource);
-  if (Array.isArray(results)) {
-    return results.map(x => x.id);
-  }
-  return [];
-}
-
 function getKnowledgeSource(mapImp) {
   return getKnowledgeSourceFromProvenance(mapImp.provenance);
 }
@@ -146,7 +103,4 @@ export {
   getKnowledgeSource,
   getKnowledgeSourceFromProvenance,
   refreshFlatmapKnowledgeCache,
-  filterPathsByOriginFromKnowledge,
-  filterPathsByDestinationFromKnowledge,
-  filterPathsByViaFromKnowledge,
 }