@abi-software/flatmapvuer 1.9.3-beta.1 → 1.9.3-beta.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/flatmapvuer",
-  "version": "1.9.3-beta.1",
+  "version": "1.9.3-beta.3",
   "license": "Apache-2.0",
   "files": [
     "dist/*",

package/src/App.vue

@@ -277,6 +277,7 @@ export default {
         },
         Vagus: {
           taxo: 'UBERON:0001759',
+          uuid: "0ea568ec-538d-52f3-a8e7-0437d844e1cf",
         },
         Sample: { taxo: 'NCBITaxon:1', displayWarning: true },
         'Functional Connectivity': {

package/src/components/FlatmapVuer.vue

@@ -318,7 +318,7 @@ Please use `const` to assign meaningful names to them...
                 ref="treeControls"
               />
               <selections-group
-                v-if="containsAlert && alertOptions"
+                v-if="containsAlert && alertOptions && showPathwayFilter"
                 title="Alert"
                 labelKey="label"
                 identifierKey="key"
@@ -357,7 +357,7 @@ Please use `const` to assign meaningful names to them...
                 />
               -->
               <selections-group
-                v-if="pathways && pathways.length > 0"
+                v-if="pathways && pathways.length > 0 & showPathwayFilter"
                 title="Pathways"
                 labelKey="label"
                 identifierKey="type"
@@ -370,7 +370,7 @@ Please use `const` to assign meaningful names to them...
                 key="pathwaysSelection"
               />
               <selections-group
-                v-if="taxonConnectivity && taxonConnectivity.length > 0"
+                v-if="taxonConnectivity && taxonConnectivity.length > 0 && showPathwayFilter"
                 title="Studied in"
                 labelKey="label"
                 identifierKey="taxon"
@@ -739,6 +739,20 @@ export default {
     return { annotator }
   },
   methods: {
+    /**
+     * 
+     * @param filter format should follow #makeStyleFilter (flatmap-viewer)
+     */
+    setVisibilityFilter: function (filter) {
+      // More filter options -> this.mapImp.featureFilterRanges()
+      if (this.mapImp) {
+        if (filter) {
+          this.mapImp.setVisibilityFilter(filter);
+        } else {
+          this.mapImp.clearVisibilityFilter();
+        }
+      }
+    },
     /**
      * @public
      * Function to manually send aborted signal when annotation tooltip popup or sidebar tab closed.
@@ -1189,6 +1203,7 @@ export default {
         ];
 
         map.setMaxBounds(null); // override default
+        map.setRenderWorldCopies(false);
 
         this.initMapState = markRaw({
           initBounds,
@@ -2005,22 +2020,30 @@ export default {
         // load and store knowledge
         loadAndStoreKnowledge(this.mapImp, this.flatmapQueries);
         let prom1 = []
-        // When there are multiple paths, emit placeholders first.
+        // Emit placeholders first.
         // This may contain invalid connectivity.
-        if (data.length > 1) {
-          this.tooltipEntry = data.map((tooltip) => {
+        this.tooltipEntry = data
+          .filter((tooltip) => {
+            return (
+              tooltip.resource[0] &&
+              this.mapImp.pathModelNodes(tooltip.resource).length > 0
+            )
+          })
+          .map((tooltip) => {
             return { title: tooltip.label, featureId: tooltip.resource, ready: false }
           })
+        // 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]))
-        }
-        this.tooltipEntry = await Promise.all(prom1)
-        const featureIds = this.tooltipEntry.map(tooltip => tooltip.featureId[0])
-        if (featureIds.length > 0) {
-          this.displayTooltip(featureIds)
+          // 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]))
+          }
+          this.tooltipEntry = await Promise.all(prom1)
+          const featureIds = this.tooltipEntry.map(tooltip => tooltip.featureId[0])
+          if (featureIds.length > 0) {
+            this.displayTooltip(featureIds)
+          }
         }
       }
     },
@@ -2315,7 +2338,9 @@ export default {
         options.annotationFeatureGeometry = geometry
       } else {
         const entry = Array.isArray(feature) ? feature[0] : feature
-        featureId = this.mapImp.modelFeatureIds(entry)[0]
+        if (entry) {
+          featureId = this.mapImp.modelFeatureIds(entry)[0]
+        }
         if (!this.activeDrawTool) {
           options.positionAtLastClick = true
         }
@@ -2338,6 +2363,7 @@ export default {
       // Provenance popup will be shown on map
       // Tooltip will be shown for Annotation view
       if (
+        featureId &&
         !this.disableUI &&
         (
           (this.viewingMode === 'Annotation' && !this.annotationSidebar) ||
@@ -2676,6 +2702,117 @@ export default {
         console.error('Map resize error')
       }
     },
+    getFilterSources: function () {
+      const FILTER_PROPERTIES = ['kind', 'taxons']
+      let withAlert = new Set()
+      let withoutAlert = new Set()
+      let filterSourcesMap = new Map()
+      for (const annotation of this.mapImp.annotations.values()) {
+        if (annotation.source) {
+          if ("alert" in annotation) {
+            withAlert.add(annotation.source)
+          } else {
+            withoutAlert.add(annotation.source)
+          }
+          for (const [key, value] of Object.entries(annotation)) {
+            if (FILTER_PROPERTIES.includes(key)) {
+              if (!filterSourcesMap.has(key)) {
+                filterSourcesMap.set(key, new Map())
+              }
+              const sourceMap = filterSourcesMap.get(key)
+              const addToSourceMap = (val) => {
+                const setKey = val
+                if (!sourceMap.has(setKey)) {
+                  sourceMap.set(setKey, new Set())
+                }
+                sourceMap.get(setKey).add(`${annotation.source}`)
+              };
+              if (Array.isArray(value)) {
+                value.forEach(addToSourceMap)
+              } else {
+                addToSourceMap(value)
+              }
+            }
+          }
+        }
+      }
+      let filterSources = {
+        'alert': {
+          'with': [...withAlert],
+          'without': [...withoutAlert]
+        }
+      }
+      for (const [key, value] of filterSourcesMap.entries()) {
+        filterSources[key] = {}
+        for (const [key1, value1] of value.entries()) {
+          filterSources[key][key1] = [...value1.values()]
+        }
+      }
+      return filterSources
+    },
+    getFilterOptions: async function () {
+      if (this.mapImp) {
+        let filterOptions = []
+        const filterRanges = this.mapImp.featureFilterRanges()
+        for (const [key, value] of Object.entries(filterRanges)) {
+          let main = {
+            key: `flatmap.connectivity.${key}`,
+            label: "",
+            children: []
+          }
+          if (key === "kind") {
+            main.label = "Pathways"
+            for (const facet of value) {
+              const pathway = this.pathways.find(p => p.type !== "centreline" && p.type === facet)
+              if (pathway) {
+                main.children.push({
+                  key: `${main.key}.${facet}`,
+                  label: pathway.label
+                })
+              }
+            }
+          } else if (key === "taxons") {
+            main.label = "Studied in"
+            const entityLabels = await findTaxonomyLabels(this.mapImp, this.mapImp.taxonIdentifiers)
+            if (entityLabels.length) {
+              for (const facet of value) {
+                const taxon = entityLabels.find(p => p.taxon === facet)
+                if (taxon) {
+                  main.children.push({
+                    key: `${main.key}.${facet}`,
+                    label: taxon.label
+                  })
+                }
+              }
+            }
+          } else if (key === "alert") {
+            main.label = "Alert"
+            for (const facet of ["with", "without"]) {
+              main.children.push({
+                key: `${main.key}.${facet}`,
+                label: `${facet} alerts`
+              })
+            }
+          }
+          if (main.label && main.children.length) {
+            filterOptions.push(main)
+          }
+        }
+        // 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
+      }
+    },
     /**
      * @public
      * This function is used for functions that need to run immediately after the flatmap is loaded.
@@ -3028,6 +3165,13 @@ export default {
       type: Boolean,
       default: true,
     },
+    /**
+     * The option to show pathway drawer
+     */
+    showPathwayFilter: {
+      type: Boolean,
+      default: true,
+    },
   },
   provide() {
     return {

package/src/components/MultiFlatmapVuer.vue

@@ -88,6 +88,7 @@
       :sparcAPI="sparcAPI"
       :showLocalSettings="showLocalSettings"
       :showOpenMapButton="showOpenMapButton"
+      :showPathwayFilter="showPathwayFilter"
     />
   </div>
 </template>
@@ -779,6 +780,13 @@ export default {
       type: Boolean,
       default: true,
     },
+    /**
+     * The option to show pathway drawer
+     */
+    showPathwayFilter: {
+      type: Boolean,
+      default: true,
+    },
   },
   data: function () {
     return {

package/src/services/flatmapQueries.js

@@ -344,20 +344,6 @@ let FlatmapQueries = function () {
     }
   }
 
-  this.queryMapPaths =  async function (mapuuid) {
-    const url = this.flatmapAPI + `flatmap/${mapuuid}/pathways`;
-
-    try {
-      const response = await fetch(url);
-      if (!response.ok) {
-        throw new Error(`Response status: ${response.status}`);
-      }
-      return await response.json();
-    } catch (error) {
-      throw new Error(error);
-    }
-  }
-
   this.queryForConnectivity = function (mapImp, keastIds, signal, processConnectivity=true) {
     const data = { sql: this.buildConnectivitySqlStatement(keastIds) }
     const headers = {
@@ -478,11 +464,15 @@ let FlatmapQueries = function () {
         const sourceKey = ["ilxtr:hasSomaLocatedIn"]
         const destinationKey = ["ilxtr:hasAxonPresynapticElementIn", "ilxtr:hasAxonSensorySubcellularElementIn"]
         sourceKey.forEach((key)=>{
-          dendrites.push(...connectivity["node-phenotypes"][key])
+          if (key in connectivity["node-phenotypes"]) {
+            dendrites.push(...connectivity["node-phenotypes"][key])
+          }
         })
         dendrites = removeDuplicates(dendrites)
         destinationKey.forEach((key)=>{
-          axons.push(...connectivity["node-phenotypes"][key])
+          if (key in connectivity["node-phenotypes"]) {
+            axons.push(...connectivity["node-phenotypes"][key])
+          }
         })
         axons = removeDuplicates(axons)
       } else {