mirror of
https://github.com/DJ2LS/FreeDATA
synced 2024-05-14 08:04:33 +00:00
1031 lines
No EOL
37 KiB
JavaScript
1031 lines
No EOL
37 KiB
JavaScript
const path = require('path')
|
|
const {
|
|
ipcRenderer
|
|
} = require('electron')
|
|
const {
|
|
v4: uuidv4
|
|
} = require('uuid');
|
|
const utf8 = require('utf8');
|
|
const blobUtil = require('blob-util')
|
|
// https://stackoverflow.com/a/26227660
|
|
var appDataFolder = process.env.APPDATA || (process.platform == 'darwin' ? process.env.HOME + '/Library/Application Support' : process.env.HOME + "/.config")
|
|
var configFolder = path.join(appDataFolder, "FreeDATA");
|
|
var configPath = path.join(configFolder, 'config.json')
|
|
const config = require(configPath);
|
|
// set date format
|
|
const dateFormat = new Intl.DateTimeFormat('en-GB', {
|
|
timeStyle: 'long',
|
|
dateStyle: 'full'
|
|
});
|
|
// set date format information
|
|
const dateFormatShort = new Intl.DateTimeFormat('en-GB', {
|
|
year: 'numeric',
|
|
month: 'numeric',
|
|
day: 'numeric',
|
|
hour: 'numeric',
|
|
minute: 'numeric',
|
|
second: 'numeric',
|
|
hour12: false,
|
|
});
|
|
|
|
const dateFormatHours = new Intl.DateTimeFormat('en-GB', {
|
|
hour: 'numeric',
|
|
minute: 'numeric',
|
|
hour12: false,
|
|
});
|
|
// split character
|
|
const split_char = '\0;\1;'
|
|
// global for our selected file we want to transmit
|
|
// ----------------- some chat globals
|
|
var filetype = '';
|
|
var file = '';
|
|
var filename = '';
|
|
var callsign_counter = 0;
|
|
var selected_callsign = '';
|
|
// -----------------------------------
|
|
|
|
var chatDB = path.join(configFolder, 'chatDB')
|
|
// ---- MessageDB
|
|
try{
|
|
var PouchDB = require('pouchdb');
|
|
} catch(err){
|
|
console.log(err);
|
|
|
|
/*
|
|
This is a fix for raspberryPi where we get an error when loading pouchdb because of
|
|
leveldown package isnt running on ARM devices.
|
|
pouchdb-browser does not depend on leveldb and seems to be working.
|
|
*/
|
|
console.log("using pouchdb-browser fallback")
|
|
var PouchDB = require('pouchdb-browser');
|
|
}
|
|
|
|
PouchDB.plugin(require('pouchdb-find'));
|
|
//PouchDB.plugin(require('pouchdb-replication'));
|
|
|
|
var db = new PouchDB(chatDB);
|
|
|
|
/*
|
|
// REMOTE SYNC ATTEMPTS
|
|
|
|
|
|
var remoteDB = new PouchDB('http://172.20.10.4:5984/chatDB')
|
|
|
|
// we need express packages for running pouchdb sync "express-pouchdb"
|
|
var express = require('express');
|
|
var app = express();
|
|
//app.use('/chatDB', require('express-pouchdb')(PouchDB));
|
|
//app.listen(5984);
|
|
|
|
app.use('/chatDB', require('pouchdb-express-router')(PouchDB));
|
|
app.listen(5984);
|
|
|
|
|
|
|
|
db.sync('http://172.20.10.4:5984/jojo', {
|
|
//var sync = PouchDB.sync('chatDB', 'http://172.20.10.4:5984/chatDB', {
|
|
live: true,
|
|
retry: false
|
|
}).on('change', function (change) {
|
|
// yo, something changed!
|
|
console.log(change)
|
|
}).on('paused', function (err) {
|
|
// replication was paused, usually because of a lost connection
|
|
console.log(err)
|
|
}).on('active', function (info) {
|
|
// replication was resumed
|
|
console.log(info)
|
|
}).on('error', function (err) {
|
|
// totally unhandled error (shouldn't happen)
|
|
console.log(err)
|
|
}).on('denied', function (err) {
|
|
// a document failed to replicate (e.g. due to permissions)
|
|
console.log(err)
|
|
}).on('complete', function (info) {
|
|
// handle complete;
|
|
console.log(info)
|
|
});
|
|
*/
|
|
|
|
var dxcallsigns = new Set();
|
|
db.createIndex({
|
|
index: {
|
|
fields: ['timestamp', 'uuid', 'dxcallsign', 'dxgrid', 'msg', 'checksum', 'type', 'command', 'status', 'percent', 'bytesperminute', '_attachments']
|
|
}
|
|
}).then(function(result) {
|
|
// handle result
|
|
console.log(result)
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
});
|
|
|
|
db.find({
|
|
selector: {
|
|
timestamp: {
|
|
$exists: true
|
|
}
|
|
},
|
|
sort: [{
|
|
'timestamp': 'asc'
|
|
}]
|
|
}).then(function(result) {
|
|
// handle result
|
|
if (typeof(result) !== 'undefined') {
|
|
result.docs.forEach(function(item) {
|
|
//console.log(item)
|
|
// another query with attachments
|
|
db.get(item._id, {
|
|
attachments: true
|
|
}).then(function(item_with_attachments){
|
|
update_chat(item_with_attachments);
|
|
});
|
|
|
|
|
|
|
|
});
|
|
}
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
});
|
|
// WINDOW LISTENER
|
|
window.addEventListener('DOMContentLoaded', () => {
|
|
|
|
|
|
// theme selector
|
|
if(config.theme != 'default'){
|
|
var theme_path = "../node_modules/bootswatch/dist/"+ config.theme +"/bootstrap.min.css";
|
|
document.getElementById("bootstrap_theme").href = theme_path;
|
|
} else {
|
|
var theme_path = "../node_modules/bootstrap/dist/css/bootstrap.min.css";
|
|
document.getElementById("bootstrap_theme").href = theme_path;
|
|
}
|
|
|
|
|
|
document.querySelector('emoji-picker').addEventListener("emoji-click", (event) => {
|
|
document.getElementById('chatModuleMessage').setRangeText(event.detail.emoji.unicode)
|
|
console.log(event.detail);
|
|
})
|
|
document.getElementById("emojipickerbutton").addEventListener("click", () => {
|
|
var element = document.getElementById("emojipickercontainer")
|
|
console.log(element.style.display);
|
|
if (element.style.display === "none") {
|
|
element.style.display = "block";
|
|
} else {
|
|
element.style.display = "none";
|
|
}
|
|
})
|
|
document.getElementById("delete_selected_chat").addEventListener("click", () => {
|
|
db.find({
|
|
selector: {
|
|
dxcallsign: selected_callsign
|
|
}
|
|
}).then(function(result) {
|
|
// handle result
|
|
if (typeof(result) !== 'undefined') {
|
|
result.docs.forEach(function(item) {
|
|
console.log(item)
|
|
db.get(item._id).then(function(doc) {
|
|
db.remove(doc).then(function(doc) {
|
|
return location.reload();
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
});
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
});
|
|
|
|
});
|
|
}
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
});
|
|
})
|
|
document.getElementById("selectFilesButton").addEventListener("click", () => {
|
|
//document.getElementById('selectFiles').click();
|
|
ipcRenderer.send('select-file', {
|
|
title: 'Title',
|
|
});
|
|
})
|
|
|
|
document.getElementById("ping").addEventListener("click", () => {
|
|
ipcRenderer.send('run-tnc-command', {
|
|
command: 'ping', dxcallsign: selected_callsign
|
|
});
|
|
})
|
|
|
|
|
|
document.addEventListener("keyup", function(event) {
|
|
// Number 13 == Enter
|
|
if (event.keyCode === 13 && !event.shiftKey) {
|
|
// Cancel the default action, if needed
|
|
event.preventDefault();
|
|
// Trigger the button element with a click
|
|
document.getElementById("sendMessage").click();
|
|
}
|
|
});
|
|
|
|
// ADJUST TEXTAREA SIZE
|
|
document.getElementById("chatModuleMessage").addEventListener("input", () => {
|
|
var textarea = document.getElementById("chatModuleMessage");
|
|
var text = textarea.value;
|
|
|
|
if(document.getElementById("expand_textarea").checked){
|
|
var lines = 6
|
|
} else {
|
|
var lines = text.split("\n").length
|
|
|
|
if (lines >= 6){
|
|
lines = 6;
|
|
}
|
|
|
|
}
|
|
var message_container_height_offset = 130 + (20*lines);
|
|
var message_container_height = `calc(100% - ${message_container_height_offset}px)`;
|
|
document.getElementById("message-container").style.height = message_container_height;
|
|
textarea.rows = lines;
|
|
|
|
console.log(textarea.value)
|
|
|
|
|
|
})
|
|
|
|
document.getElementById("expand_textarea").addEventListener("click", () => {
|
|
var textarea = document.getElementById("chatModuleMessage");
|
|
|
|
if(document.getElementById("expand_textarea").checked){
|
|
var lines=6
|
|
document.getElementById("expand_textarea_button").className = "bi bi-chevron-compact-down";
|
|
|
|
} else {
|
|
var lines=1
|
|
document.getElementById("expand_textarea_button").className = "bi bi-chevron-compact-up";
|
|
}
|
|
|
|
var message_container_height_offset = 130 + (20*lines);
|
|
//var message_container_height_offset = 90 + (23*lines);
|
|
var message_container_height = `calc(100% - ${message_container_height_offset}px)`;
|
|
document.getElementById("message-container").style.height = message_container_height;
|
|
textarea.rows = lines;
|
|
console.log(textarea.rows)
|
|
|
|
})
|
|
|
|
|
|
// NEW CHAT
|
|
|
|
document.getElementById("createNewChatButton").addEventListener("click", () => {
|
|
var dxcallsign = document.getElementById('chatModuleNewDxCall').value;
|
|
var uuid = uuidv4()
|
|
db.post({
|
|
|
|
_id: uuid,
|
|
timestamp: Math.floor(Date.now() / 1000),
|
|
dxcallsign: dxcallsign.toUpperCase(),
|
|
dxgrid: '---',
|
|
msg: 'null',
|
|
checksum: 'null',
|
|
type: 'newchat',
|
|
status: 'null',
|
|
uuid: uuid
|
|
|
|
}).then(function(response) {
|
|
// handle response
|
|
console.log("new database entry");
|
|
console.log(response);
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
});
|
|
update_chat_obj_by_uuid(uuid);
|
|
|
|
});
|
|
|
|
// SEND MSG
|
|
document.getElementById("sendMessage").addEventListener("click", () => {
|
|
document.getElementById('emojipickercontainer').style.display = "none";
|
|
|
|
var dxcallsign = selected_callsign.toUpperCase();
|
|
var textarea = document.getElementById('chatModuleMessage')
|
|
var chatmessage = textarea.value;
|
|
|
|
// reset textarea size
|
|
var message_container_height_offset = 150;
|
|
var message_container_height = `calc(100% - ${message_container_height_offset}px)`;
|
|
document.getElementById("message-container").style.height = message_container_height;
|
|
textarea.rows = 1
|
|
document.getElementById("expand_textarea_button").className = "bi bi-chevron-compact-up";
|
|
document.getElementById("expand_textarea").checked = false;
|
|
|
|
console.log(file);
|
|
console.log(filename);
|
|
console.log(filetype);
|
|
if (filetype == ''){
|
|
filetype = 'plain/text'
|
|
}
|
|
var timestamp = Math.floor(Date.now() / 1000);
|
|
|
|
var file_checksum = crc32(file).toString(16).toUpperCase();
|
|
console.log(file_checksum)
|
|
var data_with_attachment = timestamp + split_char + chatmessage + split_char + filename + split_char + filetype + split_char + file;
|
|
|
|
document.getElementById('selectFilesButton').innerHTML = ``;
|
|
var uuid = uuidv4();
|
|
console.log(data_with_attachment)
|
|
let Data = {
|
|
command: "send_message",
|
|
dxcallsign: dxcallsign,
|
|
mode: 255,
|
|
frames: 1,
|
|
data: data_with_attachment,
|
|
checksum: file_checksum,
|
|
uuid: uuid
|
|
};
|
|
ipcRenderer.send('run-tnc-command', Data);
|
|
db.post({
|
|
_id: uuid,
|
|
timestamp: timestamp,
|
|
dxcallsign: dxcallsign,
|
|
dxgrid: 'null',
|
|
msg: chatmessage,
|
|
checksum: file_checksum,
|
|
type: "transmit",
|
|
status: 'transmit',
|
|
uuid: uuid,
|
|
_attachments: {
|
|
[filename]: {
|
|
content_type: filetype,
|
|
data: btoa(file)
|
|
}
|
|
}
|
|
}).then(function(response) {
|
|
// handle response
|
|
console.log("new database entry");
|
|
console.log(response);
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
});
|
|
|
|
update_chat_obj_by_uuid(uuid);
|
|
|
|
// clear input
|
|
document.getElementById('chatModuleMessage').value = ''
|
|
|
|
// after adding file data to our attachment variable, delete it from global
|
|
filetype = '';
|
|
file = '';
|
|
filename = '';
|
|
|
|
|
|
})
|
|
// cleanup after transmission
|
|
filetype = '';
|
|
file = '';
|
|
filename = '';
|
|
});
|
|
ipcRenderer.on('return-selected-files', (event, arg) => {
|
|
filetype = arg.mime;
|
|
console.log(filetype)
|
|
|
|
file = arg.data;
|
|
filename = arg.filename;
|
|
document.getElementById('selectFilesButton').innerHTML = `
|
|
<span class="position-absolute top-0 start-85 translate-middle p-2 bg-danger border border-light rounded-circle">
|
|
<span class="visually-hidden">New file selected</span>
|
|
</span>
|
|
`;
|
|
});
|
|
ipcRenderer.on('action-update-transmission-status', (event, arg) => {
|
|
var data = arg["data"][0]
|
|
console.log(data.status);
|
|
db.get(data.uuid, {
|
|
attachments: true
|
|
}).then(function(doc) {
|
|
return db.put({
|
|
_id: data.uuid,
|
|
_rev: doc._rev,
|
|
timestamp: doc.timestamp,
|
|
dxcallsign: doc.dxcallsign,
|
|
dxgrid: doc.dxgrid,
|
|
msg: doc.msg,
|
|
checksum: doc.checksum,
|
|
type: "transmit",
|
|
status: data.status,
|
|
percent: data.percent,
|
|
bytesperminute: data.bytesperminute,
|
|
uuid: doc.uuid,
|
|
_attachments: doc._attachments
|
|
});
|
|
}).then(function(response) {
|
|
update_chat_obj_by_uuid(data.uuid);
|
|
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
console.log(data)
|
|
});
|
|
});
|
|
ipcRenderer.on('action-new-msg-received', (event, arg) => {
|
|
console.log(arg.data)
|
|
|
|
var new_msg = arg.data;
|
|
new_msg.forEach(function(item) {
|
|
console.log(item.status)
|
|
let obj = new Object();
|
|
|
|
//handle ping
|
|
if (item.ping == 'received') {
|
|
obj.timestamp = parseInt(item.timestamp);
|
|
obj.dxcallsign = item.dxcallsign;
|
|
obj.dxgrid = item.dxgrid;
|
|
obj.uuid = item.uuid;
|
|
obj.command = 'ping';
|
|
obj.checksum = 'null';
|
|
obj.msg = 'null';
|
|
obj.status = item.status;
|
|
obj.snr = item.snr;
|
|
obj.type = 'ping';
|
|
obj.filename = 'null';
|
|
obj.filetype = 'null';
|
|
obj.file = 'null';
|
|
|
|
add_obj_to_database(obj)
|
|
update_chat_obj_by_uuid(obj.uuid);
|
|
|
|
// handle beacon
|
|
} else if (item.beacon == 'received') {
|
|
obj.timestamp = parseInt(item.timestamp);
|
|
obj.dxcallsign = item.dxcallsign;
|
|
obj.dxgrid = item.dxgrid;
|
|
obj.uuid = item.uuid;
|
|
obj.command = 'beacon';
|
|
obj.checksum = 'null';
|
|
obj.msg = 'null';
|
|
obj.status = item.status;
|
|
obj.snr = item.snr;
|
|
obj.type = 'beacon';
|
|
obj.filename = 'null';
|
|
obj.filetype = 'null';
|
|
obj.file = 'null';
|
|
|
|
add_obj_to_database(obj);
|
|
update_chat_obj_by_uuid(obj.uuid);
|
|
|
|
|
|
// handle ARQ transmission
|
|
} else if (item.arq == 'transmission' && item.status == 'received') {
|
|
var encoded_data = atob(item.data);
|
|
var splitted_data = encoded_data.split(split_char);
|
|
|
|
console.log(splitted_data)
|
|
|
|
obj.timestamp = parseInt(splitted_data[4]);
|
|
obj.dxcallsign = item.dxcallsign;
|
|
obj.dxgrid = item.dxgrid;
|
|
obj.command = splitted_data[1];
|
|
obj.checksum = splitted_data[2];
|
|
// convert message to unicode from utf8 because of emojis
|
|
obj.uuid = utf8.decode(splitted_data[3]);
|
|
obj.msg = utf8.decode(splitted_data[5]);
|
|
obj.status = 'null';
|
|
obj.snr = 'null';
|
|
obj.type = 'received';
|
|
obj.filename = utf8.decode(splitted_data[6]);
|
|
obj.filetype = utf8.decode(splitted_data[7]);
|
|
obj.file = btoa(splitted_data[8]);
|
|
|
|
add_obj_to_database(obj);
|
|
update_chat_obj_by_uuid(obj.uuid);
|
|
|
|
}
|
|
});
|
|
//window.location = window.location;
|
|
});
|
|
|
|
|
|
|
|
|
|
// Update chat list
|
|
update_chat = function(obj) {
|
|
var dxcallsign = obj.dxcallsign;
|
|
var timestamp = dateFormat.format(obj.timestamp * 1000);
|
|
var timestampShort = dateFormatShort.format(obj.timestamp * 1000);
|
|
var timestampHours = dateFormatHours.format(obj.timestamp * 1000);
|
|
|
|
var dxgrid = obj.dxgrid;
|
|
|
|
// define shortmessage
|
|
if (obj.msg == 'null' || obj.msg == 'NULL'){
|
|
var shortmsg = obj.type;
|
|
} else {
|
|
var shortmsg = obj.msg;
|
|
var maxlength = 30;
|
|
var shortmsg = shortmsg.length > maxlength ? shortmsg.substring(0, maxlength - 3) + "..." : shortmsg;
|
|
|
|
}
|
|
try {
|
|
//console.log(Object.keys(obj._attachments)[0].length)
|
|
if (typeof(obj._attachments) !== 'undefined' && Object.keys(obj._attachments)[0].length > 0) {
|
|
//var filename = obj._attachments;
|
|
var filename = Object.keys(obj._attachments)[0]
|
|
var filetype = filename.split('.')[1]
|
|
var filesize = obj._attachments[filename]["length"] + " Bytes";
|
|
if (filesize == 'undefined Bytes'){
|
|
// get filesize of new submitted data
|
|
// not that nice....
|
|
// we really should avoid converting back from base64 for performance reasons...
|
|
var filesize = Math.ceil(atob(obj._attachments[filename]["data"]).length) + "Bytes";
|
|
}
|
|
|
|
// check if image, then display it
|
|
if(filetype == 'image/png' || filetype =="png"){
|
|
var fileheader = `
|
|
<div class="card-header border-0 bg-transparent text-end p-0 mb-0 hover-overlay">
|
|
<img class="w-100 rounded-2" src="data:image/png;base64,${obj._attachments[filename]["data"]}">
|
|
<p class="text-right mb-0 p-1 text-black" style="text-align: right; font-size : 1rem">
|
|
<span class="p-1" style="text-align: right; font-size : 0.8rem">${filename}</span>
|
|
<span class="p-1" style="text-align: right; font-size : 0.8rem">${filesize}</span>
|
|
<i class="bi bi-filetype-${filetype}" style="font-size: 2rem;"></i>
|
|
</p>
|
|
</div>
|
|
<hr class="m-0 p-0">
|
|
`;
|
|
|
|
}else{
|
|
|
|
var fileheader = `
|
|
<div class="card-header border-0 bg-transparent text-end p-0 mb-0 hover-overlay">
|
|
<p class="text-right mb-0 p-1 text-black" style="text-align: right; font-size : 1rem">
|
|
<span class="p-1" style="text-align: right; font-size : 0.8rem">${filename}</span>
|
|
<span class="p-1" style="text-align: right; font-size : 0.8rem">${filesize}</span>
|
|
<i class="bi bi-filetype-${filetype}" style="font-size: 2rem;"></i>
|
|
</p>
|
|
</div>
|
|
<hr class="m-0 p-0">
|
|
`;
|
|
}
|
|
|
|
|
|
|
|
var controlarea_transmit = `
|
|
<div class="ms-auto" id="msg-${obj._id}-control-area">
|
|
<button class="btn bg-transparent p-1 m-1"><i class="bi bi-arrow-repeat" id="retransmit-msg-${obj._id}" style="font-size: 1.2rem; color: grey;"></i></button>
|
|
<button class="btn bg-transparent p-1 m-1"><i class="bi bi-download" id="save-file-msg-${obj._id}" style="font-size: 1.2rem; color: grey;"></i></button>
|
|
</div>
|
|
|
|
`;
|
|
|
|
var controlarea_receive = `
|
|
|
|
<div class="me-auto" id="msg-${obj._id}-control-area">
|
|
<button class="btn bg-transparent p-1 m-1"><i class="bi bi-download" id="save-file-msg-${obj._id}" style="font-size: 1.2rem; color: grey;"></i></button>
|
|
</div>
|
|
|
|
`;
|
|
|
|
} else {
|
|
var filename = '';
|
|
var fileheader = '';
|
|
var filetype = 'text/plain';
|
|
var controlarea_transmit = `
|
|
<div class="ms-auto" id="msg-${obj._id}-control-area">
|
|
<button class="btn bg-transparent p-1 m-1"><i class="bi bi-arrow-repeat" id="retransmit-msg-${obj._id}" style="font-size: 1.2rem; color: grey;"></i></button>
|
|
</div>
|
|
`;
|
|
var controlarea_receive = '';
|
|
}
|
|
} catch (err) {
|
|
console.log("error with database parsing...")
|
|
console.log(err)
|
|
}
|
|
// CALLSIGN LIST
|
|
if (!(document.getElementById('chat-' + dxcallsign + '-list'))) {
|
|
// increment callsign counter
|
|
callsign_counter++;
|
|
if (callsign_counter == 1) {
|
|
var callsign_selected = 'active show'
|
|
//document.getElementById('chatModuleDxCall').value = dxcallsign;
|
|
selected_callsign = dxcallsign;
|
|
}
|
|
|
|
var new_callsign = `
|
|
<a class="list-group-item list-group-item-action rounded-4 rounded-top rounded-bottom border-1 mb-2 ${callsign_selected}" id="chat-${dxcallsign}-list" data-bs-toggle="list" href="#chat-${dxcallsign}" role="tab" aria-controls="chat-${dxcallsign}">
|
|
|
|
<div class="d-flex w-100 justify-content-between">
|
|
<div class="rounded-circle p-0">
|
|
<i class="bi bi-person-circle p-1" style="font-size:2rem;"></i>
|
|
</div>
|
|
|
|
<h5 class="mb-1">${dxcallsign}</h5>
|
|
<span class="badge bg-secondary text-white p-1 h-100" id="chat-${dxcallsign}-list-dxgrid"><small>${dxgrid}</small></span>
|
|
<span style="font-size:0.8rem;" id="chat-${dxcallsign}-list-time">${timestampHours}</span>
|
|
<span class="position-absolute m-2 bottom-0 end-0" style="font-size:0.8rem;" id="chat-${dxcallsign}-list-shortmsg">${shortmsg}</span>
|
|
</div>
|
|
|
|
</a>
|
|
|
|
`;
|
|
document.getElementById('list-tab').insertAdjacentHTML("beforeend", new_callsign);
|
|
var message_area = `
|
|
<div class="tab-pane fade ${callsign_selected}" id="chat-${dxcallsign}" role="tabpanel" aria-labelledby="chat-${dxcallsign}-list"></div>
|
|
`;
|
|
document.getElementById('nav-tabContent').insertAdjacentHTML("beforeend", message_area);
|
|
// create eventlistener for listening on clicking on a callsign
|
|
document.getElementById('chat-' + dxcallsign + '-list').addEventListener('click', function() {
|
|
//document.getElementById('chatModuleDxCall').value = dxcallsign;
|
|
selected_callsign = dxcallsign;
|
|
|
|
|
|
setTimeout(scrollMessagesToBottom, 200);
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
// if callsign entry already exists - update
|
|
} else {
|
|
|
|
// gridsquare - update only on receive
|
|
if (obj.type !== 'transmit'){
|
|
document.getElementById('chat-' + dxcallsign +'-list-dxgrid').innerHTML = dxgrid;
|
|
}
|
|
// time
|
|
document.getElementById('chat-' + dxcallsign +'-list-time').innerHTML = timestampHours;
|
|
// short message
|
|
document.getElementById('chat-' + dxcallsign +'-list-shortmsg').innerHTML = shortmsg;
|
|
|
|
|
|
}
|
|
// APPEND MESSAGES TO CALLSIGN
|
|
|
|
if (!(document.getElementById('msg-' + obj._id))) {
|
|
if (obj.type == 'ping') {
|
|
var new_message = `
|
|
<div class="m-auto mt-1 p-0 w-50 rounded bg-secondary bg-gradient" id="msg-${obj._id}">
|
|
<p class="text-small text-white mb-0 text-break" style="font-size: 0.7rem;"><i class="m-3 bi bi-arrow-left-right"></i>snr: ${obj.snr} - ${timestamp} </p>
|
|
|
|
</div>
|
|
`;
|
|
}
|
|
if (obj.type == 'beacon') {
|
|
var new_message = `
|
|
<div class="p-0 rounded m-auto mt-1 w-50 bg-info bg-gradient" id="msg-${obj._id}">
|
|
<p class="text-small text-white text-break" style="font-size: 0.7rem;"><i class="m-3 bi bi-broadcast"></i>snr: ${obj.snr} - ${timestamp} </p>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
if (obj.type == 'newchat') {
|
|
var new_message = `
|
|
<div class="p-0 rounded m-auto mt-1 w-50 bg-light bg-gradient" id="msg-${obj._id}">
|
|
<p class="text-small text-dark text-break" style="font-size: 0.7rem;"><i class="m-3 bi bi-file-earmark-plus"></i> new chat opened - ${timestamp} </p>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
|
|
// CHECK FOR NEW LINE AND REPLACE WITH <br>
|
|
var message_html = obj.msg.replaceAll(/\n/g, "<br>");
|
|
|
|
|
|
if (obj.type == 'received') {
|
|
var new_message = `
|
|
<div class="d-flex align-items-center" style="margin-left: auto;"> <!-- max-width: 75%; -->
|
|
|
|
<div class="mt-3 rounded-3 mb-0" style="max-width: 75%;" id="msg-${obj._id}">
|
|
<!--<p class="font-monospace text-small mb-0 text-muted text-break">${timestamp}</p>-->
|
|
<div class="card border-light bg-light" id="msg-${obj._id}">
|
|
${fileheader}
|
|
|
|
<div class="card-body rounded-3 p-0">
|
|
<p class="card-text p-2 mb-0 text-break text-wrap">${message_html}</p>
|
|
<p class="text-right mb-0 p-1 text-white" style="text-align: left; font-size : 0.9rem">
|
|
<span class="badge bg-light text-muted">${timestamp}</span>
|
|
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
${controlarea_receive}
|
|
|
|
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
if (obj.type == 'transmit') {
|
|
|
|
//console.log('msg-' + obj._id + '-status')
|
|
|
|
if (obj.status == 'failed'){
|
|
var progressbar_bg = 'bg-danger';
|
|
} else {
|
|
var progressbar_bg = 'bg-primary';
|
|
}
|
|
|
|
var new_message = `
|
|
|
|
<div class="d-flex align-items-center"> <!-- max-width: 75%; w-75 -->
|
|
|
|
${controlarea_transmit}
|
|
|
|
<div class="rounded-3 mt-2 mb-0" style="max-width: 75%;" > <!-- w-100 style="margin-left: auto;"-->
|
|
|
|
<!--<p class="font-monospace text-right mb-0 text-muted" style="text-align: right;">${timestamp}</p>-->
|
|
<div class="card border-primary bg-primary" id="msg-${obj._id}">
|
|
${fileheader}
|
|
|
|
<div class="card-body rounded-3 p-0 text-right bg-primary">
|
|
<p class="card-text p-1 mb-0 text-white text-break text-wrap">${message_html}</p>
|
|
<p class="text-right mb-0 p-1 text-white" style="text-align: right; font-size : 0.9rem">
|
|
<span class="text-light" style="font-size: 0.7rem;">${timestamp} - </span>
|
|
|
|
<span class="text-white" id="msg-${obj._id}-status" style="font-size:0.8rem;">${get_icon_for_state(obj.status)}</span>
|
|
|
|
<!--<button type="button" id="retransmit-msg-${obj._id}" class="btn btn-sm btn-light p-0" style="height:20px;width:30px"><i class="bi bi-arrow-repeat" style="font-size: 0.9rem; color: black;"></i></button>-->
|
|
|
|
</p>
|
|
|
|
<div class="progress p-0 m-0 rounded-0 rounded-bottom bg-secondary" style="height: 10px;">
|
|
<div class="progress-bar progress-bar-striped ${progressbar_bg} p-0 m-0 rounded-0" id="msg-${obj._id}-progress" role="progressbar" style="width: ${obj.percent}%;" aria-valuenow="${obj.percent}" aria-valuemin="0" aria-valuemax="100">
|
|
</div>
|
|
|
|
|
|
<p class="justify-content-center d-flex position-absolute m-0 p-0 w-100 text-white" style="font-size: xx-small" id="msg-${obj._id}-progress-information">
|
|
${obj.percent} % - ${obj.bytesperminute} Bpm
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
`;
|
|
}
|
|
// CHECK CHECK CHECK --> This could be done better
|
|
var id = "chat-" + obj.dxcallsign
|
|
document.getElementById(id).insertAdjacentHTML("beforeend", new_message);
|
|
|
|
/* UPDATE EXISTING ELEMENTS */
|
|
} else if (document.getElementById('msg-' + obj._id)) {
|
|
console.log("element already exists......")
|
|
console.log(obj)
|
|
|
|
console.log(document.getElementById('msg-' + obj._id + '-progress').getAttribute("aria-valuenow"))
|
|
|
|
document.getElementById('msg-' + obj._id + '-status').innerHTML = get_icon_for_state(obj.status);
|
|
|
|
document.getElementById('msg-' + obj._id + '-progress').setAttribute("aria-valuenow", obj.percent);
|
|
document.getElementById('msg-' + obj._id + '-progress').setAttribute("style", "width:" + obj.percent + "%;");
|
|
document.getElementById('msg-' + obj._id + '-progress-information').innerHTML = obj.percent + "% - " + obj.bytesperminute + " Bpm";
|
|
|
|
if (obj.percent >= 100){
|
|
//document.getElementById('msg-' + obj._id + '-progress').classList.remove("progress-bar-striped");
|
|
document.getElementById('msg-' + obj._id + '-progress').classList.remove("progress-bar-animated");
|
|
document.getElementById('msg-' + obj._id + '-progress').classList.remove("bg-danger");
|
|
document.getElementById('msg-' + obj._id + '-progress').classList.add("bg-primary");
|
|
|
|
document.getElementById('msg-' + obj._id + '-progress').innerHTML = '';
|
|
} else {
|
|
document.getElementById('msg-' + obj._id + '-progress').classList.add("progress-bar-striped");
|
|
document.getElementById('msg-' + obj._id + '-progress').classList.add("progress-bar-animated");
|
|
}
|
|
|
|
if (obj.status == 'failed'){
|
|
//document.getElementById('msg-' + obj._id + '-progress').classList.remove("progress-bar-striped");
|
|
document.getElementById('msg-' + obj._id + '-progress').classList.remove("progress-bar-animated");
|
|
document.getElementById('msg-' + obj._id + '-progress').classList.remove("bg-primary");
|
|
document.getElementById('msg-' + obj._id + '-progress').classList.add("bg-danger");
|
|
}
|
|
|
|
|
|
|
|
//document.getElementById(id).className = message_class;
|
|
}
|
|
|
|
|
|
|
|
|
|
// CREATE SAVE TO FOLDER EVENT LISTENER
|
|
if (document.getElementById('save-file-msg-' + obj._id) && !document.getElementById('save-file-msg-' + obj._id).hasAttribute('listenerOnClick')) {
|
|
|
|
// set Attribute to determine if we already created an EventListener for this element
|
|
document.getElementById('save-file-msg-' + obj._id).setAttribute('listenerOnClick', 'true');
|
|
|
|
document.getElementById('save-file-msg-' + obj._id).addEventListener("click", () => {
|
|
saveFileToFolder(obj._id)
|
|
});
|
|
|
|
|
|
}
|
|
// CREATE RESEND MSG EVENT LISTENER
|
|
|
|
// check if element exists and if we already created NOT created an event listener
|
|
if (document.getElementById('retransmit-msg-' + obj._id) && !document.getElementById('retransmit-msg-' + obj._id).hasAttribute('listenerOnClick')) {
|
|
|
|
// set Attribute to determine if we already created an EventListener for this element
|
|
document.getElementById('retransmit-msg-' + obj._id).setAttribute('listenerOnClick', 'true');
|
|
document.getElementById('retransmit-msg-' + obj._id).addEventListener("click", () => {
|
|
|
|
db.get(obj._id, {
|
|
attachments: true
|
|
}).then(function(doc) {
|
|
// handle doc
|
|
console.log(doc)
|
|
|
|
var filename = Object.keys(obj._attachments)[0]
|
|
var filetype = filename.content_type
|
|
|
|
console.log(filename)
|
|
console.log(filetype)
|
|
var file = obj._attachments[filename].data
|
|
console.log(file)
|
|
console.log(Object.keys(obj._attachments)[0].data)
|
|
|
|
//var file = atob(obj._attachments[filename]["data"])
|
|
db.getAttachment(obj._id, filename).then(function(data) {
|
|
console.log(data)
|
|
// convert blob data to binary string
|
|
blobUtil.blobToBinaryString(data).then(function (binaryString) {
|
|
console.log(binaryString)
|
|
}).catch(function (err) {
|
|
// error
|
|
console.log(err);
|
|
binaryString = blobUtil.arrayBufferToBinaryString(data);
|
|
|
|
}).then(function(){
|
|
|
|
console.log(binaryString)
|
|
console.log(binaryString.length)
|
|
|
|
var data_with_attachment = doc.timestamp + split_char + utf8.encode(doc.msg) + split_char + filename + split_char + filetype + split_char + binaryString;
|
|
let Data = {
|
|
command: "send_message",
|
|
dxcallsign: doc.dxcallsign,
|
|
mode: 255,
|
|
frames: 1,
|
|
data: data_with_attachment,
|
|
checksum: doc.checksum,
|
|
uuid: doc.uuid
|
|
};
|
|
console.log(Data)
|
|
ipcRenderer.send('run-tnc-command', Data);
|
|
|
|
});
|
|
});
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
});
|
|
});
|
|
|
|
}
|
|
//window.location = window.location
|
|
|
|
// scroll to bottom on new message
|
|
scrollMessagesToBottom();
|
|
|
|
}
|
|
|
|
|
|
|
|
function saveFileToFolder(id) {
|
|
db.get(id, {
|
|
attachments: true
|
|
}).then(function(obj) {
|
|
console.log(obj)
|
|
console.log(Object.keys(obj._attachments)[0].content_type)
|
|
var filename = Object.keys(obj._attachments)[0]
|
|
var filetype = filename.content_type
|
|
var file = filename.data
|
|
console.log(file)
|
|
console.log(filename.data)
|
|
db.getAttachment(id, filename).then(function(data) {
|
|
// handle result
|
|
console.log(data.length)
|
|
//data = new Blob([data.buffer], { type: 'image/png' } /* (1) */)
|
|
console.log(data)
|
|
// we need to encode data because of error "an object could not be cloned"
|
|
let Data = {
|
|
file: data,
|
|
filename: filename,
|
|
filetype: filetype,
|
|
}
|
|
console.log(Data)
|
|
ipcRenderer.send('save-file-to-folder', Data);
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
return false
|
|
});
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
});
|
|
}
|
|
|
|
|
|
// function for setting an ICON to the corresponding state
|
|
function get_icon_for_state(state) {
|
|
if (state == 'transmit') {
|
|
var status_icon = '<i class="bi bi-check" style="font-size:1rem;"></i>';
|
|
} else if (state == 'transmitting') {
|
|
//var status_icon = '<i class="bi bi-arrow-left-right" style="font-size:0.8rem;"></i>';
|
|
var status_icon = `
|
|
<i class="spinner-border ms-auto" style="width: 0.8rem; height: 0.8rem;" role="status" aria-hidden="true"></i>
|
|
`;
|
|
} else if (state == 'failed') {
|
|
var status_icon = '<i class="bi bi-exclamation-circle" style="font-size:1rem;"></i>';
|
|
} else if (state == 'transmitted') {
|
|
var status_icon = '<i class="bi bi-check-all" style="font-size:1rem;"></i>';
|
|
} else {
|
|
var status_icon = '<i class="bi bi-question" style="font-size:1rem;"></i>';
|
|
}
|
|
return status_icon;
|
|
}
|
|
|
|
|
|
|
|
update_chat_obj_by_uuid = function(uuid) {
|
|
db.get(uuid, {
|
|
attachments: true
|
|
}).then(function(doc) {
|
|
update_chat(doc)
|
|
//return doc
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
});
|
|
}
|
|
|
|
|
|
add_obj_to_database = function(obj){
|
|
db.put({
|
|
_id: obj.uuid,
|
|
timestamp: parseInt(obj.timestamp),
|
|
uuid: obj.uuid,
|
|
dxcallsign: obj.dxcallsign,
|
|
dxgrid: obj.dxgrid,
|
|
msg: obj.msg,
|
|
checksum: obj.checksum,
|
|
type: obj.type,
|
|
command: obj.command,
|
|
status: obj.status,
|
|
snr: obj.snr,
|
|
_attachments: {
|
|
[obj.filename]: {
|
|
content_type: obj.filetype,
|
|
data: obj.file
|
|
}
|
|
}
|
|
}).then(function(response) {
|
|
console.log("new database entry");
|
|
console.log(response);
|
|
}).catch(function(err) {
|
|
console.log(err);
|
|
});
|
|
}
|
|
|
|
|
|
// Scroll to bottom of message-container
|
|
function scrollMessagesToBottom() {
|
|
var messageBody = document.getElementById('message-container');
|
|
messageBody.scrollTop = messageBody.scrollHeight - messageBody.clientHeight;
|
|
}
|
|
|
|
|
|
|
|
// CRC CHECKSUMS
|
|
// https://stackoverflow.com/a/50579690
|
|
// crc32 calculation
|
|
//console.log(crc32('abc'));
|
|
//var crc32=function(r){for(var a,o=[],c=0;c<256;c++){a=c;for(var f=0;f<8;f++)a=1&a?3988292384^a>>>1:a>>>1;o[c]=a}for(var n=-1,t=0;t<r.length;t++)n=n>>>8^o[255&(n^r.charCodeAt(t))];return(-1^n)>>>0};
|
|
//console.log(crc32('abc').toString(16).toUpperCase()); // hex
|
|
|
|
var makeCRCTable = function(){
|
|
var c;
|
|
var crcTable = [];
|
|
for(var n =0; n < 256; n++){
|
|
c = n;
|
|
for(var k =0; k < 8; k++){
|
|
c = ((c&1) ? (0xEDB88320 ^ (c >>> 1)) : (c >>> 1));
|
|
}
|
|
crcTable[n] = c;
|
|
}
|
|
return crcTable;
|
|
}
|
|
|
|
var crc32 = function(str) {
|
|
var crcTable = window.crcTable || (window.crcTable = makeCRCTable());
|
|
var crc = 0 ^ (-1);
|
|
|
|
for (var i = 0; i < str.length; i++ ) {
|
|
crc = (crc >>> 8) ^ crcTable[(crc ^ str.charCodeAt(i)) & 0xFF];
|
|
}
|
|
|
|
return (crc ^ (-1)) >>> 0;
|
|
}; |