@abi-software/map-side-bar 1.1.16 → 1.1.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/map-side-bar",
-  "version": "1.1.16",
+  "version": "1.1.17",
   "main": "./dist/map-side-bar.common.js",
   "files": [
     "dist/*",

package/src/components/ContextCard.vue

@@ -1,18 +1,20 @@
 <template>
   <div class="context-card-container"  ref="container">
-    <div v-show="showDetails" class="hide" @click="showDetails = !showDetails">Hide information<i class="el-icon-arrow-up"></i></div>
-    <div v-show="!showDetails" class="hide" @click="showDetails = !showDetails">Show information<i class="el-icon-arrow-down"></i></div>
-    <el-card v-if="showDetails && Object.keys(contextData).length !== 0" class="context-card card" :body-style="{ padding: '0px', 'background-color': 'white', display: 'flex', width: '516px'}">
-      <img :src="entry.banner" class="context-image card-left">
-      <div class="card-right">
-        <div class="title">{{contextData.heading}}</div>
-        <div>{{contextData.description}}</div>
-        <template v-for="(view, i) in contextData.views">
-          <br v-bind:key="i"/>
-          <span v-bind:key="i+'_1'" @click="openViewFile(view)" style="cursor:pointer;"><img :src="getFileFromPath(view.thumbnail)" style="height: 25px;"> {{view.description}}</span>
-        </template>
-      </div>
-    </el-card>
+    <div v-show="showContextCard">
+      <div v-show="showDetails" class="hide" @click="showDetails = !showDetails">Hide information<i class="el-icon-arrow-up"></i></div>
+      <div v-show="!showDetails" class="hide" @click="showDetails = !showDetails">Show information<i class="el-icon-arrow-down"></i></div>
+      <el-card v-if="showDetails && Object.keys(contextData).length !== 0" class="context-card card" >
+        <img :src="entry.banner" class="context-image card-left">
+        <div class="card-right">
+          <div class="title">{{contextData.heading}}</div>
+          <div>{{contextData.description}}</div>
+          <template v-for="(view, i) in contextData.views">
+            <br v-bind:key="i"/>
+            <span v-bind:key="i+'_1'" @click="openViewFile(view)" class="scaffold-view"><img :src="getFileFromPath(view.thumbnail)"> {{view.description}}</span>
+          </template>
+        </div>
+      </el-card>
+    </div>
   </div>
 </template>
 
@@ -47,12 +49,21 @@ export default {
   data: function () {
     return {
       contextData: {},
-      showDetails: true
+      showDetails: true,
+      showContextCard: true
     };
   },
   watch: {
-    'entry.contextCardUrl'(val){
-      this.getContextFile(val)
+    'entry.contextCardUrl': {
+      handler(val){
+        if (val) {
+          this.getContextFile(val)
+          this.showContextCard = true
+        } else {
+          this.showContextCard = false
+        }
+      },
+      immediate: true
     }
   },
   methods: {
@@ -67,7 +78,6 @@ export default {
         })
         .then((data) => {
           this.contextData = data
-          console.log(this.contextData)
         })
         .catch(() => {
           //set defaults if we hit an error
@@ -75,7 +85,15 @@ export default {
           this.discoverId = undefined
         });
     },
+    removeDoubleFilesPath: function(path){
+      if (path.includes('files/files/')){
+        return path.replace('files/files/', 'files/')
+      } else {
+        return path
+      }
+    },
     getFileFromPath: function(path){
+      path = this.removeDoubleFilesPath(path)
       return  `${this.entry.apiLocation}s3-resource/${this.entry.discoverId}/${this.entry.version}/files/${path}`
     },
     openViewFile: function(view){
@@ -85,10 +103,6 @@ export default {
       this.entry.type = 'Scaffold View'
       EventBus.$emit("PopoverActionClick", this.entry)
     }
-    
-  },
-  mounted: function(){
-    this.getContextFile(this.entry.contextCardUrl)
   }
 };
 </script>
@@ -105,6 +119,12 @@ export default {
   background-color: white;
 }
 
+.context-card >>> .el-card__body {
+  padding: 0px;
+  display: flex;
+  width: 516px;   
+}
+
 .context-image{
   width: 250px
 }
@@ -126,6 +146,11 @@ export default {
   padding-left: 6px;
 }
 
+.cursor-pointer {
+  cursor: pointer;
+  height: 25px;
+}
+
 .title{
   font-weight: bold;
 }

package/src/components/DatasetCard.vue

@@ -17,9 +17,6 @@
           <div>
             <el-button v-if="entry.scaffolds" @click="openScaffold" size="mini" class="button" icon="el-icon-view">View scaffold</el-button>
           </div>
-          <div>
-            <el-button v-if="entry.contextualInformation" @click="openContext" size="mini" class="button" icon="el-icon-view">View context data</el-button>
-          </div>
           <div>
             <el-button v-if="hasCSVFile"  @click="openPlot" size="mini" class="button" icon="el-icon-view">View plot</el-button>
           </div>
@@ -149,20 +146,6 @@ export default {
         }
         this.propogateCardAction(action)
     },
-    openContext: function(){
-      let action = {
-          label: capitalise(this.label),
-          resource: 'not used',
-          title: "View 3D scaffold",
-          type: "Scaffold",
-          discoverId: this.discoverId,
-          apiLocation: this.envVars.API_LOCATION,
-          version: this.version,
-          contextCardUrl: this.entry.contextualInformation ? this.getFileFromPath(this.discoverId, this.version,this.entry.contextualInformation) : undefined,
-          banner: this.thumbnail
-        }
-        this.propogateCardAction(action)
-    },
     openPlot: function(){
       let action = {
           label: capitalise(this.label),

package/src/components/SearchFilters.vue

@@ -23,7 +23,7 @@
         <el-popover
           title="How do filters work?"
           width="250"
-          trigger="click"
+          trigger="hover"
           :append-to-body=false
           popper-class="popover"
           >

package/src/components/SidebarContent.vue

@@ -1,7 +1,7 @@
 <template>
   <el-card :body-style="bodyStyle" class="content-card">
     <div slot="header" class="header">
-      <context-card v-if="contextCardEntry" :entry="contextCardEntry" />
+      <context-card v-if="contextCardEntry && contextCardEnabled" :entry="contextCardEntry" />
       <el-input
         class="search-input"
         placeholder="Search"
@@ -102,7 +102,8 @@ var initial_state = {
   start: 0,
   hasSearched: false,
   sciCrunchError: false,
-  contextCardEntry: undefined
+  contextCardEntry: undefined,
+  contextCardEnabled: false
 };
 
 export default {