preview posts before you publish!

3 files changed, 65 insertions, 37 deletions

diff --git a/app.js b/app.js
index e1777df..b1c3d91 100644
--- a/app.js
+++ b/app.js
@@ -13,6 +13,8 @@ function composer (keys, reply, gotName) {
     var textarea = h('textarea', {placeholder: 'Write a new bog post...'})
   }
 
+
+
   var publisher = h('div', [
     textarea,
     h('button', {
@@ -25,22 +27,45 @@ function composer (keys, reply, gotName) {
           if (reply) {
             content.reply = reply.key
           }
-          publish(content, keys).then(post => {
+
+          publish(content, keys, {preview: true}).then(post => {
             open(post).then(msg => {
-              textarea.value = ''
-              if (reply) {
-                messageDiv.removeChild(messageDiv.firstChild)
-              }
-              if (messageDiv.firstChild) {
-                messageDiv.insertBefore(render(msg, keys), messageDiv.childNodes[1])
-              } else {
-                messageDiv.appendChild(render(msg, keys))
-              }
+              var preview = render(msg, keys, {preview: true})
+              var cache = messageDiv.firstChild
+              messageDiv.appendChild(preview)
+              messageDiv.removeChild(messageDiv.firstChild)
+              preview.firstChild.appendChild(h('button', {
+                onclick: function () {
+                  messageDiv.removeChild(messageDiv.firstChild)
+                  messageDiv.appendChild(cache)
+                }
+              }, ['Cancel']))
+              preview.firstChild.appendChild(h('button', {
+                onclick: function () {
+                  publish(content, keys).then(post => {
+                    open(post).then(msg => {
+                      textarea.value = ''
+                      if (reply) {
+                        messageDiv.removeChild(messageDiv.firstChild)
+                      }
+                      if (messageDiv.firstChild) {
+                        messageDiv.removeChild(messageDiv.firstChild)
+                        messageDiv = h('div')
+                        messageDiv.appendChild(cache)
+                        scroller.insertBefore(messageDiv, scroller.childNodes[2])
+                        scroller.insertBefore(render(msg, keys), scroller.childNodes[3])
+                      } else {
+                        messageDiv.appendChild(render(msg, keys))
+                      }
+                    })
+                  }) 
+                }
+              }, ['Publish']))
             })
-          }) 
+          })
         }
       }
-    }, ['Publish'])
+    }, ['Preview'])
   ])
 
   message.appendChild(publisher)
diff --git a/bog.js b/bog.js
index 1a45fef..98160c7 100644
--- a/bog.js
+++ b/bog.js
@@ -125,7 +125,7 @@ async function bog (feed) {
 // bog.publish -- publishes a new bog post and updates the feeds
 // EX: publish({type: 'post', timestamp: Date.now(), text: 'Hello World'}).then(msg => { console.log(msg)})
 
-async function publish (post, keys) {
+async function publish (post, keys, preview) {
   post.author = keys.publicKey
 
   post.timestamp = Date.now() 
@@ -146,24 +146,25 @@ async function publish (post, keys) {
 
     var openedMsg = await open(message)
 
-    localforage.getItem('log').then(log => {
-      if (log) {
-        log.unshift(openedMsg)
-        localforage.setItem('log', log)
-      } else {
-        var feed = [openedMsg]
-        localforage.setItem('log', feed)
-      }
-    })
+    if (!preview) {
+      localforage.getItem('log').then(log => {
+        if (log) {
+          log.unshift(openedMsg)
+          localforage.setItem('log', log)
+        } else {
+          var feed = [openedMsg]
+          localforage.setItem('log', feed)
+        }
+      })
 
-    console.log(keys.publicKey)
+      var subs = [keys.publicKey]
 
-    var subs = [keys.publicKey]
+      feed.unshift(message)
 
-    feed.unshift(message)
-    localforage.setItem(keys.publicKey, feed).then(function () {
-      sync(subs, keys)    
-    })
+      localforage.setItem(keys.publicKey, feed).then(function () {
+        sync(subs, keys)    
+      })
+    }
     return message
 
   } else {
diff --git a/render.js b/render.js
index 409852f..3305184 100644
--- a/render.js
+++ b/render.js
@@ -23,7 +23,7 @@ function getHeader (post, mini) {
   return head
 }
 
-function render (msg, keys) {
+function render (msg, keys, preview) {
   var messageDiv = h('div', {id: msg.key})
   var message = h('div', {classList: 'message'})
 
@@ -64,15 +64,17 @@ function render (msg, keys) {
     }
     var gotName = getName(msg.author)
     message.appendChild(h('div', {innerHTML: marked(msg.text)}))
-    message.appendChild(h('button', {
-      onclick: function () {
-        if (messageDiv.firstChild) {
-          messageDiv.insertBefore(h('div', {classList: 'submessage'}, [composer(keys, msg, gotName)]), messageDiv.childNodes[1])
-        } else {
-          messageDiv.appendChild(h('div', {classList: 'submessage'}, [composer(keys, msg, gotName)])) 
+    if (!preview) {
+      message.appendChild(h('button', {
+        onclick: function () {
+          if (messageDiv.firstChild) {
+            messageDiv.insertBefore(h('div', {classList: 'submessage'}, [composer(keys, msg, gotName)]), messageDiv.childNodes[1])
+          } else {
+            messageDiv.appendChild(h('div', {classList: 'submessage'}, [composer(keys, msg, gotName)])) 
+          }
         }
-      }
-    }, ['Reply']))
+      }, ['Reply']))
+    }
   } else if (msg.type == 'name') {
     message.appendChild(getHeader(msg))