snxraven/LinkUp-P2P-Chat
1
1
Fork 2
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

Reworking bot code. Again... #7

Merged
snxraven merged 5 commits from MiTask/LinkUp-P2P-Chat:main into main 2024-06-11 16:38:55 -04:00
Conversation 0 Commits 5 Files Changed 11 +457 -135
9 changed files with 457 additions and 135 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 5bb5e63105 - Show all commits

3
.idea/.gitignore vendored Normal file
View File

@ -0,0 +1,3 @@
# Default ignored files
/shelf/
/workspace.xml

12
.idea/LinkUp-P2P-Chat.iml Normal file
View File

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$">
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
<excludeFolder url="file://$MODULE_DIR$/temp" />
<excludeFolder url="file://$MODULE_DIR$/tmp" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>

6
.idea/misc.xml Normal file
View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="JavaScriptSettings">
<option name="languageLevel" value="FLOW" />
</component>
</project>

8
.idea/modules.xml Normal file
View File

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/LinkUp-P2P-Chat.iml" filepath="$PROJECT_DIR$/.idea/LinkUp-P2P-Chat.iml" />
</modules>
</component>
</project>

6
.idea/vcs.xml Normal file
View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="" vcs="Git" />
</component>
</project>

416
app.js
View File

@ -16,7 +16,7 @@ await drive.ready();
let swarm; let swarm;
let registeredUsers = JSON.parse(localStorage.getItem('registeredUsers')) || {}; let registeredUsers = JSON.parse(localStorage.getItem('registeredUsers')) || {};
let peerCount = 0; let peerCount = 0;
let currentRoom = null; let activeRooms = [];
const eventEmitter = new EventEmitter(); const eventEmitter = new EventEmitter();
// Define servePort at the top level // Define servePort at the top level
@ -29,7 +29,10 @@ let config = {
rooms: [] rooms: []
}; };
// Function to get a random port between 1337 and 2223 // Store messages for each room
let messagesStore = {};
// Function to get a random port between 49152 and 65535
function getRandomPort() { function getRandomPort() {
return Math.floor(Math.random() * (65535 - 49152 + 1)) + 49152; return Math.floor(Math.random() * (65535 - 49152 + 1)) + 49152;
} }
@ -73,40 +76,38 @@ async function initialize() {
toggleSetupBtn.addEventListener('click', toggleSetupView); toggleSetupBtn.addEventListener('click', toggleSetupView);
} }
if (removeRoomBtn) { if (removeRoomBtn) {
removeRoomBtn.addEventListener('click', leaveRoom); removeRoomBtn.addEventListener('click', () => {
const topic = document.querySelector('#chat-room-topic').innerText;
leaveRoom(topic);
});
} }
if (attachFileButton) { if (attachFileButton) {
attachFileButton.addEventListener('click', () => fileInput.click()); attachFileButton.addEventListener('click', () => fileInput.click());
} }
if (fileInput) { if (fileInput) {
fileInput.addEventListener('change', async (event) => { fileInput.addEventListener('change', handleFileInput);
const file = event.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = async (event) => {
const buffer = new Uint8Array(event.target.result);
const filePath = `/files/${file.name}`;
await drive.put(filePath, buffer);
const fileUrl = `http://localhost:${servePort}${filePath}`;
sendFileMessage(config.userName, fileUrl, file.type, config.userAvatar);
};
reader.readAsArrayBuffer(file);
}
});
} }
const configExists = fs.existsSync("./config.json"); const configExists = fs.existsSync("./config.json");
if (configExists) { if (configExists) {
config = JSON.parse(fs.readFileSync("./config.json", 'utf8')); config = JSON.parse(fs.readFileSync("./config.json", 'utf8'));
console.log("Read config from file:", config) console.log("Read config from file:", config);
// Update port in URLs // Update port in URLs
config.userAvatar = updatePortInUrl(config.userAvatar); config.userAvatar = updatePortInUrl(config.userAvatar);
config.rooms.forEach(room => { config.rooms.forEach(room => {
addRoomToListWithoutWritingToConfig(room); room.alias = room.alias || truncateHash(room.topic);
}); });
for (let user in registeredUsers) { for (let user in registeredUsers) {
registeredUsers[user] = updatePortInUrl(registeredUsers[user]); registeredUsers[user] = updatePortInUrl(registeredUsers[user]);
} }
renderRoomList(); // Render the room list with aliases
// Connect to all rooms on startup
for (const room of config.rooms) {
const topicBuffer = b4a.from(room.topic, 'hex');
await joinSwarm(topicBuffer);
}
} }
const registerDiv = document.querySelector('#register'); const registerDiv = document.querySelector('#register');
@ -115,15 +116,30 @@ async function initialize() {
} }
eventEmitter.on('onMessage', async (messageObj) => { eventEmitter.on('onMessage', async (messageObj) => {
console.log('Received message:', messageObj); // Debugging log
if (messageObj.type === 'icon') { if (messageObj.type === 'icon') {
const username = messageObj.username; const username = messageObj.username;
const avatarBuffer = Buffer.from(messageObj.avatar, 'base64'); if (messageObj.avatar) {
await drive.put(`/icons/${username}.png`, avatarBuffer); const avatarBuffer = b4a.from(messageObj.avatar, 'base64');
updateIcon(username, avatarBuffer); await drive.put(`/icons/${username}.png`, avatarBuffer);
updateIcon(username, avatarBuffer);
} else {
console.error('Received icon message with missing avatar data:', messageObj);
}
} else if (messageObj.type === 'file') { } else if (messageObj.type === 'file') {
addFileMessage(messageObj.name, messageObj.fileName, messageObj.fileUrl, messageObj.fileType, messageObj.avatar); if (messageObj.file && messageObj.fileName) {
const fileBuffer = b4a.from(messageObj.file, 'base64');
await drive.put(`/files/${messageObj.fileName}`, fileBuffer);
const fileUrl = `http://localhost:${servePort}/files/${messageObj.fileName}`;
addFileMessage(messageObj.name, messageObj.fileName, updatePortInUrl(fileUrl), messageObj.fileType, updatePortInUrl(messageObj.avatar), messageObj.topic);
} else {
console.error('Received file message with missing file data or fileName:', messageObj);
}
} else if (messageObj.type === 'message') {
onMessageAdded(messageObj.name, messageObj.message, messageObj.avatar, messageObj.topic);
} else { } else {
onMessageAdded(messageObj.name, messageObj.message, messageObj.avatar); console.error('Received unknown message type:', messageObj);
} }
}); });
@ -138,7 +154,7 @@ async function initialize() {
const iconMessage = JSON.stringify({ const iconMessage = JSON.stringify({
type: 'icon', type: 'icon',
username: config.userName, username: config.userName,
avatar: iconBuffer.toString('base64'), avatar: b4a.toString(iconBuffer, 'base64'),
}); });
connection.write(iconMessage); connection.write(iconMessage);
} }
@ -162,6 +178,11 @@ async function initialize() {
swarm.on('close', () => { swarm.on('close', () => {
console.log('Swarm closed'); console.log('Swarm closed');
}); });
// Initialize highlight.js once the DOM is fully loaded
document.addEventListener("DOMContentLoaded", (event) => {
hljs.highlightAll();
});
} }
function registerUser(e) { function registerUser(e) {
@ -214,7 +235,7 @@ async function createChatRoom() {
const topicBuffer = crypto.randomBytes(32); const topicBuffer = crypto.randomBytes(32);
const topic = b4a.toString(topicBuffer, 'hex'); const topic = b4a.toString(topicBuffer, 'hex');
addRoomToList(topic); addRoomToList(topic);
joinSwarm(topicBuffer); await joinSwarm(topicBuffer);
} }
async function joinChatRoom(e) { async function joinChatRoom(e) {
@ -222,27 +243,21 @@ async function joinChatRoom(e) {
const topicStr = document.querySelector('#join-chat-room-topic').value; const topicStr = document.querySelector('#join-chat-room-topic').value;
const topicBuffer = b4a.from(topicStr, 'hex'); const topicBuffer = b4a.from(topicStr, 'hex');
addRoomToList(topicStr); addRoomToList(topicStr);
joinSwarm(topicBuffer); await joinSwarm(topicBuffer);
} }
async function joinSwarm(topicBuffer) { async function joinSwarm(topicBuffer) {
if (currentRoom) {
currentRoom.destroy();
}
document.querySelector('#setup').classList.add('hidden');
document.querySelector('#loading').classList.remove('hidden');
const discovery = swarm.join(topicBuffer, { client: true, server: true });
await discovery.flushed();
const topic = b4a.toString(topicBuffer, 'hex'); const topic = b4a.toString(topicBuffer, 'hex');
document.querySelector('#chat-room-topic').innerText = topic; // Set full topic here if (!activeRooms.some(room => room.topic === topic)) {
document.querySelector('#loading').classList.add('hidden'); const discovery = swarm.join(topicBuffer, { client: true, server: true });
document.querySelector('#chat').classList.remove('hidden'); await discovery.flushed();
currentRoom = discovery; activeRooms.push({ topic, discovery });
clearMessages();
console.log('Joined room:', topic); // Debugging log
renderMessagesForRoom(topic);
}
} }
function addRoomToList(topic) { function addRoomToList(topic) {
@ -250,43 +265,118 @@ function addRoomToList(topic) {
const roomItem = document.createElement('li'); const roomItem = document.createElement('li');
roomItem.textContent = truncateHash(topic); roomItem.textContent = truncateHash(topic);
roomItem.dataset.topic = topic; roomItem.dataset.topic = topic;
roomItem.addEventListener('dblclick', () => enterEditMode(roomItem));
roomItem.addEventListener('click', () => switchRoom(topic)); roomItem.addEventListener('click', () => switchRoom(topic));
roomList.appendChild(roomItem); roomList.appendChild(roomItem);
config.rooms.push(topic); config.rooms.push({ topic, alias: truncateHash(topic) });
writeConfigToFile("./config.json"); writeConfigToFile("./config.json");
} }
function addRoomToListWithoutWritingToConfig(topic) { function enterEditMode(roomItem) {
const roomList = document.querySelector('#room-list'); const originalText = roomItem.textContent;
const roomItem = document.createElement('li'); const topic = roomItem.dataset.topic;
roomItem.textContent = truncateHash(topic); roomItem.innerHTML = '';
roomItem.dataset.topic = topic;
roomItem.addEventListener('click', () => switchRoom(topic)); const input = document.createElement('input');
roomList.appendChild(roomItem); input.type = 'text';
input.value = originalText;
input.style.maxWidth = '100%'; // Add this line to set the max width
input.style.boxSizing = 'border-box'; // Add this line to ensure padding and border are included in the width
roomItem.appendChild(input);
input.focus();
input.addEventListener('blur', () => {
exitEditMode(roomItem, input, topic);
});
input.addEventListener('keydown', (e) => {
if (e.key === 'Enter') {
exitEditMode(roomItem, input, topic);
} else if (e.key === 'Escape') {
roomItem.textContent = originalText;
}
});
}
function exitEditMode(roomItem, input, topic) {
const newAlias = input.value.trim();
if (newAlias) {
roomItem.textContent = newAlias;
// Update the config with the new alias
const roomConfig = config.rooms.find(room => room.topic === topic);
if (roomConfig) {
roomConfig.alias = newAlias;
writeConfigToFile("./config.json");
}
// Check if the edited room is the current room in view
const currentTopic = document.querySelector('#chat-room-topic').innerText;
if (currentTopic === topic) {
const chatRoomName = document.querySelector('#chat-room-name');
if (chatRoomName) {
chatRoomName.innerText = newAlias;
}
}
} else {
roomItem.textContent = truncateHash(topic);
}
} }
function switchRoom(topic) { function switchRoom(topic) {
const topicBuffer = b4a.from(topic, 'hex'); console.log('Switching to room:', topic); // Debugging log
joinSwarm(topicBuffer); const chatRoomTopic = document.querySelector('#chat-room-topic');
const chatRoomName = document.querySelector('#chat-room-name');
if (chatRoomTopic) {
chatRoomTopic.innerText = topic; // Set full topic here
} else {
console.error('Element #chat-room-topic not found');
}
if (chatRoomName) {
// Update the room name in the header
const room = config.rooms.find(r => r.topic === topic);
const roomName = room ? room.alias : truncateHash(topic);
chatRoomName.innerText = roomName;
} else {
console.error('Element #chat-room-name not found');
}
clearMessages();
renderMessagesForRoom(topic);
// Show chat UI elements
document.querySelector('#chat').classList.remove('hidden');
document.querySelector('#setup').classList.add('hidden');
} }
function leaveRoom() { function leaveRoom(topic) {
if (currentRoom) { const roomIndex = activeRooms.findIndex(room => room.topic === topic);
const topic = b4a.toString(currentRoom.topic, 'hex'); if (roomIndex !== -1) {
const roomItem = document.querySelector(`li[data-topic="${topic}"]`); const room = activeRooms[roomIndex];
if (roomItem) { room.discovery.destroy();
roomItem.remove(); activeRooms.splice(roomIndex, 1);
} }
config.rooms = config.rooms.filter(e => e !== topic); const roomItem = document.querySelector(`li[data-topic="${topic}"]`);
writeConfigToFile("./config.json"); if (roomItem) {
roomItem.remove();
currentRoom.destroy(); }
currentRoom = null;
config.rooms = config.rooms.filter(e => e.topic !== topic);
writeConfigToFile("./config.json");
if (activeRooms.length > 0) {
switchRoom(activeRooms[0].topic);
} else {
document.querySelector('#chat').classList.add('hidden');
document.querySelector('#setup').classList.remove('hidden');
} }
document.querySelector('#chat').classList.add('hidden');
document.querySelector('#setup').classList.remove('hidden');
} }
function sendMessage(e) { function sendMessage(e) {
@ -294,7 +384,11 @@ function sendMessage(e) {
const message = document.querySelector('#message').value; const message = document.querySelector('#message').value;
document.querySelector('#message').value = ''; document.querySelector('#message').value = '';
onMessageAdded(config.userName, message, config.userAvatar); const topic = document.querySelector('#chat-room-topic').innerText;
console.log('Sending message:', message); // Debugging log
onMessageAdded(config.userName, message, config.userAvatar, topic);
let peersPublicKeys = []; let peersPublicKeys = [];
peersPublicKeys.push([...swarm.connections].map(peer => peer.remotePublicKey.toString('hex'))); peersPublicKeys.push([...swarm.connections].map(peer => peer.remotePublicKey.toString('hex')));
@ -306,7 +400,7 @@ function sendMessage(e) {
name: config.userName, name: config.userName,
message, message,
avatar: config.userAvatar, avatar: config.userAvatar,
topic: b4a.toString(currentRoom.topic, 'hex'), topic: topic,
peers: peersPublicKeys, // Deprecated. To be deleted in future updates peers: peersPublicKeys, // Deprecated. To be deleted in future updates
timestamp: Date.now(), timestamp: Date.now(),
readableTimestamp: new Date().toLocaleString(), // Added human-readable timestamp readableTimestamp: new Date().toLocaleString(), // Added human-readable timestamp
@ -318,6 +412,41 @@ function sendMessage(e) {
} }
} }
async function handleFileInput(event) {
const file = event.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = async (event) => {
const buffer = new Uint8Array(event.target.result);
const filePath = `/files/${file.name}`;
await drive.put(filePath, buffer);
const fileUrl = `http://localhost:${servePort}${filePath}`;
const topic = document.querySelector('#chat-room-topic').innerText;
const fileMessage = {
type: 'file',
name: config.userName,
fileName: file.name,
file: b4a.toString(buffer, 'base64'),
fileType: file.type,
avatar: updatePortInUrl(config.userAvatar),
topic: topic
};
console.log('Sending file message:', fileMessage); // Debugging log
const peers = [...swarm.connections];
for (const peer of peers) {
peer.write(JSON.stringify(fileMessage));
}
addFileMessage(config.userName, file.name, fileUrl, file.type, config.userAvatar, topic);
};
reader.readAsArrayBuffer(file);
}
}
function sendFileMessage(name, fileUrl, fileType, avatar) { function sendFileMessage(name, fileUrl, fileType, avatar) {
const fileName = fileUrl.split('/').pop(); const fileName = fileUrl.split('/').pop();
const messageObj = JSON.stringify({ const messageObj = JSON.stringify({
@ -327,7 +456,7 @@ function sendFileMessage(name, fileUrl, fileType, avatar) {
fileUrl, fileUrl,
fileType, fileType,
avatar, avatar,
topic: b4a.toString(currentRoom.topic, 'hex'), topic: document.querySelector('#chat-room-topic').innerText,
timestamp: Date.now(), timestamp: Date.now(),
}); });
@ -336,10 +465,11 @@ function sendFileMessage(name, fileUrl, fileType, avatar) {
peer.write(messageObj); peer.write(messageObj);
} }
addFileMessage(name, fileName, fileUrl, fileType, avatar); addFileMessage(name, fileName, fileUrl, fileType, avatar, document.querySelector('#chat-room-topic').innerText);
} }
function addFileMessage(from, fileName, fileUrl, fileType, avatar) { function addFileMessage(from, fileName, fileUrl, fileType, avatar, topic) {
console.log('Adding file message:', { from, fileName, fileUrl, fileType, avatar, topic }); // Debugging log
const $div = document.createElement('div'); const $div = document.createElement('div');
$div.classList.add('message'); $div.classList.add('message');
@ -363,16 +493,27 @@ function addFileMessage(from, fileName, fileUrl, fileType, avatar) {
$image.classList.add('attached-image'); $image.classList.add('attached-image');
$content.appendChild($image); $content.appendChild($image);
} else { } else {
const $fileLink = document.createElement('a'); const $fileButton = document.createElement('button');
$fileLink.href = fileUrl; $fileButton.textContent = `Download File: ${fileName}`;
$fileLink.textContent = `File: ${fileName}`; $fileButton.onclick = function() {
$fileLink.download = fileName; const $fileLink = document.createElement('a');
$content.appendChild($fileLink); $fileLink.href = fileUrl;
$fileLink.download = fileName;
$fileLink.click();
};
$content.appendChild($fileButton);
} }
$div.appendChild($content); $div.appendChild($content);
document.querySelector('#messages').appendChild($div);
scrollToBottom(); // Only render the message if it's for the current room
const currentTopic = document.querySelector('#chat-room-topic').innerText;
if (currentTopic === topic) {
document.querySelector('#messages').appendChild($div);
scrollToBottom();
} else {
console.log(`Message for topic ${topic} not rendered because current topic is ${currentTopic}`); // Debugging log
}
} }
function updatePeerCount() { function updatePeerCount() {
@ -387,37 +528,61 @@ function scrollToBottom() {
container.scrollTop = container.scrollHeight; container.scrollTop = container.scrollHeight;
} }
function onMessageAdded(from, message, avatar) { function onMessageAdded(from, message, avatar, topic) {
const $div = document.createElement('div'); console.log('Adding message:', { from, message, avatar, topic }); // Debugging log
$div.classList.add('message'); const messageObj = {
from,
const $img = document.createElement('img'); message,
avatar
};
$img.src = updatePortInUrl(avatar) || 'https://via.placeholder.com/40'; // Default to a placeholder image if avatar URL is not provided // Add the message to the store
console.log(updatePortInUrl(avatar)) addMessageToStore(topic, messageObj);
$img.classList.add('avatar');
$div.appendChild($img);
const $content = document.createElement('div'); // Only render messages for the current room
$content.classList.add('message-content'); const currentTopic = document.querySelector('#chat-room-topic').innerText;
if (currentTopic === topic) {
const $div = document.createElement('div');
$div.classList.add('message');
const $header = document.createElement('div'); const $img = document.createElement('img');
$header.classList.add('message-header'); $img.src = updatePortInUrl(avatar) || 'https://via.placeholder.com/40'; // Default to a placeholder image if avatar URL is not provided
$header.textContent = from; $img.classList.add('avatar');
$div.appendChild($img);
const $text = document.createElement('div'); const $content = document.createElement('div');
$text.classList.add('message-text'); $content.classList.add('message-content');
const md = window.markdownit(); const $header = document.createElement('div');
const markdownContent = md.render(message); $header.classList.add('message-header');
$text.innerHTML = markdownContent; $header.textContent = from;
$content.appendChild($header); const $text = document.createElement('div');
$content.appendChild($text); $text.classList.add('message-text');
$div.appendChild($content);
document.querySelector('#messages').appendChild($div); const md = window.markdownit({
scrollToBottom(); highlight: function (str, lang) {
if (lang && hljs.getLanguage(lang)) {
try {
return hljs.highlight(str, { language: lang }).value;
} catch (__) {}
}
return ''; // use external default escaping
}
});
const markdownContent = md.render(message);
$text.innerHTML = markdownContent;
$content.appendChild($header);
$content.appendChild($text);
$div.appendChild($content);
document.querySelector('#messages').appendChild($div);
scrollToBottom();
} else {
console.log(`Message for topic ${topic} not rendered because current topic is ${currentTopic}`); // Debugging log
}
} }
function truncateHash(hash) { function truncateHash(hash) {
@ -429,7 +594,7 @@ async function updateIcon(username, avatarBuffer) {
if (userIcon) { if (userIcon) {
const avatarBlob = new Blob([avatarBuffer], { type: 'image/png' }); const avatarBlob = new Blob([avatarBuffer], { type: 'image/png' });
const avatarUrl = URL.createObjectURL(avatarBlob); const avatarUrl = URL.createObjectURL(avatarBlob);
userIcon.src = avatarUrl; userIcon.src = updatePortInUrl(avatarUrl);
config.userAvatar = avatarUrl; config.userAvatar = avatarUrl;
writeConfigToFile("./config.json"); writeConfigToFile("./config.json");
@ -462,4 +627,45 @@ function updatePortInUrl(url) {
return urlObject.toString(); return urlObject.toString();
} }
initialize(); function renderRoomList() {
const roomList = document.querySelector('#room-list');
roomList.innerHTML = '';
config.rooms.forEach(room => {
const roomItem = document.createElement('li');
roomItem.textContent = room.alias || truncateHash(room.topic);
roomItem.dataset.topic = room.topic;
roomItem.addEventListener('dblclick', () => enterEditMode(roomItem));
roomItem.addEventListener('click', () => switchRoom(room.topic));
roomList.appendChild(roomItem);
});
}
function renderMessagesForRoom(topic) {
console.log('Rendering messages for room:', topic); // Debugging log
// Clear the message area
clearMessages();
// Fetch and render messages for the selected room
const messages = getMessagesForRoom(topic);
messages.forEach(message => {
onMessageAdded(message.from, message.message, message.avatar, topic);
});
}
function getMessagesForRoom(topic) {
return messagesStore[topic] || [];
}
function addMessageToStore(topic, messageObj) {
if (!messagesStore[topic]) {
messagesStore[topic] = [];
}
messagesStore[topic].push(messageObj);
}
// Call this function when loading the rooms initially
renderRoomList();
initialize();

53
chatBot/includes/Client.js
View File

@ -1,5 +1,5 @@
import Hyperswarm from 'hyperswarm'; import Hyperswarm from 'hyperswarm';
import EventEmitter from 'node:events' import EventEmitter from 'node:events';
import b4a from "b4a"; import b4a from "b4a";
class Client extends EventEmitter { class Client extends EventEmitter {
@ -8,15 +8,21 @@ class Client extends EventEmitter {
if(!botName) return console.error("Bot Name is not defined!"); if(!botName) return console.error("Bot Name is not defined!");
this.botName = botName; this.botName = botName;
this.swarm = new Hyperswarm(); this.swarm = new Hyperswarm();
this.joinedRooms = new Set(); // Track the rooms the bot has joined
this.currentTopic = null; // Track the current topic
this.setupSwarm(); this.setupSwarm();
} }
setupSwarm() { setupSwarm() {
this.swarm.on('connection', (peer) => { this.swarm.on('connection', (peer) => {
peer.on('data', message => { peer.on('data', message => {
if(message.type === "message") this.emit('onMessage', peer, JSON.parse(message.toString())); const messageObj = JSON.parse(message.toString());
if(message.type === "icon") this.emit('onIcon', peer, JSON.parse(message.toString())); if (this.joinedRooms.has(messageObj.topic)) { // Process message only if it is from a joined room
if(message.type === "file") this.emit('onFile', peer, JSON.parse(message.toString())); this.currentTopic = messageObj.topic; // Set the current topic from the incoming message
if (messageObj.type === "message") this.emit('onMessage', peer, messageObj);
if (messageObj.type === "icon") this.emit('onIcon', peer, messageObj);
if (messageObj.type === "file") this.emit('onFile', peer, messageObj);
}
}); });
peer.on('error', e => { peer.on('error', e => {
@ -27,20 +33,13 @@ class Client extends EventEmitter {
this.swarm.on('update', () => { this.swarm.on('update', () => {
console.log(`Connections count: ${this.swarm.connections.size} / Peers count: ${this.swarm.peers.size}`); console.log(`Connections count: ${this.swarm.connections.size} / Peers count: ${this.swarm.peers.size}`);
this.swarm.peers.forEach((peerInfo, peerId) => {
// Please do not try to understand what is going on here. I have no idea anyway. But it surprisingly works
const peer = [peerId];
const peerTopics = [peerInfo.topics]
.filter(topics => topics)
.map(topics => topics.map(topic => b4a.toString(topic, 'hex')));
});
}); });
} }
joinChatRoom(chatRoomID) { joinChatRoom(chatRoomID) {
this.discovery = this.swarm.join(Buffer.from(chatRoomID, 'hex'), {client: true, server: true}); this.joinedRooms.add(chatRoomID); // Add the room to the list of joined rooms
this.currentTopic = chatRoomID; // Store the current topic
this.discovery = this.swarm.join(Buffer.from(chatRoomID, 'hex'), { client: true, server: true });
this.discovery.flushed().then(() => { this.discovery.flushed().then(() => {
console.log(`Bot ${this.botName} joined the chat room.`); console.log(`Bot ${this.botName} joined the chat room.`);
this.emit('onBotJoinRoom'); this.emit('onBotJoinRoom');
@ -49,17 +48,31 @@ class Client extends EventEmitter {
sendMessage(roomPeers, message) { sendMessage(roomPeers, message) {
console.log('Bot name:', this.botName); console.log('Bot name:', this.botName);
const timestamp = Date.now(); // Generate timestamp const timestamp = Date.now();
const peers = [...this.swarm.connections].filter(peer => roomPeers.includes(peer.remotePublicKey.toString('hex'))); // We remove all the peers that arent included in a room const messageObj = {
const data = JSON.stringify({name: this.botName, message, timestamp}); // Include timestamp type: 'message',
name: this.botName,
message,
timestamp,
topic: this.currentTopic // Include the current topic
};
const data = JSON.stringify(messageObj);
const peers = [...this.swarm.connections].filter(peer => roomPeers.includes(peer.remotePublicKey.toString('hex')));
for (const peer of peers) peer.write(data); for (const peer of peers) peer.write(data);
} }
sendMessageToAll(message) { sendMessageToAll(message) {
console.log('Bot name:', this.botName); console.log('Bot name:', this.botName);
const timestamp = Date.now(); // Generate timestamp const timestamp = Date.now();
const peers = [...this.swarm.connections] const messageObj = {
const data = JSON.stringify({name: this.botName, message, timestamp}); // Include timestamp type: 'message',
name: this.botName,
message,
timestamp,
topic: this.currentTopic // Include the current topic
};
const data = JSON.stringify(messageObj);
const peers = [...this.swarm.connections];
for (const peer of peers) peer.write(data); for (const peer of peers) peer.write(data);
} }

67
index.html
View File

@ -7,11 +7,13 @@
<link rel="stylesheet" type="text/css" href="style.css"> <link rel="stylesheet" type="text/css" href="style.css">
<script type="module" src="./app.js"></script> <script type="module" src="./app.js"></script>
<script src="https://cdn.jsdelivr.net/npm/markdown-it/dist/markdown-it.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/markdown-it/dist/markdown-it.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/atom-one-dark.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js"></script>
</head> </head>
<body> <body>
<header> <header>
<pear-ctrl></pear-ctrl> <pear-ctrl></pear-ctrl>
<div id="linkup-text">LinkUp</div> <div id="linkup-text">LinkUp | Peers: <span id="peers-count">0</span></div>
</header> </header>
<main> <main>
<div id="sidebar"> <div id="sidebar">
@ -44,11 +46,9 @@
<div id="chat" class="hidden"> <div id="chat" class="hidden">
<div id="header"> <div id="header">
<div id="details"> <div id="details">
<div> <div style="display: inline;">
Topic: <span id="chat-room-topic"></span> <strong><span id="chat-room-name"></span></strong> | <a href="#" id="copy-topic-link" class="mini-button">Copy Topic</a>
</div> <span id="chat-room-topic" style="display: none;"></span>
<div>
Peers: <span id="peers-count">0</span>
</div> </div>
</div> </div>
<div id="user-list"> <div id="user-list">
@ -72,12 +72,59 @@
<script> <script>
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
const messageInput = document.getElementById('message'); const messageInput = document.getElementById('message');
messageInput.addEventListener('keydown', function(event) { const copyTopicLink = document.getElementById('copy-topic-link');
if (event.key === 'Enter' && !event.shiftKey) { const chatRoomTopic = document.getElementById('chat-room-topic');
if (messageInput) {
messageInput.addEventListener('keydown', function(event) {
if (event.key === 'Enter' && !event.shiftKey) {
event.preventDefault();
document.getElementById('message-form').dispatchEvent(new Event('submit'));
}
});
}
if (copyTopicLink) {
copyTopicLink.addEventListener('click', function(event) {
event.preventDefault(); event.preventDefault();
document.getElementById('message-form').dispatchEvent(new Event('submit')); if (chatRoomTopic) {
const topic = chatRoomTopic.innerText;
navigator.clipboard.writeText(topic).then(() => {
alert('Topic copied to clipboard!');
}).catch(err => {
console.error('Failed to copy topic:', err);
});
} else {
console.error('Element #chat-room-topic not found');
}
});
}
const switchRoom = (topic) => {
console.log('Switching to room:', topic); // Debugging log
const chatRoomTopic = document.querySelector('#chat-room-topic');
const chatRoomName = document.querySelector('#chat-room-name');
if (chatRoomTopic) {
chatRoomTopic.innerText = topic; // Set full topic here
} else {
console.error('Element #chat-room-topic not found');
} }
});
// Show chat UI elements
document.querySelector('#chat').classList.remove('hidden');
document.querySelector('#setup').classList.add('hidden');
};
const roomList = document.querySelector('#room-list');
if (roomList) {
roomList.addEventListener('click', function(event) {
const roomItem = event.target.closest('li');
if (roomItem) {
switchRoom(roomItem.dataset.topic);
}
});
}
}); });
</script> </script>
</body> </body>

21
style.css
View File

@ -12,6 +12,27 @@ body {
transition: background-color 0.3s ease, color 0.3s ease; transition: background-color 0.3s ease, color 0.3s ease;
} }
.mini-button {
display: inline-block;
padding: 3px 7px;
font-size: 14px;
font-weight: bold;
color: #fff;
background-color: #7289da;
border: none;
border-radius: 3px;
text-decoration: none;
cursor: pointer;
}
.mini-button:hover {
background-color: #0056b3;
}
.bold {
font-weight: bold;
}
pear-ctrl[data-platform="darwin"] { float: right; margin-top: 4px; } pear-ctrl[data-platform="darwin"] { float: right; margin-top: 4px; }
pear-ctrl { pear-ctrl {