Commit 7cef8be38fc2c78136c3f41f4660b0f3fc977aa6
tentatively working mutable message workflow
Ev Bogue committed on 5/27/2018, 7:04:36 PMParent: 7d5a6c42f951bd0c0058b63df1d23c59abe68941
Files changed
| compose.js | changed |
| index.js | changed |
| render.js | changed |
| compose.js | ||
|---|---|---|
| @@ -36,34 +36,35 @@ | ||
| 36 | 36 | } |
| 37 | 37 | })) |
| 38 | 38 | } |
| 39 | 39 | |
| 40 | -module.exports = function (opts, buttons) { | |
| 40 | +module.exports = function (opts, fallback) { | |
| 41 | 41 | var files = [] |
| 42 | 42 | var filesById = {} |
| 43 | 43 | |
| 44 | - console.log(opts) | |
| 45 | - | |
| 46 | 44 | var composer = h('div.composer') |
| 47 | 45 | var container = h('div.container') |
| 48 | 46 | |
| 49 | - if (opts.messageText) | |
| 50 | - var textarea = h('textarea.compose', opts.messageText) | |
| 47 | + if (opts.type == 'post') | |
| 48 | + var textarea = h('textarea.compose', {placeholder: opts.placeholder || 'Write a message'}) | |
| 51 | 49 | else |
| 52 | - var textarea = h('textarea.compose', {placeholder: opts.placeholder || 'Write a message'}) | |
| 50 | + var textarea = h('textarea.compose', {placeholder: opts.placeholder || 'Write a message'}, fallback.messageText) | |
| 53 | 51 | |
| 54 | 52 | var cancelBtn = h('button.btn', 'Cancel', { |
| 55 | 53 | onclick: function () { |
| 56 | 54 | var cancel |
| 57 | - if (opts.updated) { | |
| 58 | - cancel = document.getElementById(opts.updated.substring(0,10)) | |
| 59 | - var oldMessage = h('div.message__body', tools.markdown(opts.messageText)) | |
| 55 | + console.log(opts) | |
| 56 | + if (opts.type == 'edit') { | |
| 57 | + cancel = document.getElementById('edit:' + opts.branch.substring(0,44)) | |
| 58 | + var oldMessage = h('div.message__body', tools.markdown(fallback.messageText)) | |
| 60 | 59 | cancel.parentNode.replaceChild(oldMessage, cancel) |
| 61 | - oldMessage.parentNode.appendChild(buttons) | |
| 60 | + oldMessage.parentNode.appendChild(fallback.buttons) | |
| 62 | 61 | } else if (opts.branch) { |
| 63 | - cancel = document.getElementById(opts.branch.substring(0,10)) | |
| 62 | + //cancel reply composer | |
| 63 | + cancel = document.getElementById('re:' + opts.branch.substring(0,44)) | |
| 64 | 64 | cancel.parentNode.removeChild(cancel) |
| 65 | 65 | } else { |
| 66 | + // cancel generic composer | |
| 66 | 67 | cancel = document.getElementById('composer') |
| 67 | 68 | cancel.parentNode.removeChild(cancel) |
| 68 | 69 | } |
| 69 | 70 | } |
| @@ -103,20 +104,21 @@ | ||
| 103 | 104 | if (msg.value.content) { |
| 104 | 105 | sbot.publish(msg.value.content, function (err, msg) { |
| 105 | 106 | if(err) throw err |
| 106 | 107 | console.log('Published!', msg) |
| 107 | - if (opts.type == 'update') { | |
| 108 | - var originalMessage = document.getElementById(opts.updated.substring(0,10)) | |
| 109 | - opts.messageText = msg.value.content.text | |
| 110 | - var newMessage = h('div.message__body', | |
| 108 | + if (opts.type == 'edit') { | |
| 109 | + var message = document.getElementById(opts.branch.substring(0,44)) | |
| 110 | + fallback.messageText = msg.value.content.text | |
| 111 | + var editBody = h('div.message__body', | |
| 111 | 112 | tools.timestamp(msg, {edited: true}), |
| 112 | 113 | h('div', tools.markdown(msg.value.content.text)) |
| 113 | 114 | ) |
| 114 | - originalMessage.parentNode.replaceChild(newMessage, originalMessage) | |
| 115 | - newMessage.parentNode.appendChild(buttons) | |
| 115 | + | |
| 116 | + message.replaceChild(editBody, message.childNodes[message.childNodes.length - 1]) | |
| 117 | + editBody.parentNode.appendChild(fallback.buttons) | |
| 116 | 118 | } else { |
| 117 | 119 | if (opts.branch) |
| 118 | - cancel = document.getElementById(opts.branch.substring(0,10)) | |
| 120 | + cancel = document.getElementById('re:' + opts.branch.substring(0,44)) | |
| 119 | 121 | else |
| 120 | 122 | cancel = document.getElementById('composer') |
| 121 | 123 | cancel.parentNode.removeChild(cancel) |
| 122 | 124 | } |
| index.js | ||
|---|---|---|
| @@ -21,9 +21,13 @@ | ||
| 21 | 21 | var currentScreen = document.getElementById('screen') |
| 22 | 22 | var opts = {} |
| 23 | 23 | opts.type = 'post' |
| 24 | 24 | var composer = h('div.content#composer', h('div.message', compose(opts))) |
| 25 | - currentScreen.firstChild.insertBefore(composer, currentScreen.firstChild.firstChild) | |
| 25 | + if (currentScreen.firstChild.firstChild) { | |
| 26 | + currentScreen.firstChild.insertBefore(composer, currentScreen.firstChild.firstChild) | |
| 27 | + } else { | |
| 28 | + currentScreen.firstChild.appendChild(composer) | |
| 29 | + } | |
| 26 | 30 | } |
| 27 | 31 | } |
| 28 | 32 | })), |
| 29 | 33 | h('li', h('a', {href: '#'}, 'Public')), |
| render.js | ||
|---|---|---|
| @@ -8,72 +8,73 @@ | ||
| 8 | 8 | |
| 9 | 9 | var config = require('./config')() |
| 10 | 10 | var id = require('./keys').id |
| 11 | 11 | |
| 12 | + | |
| 12 | 13 | module.exports = function (msg) { |
| 13 | - var edit = {} | |
| 14 | - var reply = {} | |
| 14 | + console.log(msg) | |
| 15 | + var message = h('div.message#' + msg.key.substring(0, 44)) | |
| 16 | + if (msg.value.content.type == 'post') { | |
| 17 | + var opts = {} | |
| 18 | + var fallback = {} | |
| 15 | 19 | |
| 16 | - var message = h('div.message') | |
| 20 | + opts.type = 'post' | |
| 21 | + opts.branch = msg.key | |
| 17 | 22 | |
| 18 | - if (msg.value.content.type == 'post') { | |
| 19 | - reply.type = 'post' | |
| 20 | - reply.branch = msg.key | |
| 21 | - | |
| 22 | 23 | if (msg.value.content.root) |
| 23 | - reply.root = msg.value.content.root | |
| 24 | + opts.root = msg.value.content.root | |
| 24 | 25 | else |
| 25 | - reply.root = msg.key | |
| 26 | - | |
| 27 | - if (msg.value.author == id) | |
| 28 | - edit.original = msg.key | |
| 29 | - edit.type = 'update' | |
| 30 | - edit.updated = msg.key | |
| 31 | - edit.messageText = msg.value.content.text | |
| 26 | + opts.root = msg.key | |
| 32 | 27 | |
| 33 | 28 | message.appendChild(tools.header(msg)) |
| 34 | 29 | |
| 35 | - if (msg.value.content.root) { | |
| 30 | + if (msg.value.content.root) | |
| 36 | 31 | message.appendChild(h('span', 're: ', tools.messageLink(msg.value.content.root))) |
| 37 | - } | |
| 38 | 32 | |
| 39 | - message.appendChild( | |
| 40 | - h('div.message__body', tools.markdown(msg.value.content.text)) | |
| 41 | - ) | |
| 33 | + message.appendChild(h('div.message__body', tools.markdown(msg.value.content.text))) | |
| 42 | 34 | |
| 35 | + | |
| 43 | 36 | pull( |
| 44 | - sbot.query({query: [{$filter: {value: {content: {type: 'update', updated: msg.key}}}}]}), | |
| 37 | + sbot.query({query: [{$filter: {value: {content: {type: 'edit', original: msg.key}}}}]}), | |
| 45 | 38 | pull.drain(function (update) { |
| 46 | 39 | var newMessage = h('div', tools.markdown(update.value.content.text)) |
| 47 | 40 | var latest = h('div.message__body', |
| 48 | - tools.timestamp(msg, {edited: true}), | |
| 41 | + tools.timestamp(update, {edited: true}), | |
| 49 | 42 | newMessage |
| 50 | 43 | ) |
| 51 | - var r = message.childNodes.length - 2 | |
| 52 | - message.replaceChild(latest, message.childNodes[r]) | |
| 53 | - edit.messageText = update.value.content.text | |
| 54 | - edit.original = msg.value.content.original | |
| 44 | + message.replaceChild(latest, message.childNodes[message.childNodes.length - 2]) | |
| 45 | + fallback.messageText = update.value.content.text | |
| 46 | + opts.updated = update.key | |
| 47 | + opts.original = msg.key | |
| 55 | 48 | }) |
| 56 | 49 | ) |
| 50 | + | |
| 57 | 51 | var buttons = h('div.buttons') |
| 58 | 52 | buttons.appendChild(h('button.btn', 'Reply', { |
| 59 | 53 | onclick: function () { |
| 60 | 54 | var r = message.childNodes.length - 1 |
| 61 | - buttons = message.childNodes[r] | |
| 62 | - //fallback = message.lastElementChild | |
| 63 | - //console.log(fallback) | |
| 64 | - var compose = h('div.message#' + reply.branch.substring(0, 10), composer(reply, buttons)) | |
| 65 | - message.parentNode.appendChild(compose) | |
| 66 | - //message.replaceChild(compose, message.lastElementChild) | |
| 55 | + | |
| 56 | + fallback.buttons = message.childNodes[r] | |
| 57 | + var compose = h('div.message#re:' + msg.key.substring(0, 44), composer(opts, fallback)) | |
| 58 | + message.parentNode.insertBefore(compose, message.nextSibling) | |
| 67 | 59 | } |
| 68 | 60 | })) |
| 61 | + | |
| 69 | 62 | if (msg.value.author == id) |
| 70 | 63 | buttons.appendChild(h('button.btn', 'Edit', { |
| 71 | 64 | onclick: function () { |
| 65 | + opts.type = 'edit' | |
| 66 | + if (!fallback.messageText) | |
| 67 | + fallback.messageText = msg.value.content.text | |
| 68 | + | |
| 69 | + if (!opts.updated) | |
| 70 | + opts.updated = msg.key | |
| 71 | + opts.original = msg.key | |
| 72 | + | |
| 72 | 73 | var r = message.childNodes.length - 1 |
| 73 | - buttons = message.childNodes[r] | |
| 74 | + fallback.buttons = message.childNodes[r] | |
| 74 | 75 | message.removeChild(message.childNodes[r]) |
| 75 | - var compose = h('div#' + edit.updated.substring(0, 10), composer(edit, buttons)) | |
| 76 | + var compose = h('div#edit:' + msg.key.substring(0, 44), composer(opts, fallback)) | |
| 76 | 77 | message.replaceChild(compose, message.lastElementChild) |
| 77 | 78 | } |
| 78 | 79 | })) |
| 79 | 80 | |
| @@ -105,7 +106,7 @@ | ||
| 105 | 106 | } else { |
| 106 | 107 | //message.appendChild(tools.header(msg)) |
| 107 | 108 | //message.appendChild(h('pre', tools.rawJSON(msg.value.content))) |
| 108 | 109 | //return message |
| 109 | - return | |
| 110 | + return h('div.invisibleMessage') | |
| 110 | 111 | } |
| 111 | 112 | } |
Built with git-ssb-web