adds handling of rich text (markdown)
authorduong tam kien <tk@deveha.com>
Fri, 24 Feb 2017 17:47:45 +0100
changeset 391 7ab1cc12827e
parent 390 d2187b1af744
child 392 e07a9c8901c2
adds handling of rich text (markdown)
src_js/iconolab-bundle/package.json
src_js/iconolab-bundle/src/components/editor/Comment.vue
--- a/src_js/iconolab-bundle/package.json	Fri Feb 24 17:35:16 2017 +0100
+++ b/src_js/iconolab-bundle/package.json	Fri Feb 24 17:47:45 2017 +0100
@@ -25,6 +25,7 @@
     "node-sass": "^4.5.0",
     "resolve-url-loader": "^1.6.1",
     "sass-loader": "^4.1.1",
+    "showdown": "^1.6.4",
     "snapsvg": "^0.4.0",
     "url-loader": "^0.5.7",
     "vue": "^2.0.0-alpha.8",
--- a/src_js/iconolab-bundle/src/components/editor/Comment.vue	Fri Feb 24 17:35:16 2017 +0100
+++ b/src_js/iconolab-bundle/src/components/editor/Comment.vue	Fri Feb 24 17:47:45 2017 +0100
@@ -1,6 +1,6 @@
 <template>
     <div class="comment">
-        {{ comment }}
+        <div class="comment-body" v-html="commentFormatted"></div>
         <div class="comment-footer">
             <span class="comment-author">{{ username }}</span>
             <span class="comment-date">{{ dateFormatted }}</span>
@@ -10,6 +10,10 @@
 
 <script>
 
+    import showdown from 'showdown'
+
+    const converter = new showdown.Converter()
+
     export default {
         props: [
             'comment',
@@ -27,6 +31,9 @@
                 var year = date.getFullYear();
 
                 return day + '/' + month + '/' + year;
+            },
+            commentFormatted: function(){
+              return converter.makeHtml(this.comment);
             }
         }
     }