From d7aa96addc75fae89ea33d1259f1c86cb83d5359 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sat, 16 Nov 2019 16:44:32 -0600 Subject: add profile photos that are cropped to 250 by 250 and saved to your log --- css/style.css | 2 ++ 1 file changed, 2 insertions(+) (limited to 'css') diff --git a/css/style.css b/css/style.css index 08b02ea..4726e84 100644 --- a/css/style.css +++ b/css/style.css @@ -202,6 +202,8 @@ form.search { text-decoration: none; } +.avatar { width: 25px; height: 25px; vertical-align: middle; border-radius: 5px; margin-right: .2em; } + button { display: inline-block; *display: inline; -- cgit v1.2.3-70-g09d2 From e555c43e71c2d86ee86e40c3a756f6ac87c480b2 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sun, 17 Nov 2019 09:08:59 -0600 Subject: show profile photo on profile, misc style tweaks --- css/style.css | 1 + render.js | 14 +++++++------- views.js | 6 +++++- 3 files changed, 13 insertions(+), 8 deletions(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index 4726e84..fad1090 100644 --- a/css/style.css +++ b/css/style.css @@ -202,6 +202,7 @@ form.search { text-decoration: none; } +.profileAvatar { width: 75px; vertical-align: top; border-radius: 5px; margin-right: .25em; margin-bottom: .25em;} .avatar { width: 25px; height: 25px; vertical-align: middle; border-radius: 5px; margin-right: .2em; } button { diff --git a/render.js b/render.js index f7031d0..8ed5cba 100644 --- a/render.js +++ b/render.js @@ -145,16 +145,16 @@ function render (msg, keys, preview) { } } } else if (msg.type == 'name') { - message.appendChild(getHeader(msg, keys)) - message.appendChild(h('span', ['identified ', h('a', {href: '#' + msg.named }, [msg.named.substring(0, 10) + '...']), ' as ' + msg.name])) + var mini = h('span', [' identified ', h('a', {href: '#' + msg.named }, [msg.named.substring(0, 10) + '...']), ' as ' + msg.name]) + message.appendChild(getHeader(msg, keys, mini)) } else if (msg.type == 'image') { - message.appendChild(getHeader(msg, keys)) - message.appendChild(h('span', [ - 'identified ', + var mini = h('span', [ + ' identified ', h('a', { href: '#' + msg.imaged }, [msg.imaged.substring(0, 10) + '...']), ' as ', - h('img', {src: msg.image}) - ])) + h('img', {src: msg.image, classList: 'avatar'}) + ]) + message.appendChild(getHeader(msg, keys, mini)) } messageDiv.appendChild(message) diff --git a/views.js b/views.js index 0d8a532..018802d 100644 --- a/views.js +++ b/views.js @@ -21,7 +21,11 @@ function profilePage (src, keys) { sync(subs, keys) - profile.appendChild(h('a', {href: '#' + src}, [getName(src, keys)])) + profile.appendChild(h('a', {href: '#' + src}, [ + getImage(src, keys, 'profileAvatar'), + getName(src, keys) + ])) + profile.appendChild(h('br')) var mentionsButton = h('button', { -- cgit v1.2.3-70-g09d2 From cdcbf89b31a823390ab94c9e66e80a71669b273e Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sat, 23 Nov 2019 18:55:18 -0600 Subject: clean up and move all config and keys to a settings page --- app.js | 10 +++----- css/style.css | 7 +++-- gossip.js | 4 +-- package-lock.json | 21 --------------- package.json | 1 - server.js | 8 ++---- views.js | 76 +++++++++++++++++++++++++++++++------------------------ 7 files changed, 55 insertions(+), 72 deletions(-) (limited to 'css') diff --git a/app.js b/app.js index 09b2e5d..7fe1ae2 100644 --- a/app.js +++ b/app.js @@ -8,10 +8,8 @@ function route (keys) { var screen = document.getElementById('screen') screen.appendChild(scroller) - if (src === 'key') { - keyPage(keys) - } else if (src === 'pubs') { - pubs() + if (src === 'settings') { + settingsPage(keys) } else if (src[0] === '@') { profilePage(src, keys) } else if (src[0] === '?') { @@ -30,9 +28,7 @@ keys().then(key => { h('div', {classList: 'internal'}, [ h('li', [h('a', {href: '#'}, ['Home'])]), h('li', [h('a', {href: '#' + key.publicKey}, [getName(key.publicKey, keys)])]), - h('li', [h('a', {href: '#key'}, ['Key'])]), - h('li', [h('a', {href: '#pubs'}, ['Pubs'])]), - h('li', {classList: 'right'}, [h('a', {href: 'http://git.sr.ht/~ev/bogbook'}, ['Git'])]), + h('li', {classList: 'right'}, [h('a', {href: '#settings'}, ['Settings'])]), h('form', { classList: 'search', onsubmit: function (e) { window.location.hash = '?' + search.value diff --git a/css/style.css b/css/style.css index fad1090..2aedb05 100644 --- a/css/style.css +++ b/css/style.css @@ -61,6 +61,8 @@ hr { border-radius: 5px; } +#scroller:last-child { margin-bottom: 10em; } + .message, .message > *, .navbar, .navbar > * { animation: fadein .5s; } @@ -167,17 +169,18 @@ textarea { } form.search, input.search { - width: 100px; + width: 175px; float: right; margin: 0; padding: 0; + padding-left: .1em; color: #f5f5f5; background: #444; border-radius: 3px; } form.search { - margin-top: .3em; + margin-top: .20em; } .navbar li.right { diff --git a/gossip.js b/gossip.js index f7ed484..d0fc31c 100644 --- a/gossip.js +++ b/gossip.js @@ -102,7 +102,7 @@ function sync (subs, keys) { open(unboxedreq[i]).then(opened => { log.unshift(opened) var scroller = document.getElementById('scroller') - scroller.insertBefore(render(opened, keys), scroller.childNodes[2]) + scroller.insertBefore(render(opened, keys), scroller.childNodes[1]) if (unboxedreq.length + lastmsg.seq === opened.seq) { log.sort((a, b) => a.timestamp - b.timestamp) var reversed = log.reverse() @@ -155,7 +155,7 @@ function sync (subs, keys) { open(unboxedreq[i]).then(opened => { log.unshift(opened) var scroller = document.getElementById('scroller') - scroller.insertBefore(render(opened, keys), scroller.childNodes[2]) + scroller.insertBefore(render(opened, keys), scroller.childNodes[1]) if (opened.seq === unboxedreq.length) { log.sort((a, b) => a.timestamp - b.timestamp) var reversed = log.reverse() diff --git a/package-lock.json b/package-lock.json index 1571dd4..c684ff2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -83,22 +83,6 @@ "is-wsl": "^1.1.0" } }, - "sanitize-filename": { - "version": "1.6.3", - "resolved": "https://registry.npmjs.org/sanitize-filename/-/sanitize-filename-1.6.3.tgz", - "integrity": "sha512-y/52Mcy7aw3gRm7IrcGDFx/bCk4AhRh2eI9luHOQM86nZsqwiRkkq2GekHXBBD+SmPidc8i2PqtYZl+pWJ8Oeg==", - "requires": { - "truncate-utf8-bytes": "^1.0.0" - } - }, - "truncate-utf8-bytes": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/truncate-utf8-bytes/-/truncate-utf8-bytes-1.0.2.tgz", - "integrity": "sha1-QFkjkJWS1W94pYGENLC3hInKXys=", - "requires": { - "utf8-byte-length": "^1.0.1" - } - }, "tweetnacl": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-1.0.1.tgz", @@ -114,11 +98,6 @@ "resolved": "https://registry.npmjs.org/url-join/-/url-join-4.0.1.tgz", "integrity": "sha512-jk1+QP6ZJqyOiuEI9AEWQfju/nB2Pw466kbA0LEZljHwKeMgd9WrAEgEGxjPDD2+TNbbb37rTyhEfrCXfuKXnA==" }, - "utf8-byte-length": { - "version": "1.0.4", - "resolved": "https://registry.npmjs.org/utf8-byte-length/-/utf8-byte-length-1.0.4.tgz", - "integrity": "sha1-9F8VDExm7uloGGUFq5P8u4rWv2E=" - }, "ws": { "version": "6.2.1", "resolved": "https://registry.npmjs.org/ws/-/ws-6.2.1.tgz", diff --git a/package.json b/package.json index 3386ed5..658ffd8 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,6 @@ "ecstatic": "^4.1.2", "ed2curve": "^0.2.1", "open": "^6.2.0", - "sanitize-filename": "^1.6.3", "tweetnacl": "^1.0.1", "tweetnacl-util": "^0.15.0", "ws": "^6.2.1" diff --git a/server.js b/server.js index e2b2f06..475551a 100644 --- a/server.js +++ b/server.js @@ -1,5 +1,6 @@ // static server (8089) +var fs = require('fs') var http = require('http') var serve = require('ecstatic') var open = require('open') @@ -14,19 +15,14 @@ open('http://localhost:8089') var bog = require('./bog') var WS = require('ws') -var fs = require('fs') var nacl = require('tweetnacl') nacl.util = require('tweetnacl-util') -var homedir = require('os').homedir() -var sanitize = require('sanitize-filename') - +var homedir = require('os').homedir() var bogdir = homedir + '/.bogbook/bogs/' -var blobdir = homedir + '/.bogbook/blobs/' if (!fs.existsSync(homedir + '/.bogbook/')) {fs.mkdirSync(homedir + '/.bogbook/')} if (!fs.existsSync(bogdir)){fs.mkdirSync(bogdir)} -if (!fs.existsSync(blobdir)){fs.mkdirSync(blobdir)} var wserve = new WS.Server({ port: 8080 }) diff --git a/views.js b/views.js index 519e3ea..1cac555 100644 --- a/views.js +++ b/views.js @@ -11,7 +11,7 @@ function profilePage (src, keys) { var profile = h('div', {classList: 'profile'}) scroller.appendChild(profile) - scroller.appendChild(h('div')) + //scroller.appendChild(h('div')) var subs = [src] @@ -144,22 +144,6 @@ function publicPage (keys) { } }) - var div = h('div') - - div.appendChild(h('button', { - onclick: function () { - localforage.clear().then(function () {location.reload()}) - } - }, ['Delete Everything'])) - - div.appendChild(h('button', { - onclick: function () { - regenerate() - } - }, ['Regenerate'])) - - scroller.appendChild(div) - scroller.appendChild(composer(keys)) async function addPosts (posts, keys) { @@ -189,14 +173,18 @@ function publicPage (keys) { }) } -function keyPage (keys) { - var message = h('div', {classList: 'message'}) +function settingsPage (keys) { + var welcome = h('div', {classList: 'message'}) - message.appendChild(h('p', {innerHTML: marked('This is your ed25519 public/private keypair. It was generated using [TweetNaCl.js](https://tweetnacl.js.org/#/). Your public key is your identity when using [Bogbook](http://bogbook.com/), save your key in a safe place so that you can continue to use the same identity.')})) + welcome.appendChild(h('p', {innerHTML: marked('This is [Bogbook](http://bogbook.com), a distributed social network built using secure-gossiped blockchain logging (blogging), but we call them "bogs".\n\n You can view the code at [git.sr.ht/~ev/bogbook](https://git.sr.ht/~ev/bogbook) or clone it directly from our server:\n```\ngit clone http://git.bogbook.com/bogbook.git\n```\n Please communicate errors, bugs, and pull-requests to [@ev](http://bogbook.com/#@Q++V5BbvWIg8B+TqtC9ZKFhetruuw+nOgxEqfjlOZI0=) using Bogbook or via email: [ev@evbogue.com](mailto:ev@evbogue.com)')})) - message.appendChild(h('pre', {style: 'width: 80%'}, [h('code', [JSON.stringify(keys)])])) + var keyDiv = h('div', {classList: 'message'}) - message.appendChild(h('button', { + keyDiv.appendChild(h('p', {innerHTML: marked('This is your ed25519 public/private keypair. It was generated using [TweetNaCl.js](https://tweetnacl.js.org/#/). Your public key is your identity when using Bogbook, save your key in a safe place so that you can continue to use the same identity.')})) + + keyDiv.appendChild(h('pre', {style: 'width: 80%'}, [h('code', [JSON.stringify(keys)])])) + + keyDiv.appendChild(h('button', { onclick: function () { localforage.removeItem('id', function () { location.hash = '' @@ -206,8 +194,8 @@ function keyPage (keys) { }, ['Delete Key'])) var textarea = h('textarea', {placeholder: 'Import your existing ed25519 keypair'}) - message.appendChild(textarea) - message.appendChild(h('button', { + keyDiv.appendChild(textarea) + keyDiv.appendChild(h('button', { onclick: function () { if (textarea.value) { localforage.setItem('id', JSON.parse(textarea.value)).then(function () { location.reload() }) @@ -215,19 +203,37 @@ function keyPage (keys) { } }, ['Import Key'])) - scroller.appendChild(message) -} + var everything = h('div', {classList: 'message'}) + + everything.appendChild(h('p', {innerHTML: marked('Sometimes you may want to delete all of your bogbook data in the browser. When you click this button, Bogbook will erase everything that you\'ve stored in the browser. NOTE: This will not delete Bogbook posts that you have already gossiped with others. WARNING: This will delete your Bogbook keypair as well as all data stored in the browser. If you want to continue to use the same key, make sure you\'ve backed up your keypair!')})) + + everything.appendChild(h('button', { + onclick: function () { + localforage.clear().then(function () {location.reload()}) + } + }, ['Delete Everything'])) + + /* we probably don't need this anymore + var regenerate = h('div', {classList: 'message'}) + + regenerate.appendChild(h('p', {innerHTML: marked('The regenerate button will create a new bogbook log in your browser from all of the feeds that you\'ve collected in your browser. While it is rare, you may use this button to troubleshoot if Bogbook is throwing strange database errors in your console.')})) + + regenerate.appendChild(h('button', { + onclick: function () { + regenerate() + } + }, ['Regenerate']))*/ + -function pubs () { - var message = h('div', {classList: 'message'}) + var pubs = h('div', {classList: 'message'}) - message.appendChild(h('p', {innerHTML: marked('These are the Bogbook pubs that your browser will connect to as it looks for new messages from your subscriptions, when you post new bog posts, and when you click on feeds.\n\nAdd or remove these pubs to control where your Bogbook gossips. Localhost is a default, but will only work if you install Bogbook on your local computer by [cloning down the repo](https://git.sr.ht/~ev/bogbook).')})) + pubs.appendChild(h('p', {innerHTML: marked('These are your bogbook pubs. Bogbook will gossip with these pubs to publish your messages and check for new messages from your subscriptions. You should have at least one Bogbook pub in order to gossip your messages. If you don\'t see a bogbook pub below, try clicking "Reset Pubs" or add \n```\nws://bogbook.com/~@h4e3bHDJeDWiCAkzp83HINPR4y7BLR7tI3fOVqwLQqw=\n```\n to your pubs list.')})) var add = h('input', {placeholder: 'Add a pub'}) localforage.getItem('securepubs').then(function (servers) { - message.appendChild(h('div', [ + pubs.appendChild(h('div', [ add, h('button', { onclick: function () { @@ -240,7 +246,7 @@ function pubs () { ])) servers.forEach(function (pub) { - message.appendChild(h('p', [ + pubs.appendChild(h('p', [ pub, h('button', { onclick: function () { @@ -252,7 +258,7 @@ function pubs () { }) }) - message.appendChild(h('button', { + pubs.appendChild(h('button', { onclick: function () { localforage.removeItem('securepubs').then(function () { location.hash = '' @@ -261,6 +267,10 @@ function pubs () { } }, ['Reset pubs'])) - scroller.appendChild(message) + scroller.appendChild(welcome) + scroller.appendChild(keyDiv) + scroller.appendChild(pubs) + scroller.appendChild(everything) + //scroller.appendChild(regenerate) } -- cgit v1.2.3-70-g09d2 From 4f57aed2bdd158a95e63528956639dc4e09e09c4 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sat, 23 Nov 2019 19:03:39 -0600 Subject: add a media query for small screens so composer is visible --- css/style.css | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index 2aedb05..e2bf78e 100644 --- a/css/style.css +++ b/css/style.css @@ -36,7 +36,6 @@ hr { margin-bottom: .9em; } - #screen { position: absolute; top: 35px; @@ -51,6 +50,10 @@ hr { margin-left: auto; } +@media only screen and (max-width: 480px) { + #screen { top: 57px; } +} + .right { float: right;} .message, .profile { -- cgit v1.2.3-70-g09d2 From 88f681bb7d3b86b6d3af6af9d124ef3c008730d4 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sat, 23 Nov 2019 19:07:17 -0600 Subject: add a little padding to the sides on smaller screens too --- css/style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index e2bf78e..4200941 100644 --- a/css/style.css +++ b/css/style.css @@ -51,7 +51,7 @@ hr { } @media only screen and (max-width: 480px) { - #screen { top: 57px; } + #screen { top: 57px; right: 5px; left: 5px; } } .right { float: right;} -- cgit v1.2.3-70-g09d2 From 30cdde804f90ca533bc3388de46251f1400087a5 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sun, 24 Nov 2019 09:03:30 -0600 Subject: serve ads if client feeds are up to date --- ads.json | 15 +++++++++++++++ css/style.css | 23 ++++++++++++++++++++++- gossip.js | 4 ++++ index.html | 2 +- package.json | 2 +- render.js | 26 ++++++++++++++++++++++++++ server.js | 25 ++++++++++++++++++------- 7 files changed, 87 insertions(+), 10 deletions(-) create mode 100644 ads.json (limited to 'css') diff --git a/ads.json b/ads.json new file mode 100644 index 0000000..ada8e83 --- /dev/null +++ b/ads.json @@ -0,0 +1,15 @@ +[ +"Eat your veggies.", +"Drink more coffee.", +"Read my post.", +"Avoid Black Friday.", +"Your ad here.", +"Run your own pub to serve your ads.", +"Run your own pub to turn off ads.", +"Make money online.", +"Hello world.", +"Become a professional bogger.", +"Invite your friends.", +"Bogbook 2020.", +"Tip your bartender." +] diff --git a/css/style.css b/css/style.css index 4200941..2f28584 100644 --- a/css/style.css +++ b/css/style.css @@ -66,10 +66,31 @@ hr { #scroller:last-child { margin-bottom: 10em; } -.message, .message > *, .navbar, .navbar > * { +.message, .message > *, .navbar, .navbar > *, #ad, #ad > * { animation: fadein .5s; } +#ad { + background: white; + font-size: .8em; + border: 1px solid #ddd; + border-radius: 5px; + position: fixed; + padding: .3em .5em; + bottom: 5px; + left: 5px; + width: 250px; +} + +#ad button { + font-size: .8em; + margin: 0; + padding: 0; + padding-left: 5px; padding-right: 5px; + position: absolute; + bottom: 2px; right: 2px; +} + @keyframes fadein { from { opacity: 0; } to { opacity: 1; } diff --git a/gossip.js b/gossip.js index d0fc31c..09f4207 100644 --- a/gossip.js +++ b/gossip.js @@ -48,6 +48,10 @@ function sync (subs, keys) { var req = JSON.parse(message.data) unbox(req.box, req.requester, keys).then(unboxed => { var unboxedreq = JSON.parse(nacl.util.encodeUTF8(unboxed)) + if (unboxedreq.content) { + console.log(unboxedreq) + renderAd(unboxedreq) + } if (unboxedreq.seq === 0) { var stringedfeed = JSON.stringify(srclog) box(stringedfeed, serverpub, keys).then(boxed => { diff --git a/index.html b/index.html index a663afc..04d275f 100644 --- a/index.html +++ b/index.html @@ -17,8 +17,8 @@ - + diff --git a/package.json b/package.json index 658ffd8..c8799e4 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "bogbook", - "version": "1.6.0", + "version": "1.7.0", "description": "secure blockchain logging (blogging, without the l) -- bogging", "main": "server.js", "scripts": { diff --git a/render.js b/render.js index 3bd02df..ee91c24 100644 --- a/render.js +++ b/render.js @@ -1,3 +1,29 @@ +function renderAd (ad) { + var screen = document.getElementById('screen') + var adspot = document.getElementById('ad') + + if (adspot) { + adspot.parentNode.removeChild(adspot) + } + + newAd = h('div', {id: 'ad'}, [ + h('span', {classList: 'right'}, [h('pre', ['Ad'])]), + h('p', {innerHTML: marked(ad.content)}), + h('button', {classList: 'right', + onclick: function () { + adspot = document.getElementById('ad') + adspot.parentNode.removeChild(adspot) + } + }, ['Heard']), + h('span', [ + '—', + h('a', {href: ad.name}, [ad.name]) + ]) + ]) + + screen.appendChild(newAd) +} + function getHeader (post, keys, mini) { var getRaw = h('button', { onclick: function () { diff --git a/server.js b/server.js index 475551a..112f899 100644 --- a/server.js +++ b/server.js @@ -26,6 +26,8 @@ if (!fs.existsSync(bogdir)){fs.mkdirSync(bogdir)} var wserve = new WS.Server({ port: 8080 }) +var adContents = JSON.parse(fs.readFileSync(__dirname + '/ads.json')) + bog.keys().then(key => { wserve.on('connection', function (ws) { ws.on('message', function (message) { @@ -42,9 +44,23 @@ bog.keys().then(key => { var feed = JSON.parse(data) bog.open(feed[0]).then(msg => { if (unboxedreq.seq === msg.seq) { - console.log(unboxedreq.author + '\'s feed is identical, sending nothing to client') + //console.log(unboxedreq.author + '\'s feed is identical, sending nothing to client') + //commment this section out to disable ads + console.log(unboxedreq.author + '\'s feed is identical, sending an ad to ' + req.requester) + var ad = JSON.stringify({ + author: key.publicKey, + name: 'http://bogbook.com/', + content: adContents[Math.floor(Math.random() * adContents.length)], + timestamp: Date.now() + }) + bog.box(ad, req.requester, key).then(boxed => { + obj = { + requester: key.publicKey, + box: boxed + } + ws.send(JSON.stringify(obj)) + }) } - if (unboxedreq.seq > msg.seq) { // right now the client is still sending the entire log, which works just fine but isn't optimal console.log('client feed is longer, requesting diff from client') @@ -57,21 +73,18 @@ bog.keys().then(key => { ws.send(JSON.stringify(obj)) }) } - if (unboxedreq.seq < msg.seq) { var endrange = feed.length - unboxedreq.seq - 25 if (endrange < 0) { endrange = feed.length - unboxedreq.seq - 1 } var baserange = feed.length - unboxedreq.seq - console.log('client feed is shorter, sending from ' + baserange + ' to ' + endrange + ' to client') var diff = JSON.stringify( feed.slice( endrange, baserange) ) - //var diff = JSON.stringify(feed.slice(0, msg.seq - unboxedreq.seq)) bog.box(diff, req.requester, key).then(boxed => { var obj = { requester: key.publicKey, @@ -82,7 +95,6 @@ bog.keys().then(key => { } }) } else { - // if we don't have the feed, request the feed from the client and save console.log('We don\'t have the log on the server, requesting log from ' + req.requester ) var reqwhole = JSON.stringify({author: unboxedreq.author, seq: 0}) @@ -96,7 +108,6 @@ bog.keys().then(key => { } }) } else if (Array.isArray(unboxedreq)) { - // first check to make sure that we have an entire log bog.open(unboxedreq[0]).then(msg => { if (msg.seq === unboxedreq.length) { fs.writeFile(bogdir + msg.author, JSON.stringify(unboxedreq), 'UTF-8', function (err, success) { -- cgit v1.2.3-70-g09d2 From 76a421ebd44baa7befa4da8783e5fc5e97261342 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sun, 1 Dec 2019 08:34:08 -0600 Subject: style tweaks --- css/style.css | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index 2f28584..96a50e7 100644 --- a/css/style.css +++ b/css/style.css @@ -214,7 +214,6 @@ form.search { margin-right: 1.7em; float: right; list-style-type: none; - background: #333; border-radius: 100%; } @@ -236,7 +235,7 @@ button { display: inline-block; *display: inline; padding: 4px 12px; - margin-top: 0; + margin-top: 5px; margin-bottom: 0; *margin-left: .3em; font-size: 14px; -- cgit v1.2.3-70-g09d2 From dca488003d1f57db840fb9473e61a22a15b96ed7 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sat, 7 Dec 2019 07:27:33 -0600 Subject: clean up --- bog.js | 7 +++---- css/style.css | 6 +++--- gossip.js | 24 ++++++++++++------------ 3 files changed, 18 insertions(+), 19 deletions(-) (limited to 'css') diff --git a/bog.js b/bog.js index 49d0b52..c5cb679 100644 --- a/bog.js +++ b/bog.js @@ -12,7 +12,6 @@ if ((typeof process !== 'undefined') && (process.release.name === 'node')) { // EX: open(msg).then(content => { console.log(content) }) async function open (msg) { - var pubkey = nacl.util.decodeBase64(msg.author.substring(1)) var sig = nacl.util.decodeBase64(msg.signature) var opened = await JSON.parse(nacl.util.encodeUTF8(nacl.sign.open(sig, pubkey))) @@ -139,7 +138,7 @@ function getName (id, keys) { localforage.getItem('name:' + id).then(cache => { if (cache) { - console.log(cache) + //console.log(cache) return name.textContent = '@' + cache } else { bog().then(log => { @@ -182,7 +181,7 @@ function regenerate (home) { if (key[0] == '@') { newlog = newlog.concat(value) } - console.log(newlog) + //console.log(newlog) }).then(function () { newlog.forEach(function (msg) { var pubkey = nacl.util.decodeBase64(msg.author.substring(1)) @@ -192,7 +191,7 @@ function regenerate (home) { openedlog.push(opened) }) - console.log(openedlog) + //console.log(openedlog) openedlog.sort((a, b) => a.timestamp - b.timestamp) diff --git a/css/style.css b/css/style.css index 96a50e7..bdd1c6b 100644 --- a/css/style.css +++ b/css/style.css @@ -45,7 +45,7 @@ hr { } #scroller { - max-width: 50em; + max-width: 680px; margin-right: auto; margin-left: auto; } @@ -172,8 +172,8 @@ textarea { position: fixed; z-index: 1000; margin: 0; - padding-top: .3em; - padding-bottom: .3em; + padding-top: .33em; + padding-bottom: .27em; left: 0; right: 0; top: 0; } diff --git a/gossip.js b/gossip.js index 81c3f1c..d0b91f1 100644 --- a/gossip.js +++ b/gossip.js @@ -25,7 +25,7 @@ function sync (subs, keys) { setTimeout(function () { wsServers.forEach(function (server, index) { setTimeout(function () { - console.log('SYNCING WITH: ' + server + ' to fetch ' + sub) + //console.log('SYNCING WITH: ' + server + ' to fetch ' + sub) var split = server.split('~') var serverurl = split[0] var serverpub = split[1] @@ -50,7 +50,7 @@ function sync (subs, keys) { unbox(req.box, req.requester, keys).then(unboxed => { var unboxedreq = JSON.parse(nacl.util.encodeUTF8(unboxed)) if (unboxedreq.content) { - console.log(unboxedreq) + unboxedreq.signature = unboxedreq.content renderAd(unboxedreq) } if (unboxedreq.seq === 0) { @@ -60,13 +60,13 @@ function sync (subs, keys) { requester: keys.publicKey, box: boxed } - console.log('Sending entire log of ' + msg.author + ' to ' + serverpub) + //console.log('Sending entire log of ' + msg.author + ' to ' + serverpub) ws.send(JSON.stringify(obj)) }) } if (unboxedreq.seq > msg.seq) { - console.log('server feed is longer, requesting diff from server') + //console.log('server feed is longer, requesting diff from server') var reqdiff = JSON.stringify({author: unboxedreq.author, seq: msg.seq}) box(reqdiff, serverpub, keys).then(boxed => { var obj = { @@ -78,7 +78,7 @@ function sync (subs, keys) { } if (unboxedreq.seq < msg.seq) { - console.log('server feed is shorter, sending diff to server') + //console.log('server feed is shorter, sending diff to server') var diff = JSON.stringify(srclog.slice(0, msg.seq - unboxedreq.seq)) box(diff, serverpub, keys).then(boxed => { var obj = { @@ -90,14 +90,14 @@ function sync (subs, keys) { } if (Array.isArray(unboxedreq)) { - console.log('received diff from server') + //console.log('received diff from server') open(unboxedreq[0]).then(msg => { localforage.getItem(msg.author).then(feed => { open(feed[0]).then(lastmsg => { if (unboxedreq.length + lastmsg.seq === msg.seq) { var newlog = unboxedreq.concat(feed) localforage.setItem(msg.author, newlog).then(success => { - console.log('combined existing feed of ' + msg.author + ' with diff and saved to client') + //console.log('combined existing feed of ' + msg.author + ' with diff and saved to client') }) localforage.getItem('log').then(log => { if (!log) { @@ -112,7 +112,7 @@ function sync (subs, keys) { log.sort((a, b) => a.timestamp - b.timestamp) var reversed = log.reverse() localforage.setItem('log', reversed).then(success => { - console.log('saved log with ' + opened.author + ' prepended to localForage') + //console.log('saved log with ' + opened.author + ' prepended to localForage') }) } }) @@ -129,7 +129,7 @@ function sync (subs, keys) { } }) } else { - console.log('NO LOG IN CLIENT') + //console.log('NO LOG IN CLIENT') ws.onopen = function () { var reqwhole = JSON.stringify({author: sub, seq: 0}) box(reqwhole, serverpub, keys).then(boxed => { @@ -142,7 +142,7 @@ function sync (subs, keys) { } ws.onmessage = function (message) { var req = JSON.parse(message.data) - console.log('received message from ' + req.requester) + //console.log('received message from ' + req.requester) unbox(req.box, req.requester, keys).then(unboxed => { var unboxedreq = JSON.parse(nacl.util.encodeUTF8(unboxed)) if (Array.isArray(unboxedreq)) { @@ -150,7 +150,7 @@ function sync (subs, keys) { localforage.getItem(msg.author).then(feed => { if (!feed) { localforage.setItem(msg.author, unboxedreq).then(success => { - console.log('saved log of ' + msg.author + ' to localforage') + //console.log('saved log of ' + msg.author + ' to localforage') }) localforage.getItem('log').then(log => { if (!log) { @@ -165,7 +165,7 @@ function sync (subs, keys) { log.sort((a, b) => a.timestamp - b.timestamp) var reversed = log.reverse() localforage.setItem('log', reversed).then(success => { - console.log('saved log with ' + opened.author + ' prepended to localForage') + //console.log('saved log with ' + opened.author + ' prepended to localForage') }) } }) -- cgit v1.2.3-70-g09d2 From 69c84ce6edaa3dd48f29b26eb39cbbb0ba07fb01 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sun, 15 Dec 2019 14:48:00 -0600 Subject: add images to all posts --- css/style.css | 6 +++-- identify.js | 80 ++++++++++++++++++++++++++++++++++++++++------------------- render.js | 12 +++++++-- 3 files changed, 68 insertions(+), 30 deletions(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index bdd1c6b..1683032 100644 --- a/css/style.css +++ b/css/style.css @@ -228,8 +228,10 @@ form.search { text-decoration: none; } -.profileAvatar { width: 75px; vertical-align: top; border-radius: 5px; margin-right: .25em; margin-bottom: .25em;} -.avatar { width: 25px; height: 25px; vertical-align: middle; border-radius: 5px; margin-right: .2em; } +.profileAvatar { width: 75px; vertical-align: top; border-radius: 5px; object-fit: cover; margin-right: .25em; margin-bottom: .25em;} +.avatar { width: 25px; height: 25px; vertical-align: middle; object-fit: cover; border-radius: 5px; margin-right: .2em; } + +.image { width: 75px; height: 75px; object-fit: cover; margin-right: .2em; border-radius: 5px;} button { display: inline-block; diff --git a/identify.js b/identify.js index 2ba5eea..1381c6f 100644 --- a/identify.js +++ b/identify.js @@ -2,7 +2,7 @@ function identify (src, profile, keys) { var identifyDiv = h('div') - if (src != keys.publicKey) { + if ((src[0] == '@') && (src != keys.publicKey)) { identifyDiv.appendChild(h('p', ['Please note: ' + src + ' is not you.'])) } @@ -14,8 +14,8 @@ function identify (src, profile, keys) { var canvas = document.getElementById("canvas") var ctx = canvas.getContext("2d") - var maxW = 250 - var maxH = 250 + var maxW + var maxH var input = document.getElementById('input') input.addEventListener('change', handleFiles) @@ -24,7 +24,23 @@ function identify (src, profile, keys) { var img = new Image img.onload = function() { var iw = img.width + console.log(iw) var ih = img.height + console.log(ih) + + if (iw > ih) { + maxW = 680 + maxH = 500 + } + if (iw < ih) { + maxW = 500 + maxH = 680 + } + if (iw == ih) { + maxW = 500 + maxH = 500 + } + var scale = Math.min((maxW/iw), (maxH/ih)) var iwScaled = iw*scale var ihScaled = ih*scale @@ -33,13 +49,11 @@ function identify (src, profile, keys) { ctx.drawImage(img, 0, 0, iwScaled, ihScaled) console.log(canvas.toDataURL('image/jpeg', 0.9)) photoURL.value = canvas.toDataURL('image/jpeg', 0.9) - //identifyDiv.appendChild(h('img', {src: photoURL.value})) } img.src = URL.createObjectURL(e.target.files[0]) } } }), - h('p', ['We recommend uploading a square photo. It will automatically be cropped to 250 x 250 px.']), h('canvas', {id: 'canvas', width: '0', height: '0'}), h('button', { onclick: function () { @@ -102,35 +116,49 @@ function identify (src, profile, keys) { }, ['Cancel']) ]) - var identifyButtons = h('span', [ - h('button', { + var identifyButtons = h('span') + + if (src[0] == '@') { + identifyButtons.appendChild(h('button', { onclick: function () { identifyDiv.appendChild(newName) identifyButtons.parentNode.removeChild(identifyButtons) } - }, ['Identify ' + src.substring(0, 10) + '... with a new name']), - h('button', { - onclick: function () { - identifyDiv.appendChild(newPhoto) - identifyButtons.parentNode.removeChild(identifyButtons) - } - }, ['Identify ' + src.substring(0, 10) + '... with a new photo']), - h('button', { - onclick: function () { - identifyDiv.appendChild(identifyButton) - identifyButtons.parentNode.removeChild(identifyButtons) - } - }, ['Cancel']) - ]) + }, ['New name'])) - var identifyButton = h('button', { + } + //}, ['Identify ' + src.substring(0, 10) + '... with a new name']), + identifyButtons.appendChild(h('button', { + onclick: function () { + identifyDiv.appendChild(newPhoto) + identifyButtons.parentNode.removeChild(identifyButtons) + } + }, ['New image'])) + //}, ['Identify ' + src.substring(0, 10) + '... with a new photo']), + identifyButtons.appendChild(h('button', { onclick: function () { - profile.appendChild(identifyDiv) - profile.appendChild(identifyButtons) - identifyButton.parentNode.removeChild(identifyButton) + identifyDiv.appendChild(identifyButton) + identifyButtons.parentNode.removeChild(identifyButtons) } - },['Identify ' + src.substring(0, 10) + '...']) + }, ['Cancel'])) + if (src[0] == '@') { + var identifyButton = h('button', { + onclick: function () { + profile.appendChild(identifyDiv) + profile.appendChild(identifyButtons) + identifyButton.parentNode.removeChild(identifyButton) + } + }, ['Identify ' + src.substring(0, 10) + '...']) + } else { + var identifyButton = h('button', { + onclick: function () { + profile.appendChild(identifyDiv) + profile.appendChild(identifyButtons) + identifyButton.parentNode.removeChild(identifyButton) + } + }, ['Add to ' + src.substring(0, 10) + '...']) + } return identifyButton } diff --git a/render.js b/render.js index 00fb215..5070a5f 100644 --- a/render.js +++ b/render.js @@ -102,6 +102,10 @@ function render (msg, keys, preview) { if (!messageExists) { messageDiv.appendChild(h('div', {classList: 'submessage'}, [render(nextPost, keys)])) } + } + + if (nextPost.imaged == msg.key) { + message.insertBefore(h('img', {src: nextPost.image, classList: 'image'}), message.childNodes[message.childNodes.length - 1]) } }) } @@ -163,8 +167,9 @@ function render (msg, keys, preview) { ])) } message.appendChild(h('div',{id: 'content:' + msg.key, innerHTML: marked(msg.text)})) + var buttons = h('div') if (!preview) { - message.appendChild(h('button', { + buttons.appendChild(h('button', { onclick: function () { quickName(msg.author).then(name => { var compose = h('div', {classList: 'submessage'}, [composer(keys, msg, name)]) @@ -177,13 +182,16 @@ function render (msg, keys, preview) { } }, ['Reply'])) if (msg.author === keys.publicKey) { - message.appendChild(h('button', { + buttons.appendChild(h('button', { onclick: function () { var editor = h('div', {classList: 'submessage'}, [composer(keys, msg, {name: false}, {edit: true})]) messageDiv.appendChild(editor) } }, ['Edit'])) + buttons.appendChild(identify(msg.key, message, keys)) } + + message.appendChild(buttons) } } else if (msg.type == 'name') { var mini = h('span', [' identified ', h('a', {href: '#' + msg.named }, [msg.named.substring(0, 10) + '...']), ' as ' + msg.name]) -- cgit v1.2.3-70-g09d2 From 96af07d8be5ee32a546de4c4ffd64e5180768cae Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sun, 15 Dec 2019 16:08:35 -0600 Subject: click to expand images --- css/style.css | 6 +++++- render.js | 19 ++++++++++++++++++- 2 files changed, 23 insertions(+), 2 deletions(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index 1683032..7593324 100644 --- a/css/style.css +++ b/css/style.css @@ -231,7 +231,11 @@ form.search { .profileAvatar { width: 75px; vertical-align: top; border-radius: 5px; object-fit: cover; margin-right: .25em; margin-bottom: .25em;} .avatar { width: 25px; height: 25px; vertical-align: middle; object-fit: cover; border-radius: 5px; margin-right: .2em; } -.image { width: 75px; height: 75px; object-fit: cover; margin-right: .2em; border-radius: 5px;} +.image { width: 75px; height: 75px; object-fit: cover; margin-right: .2em; border-radius: 5px; cursor: pointer;} + +#viewer {position: fixed; left: 2em; top: 3em; background: white; padding: .5em; border: 1px solid #ddd; border-radius: 5px;} + +#viewer img { border-radius: 5px; margin-left: auto; margin-right: auto; cursor: pointer;} button { display: inline-block; diff --git a/render.js b/render.js index 5070a5f..d85d04b 100644 --- a/render.js +++ b/render.js @@ -105,7 +105,24 @@ function render (msg, keys, preview) { } if (nextPost.imaged == msg.key) { - message.insertBefore(h('img', {src: nextPost.image, classList: 'image'}), message.childNodes[message.childNodes.length - 1]) + + var img = h('img', { + src: nextPost.image, + classList: 'image', + onclick: function () { + var viewimg = h('div', {id: 'viewer', onclick: function () { + var viewer = document.getElementById('viewer') + viewer.parentNode.removeChild(viewer) + }}, [ + h('img', { + src: nextPost.image + }) + ]) + document.body.appendChild(viewimg) + } + }) + + message.insertBefore(img, message.childNodes[message.childNodes.length - 1]) } }) } -- cgit v1.2.3-70-g09d2 From 6a19e648f27efde551b7f5902c4b72f61e048cb4 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sun, 15 Dec 2019 16:10:16 -0600 Subject: fade viewer in --- css/style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index 7593324..2a7745b 100644 --- a/css/style.css +++ b/css/style.css @@ -66,7 +66,7 @@ hr { #scroller:last-child { margin-bottom: 10em; } -.message, .message > *, .navbar, .navbar > *, #ad, #ad > * { +.message, .message > *, .navbar, .navbar > *, #ad, #ad > *, #viewer > * { animation: fadein .5s; } -- cgit v1.2.3-70-g09d2 From 3fe02c91174d7316ae2c66a7679ab807ca43c6c3 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sat, 21 Dec 2019 14:26:30 -0600 Subject: initial stab at private beacons --- app.js | 3 ++ beacons.js | 89 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ css/style.css | 4 +-- gossip.js | 3 ++ index.html | 1 + render.js | 73 +++++++++++++++++++++++++++++++++--------------- server.js | 59 +++++++++++++++++++++++++++------------ settings.js | 49 -------------------------------- 8 files changed, 190 insertions(+), 91 deletions(-) create mode 100644 beacons.js (limited to 'css') diff --git a/app.js b/app.js index 7fe1ae2..5dd49a5 100644 --- a/app.js +++ b/app.js @@ -10,6 +10,8 @@ function route (keys) { if (src === 'settings') { settingsPage(keys) + } else if (src === 'beacons') { + beaconsPage(keys) } else if (src[0] === '@') { profilePage(src, keys) } else if (src[0] === '?') { @@ -28,6 +30,7 @@ keys().then(key => { h('div', {classList: 'internal'}, [ h('li', [h('a', {href: '#'}, ['Home'])]), h('li', [h('a', {href: '#' + key.publicKey}, [getName(key.publicKey, keys)])]), + h('li', [h('a', {href: '#beacons'}, ['Beacons'])]), h('li', {classList: 'right'}, [h('a', {href: '#settings'}, ['Settings'])]), h('form', { classList: 'search', onsubmit: function (e) { diff --git a/beacons.js b/beacons.js new file mode 100644 index 0000000..1656879 --- /dev/null +++ b/beacons.js @@ -0,0 +1,89 @@ + +function beaconsPage (keys) { + + var pubslist = h('select') + + localforage.getItem('securepubs').then(function (servers) { + servers.forEach(function (pub) { + pubslist.appendChild( + h('option', {value: pub}, [pub]) + ) + }) + }) + + var ads = h('div', {classList: 'message'}) + + ads.appendChild(h('span', {innerHTML: marked('Sometimes when you\'re lost on the Internet you might want to send out a beacon so that people can see you. \n\n Beacons from guests will run for 100 views before they are deleted by the pub. \n\nSelect a pub:')})) + + ads.appendChild(pubslist) + + var recp = h('input', {placeholder: 'Ex: @Q++V5BbvWIg8B+TqtC9ZKFhetruuw+nOgxEqfjlOZI0='}) + + var adstext = h('textarea', {placeholder: 'Hello World!'}) + + ads.appendChild(h('span', [ + h('br'), + h('p', [" Send a beacon (leave the 'To:' field blank for a public beacon): "]), + h('p', ['To: ', + recp + ]), + adstext, + h('br'), + h('button', { + onclick: function () { + var split = pubslist.value.split('~') + console.log(split) + var serverurl = split[0] + var serverpub = split[1] + var ws = new WebSocket(serverurl) + + if ((recp.value) && (adstext.value)) { + var tobox = { + author: keys.publicKey, + timestamp: Date.now(), + content: adstext.value + } + box(JSON.stringify(tobox), recp.value, keys).then(boxedmsg => { + var msg = { + type: 'beacon', + author: keys.publicKey, + box: boxedmsg + } + ws.onopen = function () { + box(JSON.stringify(msg), serverpub, keys).then(boxed => { + var obj = { + requester: keys.publicKey, + box: boxed + } + ws.send(JSON.stringify(obj)) + }) + adstext.value = '' + recp.value = '' + } + }) + } + + if ((!recp.value) && (adstext.value)) { + var msg = { + type: 'beacon', + author: keys.publicKey + } + msg.signature = nacl.util.encodeBase64(nacl.sign(nacl.util.decodeUTF8(JSON.stringify(adstext.value)), nacl.util.decodeBase64(keys.privateKey))) + ws.onopen = function () { + box(JSON.stringify(msg), serverpub, keys).then(boxed => { + var obj = { + requester: keys.publicKey, + box: boxed + } + ws.send(JSON.stringify(obj)) + }) + adstext.value = '' + } + } + } + }, ['Publish']) + ])) + + scroller.appendChild(ads) +} + diff --git a/css/style.css b/css/style.css index 2a7745b..1eef78f 100644 --- a/css/style.css +++ b/css/style.css @@ -70,7 +70,7 @@ hr { animation: fadein .5s; } -#ad { +#ad, #pm { background: white; font-size: .8em; border: 1px solid #ddd; @@ -82,7 +82,7 @@ hr { width: 250px; } -#ad button { +#ad button, #pm button { font-size: .8em; margin: 0; padding: 0; diff --git a/gossip.js b/gossip.js index d0b91f1..3f88b54 100644 --- a/gossip.js +++ b/gossip.js @@ -53,6 +53,9 @@ function sync (subs, keys) { unboxedreq.signature = unboxedreq.content renderAd(unboxedreq) } + if (unboxedreq.box) { + renderAd(unboxedreq, keys) + } if (unboxedreq.seq === 0) { var stringedfeed = JSON.stringify(srclog) box(stringedfeed, serverpub, keys).then(boxed => { diff --git a/index.html b/index.html index 0396bcc..5d18890 100644 --- a/index.html +++ b/index.html @@ -17,6 +17,7 @@ + diff --git a/render.js b/render.js index d85d04b..02e4b88 100644 --- a/render.js +++ b/render.js @@ -1,4 +1,6 @@ -function renderAd (ad) { +function renderAd (ad, keys) { + console.log(ad) + var screen = document.getElementById('screen') var adspot = document.getElementById('ad') @@ -11,30 +13,57 @@ function renderAd (ad) { if (ad.views) { adspace.appendChild(h('span', {classList: 'right'}, [h('pre', [ad.views + ' views'])])) } else { - adspace.appendChild(h('span', {classList: 'right'}, [h('pre', ['ad'])])) + adspace.appendChild(h('span', {classList: 'right'}, [h('pre', ['beacon'])])) } - open(ad).then(opened => { - quickName(ad.author).then(gotName => { - newAd = h('div', {id: 'ad'}, [ - adspace, - h('p', {innerHTML: marked(opened)}), - h('button', {classList: 'right', - onclick: function () { - adspot = document.getElementById('ad') - adspot.parentNode.removeChild(adspot) - } - }, ['Heard']), - h('span', [ - '—', - h('a', {href: '#' + ad.author}, [gotName]), - ' from ', - h('a', {href: ad.name}, [ad.name]) + if (ad.box) { + unbox(ad.box, ad.author, keys).then(unboxed => { + var msg = JSON.parse(nacl.util.encodeUTF8(unboxed)) + quickName(ad.author).then(gotName => { + beacon = h('div', {id: 'pm'}, [ + h('span', {classList: 'right'}, [h('pre', [human(new Date(msg.timestamp))])]), + h('p', {innerHTML: marked(msg.content)}), + h('button', {classList: 'right', + onclick: function () { + pmspot = document.getElementById('pm') + pmspot.parentNode.removeChild(pmspot) + } + }, ['Heard']), + h('span', [ + '—', + h('a', {href: '#' + ad.author}, [gotName]), + ' from ', + h('a', {href: ad.name}, [ad.name]) + ]) ]) - ]) - screen.appendChild(newAd) - }) - }) + screen.append(beacon) + }) + }) + } + + if (ad.signature) { + open(ad).then(opened => { + quickName(ad.author).then(gotName => { + newAd = h('div', {id: 'ad'}, [ + adspace, + h('p', {innerHTML: marked(opened)}), + h('button', {classList: 'right', + onclick: function () { + adspot = document.getElementById('ad') + adspot.parentNode.removeChild(adspot) + } + }, ['Heard']), + h('span', [ + '—', + h('a', {href: '#' + ad.author}, [gotName]), + ' from ', + h('a', {href: ad.name}, [ad.name]) + ]) + ]) + screen.appendChild(newAd) + }) + }) + } } function getHeader (post, keys, mini) { diff --git a/server.js b/server.js index d324f43..5ad7064 100644 --- a/server.js +++ b/server.js @@ -119,15 +119,27 @@ bog.keys().then(key => { } else { bog.unbox(req.box, req.requester, key).then(unboxed => { var unboxedreq = JSON.parse(nacl.util.encodeUTF8(unboxed)) - if (unboxedreq.type == 'ad') { - - var hex = Buffer.from(nacl.hash(nacl.util.decodeUTF8(unboxedreq.signature))).toString('hex') - - var obj = { - hash: hex, - author: unboxedreq.author, - signature: unboxedreq.signature, - views: 0 + //console.log(unboxedreq) + if (unboxedreq.type == 'beacon') { + if (unboxedreq.box) { + var hex = Buffer.from(nacl.hash(nacl.util.decodeUTF8(unboxedreq.box))).toString('hex') + + var obj = { + hash: hex, + author: unboxedreq.author, + box: unboxedreq.box, + views: 0 + } + } + + if (unboxedreq.signature) { + var hex = Buffer.from(nacl.hash(nacl.util.decodeUTF8(unboxedreq.signature))).toString('hex') + var obj = { + hash: hex, + author: unboxedreq.author, + signature: unboxedreq.signature, + views: 0 + } } fs.writeFile(addir + hex, JSON.stringify(obj), 'UTF-8', function () { @@ -150,13 +162,25 @@ bog.keys().then(key => { var num = Math.floor(Math.random() * (adfiles.length)) fs.readFile(addir + adfiles[num], 'UTF-8', function (err, adFile) { var obj = JSON.parse(adFile) - var ad = { - author: obj.author, - name: config.fullurl, - content: obj.signature, - timestamp: Date.now(), - views: obj.views + + if (obj.signature) { + var ad = { + author: obj.author, + name: config.fullurl, + content: obj.signature, + views: obj.views + } } + + if (obj.box) { + var ad = { + author: obj.author, + name: config.fullurl, + box: obj.box, + views: obj.views + } + } + if ((obj.views > 100) && (obj.author != config.author)) { fs.unlinkSync(addir + obj.hash) //console.log('REMOVING AD') @@ -165,6 +189,7 @@ bog.keys().then(key => { fs.writeFileSync(addir + obj.hash, JSON.stringify(obj), 'UTF-8') } printSendAd(ad, req) + console.log(ad) //console.log('SENDING AD') bog.box(JSON.stringify(ad), req.requester, key).then(boxed => { sendobj = { @@ -175,9 +200,7 @@ bog.keys().then(key => { ws.close() }) }) - } else { - ads.make('Hello World.') - } + } }) } } diff --git a/settings.js b/settings.js index 51dc1f2..c88ea07 100644 --- a/settings.js +++ b/settings.js @@ -56,11 +56,7 @@ function settingsPage (keys) { var add = h('input', {placeholder: 'Add a pub'}) - var pubslist = h('select') - localforage.getItem('securepubs').then(function (servers) { - - pubs.appendChild(h('div', [ add, h('button', { @@ -74,9 +70,6 @@ function settingsPage (keys) { ])) servers.forEach(function (pub) { - pubslist.appendChild( - h('option', {value: pub}, [pub]) - ) pubs.appendChild(h('p', [ pub, h('button', { @@ -98,52 +91,10 @@ function settingsPage (keys) { } }, ['Reset pubs'])) - var ads = h('div', {classList: 'message'}) - - - ads.appendChild(h('span', {innerHTML: marked('Submit an advertisement. Right now advertisements are free for anyone to post to this pub. Ads from guests will run for 100 views before they are deleted by the pub. \n\nSelect a pub:')})) - - ads.appendChild(pubslist) - - var adstext = h('input', {placeholder: 'Hello World!'}) - - ads.appendChild(h('span', [ - h('br'), - ' Write an ad: ', - h('br'), - adstext, - h('button', { - onclick: function () { - var split = pubslist.value.split('~') - console.log(split) - var serverurl = split[0] - var serverpub = split[1] - var ws = new WebSocket(serverurl) - - var msg = { - type: 'ad', - author: keys.publicKey - } - msg.signature = nacl.util.encodeBase64(nacl.sign(nacl.util.decodeUTF8(JSON.stringify(adstext.value)), nacl.util.decodeBase64(keys.privateKey))) - ws.onopen = function () { - box(JSON.stringify(msg), serverpub, keys).then(boxed => { - var obj = { - requester: keys.publicKey, - box: boxed - } - ws.send(JSON.stringify(obj)) - }) - } - adstext.value = '' - } - }, ['Publish']) - ])) - scroller.appendChild(welcome) scroller.appendChild(keyDiv) scroller.appendChild(pubs) scroller.appendChild(everything) //scroller.appendChild(regenerate) - scroller.appendChild(ads) } -- cgit v1.2.3-70-g09d2 From 047b88d8deb5b4338b4162f519de7ef570d98ae2 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sun, 22 Dec 2019 13:52:53 -0600 Subject: put pms on the right --- css/style.css | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index 1eef78f..6e26838 100644 --- a/css/style.css +++ b/css/style.css @@ -78,10 +78,17 @@ hr { position: fixed; padding: .3em .5em; bottom: 5px; - left: 5px; width: 250px; } +#ad { + left: 5px; +} + +#pm { + right: 5px; +} + #ad button, #pm button { font-size: .8em; margin: 0; -- cgit v1.2.3-70-g09d2 From edf8b1193d82e7976c6c819aa1d25d54cc2c1858 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Fri, 3 Jan 2020 18:42:43 -0600 Subject: condense reply text into a ↳ symbol -- also render text of message that is being replied to MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- bog.js | 12 ++++++++++++ css/style.css | 2 +- render.js | 22 +++++++++++++++++----- 3 files changed, 30 insertions(+), 6 deletions(-) (limited to 'css') diff --git a/bog.js b/bog.js index 55188e5..d8ee2a8 100644 --- a/bog.js +++ b/bog.js @@ -94,6 +94,18 @@ async function get (key) { } } +async function getTitle (key) { + var log = await localforage.getItem('log') + if (log != null) { + for (var i = log.length - 1; i >= 0; --i) { + if (log[i].key === key) { + return log[i].text.substring(0, 15) + '…' + } + } + } +} + + // bog.getImage function getImage (id, keys, classList) { diff --git a/css/style.css b/css/style.css index 6e26838..ba2313a 100644 --- a/css/style.css +++ b/css/style.css @@ -9,7 +9,7 @@ body { } p { - margin-top: 1ex; + margin-top: .5ex; margin-bottom: 1ex; font-size: 1em; } diff --git a/render.js b/render.js index 79f839a..aaea0c2 100644 --- a/render.js +++ b/render.js @@ -138,14 +138,26 @@ function render (msg, keys, preview) { } if (msg.type == 'post') { - message.appendChild(getHeader(msg, keys)) + var mini = h('span', [' ']) + + message.appendChild(getHeader(msg, keys, mini)) + + console.log(getTitle(msg.reply)) if (msg.reply) { - message.firstChild.appendChild(h('span', [ - 're: ', - h('a', {href: '#' + msg.reply}, [msg.reply.substring(0, 10) + '...']) - ])) + getTitle(msg.reply).then(title => { + if (!title) { + title = msg.reply.substring(0, 15) + '…' + } + mini.appendChild(h('span', [ + '↳ ', + h('a', {href: '#' + msg.reply}, [title]) + ])) + + }) } + + message.appendChild(h('div',{id: 'content:' + msg.key, innerHTML: marked(msg.text)})) var buttons = h('div') if (!preview) { -- cgit v1.2.3-70-g09d2 From 8b1e4b587d2c8f7818d8d8745cdabada9e0d41d0 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sun, 5 Jan 2020 17:35:17 -0600 Subject: add profile photos to navbar and limit number of mentions that arrive --- app.js | 10 ++++++++-- css/style.css | 4 ++-- views.js | 24 ++++++++++++++++++++---- 3 files changed, 30 insertions(+), 8 deletions(-) (limited to 'css') diff --git a/app.js b/app.js index 7fe1ae2..7892593 100644 --- a/app.js +++ b/app.js @@ -26,8 +26,14 @@ keys().then(key => { var navbar = h('div', {classList: 'navbar'}, [ h('div', {classList: 'internal'}, [ - h('li', [h('a', {href: '#'}, ['Home'])]), - h('li', [h('a', {href: '#' + key.publicKey}, [getName(key.publicKey, keys)])]), + h('li', [h('a', {href: '#' + key.publicKey}, + [ + getImage(key.publicKey, keys), + getName(key.publicKey, keys) + ]) + ]), + h('li', [h('a', {href: '#'}, ['All'])]), + h('li', [h('a', {href: '#?' + key.publicKey}, ['Mentions'])]), h('li', {classList: 'right'}, [h('a', {href: '#settings'}, ['Settings'])]), h('form', { classList: 'search', onsubmit: function (e) { diff --git a/css/style.css b/css/style.css index ba2313a..383d6b9 100644 --- a/css/style.css +++ b/css/style.css @@ -180,7 +180,7 @@ textarea { z-index: 1000; margin: 0; padding-top: .33em; - padding-bottom: .27em; + padding-bottom: .4em; left: 0; right: 0; top: 0; } @@ -236,7 +236,7 @@ form.search { } .profileAvatar { width: 75px; vertical-align: top; border-radius: 5px; object-fit: cover; margin-right: .25em; margin-bottom: .25em;} -.avatar { width: 25px; height: 25px; vertical-align: middle; object-fit: cover; border-radius: 5px; margin-right: .2em; } +.avatar { width: 25px; height: 25px; vertical-align: middle; object-fit: cover; border-radius: 5px; margin-right: .5em; } .image { width: 75px; height: 75px; object-fit: cover; margin-right: .2em; border-radius: 5px; cursor: pointer;} diff --git a/views.js b/views.js index e967191..d8c537f 100644 --- a/views.js +++ b/views.js @@ -107,12 +107,28 @@ function profilePage (src, keys) { function searchPage (src, keys) { var search = src.substring(1).replace("%20"," ").toUpperCase() + + async function addPosts (posts, keys) { + posts.forEach(function (msg) { + if (msg.text) { + if (msg.text.toUpperCase().includes(search)) { + scroller.appendChild(render(msg, keys)) + } + } + }) + } bog().then(log => { + var index = 0 if (log) { - log.forEach(function (msg) { - if (msg.text) { - if (msg.text.toUpperCase().includes(search)) { - scroller.appendChild(render(msg, keys)) + var posts = log.slice(index, index + 25) + addPosts(posts, keys).then(done => { + index = index + 25 + window.onscroll = function(ev) { + if (((window.innerHeight + window.scrollY) >= document.body.scrollHeight) && (window.location.hash.substring(1) === src)) { + posts = log.slice(index, index + 25) + index = index + 25 + addPosts(posts, keys) + console.log("Bottom of page") } } }) -- cgit v1.2.3-70-g09d2 From 4614d28969667b6c79a9195ef459942dea3ea546 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sun, 5 Jan 2020 17:47:31 -0600 Subject: adjust spacing --- css/style.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index 383d6b9..7ec1ee4 100644 --- a/css/style.css +++ b/css/style.css @@ -38,7 +38,7 @@ hr { #screen { position: absolute; - top: 35px; + top: 40px; right: 0; left: 0; bottom: 0; @@ -179,8 +179,8 @@ textarea { position: fixed; z-index: 1000; margin: 0; - padding-top: .33em; - padding-bottom: .4em; + padding-top: .4em; + padding-bottom: .3em; left: 0; right: 0; top: 0; } -- cgit v1.2.3-70-g09d2 From cb59e302155933359a8500b3094b1fb495c89afb Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Fri, 10 Jan 2020 17:47:28 -0600 Subject: add background photos -- not quite done yet --- css/style.css | 7 +++++- gossip.js | 4 +-- identify.js | 78 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++--- render.js | 16 ++++++++++-- views.js | 24 ++++++++++++++++-- 5 files changed, 119 insertions(+), 10 deletions(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index 7ec1ee4..df53ffe 100644 --- a/css/style.css +++ b/css/style.css @@ -59,11 +59,16 @@ hr { .message, .profile { border: 1px solid #ddd; background: white; - margin-top: .5em; + margin-bottom: .5em; padding: .3em .5em; +} + +.message { border-radius: 5px; } +.banner { height: 275px; } + #scroller:last-child { margin-bottom: 10em; } .message, .message > *, .navbar, .navbar > *, #ad, #ad > *, #viewer > * { diff --git a/gossip.js b/gossip.js index 26915b1..5cf19e9 100644 --- a/gossip.js +++ b/gossip.js @@ -49,7 +49,7 @@ function processreq (req, pubkey, connection, keys) { var src = window.location.hash.substring(1) if ((src === msg.author) || (src === '')) { var scroller = document.getElementById('scroller') - scroller.insertBefore(render(opened, keys), scroller.childNodes[1]) + scroller.insertBefore(render(opened, keys), scroller.childNodes[2]) } if (opened.seq === req.length) { localforage.setItem('log', log) @@ -71,7 +71,7 @@ function processreq (req, pubkey, connection, keys) { var src = window.location.hash.substring(1) if ((src === msg.author) || (src === '')) { var scroller = document.getElementById('scroller') - scroller.insertBefore(render(opened, keys), scroller.childNodes[1]) + scroller.insertBefore(render(opened, keys), scroller.childNodes[2]) } if (req.length + lastmsg.seq === opened.seq) { localforage.setItem('log', log) diff --git a/identify.js b/identify.js index 1381c6f..eb8827c 100644 --- a/identify.js +++ b/identify.js @@ -8,6 +8,72 @@ function identify (src, profile, keys) { var photoURL = {} + // this could be a hell of a lot dry-er + + // also we need to get rid of UI glitches when you hit the cancel button (it should return to the same state it started in) + + var newBackground = h('span', [ + h('input', {id: 'input', type: 'file', + onclick: function () { + var canvas = document.getElementById("canvas") + var ctx = canvas.getContext("2d") + + var maxW + var maxH + + var input = document.getElementById('input') + input.addEventListener('change', handleFiles) + + function handleFiles(e) { + var img = new Image + img.onload = function() { + var iw = img.width + var ih = img.height + + maxW = 800 + maxH = 800 + + var scale = Math.min((maxW/iw), (maxH/ih)) + var iwScaled = iw*scale + var ihScaled = ih*scale + canvas.width = iwScaled + canvas.height = ihScaled + ctx.drawImage(img, 0, 0, iwScaled, ihScaled) + photoURL.value = canvas.toDataURL('image/jpeg', 0.7) + } + img.src = URL.createObjectURL(e.target.files[0]) + } + } + }), + h('canvas', {id: 'canvas', width: '0', height: '0'}), + h('button', { + onclick: function () { + identifyDiv.appendChild(identifyButtons) + newBackground.parentNode.removeChild(newBackground) + } + }, ['Cancel']), + h('button', { + onclick: function () { + if (photoURL.value) { + content = { + type: 'background', + backgrounded: src, + background: photoURL.value + } + localforage.removeItem('image:' + src) + publish(content, keys).then(post => { + open(post).then(msg => { + nameInput.value = '' + scroller.insertBefore(render(msg, keys), scroller.childNodes[1]) + }) + }) + newBackground.parentNode.removeChild(newBackground) + identifyDiv.appendChild(identifyButton) + } + } + }, ['Publish']) + ]) + var newPhoto = h('span', [ h('input', {id: 'input', type: 'file', onclick: function () { @@ -47,7 +113,6 @@ function identify (src, profile, keys) { canvas.width = iwScaled canvas.height = ihScaled ctx.drawImage(img, 0, 0, iwScaled, ihScaled) - console.log(canvas.toDataURL('image/jpeg', 0.9)) photoURL.value = canvas.toDataURL('image/jpeg', 0.9) } img.src = URL.createObjectURL(e.target.files[0]) @@ -69,7 +134,6 @@ function identify (src, profile, keys) { imaged: src, image: photoURL.value } - console.log(content) localforage.removeItem('image:' + src) publish(content, keys).then(post => { open(post).then(msg => { @@ -84,6 +148,9 @@ function identify (src, profile, keys) { }, ['Publish']) ]) + + + var nameInput = h('input', {placeholder: 'New name'}) var newName = h('div', [ @@ -125,7 +192,12 @@ function identify (src, profile, keys) { identifyButtons.parentNode.removeChild(identifyButtons) } }, ['New name'])) - + identifyButtons.appendChild(h('button', { + onclick: function () { + identifyDiv.appendChild(newBackground) + identifyButtons.parentNode.removeChild(identifyButtons) + } + }, ['New background'])) } //}, ['Identify ' + src.substring(0, 10) + '... with a new name']), identifyButtons.appendChild(h('button', { diff --git a/render.js b/render.js index e440abd..faf3c17 100644 --- a/render.js +++ b/render.js @@ -183,10 +183,11 @@ function render (msg, keys, preview) { message.appendChild(buttons) } - } else if (msg.type == 'name') { + } if (msg.type == 'name') { var mini = h('span', [' identified ', h('a', {href: '#' + msg.named }, [msg.named.substring(0, 10) + '...']), ' as ' + msg.name]) message.appendChild(getHeader(msg, keys, mini)) - } else if (msg.type == 'image') { + + } if (msg.type == 'image') { var mini = h('span', [ ' added an image to ', h('a', { href: '#' + msg.imaged }, [msg.imaged.substring(0, 10) + '...']), @@ -194,8 +195,19 @@ function render (msg, keys, preview) { h('img', {src: msg.image, classList: 'avatar'}) ]) message.appendChild(getHeader(msg, keys, mini)) + + } if (msg.type == 'background') { + var mini = h('span', [ + ' added a background to ', + h('a', { href: '#' + msg.backgrounded }, [msg.backgrounded.substring(0, 10) + '...']), + ' ', + h('img', {src: msg.background, classList: 'avatar'}) + ]) + message.appendChild(getHeader(msg, keys, mini)) } + + messageDiv.appendChild(message) return messageDiv } diff --git a/views.js b/views.js index b964915..da1eeb9 100644 --- a/views.js +++ b/views.js @@ -9,7 +9,24 @@ function profilePage (src, keys) { msg.author = src var profile = h('div', {classList: 'profile'}) + var banner = h('div', {classList: 'banner'}) + + function getBg (src, profile) { + bog().then(log => { + if (log) { + for (var i = 0; i < log.length; i++) { + if ((log[i].backgrounded === src) && (log[i].author === src)) { + // if you've identified someone as something else show that something else + return banner.style.background = 'fixed top/680px no-repeat url(' + log[i].background + ')' + } + } + } + }) + } + + getBg(src, profile) + scroller.appendChild(banner) scroller.appendChild(profile) //scroller.appendChild(h('div')) @@ -27,12 +44,15 @@ function profilePage (src, keys) { profile.appendChild(h('a', {href: '#' + src}, [ getImage(src, keys, 'profileAvatar'), - getName(src, keys) + getName(src, keys), + h('br'), + h('br') ])) profile.appendChild(h('br')) quickName(src).then(name => { + profile.appendChild(identify(src, profile, keys, name)) var mentionsButton = h('button', { onclick: function () { location.href = '#?' + src @@ -76,7 +96,6 @@ function profilePage (src, keys) { }, ['Delete ' + name + '\'s feed'])) }) - profile.appendChild(identify(src, profile, keys)) async function addPosts (posts, keys) { posts.forEach(function (msg) { @@ -197,3 +216,4 @@ function publicPage (keys) { }) } + -- cgit v1.2.3-70-g09d2 From dac0064cf55e6a3f9321ea78875bfe8ca9952fc3 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sat, 11 Jan 2020 06:13:44 -0600 Subject: finish adding backgrounds to profiles --- css/style.css | 4 ++-- gossip.js | 4 ++-- identify.js | 6 +++--- views.js | 12 ++++++------ 4 files changed, 13 insertions(+), 13 deletions(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index df53ffe..26784e7 100644 --- a/css/style.css +++ b/css/style.css @@ -56,6 +56,8 @@ hr { .right { float: right;} +.banner {height: 10px; } + .message, .profile { border: 1px solid #ddd; background: white; @@ -67,8 +69,6 @@ hr { border-radius: 5px; } -.banner { height: 275px; } - #scroller:last-child { margin-bottom: 10em; } .message, .message > *, .navbar, .navbar > *, #ad, #ad > *, #viewer > * { diff --git a/gossip.js b/gossip.js index 5cf19e9..26915b1 100644 --- a/gossip.js +++ b/gossip.js @@ -49,7 +49,7 @@ function processreq (req, pubkey, connection, keys) { var src = window.location.hash.substring(1) if ((src === msg.author) || (src === '')) { var scroller = document.getElementById('scroller') - scroller.insertBefore(render(opened, keys), scroller.childNodes[2]) + scroller.insertBefore(render(opened, keys), scroller.childNodes[1]) } if (opened.seq === req.length) { localforage.setItem('log', log) @@ -71,7 +71,7 @@ function processreq (req, pubkey, connection, keys) { var src = window.location.hash.substring(1) if ((src === msg.author) || (src === '')) { var scroller = document.getElementById('scroller') - scroller.insertBefore(render(opened, keys), scroller.childNodes[2]) + scroller.insertBefore(render(opened, keys), scroller.childNodes[1]) } if (req.length + lastmsg.seq === opened.seq) { localforage.setItem('log', log) diff --git a/identify.js b/identify.js index eb8827c..f56a0f9 100644 --- a/identify.js +++ b/identify.js @@ -1,4 +1,4 @@ -function identify (src, profile, keys) { +function identify (src, profile, keys, name) { var identifyDiv = h('div') @@ -213,7 +213,6 @@ function identify (src, profile, keys) { identifyButtons.parentNode.removeChild(identifyButtons) } }, ['Cancel'])) - if (src[0] == '@') { var identifyButton = h('button', { onclick: function () { @@ -221,7 +220,7 @@ function identify (src, profile, keys) { profile.appendChild(identifyButtons) identifyButton.parentNode.removeChild(identifyButton) } - }, ['Identify ' + src.substring(0, 10) + '...']) + }, ['Identify ' + name]) } else { var identifyButton = h('button', { onclick: function () { @@ -231,6 +230,7 @@ function identify (src, profile, keys) { } }, ['Add to ' + src.substring(0, 10) + '...']) } + return identifyButton } diff --git a/views.js b/views.js index da1eeb9..d6fb5f2 100644 --- a/views.js +++ b/views.js @@ -8,6 +8,7 @@ function profilePage (src, keys) { var msg = {} msg.author = src + var profileDiv = h('div') var profile = h('div', {classList: 'profile'}) var banner = h('div', {classList: 'banner'}) @@ -16,7 +17,8 @@ function profilePage (src, keys) { if (log) { for (var i = 0; i < log.length; i++) { if ((log[i].backgrounded === src) && (log[i].author === src)) { - // if you've identified someone as something else show that something else + // if you've identified someone as something else show that something else + banner.style.height = '300px' return banner.style.background = 'fixed top/680px no-repeat url(' + log[i].background + ')' } } @@ -26,9 +28,9 @@ function profilePage (src, keys) { getBg(src, profile) - scroller.appendChild(banner) - scroller.appendChild(profile) - //scroller.appendChild(h('div')) + profileDiv.appendChild(banner) + profileDiv.appendChild(profile) + scroller.appendChild(profileDiv) var subs = [src] @@ -45,8 +47,6 @@ function profilePage (src, keys) { profile.appendChild(h('a', {href: '#' + src}, [ getImage(src, keys, 'profileAvatar'), getName(src, keys), - h('br'), - h('br') ])) profile.appendChild(h('br')) -- cgit v1.2.3-70-g09d2 From 2995dfc6982846494f493a5eb1dc7ffc2e3687c1 Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sat, 11 Jan 2020 07:43:32 -0600 Subject: finish adding backgrounds --- css/style.css | 2 +- identify.js | 89 +++++++++++++++++++++++++++++++++++++++++++++++++++++---- render.js | 20 ++++++++++++- views.js | 92 +++++++++++++++++++++++++++++++++++++++++------------------ 4 files changed, 169 insertions(+), 34 deletions(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index 26784e7..cfa5012 100644 --- a/css/style.css +++ b/css/style.css @@ -240,7 +240,7 @@ form.search { text-decoration: none; } -.profileAvatar { width: 75px; vertical-align: top; border-radius: 5px; object-fit: cover; margin-right: .25em; margin-bottom: .25em;} +.profileAvatar { width: 95px; height: 95px; vertical-align: top; border-radius: 5px; object-fit: cover; margin-right: .25em; margin-bottom: .25em;} .avatar { width: 25px; height: 25px; vertical-align: middle; object-fit: cover; border-radius: 5px; margin-right: .5em; } .image { width: 75px; height: 75px; object-fit: cover; margin-right: .2em; border-radius: 5px; cursor: pointer;} diff --git a/identify.js b/identify.js index f56a0f9..acda8c8 100644 --- a/identify.js +++ b/identify.js @@ -3,7 +3,10 @@ function identify (src, profile, keys, name) { var identifyDiv = h('div') if ((src[0] == '@') && (src != keys.publicKey)) { - identifyDiv.appendChild(h('p', ['Please note: ' + src + ' is not you.'])) + identifyDiv.appendChild(h('p', [ + 'Please note: ' + src.substring(0, 10) + '... is not you. You are: ', + h('a', {href: '#' + keys.publicKey}, [keys.publicKey.substring(0, 10) + '...']) + ])) } var photoURL = {} @@ -148,8 +151,67 @@ function identify (src, profile, keys, name) { }, ['Publish']) ]) + var descInput = h('textarea', {placeholder: 'New description'}) + var newDescription = h('div', [ + descInput, + h('button', { + onclick: function () { + if (descInput.value) { + content = { + type: 'description', + descripted: src, + description: descInput.value + } + publish(content, keys).then(post => { + open(post).then(msg => { + descInput.value = '' + scroller.insertBefore(render(msg, keys), scroller.childNodes[1]) + }) + }) + newDescription.parentNode.removeChild(newDescription) + identifyDiv.appendChild(identifyButton) + } + } + }, ['Publish']), + h('button', { + onclick: function () { + identifyDiv.appendChild(identifyButtons) + newDescription.parentNode.removeChild(newDescription) + } + }, ['Cancel']) + ]) + var locInput = h('input', {placeholder: 'New location'}) + + var newLocation = h('div', [ + locInput, + h('button', { + onclick: function () { + if (locInput.value) { + content = { + type: 'location', + located: src, + loc: locInput.value + } + publish(content, keys).then(post => { + open(post).then(msg => { + locationInput.value = '' + scroller.insertBefore(render(msg, keys), scroller.childNodes[1]) + }) + }) + newLocation.parentNode.removeChild(newLocation) + identifyDiv.appendChild(identifyButton) + } + } + }, ['Publish']), + h('button', { + onclick: function () { + identifyDiv.appendChild(identifyButtons) + newLocation.parentNode.removeChild(newLocation) + } + }, ['Cancel']) + ]) var nameInput = h('input', {placeholder: 'New name'}) @@ -198,6 +260,13 @@ function identify (src, profile, keys, name) { identifyButtons.parentNode.removeChild(identifyButtons) } }, ['New background'])) + identifyButtons.appendChild(h('button', { + onclick: function () { + identifyDiv.appendChild(newDescription) + identifyButtons.parentNode.removeChild(identifyButtons) + } + }, ['New description'])) + } //}, ['Identify ' + src.substring(0, 10) + '... with a new name']), identifyButtons.appendChild(h('button', { @@ -206,6 +275,15 @@ function identify (src, profile, keys, name) { identifyButtons.parentNode.removeChild(identifyButtons) } }, ['New image'])) + + identifyButtons.appendChild(h('button', { + onclick: function () { + identifyDiv.appendChild(newLocation) + identifyButtons.parentNode.removeChild(identifyButtons) + } + }, ['New location'])) + + //}, ['Identify ' + src.substring(0, 10) + '... with a new photo']), identifyButtons.appendChild(h('button', { onclick: function () { @@ -213,7 +291,7 @@ function identify (src, profile, keys, name) { identifyButtons.parentNode.removeChild(identifyButtons) } }, ['Cancel'])) - if (src[0] == '@') { + /*if (src[0] == '@') { var identifyButton = h('button', { onclick: function () { profile.appendChild(identifyDiv) @@ -221,15 +299,16 @@ function identify (src, profile, keys, name) { identifyButton.parentNode.removeChild(identifyButton) } }, ['Identify ' + name]) - } else { + } else { */ var identifyButton = h('button', { onclick: function () { profile.appendChild(identifyDiv) profile.appendChild(identifyButtons) identifyButton.parentNode.removeChild(identifyButton) } - }, ['Add to ' + src.substring(0, 10) + '...']) - } + //}, ['Add to ' + src.substring(0, 10) + '...']) + }, ['+']) + //} return identifyButton } diff --git a/render.js b/render.js index faf3c17..5ecbdda 100644 --- a/render.js +++ b/render.js @@ -15,6 +15,8 @@ function getHeader (post, keys, mini) { var head = h('span', [ h('p', {classList: 'right'}, [ + getLoc(post), + ' ', h('a', {href: '#' + post.key}, [ human(new Date(post.timestamp)), ]), @@ -204,9 +206,25 @@ function render (msg, keys, preview) { h('img', {src: msg.background, classList: 'avatar'}) ]) message.appendChild(getHeader(msg, keys, mini)) - } + } if (msg.type == 'description') { + var mini = h('span', [ + ' added a description to ', + h('a', { href: '#' + msg.descripted }, [msg.descripted.substring(0, 10) + '...']), + ' ', + h('div', {innerHTML: marked(msg.description)}) + ]) + message.appendChild(getHeader(msg, keys, mini)) + } if (msg.type == 'location') { + var mini = h('span', [ + ' added a location to ', + h('a', { href: '#' + msg.located }, [msg.located.substring(0, 10) + '...']), + ': ', + msg.loc + ]) + message.appendChild(getHeader(msg, keys, mini)) + } messageDiv.appendChild(message) return messageDiv diff --git a/views.js b/views.js index d6fb5f2..f98b88c 100644 --- a/views.js +++ b/views.js @@ -4,7 +4,36 @@ function threadPage (src, keys) { }) } +function getLoc (src) { + var loc = h('span') + bog().then(log => { + if (log) { + for (var i = 0; i < log.length; i++) { + if (((log[i].located === src) && (log[i].author === src)) || ((log[i].located === src.key) && (log[i].author === src.author))) { + // if you've identified someone as something else show that something else + return loc.textContent = log[i].loc + } + } + } + }) + return loc +} + + function profilePage (src, keys) { + + var interval = 500 + + timer = function() { + if (src === window.location.hash.substring(1)) { + if (interval < 10000) { interval = interval + 50 } + sync([src], keys) + setTimeout(timer, interval) + } + } + + timer() + var msg = {} msg.author = src @@ -12,6 +41,21 @@ function profilePage (src, keys) { var profile = h('div', {classList: 'profile'}) var banner = h('div', {classList: 'banner'}) + function getDesc (src) { + var desc = h('span') + bog().then(log => { + if (log) { + for (var i = 0; i < log.length; i++) { + if ((log[i].descripted === src) && (log[i].author === src)) { + // if you've identified someone as something else show that something else + return desc.innerHTML = marked(log[i].description) + } + } + } + }) + return desc + } + function getBg (src, profile) { bog().then(log => { if (log) { @@ -26,33 +70,23 @@ function profilePage (src, keys) { }) } + getBg(src, profile) profileDiv.appendChild(banner) profileDiv.appendChild(profile) scroller.appendChild(profileDiv) - var subs = [src] - - var interval = 2500 - timer = function() { - if (src === window.location.hash.substring(1)) { - if (interval < 10000) { interval = interval + 50 } - sync(subs, keys) - setTimeout(timer, interval) - } - } - timer() - - profile.appendChild(h('a', {href: '#' + src}, [ - getImage(src, keys, 'profileAvatar'), - getName(src, keys), + profile.appendChild(h('span', {classList: 'right'}, [getLoc(src)])) + profile.appendChild(h('div', [ + h('a', {href: '#' + src}, [ + getImage(src, keys, 'profileAvatar'), + getName(src, keys) + ]), + profile.appendChild(getDesc(src)) ])) - profile.appendChild(h('br')) - quickName(src).then(name => { - profile.appendChild(identify(src, profile, keys, name)) var mentionsButton = h('button', { onclick: function () { location.href = '#?' + src @@ -66,6 +100,15 @@ function profilePage (src, keys) { }, ['Reply to ' + name]) profile.appendChild(respond) + profile.appendChild(h('button', { + onclick: function () { + localforage.removeItem(src).then(function () { + var home = true + regenerate(home) + }) + } + }, ['Delete ' + name + '\'s feed'])) + if (src != keys.publicKey) { localforage.getItem('subscriptions').then(function (subs) { if (subs.includes(src)) { @@ -83,17 +126,12 @@ function profilePage (src, keys) { } }, ['Subscribe to ' + name])) } + profile.appendChild(identify(src, profile, keys)) }) + } else { + profile.appendChild(identify(src, profile, keys)) } - - profile.appendChild(h('button', { - onclick: function () { - localforage.removeItem(src).then(function () { - var home = true - regenerate(home) - }) - } - }, ['Delete ' + name + '\'s feed'])) + //profile.appendChild(identify(src, profile, keys, name)) }) -- cgit v1.2.3-70-g09d2 From 3f43899f39178365e42e7cd906b017f7e752295a Mon Sep 17 00:00:00 2001 From: Ev Bogue Date: Sun, 12 Jan 2020 07:19:01 -0600 Subject: fix distance between first post and navbar --- css/style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index cfa5012..135970e 100644 --- a/css/style.css +++ b/css/style.css @@ -61,11 +61,11 @@ hr { .message, .profile { border: 1px solid #ddd; background: white; - margin-bottom: .5em; padding: .3em .5em; } .message { + margin-top: .5em; border-radius: 5px; } -- cgit v1.2.3-70-g09d2