diff options
| -rw-r--r-- | public/scripts/2_encryption.js | 20 | ||||
| -rw-r--r-- | public/scripts/4_input_pin.js | 55 | ||||
| -rw-r--r-- | public/scripts/chat.js | 68 | ||||
| -rw-r--r-- | public/styles/main.sass | 1 | ||||
| -rw-r--r-- | public/styles/pin.sass | 38 | ||||
| -rw-r--r-- | public/styles/style.sass | 6 | ||||
| -rw-r--r-- | views/index.pug | 33 |
7 files changed, 183 insertions, 38 deletions
diff --git a/public/scripts/2_encryption.js b/public/scripts/2_encryption.js index e33b475..a6f610e 100644 --- a/public/scripts/2_encryption.js +++ b/public/scripts/2_encryption.js @@ -105,8 +105,7 @@ async function encrypt(data, publicKey) { * @returns {Promise<String>} */ async function decrypt(data, publicKey, privateKey, passphrase) { - const privateKeyObj = (await openpgp.key.readArmored(privateKey)).keys[0]; - await privateKeyObj.decrypt(passphrase); + const privateKeyObj = await decryptPrivateKey(privateKey, passphrase); const options = { message: await openpgp.message.readArmored(data), @@ -114,7 +113,19 @@ async function decrypt(data, publicKey, privateKey, passphrase) { privateKeys: [privateKeyObj] }; - return await openpgp.decrypt(options).then(plaintext => plaintext.data) + return await openpgp.decrypt(options).then(plaintext => plaintext.data); +} + +/** + * Decrypts the private key + * @param privateKey + * @param passphrase + * @returns {Promise<module:key.Key>} + */ +async function decryptPrivateKey(privateKey, passphrase) { + const privateKeyObj = (await openpgp.key.readArmored(privateKey)).keys[0]; + await privateKeyObj.decrypt(passphrase); + return privateKeyObj; } /** @@ -187,9 +198,8 @@ exports.getPrivate = getPrivateKey; exports.getPublic = getPublicKey; exports.encrypt = encrypt; exports.decrypt = decrypt; +exports.decryptPrivate = decryptPrivateKey; exports.check = isEncrypted; exports.store = storePeerPublicKey; exports.get = getPeerPublicKey; exports.test = testEncryption; - -window.pgp = openpgp; diff --git a/public/scripts/4_input_pin.js b/public/scripts/4_input_pin.js new file mode 100644 index 0000000..e0c96bd --- /dev/null +++ b/public/scripts/4_input_pin.js @@ -0,0 +1,55 @@ +const $ = require('jquery'); +let pin = []; + +/** + * Initializes actions of the pin input field + * @param callback + */ +function init(callback) { + $('#1').focus().on('input', (el) => { + pin.push($(el.target).val()); + $(el.target).val('*'); + $('#' + (parseInt($(el.target).attr('id')) + 1).toString()).focus(); + }); + + $('#2').on('input', (el) => { + pin.push($(el.target).val()); + $(el.target).val('*'); + $('#' + (parseInt($(el.target).attr('id')) + 1).toString()).focus(); + }); + + $('#3').on('input', (el) => { + pin.push($(el.target).val()); + $(el.target).val('*'); + $('#' + (parseInt($(el.target).attr('id')) + 1).toString()).focus(); + }); + + $('#4').on('input', (el) => { + pin.push($(el.target).val()); + $(el.target).val('*'); + console.log(pin); + callback(pin.join('')) + }); +} + +/** + * Displays error message and clears input + */ +function isWrong() { + $('#pin_message').text('Passphrase is wrong!'); + for (let i = 1; i < 5; i++) $(`#${i}`).val(''); + $('#1').focus(); + pin = []; +} + +/** + * Display generation message + */ +function needsGeneration() { + // TODO: Add loading animation + $('#pin_message').text('Generating keys...'); +} + +exports.init = init; +exports.failure = isWrong; +exports.generate = needsGeneration; diff --git a/public/scripts/chat.js b/public/scripts/chat.js index b50ec81..eb08c98 100644 --- a/public/scripts/chat.js +++ b/public/scripts/chat.js @@ -1,13 +1,18 @@ +// general imports const $ = require('jquery'); const encryption = require('./2_encryption'); const wordList = require('./3_wordlist'); +const pinInput = require('./4_input_pin'); const xkcdPassword = require('xkcd-password'); +// setup vars const host = '127.0.0.1'; let peerId; +let passphrase; let connectedPeer; let connectedPeers = []; // TODO: Save new peers in array +// setup generator const generator = new xkcdPassword(); generator.initWithWordList(wordList); @@ -16,15 +21,35 @@ generator.initWithWordList(wordList); peerId = await generator.generate().then(words => words.join('-')); encryption.setup(); if (localStorage.getItem('database') === 'success' && await encryption.check()) { - // TODO: Ask for passphrase - chat(); + pinInput.init(async pin => { + try { + await encryption.decryptPrivate(await encryption.getPrivate(), pin); + chat() + } catch (e) { + // TODO: 3 passphrase tries + console.error('Passphrase is wrong!'); + pinInput.failure(); + } + }); } else { - console.log('[LOG] No existing keys found! Generating...'); - (async () => await encryption.generate(peerId, 'supersecure').then(() => chat()))() + pinInput.init(pin => { + console.log('[LOG] No existing keys found! Generating...'); + pinInput.generate(); + passphrase = pin; + (async () => await encryption.generate(peerId, passphrase).then(() => chat()))() + }); } })(); +/** + * Initializes chat functions + */ function chat() { + // hide pin input and display chat + $('#enter_pin').hide(); + $('#chat').fadeIn(); + + // start the peer const peer = new Peer(peerId, {host: host, port: 8080, path: '/api', debug: 0}); // Peer events @@ -33,8 +58,11 @@ function chat() { peer.on('connection', conn => { connectedPeer = conn; console.log('[LOG] Connected with', connectedPeer.peer); - connectedPeer.on('open', async () => await encryption.getPublic().then(res => transferKey(res))); - connectedPeer.on('data', async message => await receivedMessage(message)); + connectedPeer.on('open', async () => transferKey(await encryption.getPublic())); + connectedPeer.on('data', async message => { + console.log('[LOG] Received new message!'); + await receivedMessage(message); + }) }); /** @@ -43,13 +71,16 @@ function chat() { * @returns {Promise<void>} */ async function connect(id) { - const connectionId = await generator.generate().then(words => words.join('-')); + const connectionId = (await generator.generate()).join('-'); console.log('[LOG] Connecting to', id); console.log('[LOG] Your connection ID is', connectionId); connectedPeer = peer.connect(id, {label: connectionId, reliable: true}); console.log('[LOG] Connected with', connectedPeer.peer); - connectedPeer.on('open', async () => await encryption.getPublic().then(res => transferKey(res))); - connectedPeer.on('data', async message => await receivedMessage(message)) + connectedPeer.on('open', async () => transferKey(await encryption.getPublic())); + connectedPeer.on('data', async message => { + console.log('[LOG] Received new message!'); + await receivedMessage(message); + }) } /** @@ -59,12 +90,11 @@ function chat() { */ async function sendMessage(message) { console.log(`[LOG] Sending message '${message}' to ${connectedPeer.peer}`); - await encryption.get(connectedPeer.peer).then(async peerKey => { - await encryption.encrypt(message, peerKey).then(async encrypted => { - connectedPeer.send({type: 'text', data: encrypted}); - await receivedMessage(message, true); - }) - }) + connectedPeer.send({ + type: 'text', + data: await encryption.encrypt(message, await encryption.get(connectedPeer.peer)) + }); + await receivedMessage(message, true); } /** @@ -86,12 +116,8 @@ function chat() { $('#messages').append(`<span style="color: green">${message}</span><br>`); } else { if (message.type === 'text') { - await encryption.get(connectedPeer.peer).then(async peerKey => { - await encryption.getPrivate().then(async privateKey => { - await encryption.decrypt(message.data, peerKey, privateKey, 'supersecure') - .then(plaintext => $('#messages').append(`${plaintext}<br>`)); - }) - }) + await encryption.decrypt(message.data, await encryption.get(connectedPeer.peer), await encryption.getPrivate(), passphrase) + .then(plaintext => $('#messages').append(`${plaintext}<br>`)); } else if (message.type === 'key') { await encryption.store(connectedPeer.peer, message.data) } diff --git a/public/styles/main.sass b/public/styles/main.sass index d7377ab..a6f0d2e 100644 --- a/public/styles/main.sass +++ b/public/styles/main.sass @@ -1,3 +1,4 @@ // Normal input doesn't work here for npm packages! @import "../../node_modules/bulma/bulma" @import "style" +@import "pin" diff --git a/public/styles/pin.sass b/public/styles/pin.sass new file mode 100644 index 0000000..3aea4fc --- /dev/null +++ b/public/styles/pin.sass @@ -0,0 +1,38 @@ +.columns + min-height: 100% + +.enter-pin + position: relative + top: 50% + transform: translateY(-50%) + +.pin-wrapper + padding: 0 + margin: 0 + align-items: center + justify-content: center + +.pin-wrapper > .column + align-items: center + justify-content: center + +.pin-wrapper > .column input + width: 15vw + height: 15vw + font-size: 15vw + background-color: #2d3338 + color: transparent + text-shadow: 0 0 0 #000 + border: none + border-radius: 10px + text-align: center + +.pin-wrapper > .column input::-webkit-outer-spin-button, .pin-wrapper > .column input::-webkit-inner-spin-button + -webkit-appearance: none + margin: 0 + +.pin-wrapper > .column input:focus + border-color: inherit + -webkit-box-shadow: none + box-shadow: none + outline: none diff --git a/public/styles/style.sass b/public/styles/style.sass index 16ce7fe..4d38d4b 100644 --- a/public/styles/style.sass +++ b/public/styles/style.sass @@ -4,6 +4,9 @@ html, body overflow: hidden !important background-color: #23272a !important +.chat + display: none + .main align-items: flex-start @@ -26,6 +29,3 @@ html, body width: 100% bottom: 0 left: 0 - -.columns - min-height: 100% diff --git a/views/index.pug b/views/index.pug index edcec7f..ac8c13e 100644 --- a/views/index.pug +++ b/views/index.pug @@ -1,16 +1,17 @@ extends layout block content - button.button.add-peer-button.is-big.is-outlined.is-info(toggle-contact-modal) - i.fas.fa-plus + .chat#chat + button.button.add-peer-button.is-big.is-outlined.is-info(toggle-contact-modal) + i.fas.fa-plus - .columns.level.main - .section.column.level-right - #messages - .message-field - input#message.message-input.input(placeholder='Enter a message') - button#send_message.message-button.button.is-success(type=submit) - i.fas.fa-paper-plane + .columns.level.main + .section.column.level-right + #messages + .message-field + input#message.message-input.input(placeholder='Enter a message') + button#send_message.message-button.button.is-success(type=submit) + i.fas.fa-paper-plane .modal#add_contact_modal .modal-background @@ -23,3 +24,17 @@ block content footer.modal-card-foot button#add_peer_id.button.is-success(toggle-contact-modal) Add button.button(aria-label='close', toggle-contact-modal) Cancel + + .enter-pin#enter_pin + .title.has-text-centered Enter a passphrase + .subtitle.has-text-centered.is-danger#pin_message + .columns.is-centered.is-flex.pin-wrapper + .column.is-centered.is-flex + input#1(type='text', maxlength=1, min=0, max=9) + .column.is-centered.is-flex + input#2(type='text', maxlength=1, min=0, max=9) + .column.is-centered.is-flex + input#3(type='text', maxlength=1, min=0, max=9) + .column.is-centered.is-flex + input#4(type='text', maxlength=1, min=0, max=9) + |