@abi-software/map-side-bar 1.3.27 → 1.3.28

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/map-side-bar",
-  "version": "1.3.27",
+  "version": "1.3.28",
   "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

@@ -1,15 +1,15 @@
 <template>
   <div class="context-card-container"  ref="container">
     <div v-show="showContextCard">
-      <div v-show="showDetails" class="hide" @click="showDetails = !showDetails">Hide information panel<i class="el-icon-arrow-up"></i></div>
-      <div v-show="!showDetails" class="hide" @click="showDetails = !showDetails">Show information panel<i class="el-icon-arrow-down"></i></div>
+      <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" v-loading="loading" class="context-card" >
         <div class="card-left">
           <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);
@@ -160,8 +163,8 @@ export default {
     },
     banner: function(){
       if (this.contextData.banner){
-        this.getFileFromPath(this.contextData.banner) 
-      } else if (this.contextData && this.contextData.views) {
+        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)
         }
@@ -255,6 +258,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}`