more work on file attachments

app.js

@@ -79,20 +79,7 @@ async function initialize() {
     attachFileButton.addEventListener('click', () => fileInput.click());
   }
   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");
@@ -115,15 +102,30 @@ async function initialize() {
   }
 
   eventEmitter.on('onMessage', async (messageObj) => {
+    console.log('Received message:', messageObj); // Debugging log
+  
     if (messageObj.type === 'icon') {
       const username = messageObj.username;
+      if (messageObj.avatar) {
         const avatarBuffer = Buffer.from(messageObj.avatar, 'base64');
         await drive.put(`/icons/${username}.png`, avatarBuffer);
         updateIcon(username, avatarBuffer);
-    } else if (messageObj.type === 'file') {
-      addFileMessage(messageObj.name, messageObj.fileName, messageObj.fileUrl, messageObj.fileType, messageObj.avatar);
       } else {
+        console.error('Received icon message with missing avatar data:', messageObj);
+      }
+    } else if (messageObj.type === 'file') {
+      if (messageObj.file && messageObj.fileName) {
+        const fileBuffer = Buffer.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));
+      } 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);
+    } else {
+      console.error('Received unknown message type:', messageObj);
     }
   });
 
@@ -323,6 +325,38 @@ 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 fileMessage = {
+        type: 'file',
+        name: config.userName,
+        fileName: file.name,
+        file: buffer.toString('base64'),
+        fileType: file.type,
+        avatar: updatePortInUrl(config.userAvatar),
+      };
+
+      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);
+    };
+    reader.readAsArrayBuffer(file);
+  }
+}
+
 function sendFileMessage(name, fileUrl, fileType, avatar) {
   const fileName = fileUrl.split('/').pop();
   const messageObj = JSON.stringify({
@@ -444,7 +478,7 @@ async function updateIcon(username, avatarBuffer) {
   if (userIcon) {
     const avatarBlob = new Blob([avatarBuffer], { type: 'image/png' });
     const avatarUrl = URL.createObjectURL(avatarBlob);
-    userIcon.src = avatarUrl;
+    userIcon.src = updatePortInUrl(avatarUrl);
 
     config.userAvatar = avatarUrl;
     writeConfigToFile("./config.json");