@abi-software/map-side-bar 1.3.26-staging → 1.3.27-staging

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/map-side-bar",
-  "version": "1.3.26-staging",
+  "version": "1.3.27-staging",
   "main": "./dist/map-side-bar.common.js",
   "files": [
     "dist/*",
@@ -21,6 +21,8 @@
     "@abi-software/svg-sprite": "^0.1.14",
     "algoliasearch": "^4.10.5",
     "element-ui": "^2.13.0",
+    "isomorphic-dompurify": "^0.23.0",
+    "marked": "^4.1.1",
     "vue": "^2.6.10"
   },
   "devDependencies": {

package/src/components/ContextCard.vue

@@ -5,11 +5,11 @@
       <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" v-loading="loading" class="context-card" >
         <div class="card-left">
-          <img :src="entry.banner" class="context-image">
+          <img :src="banner" class="context-image">
         </div>
         <div class="card-right scrollbar">
           <div class="title">{{contextData.heading}}</div>
-          <div v-html="contextData.description"/>
+          <div v-html="parseMarkdown(contextData.description)"/>
           <br/>
 
           <!-- Show sampeles and views seperately if they do not match -->
@@ -71,6 +71,9 @@ import locale from "element-ui/lib/locale";
 import EventBus from "./EventBus"
 import hardcoded_info from './hardcoded-context-info'
 
+import { marked } from 'marked'
+import DOMPurify from 'isomorphic-dompurify';
+
 locale.use(lang);
 Vue.use(Link);
 Vue.use(Icon);
@@ -161,6 +164,17 @@ export default {
       }
       else return false
     },
+    banner: function(){
+      if (this.contextData.banner){
+        console.log('found banner!')
+        return this.getFileFromPath(this.contextData.banner) 
+      } else if (this.contextData && this.contextData.views && this.contextData.views.length > 0) {
+        if(this.contextData.views[0].thumbnail){
+          return this.getFileFromPath(this.contextData.views[0].thumbnail)
+        }
+      } 
+      return this.entry.banner
+    }
   },
   methods: {
     samplesMatching: function(viewId){
@@ -248,6 +262,9 @@ export default {
       return `${this.envVars.ROOT_URL}/file/${sample.discoverId}/${sample.version}?path=${this.processPathForUrl(sample.path)}`
 
     },
+    parseMarkdown(markdown){
+      return DOMPurify.sanitize(marked.parse(markdown))
+    },
     openViewFile: function(view){
       // note that we assume that the view file is in the same directory as the scaffold (viewUrls take relative paths)
       this.entry.viewUrl = `${this.envVars.API_LOCATION}s3-resource/${this.entry.discoverId}/${this.entry.version}/${view.path}`