@abi-software/flatmapvuer 0.2.4-beta-1 → 0.2.4-beta-5

package/package-lock.json

@@ -1,20 +1,21 @@
 {
   "name": "@abi-software/flatmapvuer",
-  "version": "0.2.4-beta-0",
+  "version": "0.2.4-beta-3",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
     "@abi-software/flatmap-viewer": {
-      "version": "2.1.0-beta.14",
-      "resolved": "https://registry.npmjs.org/@abi-software/flatmap-viewer/-/flatmap-viewer-2.1.0-beta.14.tgz",
-      "integrity": "sha512-WqnMFrfgVRsrIOKhIpudXCa8nO28Xc0WjN5XRrhYM8KU0LBD+QP1kBzTDBgbt/Q6ygiIiCgWvI1Wtoy8Kj5DjQ==",
+      "version": "2.2.0-beta.7",
+      "resolved": "https://registry.npmjs.org/@abi-software/flatmap-viewer/-/flatmap-viewer-2.2.0-beta.7.tgz",
+      "integrity": "sha512-keAB4wn7nEw7eBA9Z4HyODVSbZiKqRk1l40Z9gVQXQ4ZYUwh4MqFZsYNvfdujciBsUj0hrl/mphHNKXAGIOu2g==",
       "requires": {
         "@babel/runtime": "^7.10.4",
         "@turf/area": "^6.0.1",
         "@turf/bbox": "^6.0.1",
         "@turf/helpers": "^6.1.4",
-        "maplibre-gl": "^1.15.2",
-        "minisearch": "^2.2.1"
+        "maplibre-gl": "^2.1.0",
+        "minisearch": "^2.2.1",
+        "polylabel": "^1.1.0"
       }
     },
     "@abi-software/svg-sprite": {
@@ -1281,20 +1282,15 @@
         "minimist": "^1.2.5"
       }
     },
-    "@mapbox/geojson-types": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@mapbox/geojson-types/-/geojson-types-1.0.2.tgz",
-      "integrity": "sha512-e9EBqHHv3EORHrSfbR9DqecPNn+AmuAoQxV6aL8Xu30bJMJR1o8PZLZzpk1Wq7/NfCbuhmakHTPYRhoqLsXRnw=="
-    },
     "@mapbox/jsonlint-lines-primitives": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/@mapbox/jsonlint-lines-primitives/-/jsonlint-lines-primitives-2.0.2.tgz",
       "integrity": "sha1-zlblOfg1UrWNENZy6k1vya3HsjQ="
     },
     "@mapbox/mapbox-gl-supported": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/@mapbox/mapbox-gl-supported/-/mapbox-gl-supported-1.5.0.tgz",
-      "integrity": "sha512-/PT1P6DNf7vjEEiPkVIRJkvibbqWtqnyGaBz3nfRdcxclNSnSdaLU5tfAgcD7I8Yt5i+L19s406YLl1koLnLbg=="
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@mapbox/mapbox-gl-supported/-/mapbox-gl-supported-2.0.1.tgz",
+      "integrity": "sha512-HP6XvfNIzfoMVfyGjBckjiAOQK9WfX0ywdLubuPMPv+Vqf5fj0uCbgBQYpiqcWZT6cbyyRnTSXDheT1ugvF6UQ=="
     },
     "@mapbox/point-geometry": {
       "version": "0.1.0",
@@ -1302,14 +1298,14 @@
       "integrity": "sha1-ioP5M1x4YO/6Lu7KJUMyqgru2PI="
     },
     "@mapbox/tiny-sdf": {
-      "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/@mapbox/tiny-sdf/-/tiny-sdf-1.2.5.tgz",
-      "integrity": "sha512-cD8A/zJlm6fdJOk6DqPUV8mcpyJkRz2x2R+/fYcWDYG3oWbG7/L7Yl/WqQ1VZCjnL9OTIMAn6c+BC5Eru4sQEw=="
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@mapbox/tiny-sdf/-/tiny-sdf-2.0.5.tgz",
+      "integrity": "sha512-OhXt2lS//WpLdkqrzo/KwB7SRD8AiNTFFzuo9n14IBupzIMa67yGItcK7I2W9D8Ghpa4T04Sw9FWsKCJG50Bxw=="
     },
     "@mapbox/unitbezier": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/@mapbox/unitbezier/-/unitbezier-0.0.0.tgz",
-      "integrity": "sha1-FWUb1VOme4WB+zmIEMmK2Go0Uk4="
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/@mapbox/unitbezier/-/unitbezier-0.0.1.tgz",
+      "integrity": "sha512-nMkuDXFv60aBr9soUG5q+GvZYL+2KZHVvsqFCzqnkGEf46U2fvmytHaEVc1/YZbiLn8X+eR3QzX1+dwDO1lxlw=="
     },
     "@mapbox/vector-tile": {
       "version": "1.3.1",
@@ -6499,11 +6495,6 @@
       "integrity": "sha512-nTnJ528pbqxYanhpDYsi4Rd8MAeaBA67+RZ10CM1m3bTAVFEDcd5AuA4a6W5YkGZ1iNXHzZz8T6TBKLeBuNriQ==",
       "dev": true
     },
