@abi-software/flatmapvuer 0.3.8 → 0.3.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/flatmapvuer",
-  "version": "0.3.8",
+  "version": "0.3.10",
   "main": "./dist/flatmapvuer.common.js",
   "files": [
     "dist/*",
@@ -21,7 +21,7 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "@abi-software/flatmap-viewer": "^2.2.5",
+    "@abi-software/flatmap-viewer": "^2.2.9",
     "@abi-software/svg-sprite": "^0.1.14",
     "core-js": "^3.3.2",
     "css-element-queries": "^1.2.2",

package/src/App.vue

@@ -11,7 +11,7 @@
         <el-row :gutter="20">
           <el-button @click="helpMode = !helpMode" size="mini">Help Mode</el-button>
           <el-button @click="saveSettings()" size="mini">Save Settings</el-button>
-          <el-button @click="restoreSettings()" size="mini">Restore Settings</el-button>
+          <el-button :disabled="mapSettings.length === 0" @click="restoreSettings()" size="mini">Restore Settings</el-button>
         </el-row>
       </div>
       <el-button class="options-button" icon="el-icon-setting" slot="reference">Options</el-button>
@@ -46,11 +46,11 @@ export default {
   name: 'app',
   methods: {
     saveSettings: function() {
-      this._mapSettings.push(this.$refs.multi.getState());
+      this.mapSettings.push(this.$refs.multi.getState());
     },
     restoreSettings: function() {
-      if (this._mapSettings.length > 0)
-        this.$refs.multi.setState(this._mapSettings.pop());
+      if (this.mapSettings.length > 0)
+        this.$refs.multi.setState(this.mapSettings.pop());
     },
     FlatmapSelected: function(resource) {
       if (resource.eventType === "click")
@@ -74,8 +74,9 @@ export default {
       searchable: true,
       pathControls: true,
       minZoom: 4,
-      availableSpecies : {"Human Female":{id: "human-flatmap_female", iconClass:"mapicon-icon_human", displayWarning:true},
-        "Human Male":{id: "human-flatmap_male", taxo: "NCBITaxon:9606", iconClass:"mapicon-icon_human", displayWarning:true},
+      availableSpecies : {
+        "Human Female":{taxo: "NCBITaxon:9606", biologicalSex: "PATO:0000383", iconClass:"mapicon-icon_human", displayWarning:true},
+        "Human Male":{taxo: "NCBITaxon:9606", biologicalSex: "PATO:0000384", iconClass:"mapicon-icon_human", displayWarning:true},
         "Rat":{taxo: "NCBITaxon:10114", iconClass:"mapicon-icon_rat", displayWarning:false, displayLatestChanges:true},
         "Mouse":{taxo: "NCBITaxon:10090", iconClass:"mapicon-icon_mouse", displayWarning:true},
         "Kember":{taxo: "ABI:1000001", displayWarning:true},
@@ -93,15 +94,13 @@ export default {
       displayCloseButton: false,
       initial: "Rat",
       helpMode: false,
+      mapSettings: [],
       //flatmapAPI: "https://mapcore-demo.org/current/flatmap/v2/"
       //flatmapAPI: "https://mapcore-demo.org/devel/flatmap/v3/"
-      flatmapAPI: "https://mapcore-demo.org/fccb/flatmap/"
+       flatmapAPI: "https://mapcore-demo.org/current/flatmap/v3/"
       // flatmapAPI: "https://mapcore-demo.org/devel/flatmap/v1/"
     }
   },
-  mounted: function() {
-    this._mapSettings = [];
-  },
   components: {
     MultiFlatmapVuer,
   }

package/src/components/FlatmapVuer.vue

@@ -378,10 +378,10 @@ export default {
           const label = data.label;
           const resource = [data.models];
           const taxonomy = this.entry;
-          const flatmapId = this.flatmapId;
+          const biologicalSex = this.biologicalSex;
           const payload = {
             dataset: data.dataset,
-            flatmapId: flatmapId,
+            biologicalSex: biologicalSex,
             taxonomy: taxonomy,
             resource: resource,
             label: label,
@@ -566,20 +566,28 @@ export default {
       if (this.mapImp) {
         let state = {
           entry: this.entry,
-          flatmapId: this.flatmapId,
           viewport: this.mapImp.getState()
         };
+        const identifier = this.mapImp.getIdentifier();
+        if (this.biologicalSex)
+          state['biologicalSex'] = this.biologicalSex;
+        else if (identifier && identifier.biologicalSex)
+          state['biologicalSex'] = identifier.biologicalSex;
+        if (identifier && identifier.uuid)
+          state['uuid'] = identifier.uuid;
         return state;
       }
       return undefined;
     },
     setState: function(state) {
       if (state) {
-        if (this.mapImp && (state.entry || state.flatmapId)) {
-          if ((this.flatmapId && (this.flatmapId == state.flatmapId)) || (this.entry == state.entry))
-            if (state.viewport) {
-              this.mapImp.setState(state.viewport);
-            }
+        if (this.mapImp && 
+          (state.entry && (this.entry == state.entry)) &&
+          (!state.biologicalSex || (state.biologicalSex === this.biologicalSex))) 
+        {
+          if (state.viewport) {
+            this.mapImp.setState(state.viewport);
+          }
         } else {
           this.createFlatmap(state);
         }
@@ -593,15 +601,41 @@ export default {
           minimap = { position: "top-right" };
         }
 
-        let entry = this.flatmapId;
-        if (state && state.flatmapId) entry = state.flatmapId;
-        if  (!entry) {
-          entry = this.entry;
-          if (state && state.entry) entry = state.entry;
+        //As for flatmap-viewer@2.2.7, see below for the documentation 
+        //for the identifier:
+
+        //@arg identifier {string|Object}
+        // A string or object identifying the map to load. If a string its
+        // value can be either the map's ``uuid``, assigned at generation time,
+        // or taxon and biological sex identifiers of the species that the map
+        // represents. The latest version of a map is loaded unless it has been
+        // identified using a ``uuid`` (see below).
+        // @arg identifier.taxon {string} The taxon identifier of the species 
+        //  represented by the map. This is specified as metadata in the map's source file.
+        // @arg identifier.biologicalSex {string} The biological sex of the species
+        // represented by the map. This is specified as metadatain the map's source file.
+        // @arg identifier.uuid {string} The unique uuid the flatmap. If given then this exact map will
+        //  be loaded, overriding ``taxon`` and ``biologicalSex``.
+
+        let identifier = { taxon: this.entry };
+        if (state && state.entry) {
+          identifier.taxon = state.entry;
+          if (state.biologicalSex) {
+            identifier["biologicalSex"] = state.biologicalSex;
+          } else if (identifier.taxon === "NCBITaxon:9606") {
+            //For backward compatibility
+            identifier["biologicalSex"] ="PATO:0000384";
+          }
+        } else {
+          // Set the bioloicalSex now if map is not resumed from
+          // a saved state
+          if (this.biologicalSex) {
+            identifier["biologicalSex"] = this.biologicalSex;
+          }
         }
 
         let promise1 = this.mapManager.loadMap(
-          entry,
+          identifier,
           this.$refs.display,
           this.eventCallback(),
           {
@@ -633,7 +667,7 @@ export default {
             this.mapImp.setState(state.viewport);
         });
       } else if (state) {
-        if ((this.flatmapId == state.flatmapId) || this.entry == state.entry)
+        if (this.entry == state.entry)
           this._viewportToBeSet = state.viewport;
       }
     },
@@ -675,7 +709,10 @@ export default {
   },
   props: {
     entry: String,
-    flatmapId: String,
+    biologicalSex: {
+      type: String,
+      default: ""
+    },
     featureInfo: {
       type: Boolean,
       default: false
@@ -780,9 +817,6 @@ export default {
     entry: function() {
       if (!this.state) this.createFlatmap();
     },
-    flatmapId: function() {
-      if (!this.state) this.createFlatmap();
-    },
     helpMode: function(val) {
       this.setHelpMode(val);
     },
@@ -888,6 +922,9 @@ export default {
       transparent 9px
     );
   }
+  &.other {
+    background: #888;
+  }
 }
 
 .flatmap-container {
@@ -1276,10 +1313,6 @@ export default {
   }
 }
 
-::v-deep .flatmap-popper {
-  
-}
-
 ::v-deep .popper-zoomout {
   padding-right: 13px !important;
   left: -21px !important;

package/src/components/MultiFlatmapVuer.vue

@@ -31,7 +31,7 @@
       :showLayer="showLayer"
       v-show="activeSpecies==key"
       :entry="item.taxo"
-      :flatmap-id="item.id"
+      :biologicalSex="item.biologicalSex"
       :displayWarning="item.displayWarning"
       :warningMessage="warningMessage"
       :displayLatestChanges="item.displayLatestChanges"
@@ -88,18 +88,20 @@ export default {
         fetch(this.flatmapAPI)
         .then(response => response.json())
         .then(data => {
-          this.speciesLis= {};
+          this.speciesList= {};
           Object.keys(this.availableSpecies).forEach(key => {
             for (let i = 0; i < data.length; i++) {
-              if (this.availableSpecies[key].id === data[i].id) {
-                this.speciesList[key] = this.availableSpecies[key];
-                break;
-              }
               if (this.availableSpecies[key].taxo === data[i].taxon) {
-                this.speciesList[key] = this.availableSpecies[key];
-                //make sure the id is unset as it fails to match the one on
-                this.speciesList[key].id = undefined;
-                break;
+                if (this.availableSpecies[key].biologicalSex) {
+                  if (data[i].biologicalSex && 
+                    data[i].biologicalSex === this.availableSpecies[key].biologicalSex) {
+                      this.speciesList[key] = this.availableSpecies[key];
+                      break;
+                    }
+                } else {
+                  this.speciesList[key] = this.availableSpecies[key];
+                  break;
+                }
               }
             }
           });