add images to all posts

master
Ev Bogue 4 years ago
parent d0d487baee
commit 69c84ce6ed

@ -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;

@ -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
}

@ -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])

Loading…
Cancel
Save