-    "grid-index": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/grid-index/-/grid-index-1.1.0.tgz",
-      "integrity": "sha512-HZRwumpOGUrHyxO5bqKZL0B0GlUpwtCAzZ42sgxUPniu33R1LSFH5yrIcBCHjkctCAh3mtWKcKd9J4vDDdeVHA=="
-    },
     "gzip-size": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz",
@@ -8064,33 +8055,29 @@
       }
     },
     "maplibre-gl": {
-      "version": "1.15.2",
-      "resolved": "https://registry.npmjs.org/maplibre-gl/-/maplibre-gl-1.15.2.tgz",
-      "integrity": "sha512-uPeV530apb4JfX3cRFfE+awFnbcJTOnCv2QvY4mw4huiInbybElWYkNzTs324YLSADq0f4bidRoYcR81ho3aLA==",
+      "version": "2.1.6",
+      "resolved": "https://registry.npmjs.org/maplibre-gl/-/maplibre-gl-2.1.6.tgz",
+      "integrity": "sha512-UHdw4YeCkIyfG7vMdNK6e/sDNPB7jjUN5MUytKE1DFQB7sKM9V19ar1GUyn0uYRvQwJ5iC01fWhH3r/5bbHlKQ==",
       "requires": {
-        "@mapbox/geojson-rewind": "^0.5.0",
-        "@mapbox/geojson-types": "^1.0.2",
+        "@mapbox/geojson-rewind": "^0.5.1",
         "@mapbox/jsonlint-lines-primitives": "^2.0.2",
-        "@mapbox/mapbox-gl-supported": "^1.5.0",
+        "@mapbox/mapbox-gl-supported": "^2.0.1",
         "@mapbox/point-geometry": "^0.1.0",
-        "@mapbox/tiny-sdf": "^1.1.1",
-        "@mapbox/unitbezier": "^0.0.0",
+        "@mapbox/tiny-sdf": "^2.0.4",
+        "@mapbox/unitbezier": "^0.0.1",
         "@mapbox/vector-tile": "^1.3.1",
         "@mapbox/whoots-js": "^3.1.0",
         "csscolorparser": "~1.0.3",
-        "earcut": "^2.2.2",
+        "earcut": "^2.2.3",
         "geojson-vt": "^3.2.1",
-        "gl-matrix": "^3.2.1",
-        "grid-index": "^1.1.0",
-        "minimist": "^1.2.5",
+        "gl-matrix": "^3.4.3",
         "murmurhash-js": "^1.0.0",
         "pbf": "^3.2.1",
-        "potpack": "^1.0.1",
+        "potpack": "^1.0.2",
         "quickselect": "^2.0.0",
-        "rw": "^1.3.3",
-        "supercluster": "^7.1.0",
+        "supercluster": "^7.1.4",
         "tinyqueue": "^2.0.3",
-        "vt-pbf": "^3.1.1"
+        "vt-pbf": "^3.1.3"
       }
     },
     "md5.js": {
@@ -9396,6 +9383,14 @@
         "ts-pnp": "^1.1.6"
       }
     },
+    "polylabel": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/polylabel/-/polylabel-1.1.0.tgz",
+      "integrity": "sha512-bxaGcA40sL3d6M4hH72Z4NdLqxpXRsCFk8AITYg6x1rn1Ei3izf00UMLklerBZTO49aPA3CYrIwVulx2Bce2pA==",
+      "requires": {
+        "tinyqueue": "^2.0.3"
+      }
+    },
     "portfinder": {
       "version": "1.0.28",
       "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz",
@@ -10716,11 +10711,6 @@
         "aproba": "^1.1.1"
       }
     },
