From 7aa7ee7550f1ed7491eebe63df9670c1f06740b7 Mon Sep 17 00:00:00 2001 From: Thomas Kafetzis Date: Tue, 24 Sep 2024 16:47:14 +0300 Subject: [PATCH] Replace dropdown user list with input field for recipient UUID (#2) * Replace dropdown user list with input field for recipient UUID * Update tests * Update Image & Video Demos [README] --- README.md | 6 +-- fileshare/consumers.py | 67 ------------------------ fileshare/static/main.js | 39 +------------- fileshare/templates/fileshare/index.html | 8 ++- fileshare/tests/test_consumers.py | 15 +----- 5 files changed, 8 insertions(+), 127 deletions(-) diff --git a/README.md b/README.md index 30bb8d0..f2f5051 100644 --- a/README.md +++ b/README.md @@ -93,17 +93,17 @@ $ python3 manage.py test fileshare.tests ## Demo Image -![Screenshot 2024-09-23 112921](https://github.com/user-attachments/assets/84cc69ad-6f52-4a5e-8a52-3b392e46925f) +![fileshare](https://github.com/user-attachments/assets/df026073-42c8-43f9-92ce-b57b0e9a01b6) ## Demo Videos ### User 1 -https://github.com/user-attachments/assets/608b68d8-2a38-409d-b2f3-6f0ac4fdabca +https://github.com/user-attachments/assets/10552c38-0d08-4040-9fb5-e9093528b5ef ### User 2 -https://github.com/user-attachments/assets/194f07a2-dd38-43a7-a418-e481e50332ce +https://github.com/user-attachments/assets/f07322d1-35b1-4569-b496-c61578b32e1b ## Contributing Guidelines for FileShare diff --git a/fileshare/consumers.py b/fileshare/consumers.py index c003436..df952dd 100644 --- a/fileshare/consumers.py +++ b/fileshare/consumers.py @@ -17,12 +17,9 @@ class FileTransferConsumer(AsyncWebsocketConsumer): based on unique identifiers. """ - connected_users = set() # Track all connected users - async def connect(self): """ Assign a unique ID to the connected user. - Update the list of connected peers. """ # Generate a unique ID for the connected user self.user_id = str(uuid.uuid4())[:10] @@ -33,9 +30,6 @@ async def connect(self): await self.accept() - # Add the user to the set of connected users - self.connected_users.add(self.user_id) - # Send the unique ID back to the user for display await self.send( text_data=json.dumps( @@ -46,47 +40,12 @@ async def connect(self): ) ) - # Send the list of already connected users, - # to the new user (excluding themselves) - await self.send( - text_data=json.dumps( - { - "type": "connected_users", - "users": list( - self.connected_users - {self.user_id} - ), # Exclude the current user - } - ) - ) - - # Update the list of connected peers - await self.channel_layer.group_send( - self.room_group_name, - { - "type": "user_connected", - "user_id": self.user_id, - }, - ) - async def disconnect(self, close_code): """ Remove the user from the group when they disconnect. - Update the list of connected peers. """ await self.channel_layer.group_discard(self.room_group_name, self.channel_name) - # Remove the user from the connected users set - self.connected_users.discard(self.user_id) - - # Update the list of connected peers - await self.channel_layer.group_send( - self.room_group_name, - { - "type": "user_disconnected", - "user_id": self.user_id, - }, - ) - async def receive(self, text_data): """ Handle incoming files from specific users based on user_id. @@ -161,29 +120,3 @@ async def send_file(self, event): } ) ) - - async def user_connected(self, event): - """ - Update the list of connected peers when a user joins. - """ - await self.send( - text_data=json.dumps( - { - "type": "user_connected", - "user_id": event["user_id"], - } - ) - ) - - async def user_disconnected(self, event): - """ - Update the list of connected peers when a user leaves. - """ - await self.send( - text_data=json.dumps( - { - "type": "user_disconnected", - "user_id": event["user_id"], - } - ) - ) diff --git a/fileshare/static/main.js b/fileshare/static/main.js index 9f10677..aedcb08 100644 --- a/fileshare/static/main.js +++ b/fileshare/static/main.js @@ -19,23 +19,6 @@ socket.onmessage = function (e) { document.getElementById('myUserId').innerHTML = myUserId; } - // Populate the list of already connected users (sent when a new user connects) - if (data.type === 'connected_users') { - data.users.forEach(userId => { - addUserOption(userId); - }); - } - - // Add a newly connected user to the dropdown list, excluding the current user - if (data.type === 'user_connected' && data.user_id !== myUserId) { - addUserOption(data.user_id); - } - - // Remove a disconnected user from the dropdown list - if (data.type === 'user_disconnected') { - removeUserOption(data.user_id); - } - // Handle form submission (sending files) if (data.type === 'file_offer') { let agree = confirm(`User ${data.sender_id} is sending a file: ${data.file_name}. Do you want to download it?`); @@ -51,7 +34,7 @@ form.addEventListener('submit', (e) => { let fileInput = document.getElementById('fileInput'); let file = fileInput.files[0]; - let targetUserId = document.getElementById('userSelect').value; + let targetUserId = document.getElementById('userInput').value; let reader = new FileReader(); reader.onload = function (event) { @@ -71,26 +54,6 @@ form.addEventListener('submit', (e) => { form.reset(); }); -function addUserOption(userId) { - let userSelect = document.getElementById('userSelect'); - let option = document.createElement('option'); - option.value = userId; - option.text = `User: ${userId}`; - userSelect.appendChild(option); -} - -function removeUserOption(userId) { - let userSelect = document.getElementById('userSelect'); - let options = userSelect.options; - - for (let i = 0; i < options.length; i++) { - if (options[i].value === userId) { - userSelect.remove(i); - break; - } - } -} - function downloadFile(fileName, fileData) { // Creates an invisible link, sets its href to the base64-encoded file data, // and triggers a download with the specified filename. The browser automatically diff --git a/fileshare/templates/fileshare/index.html b/fileshare/templates/fileshare/index.html index 89e24a8..5e5020f 100644 --- a/fileshare/templates/fileshare/index.html +++ b/fileshare/templates/fileshare/index.html @@ -38,12 +38,10 @@

FileShare

- - + +
- +
diff --git a/fileshare/tests/test_consumers.py b/fileshare/tests/test_consumers.py index 6c07d4b..e000598 100644 --- a/fileshare/tests/test_consumers.py +++ b/fileshare/tests/test_consumers.py @@ -28,17 +28,12 @@ async def test_connect(self): async def test_disconnect(self): """ - Test if the WebSocket disconnection is established correctly, - and check if the user is removed from the group. + Test if the WebSocket disconnection is established correctly. """ communicator = WebsocketCommunicator( FileTransferConsumer.as_asgi(), "/ws/socket-server/" ) await communicator.connect() - - # Get the user ID first - await communicator.receive_json_from() - await communicator.disconnect() async def test_file_transfer(self): @@ -61,14 +56,6 @@ async def test_file_transfer(self): receiver_response = await communicator_receiver.receive_json_from() receiver_id = receiver_response["user_id"] - # Handle the "connected_users" message for the receiver - connected_users_event = await communicator_receiver.receive_json_from() - self.assertEqual(connected_users_event["type"], "connected_users") - - # Handle the "user_connected" event (because sender connects) - user_connected_event = await communicator_receiver.receive_json_from() - self.assertEqual(user_connected_event["type"], "user_connected") - # Mock file transfer file_name = "test_file.txt" file_content = "Hello, World!" # The original file content