fix empty message

main
jerl 2024-04-15 23:53:54 -07:00
parent dff6a281c1
commit b3ae3f8a78
3 changed files with 29 additions and 29 deletions

View File

@ -46,9 +46,9 @@ function addMember() {
async function createThread(e) { async function createThread(e) {
e.preventDefault(); e.preventDefault();
let name = document.getElementById('newthreadname'); let name = document.getElementById('newthreadname').value;
if (!name.value) { if (!name) {
name.insertAdjacentHTML('afterend', `<p>name cannot be empty</p>`); document.getElementById('nameempty').classList.remove('hidden');
return; return;
} }
let members = window.threadmembers.map(name => ({ name })); let members = window.threadmembers.map(name => ({ name }));
@ -95,7 +95,7 @@ async function createThread(e) {
window.emit( window.emit(
'create_thread', 'create_thread',
{ {
name: name.value, name,
permissions, permissions,
members members
}, },
@ -119,6 +119,7 @@ function newThread() {
<form id='createthread' class='column' onsubmit=${createThread}> <form id='createthread' class='column' onsubmit=${createThread}>
<h3>create thread</h3> <h3>create thread</h3>
<label for='newthreadname' class='heading'>thread name</label> <label for='newthreadname' class='heading'>thread name</label>
<p id='nameempty' class='hidden'>name cannot be empty</p>
<input type='text' id='newthreadname' /> <input type='text' id='newthreadname' />
<p id='permissions'>thread permissions</p> <p id='permissions'>thread permissions</p>
<input type='radio' id='public' name='permissions' value='public' checked /> <input type='radio' id='public' name='permissions' value='public' checked />

View File

@ -1,9 +1,9 @@
import { render, html } from '/uhtml.js'; import { render, html } from '/uhtml.js';
function rand() { function rand() {
let str = ""; let str = '';
const lookups = const lookups =
"abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789".split(""); 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789'.split('');
while (str.length < 16) { while (str.length < 16) {
const n = Math.random() * lookups.length; const n = Math.random() * lookups.length;
str += lookups[Math.floor(n)]; str += lookups[Math.floor(n)];
@ -13,11 +13,11 @@ function rand() {
async function auth() { async function auth() {
const sig = await openpgp.sign({ const sig = await openpgp.sign({
message: new openpgp.CleartextMessage("vybe_auth " + window.session, ""), message: new openpgp.CleartextMessage('vybe_auth ' + window.session, ''),
signingKeys: window.keys.priv, signingKeys: window.keys.priv
}); });
window.socket.emit( window.socket.emit(
"authenticate", 'authenticate',
{ name: window.name, message: sig }, { name: window.name, message: sig },
msg => { msg => {
let register = document.getElementById('register'); let register = document.getElementById('register');
@ -35,7 +35,7 @@ async function auth() {
} }
render(document.body, html` render(document.body, html`
<div id="register" class='hidden'> <div id='register' class='hidden'>
<h1>welcome to vybe</h1> <h1>welcome to vybe</h1>
<h3>a communication network (beta)</h3> <h3>a communication network (beta)</h3>
<p> <p>
@ -45,7 +45,7 @@ render(document.body, html`
</p> </p>
<form onsubmit=${async e => { <form onsubmit=${async e => {
e.preventDefault(); e.preventDefault();
const name = document.getElementById("name").value; const name = document.getElementById('name').value;
if (!name) if (!name)
return; return;
const keys = await openpgp.generateKey({ const keys = await openpgp.generateKey({
@ -54,32 +54,30 @@ render(document.body, html`
const priv = await openpgp.readKey({ armoredKey: keys.privateKey }); const priv = await openpgp.readKey({ armoredKey: keys.privateKey });
const pub = await openpgp.readKey({ armoredKey: keys.publicKey }); const pub = await openpgp.readKey({ armoredKey: keys.publicKey });
window.emit( window.emit(
"create_user", 'create_user',
{ name, pubkey: keys.publicKey }, { name, pubkey: keys.publicKey },
(msg) => { (msg) => {
if (!msg.success) { if (!msg.success) {
document.querySelector('#registerform').insertAdjacentHTML( document.querySelector('#message').innerText = msg.message;
'afterend',
`<p>${msg.message}</p>`
);
return; return;
} }
window.keys = { priv, pub }; window.keys = { priv, pub };
localStorage.setItem("keys", JSON.stringify(keys)); localStorage.setItem('keys', JSON.stringify(keys));
localStorage.setItem("name", name); localStorage.setItem('name', name);
window.name = name; window.name = name;
auth(); auth();
} }
); );
}} id="registerform"> }} id='registerform'>
<label for="name">username: </label> <label for='name'>username: </label>
<input id="name" type="text" /> <input id='name' type='text' />
<button id="submit" type="submit">generate keys & register</button> <button id='submit' type='submit'>generate keys & register</button>
</form> </form>
<p id='message'></p>
</div> </div>
`); `);
const gensession = async () => { async function gensession() {
window.session = rand(); window.session = rand();
window.emit = (type, data, callback) => window.emit = (type, data, callback) =>
@ -91,16 +89,16 @@ const gensession = async () => {
}, },
callback callback
); );
}; }
window.onload = async () => { window.onload = async () => {
window.socket = io(); window.socket = io();
await gensession(); await gensession();
let keys = localStorage.getItem("keys"); let keys = localStorage.getItem('keys');
if (keys) { if (keys) {
window.name = localStorage.getItem("name"); window.name = localStorage.getItem('name');
keys = JSON.parse(keys); keys = JSON.parse(keys);
window.keys = { window.keys = {
priv: await openpgp.readKey({ armoredKey: keys.privateKey }), priv: await openpgp.readKey({ armoredKey: keys.privateKey }),
@ -111,9 +109,9 @@ window.onload = async () => {
else else
document.getElementById('register').classList.remove('hidden'); document.getElementById('register').classList.remove('hidden');
window.socket.io.on("reconnect", async attempt => { window.socket.io.on('reconnect', async attempt => {
await gensession(); await gensession();
if (localStorage.getItem("keys")) if (localStorage.getItem('keys'))
await auth(); await auth();
}); });
}; };

View File

@ -64,10 +64,11 @@
} }
#register { #register {
margin-inline: 14px; margin-inline: 14px;
max-width: 800px;
} }
.thread:hover, .thread:hover,
.tab:hover { .tab:hover {
background-color: #3b3b3b; background-color: #303030;
} }
.tab.active, .tab.active,
.thread.active, .thread.active,