show and hide raw message with button

2 files changed, 14 insertions, 5 deletions

diff --git a/css/style.css b/css/style.css
index 4e862bd..5e431a5 100644
--- a/css/style.css
+++ b/css/style.css
@@ -187,7 +187,7 @@ button {
   display: inline-block;
   *display: inline;
   padding: 4px 12px;
-  margin-top: .5em;
+  margin-top: 0;
   margin-bottom: 0;
   *margin-left: .3em;
   font-size: 14px;
diff --git a/render.js b/render.js
index 3305184..44f6333 100644
--- a/render.js
+++ b/render.js
@@ -1,9 +1,18 @@
 function getHeader (post, mini) {
-  var src = h('a', {
+
+  var getRaw = h('button', {
     onclick: function () {
-      head.appendChild(h('pre', [h('code', [JSON.stringify(post)])]))
+      var raw = h('pre', [h('code', [JSON.stringify(post)])])
+      var removeRaw = h('button', {
+        onclick: function () {
+          raw.parentNode.removeChild(raw)
+          removeRaw.parentNode.replaceChild(getRaw, removeRaw)
+        }   
+      }, ['hide'])
+      getRaw.parentNode.replaceChild(removeRaw, getRaw)      
+      head.appendChild(raw)
     }
-  }, ['[raw]'])
+  }, ['src'])
 
   var head = h('span', [
     h('p', {classList: 'right'}, [
@@ -11,7 +20,7 @@ function getHeader (post, mini) {
         human(new Date(post.timestamp)),
       ]),
       ' ',
-      src
+      getRaw
     ]),
     h('p', [
       h('a', {href: '#' + post.author}, [