-    "rw": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/rw/-/rw-1.3.3.tgz",
-      "integrity": "sha1-P4Yt+pGrdmsUiF700BEkv9oHT7Q="
-    },
     "rxjs": {
       "version": "6.6.7",
       "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.7.tgz",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/flatmapvuer",
-  "version": "0.2.4-beta-1",
+  "version": "0.2.4-beta-5",
   "main": "./dist/flatmapvuer.common.js",
   "files": [
     "dist/*",
@@ -16,7 +16,7 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "@abi-software/flatmap-viewer": "^2.1.0-beta.14",
+    "@abi-software/flatmap-viewer": "2.2.0-beta.7",
     "@abi-software/svg-sprite": "^0.1.14",
     "core-js": "^3.3.2",
     "css-element-queries": "^1.2.2",

package/src/App.vue

@@ -18,7 +18,8 @@
     </el-popover>
   
     <MultiFlatmapVuer ref="multi" :availableSpecies="availableSpecies" 
-    @resource-selected="FlatmapSelected" :minZoom="minZoom"
+      @resource-selected="FlatmapSelected" :minZoom="minZoom"
+      @pan-zoom-callback="panZoomcallback"
       @ready="FlatmapReady" :featureInfo="featureInfo" :searchable="searchable" 
       :initial="initial" :pathControls="pathControls" :helpMode="helpMode"
       :displayMinimap=true :flatmapAPI="flatmapAPI"/>
@@ -58,8 +59,13 @@ export default {
     FlatmapReady: function(component) {
       let taxon = component.mapImp.describes;
       let id = component.mapImp.addMarker("UBERON:0000948", "simulation");
+      component.enablePanZoomEvents(true);
+      component.showPathwaysDrawer(false);
       console.log(taxon, id);
     },
+    panZoomcallback: function(payload) {
+      console.log(payload);
+    }
   },
   data: function(){
     return {
@@ -73,6 +79,7 @@ export default {
         "Kember":{taxo: "ABI:1000001", displayWarning:true},
         "Pig":{taxo: "NCBITaxon:9823", iconClass:"icon-mapicon_pig", displayWarning:true}, 
         "Cat":{taxo: "NCBITaxon:9685", iconClass:"icon-mapicon_cat", displayWarning:true},
+        "digestive tract":{taxo: "digestive tract", displayWarning:true}
       },
       tooltipContent: undefined,
       tStyle: {
@@ -81,9 +88,10 @@ export default {
         position: "absolute"
       },
       displayCloseButton: false,
-      initial: "Rat",
+      initial: "digestive tract",
       helpMode: false,
-      flatmapAPI: "https://mapcore-demo.org/fccb/flatmap/"
+      //flatmapAPI: "https://mapcore-demo.org/fccb/flatmap/"
+      flatmapAPI: "https://mapcore-demo.org/devel/flatmap/v3/"
     }
   },
   mounted: function() {

package/src/components/FlatmapVuer.vue

@@ -338,24 +338,31 @@ export default {
         this.mapImp.showPaths(this.checkedItems);
       }
     },
+    enablePanZoomEvents: function(flag) {
+      this.mapImp.enablePanZoomEvents(flag);
+    },
     eventCallback: function() {
-      return (eventType, feature, ...args) => {
-        const label = feature.label;
-        const resource = [feature.models];
-        const taxonomy = this.entry;
-        const data = {
-          dataset: feature.dataset,
-          taxonomy: taxonomy,
-          resource: resource,
-          label: label,
-          feature: feature,
-          userData: args,
-          eventType: eventType
-        };
-        // Disable the nueron pop up for now.
-        if (feature && feature.type !== "marker")
-          this.checkAndCreatePopups(data);
-        this.$emit("resource-selected", data);
+      return (eventType, data, ...args) => {
+        if (eventType !== "pan-zoom") {
+          const label = data.label;
+          const resource = [data.models];
+          const taxonomy = this.entry;
+          const payload = {
+            dataset: data.dataset,
+            taxonomy: taxonomy,
+            resource: resource,
+            label: label,
+            feature: data,
+            userData: args,
+            eventType: eventType
+          };
+          // Disable the nueron pop up for now.
+          if (data && data.type !== "marker")
+            this.checkAndCreatePopups(data);
+          this.$emit("resource-selected", payload);
+        } else {
+          this.$emit("pan-zoom-callback", data);
+        }
       };
     },
     // checkNeuronClicked shows a neuron path pop up if a path was recently clicked
@@ -578,6 +585,13 @@ export default {
         if (this.entry == state.entry) this._viewportToBeSet = state.viewport;
       }
     },
+    showMinimap: function(flag) {
+      if (this.mapImp)
+        this.mapImp.showMinimap(flag);
+    },
+    showPathwaysDrawer: function(flag) {
+      this.drawerOpen = flag;
+    },
     /**
      * Function to display features with annotation matching the provided term.
      */

package/src/components/MultiFlatmapVuer.vue

@@ -36,6 +36,7 @@
       :ref="key"
       @resource-selected="FlatmapSelected"
       @ready="FlatmapReady"
+      @pan-zoom-callback="panZoomCallback"
       :featureInfo="featureInfo"
       :minZoom="minZoom"
       :pathControls="pathControls"
@@ -119,6 +120,9 @@ export default {
     getCurrentFlatmap: function() {
       return this.$refs[this.activeSpecies][0];
     },
+    panZoomCallback: function(payload) {
+      this.$emit("pan-zoom-callback", payload);
+    },
     showPopup: function(featureId, node, options) {
       let map = this.getCurrentFlatmap();
       map.showPopup(featureId, node, options);