feat(*): Add test websockets implementatio

package-lock.json

@@ -9,6 +9,7 @@
 			"version": "0.0.1",
 			"dependencies": {
 				"@netlify/functions": "^1.6.0",
+				"uuid": "^9.0.0",
 				"ws": "^8.13.0"
 			},
 			"devDependencies": {
@@ -17753,6 +17754,14 @@
 			"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
 			"dev": true
 		},
+		"node_modules/uuid": {
+			"version": "9.0.0",
+			"resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.0.tgz",
+			"integrity": "sha512-MXcSTerfPa4uqyzStbRoTgt5XIe3x5+42+q1sDuy3R5MDk66URdLMOZe5aPX/SQd+kuYAh0FdP/pO28IkQyTeg==",
+			"bin": {
+				"uuid": "dist/bin/uuid"
+			}
+		},
 		"node_modules/vite": {
 			"version": "4.3.9",
 			"resolved": "https://registry.npmjs.org/vite/-/vite-4.3.9.tgz",

package.json

@@ -3,7 +3,7 @@
 	"version": "0.0.1",
 	"private": true,
 	"scripts": {
-		"dev": "vite dev && netlify dev",
+		"dev": "vite dev",
 		"build": "vite build",
 		"preview": "vite preview",
 		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
@@ -28,6 +28,7 @@
 	"type": "module",
 	"dependencies": {
 		"@netlify/functions": "^1.6.0",
+		"uuid": "^9.0.0",
 		"ws": "^8.13.0"
 	}
 }

src/functions/websocket.js

@@ -0,0 +1,71 @@
+// websocket.js
+
+import { Server, OPEN } from 'ws';
+
+const handler = async (event, context) => {
+  const wss = new Server({ noServer: true });
+
+  const clients = new Map();
+  const estimates = new Map();
+
+  wss.on('connection', (socket) => {
+    const roomID = new URL(event.headers.referer).pathname.replace('/', '');
+
+    clients.set(socket, roomID);
+
+    function broadcast(roomID, message) {
+      wss.clients.forEach((client) => {
+        if (clients.get(client) === roomID && client !== socket && client.readyState === OPEN) {
+          client.send(JSON.stringify(message));
+        }
+      });
+    }
+
+    broadcast(roomID, { type: 'user-joined', message: 'A new user has joined the room' });
+
+    socket.on('message', (message) => {
+      const data = JSON.parse(message);
+
+      if (data.type === 'select-estimate') {
+        const { user, estimate } = data;
+
+        if (!estimates.has(roomID)) {
+          estimates.set(roomID, new Map());
+        }
+        estimates.get(roomID).set(user, estimate);
+
+        broadcast(roomID, { type: 'estimate-selected', user, estimate });
+      }
+    });
+
+    socket.on('close', () => {
+      const user = clients.get(socket);
+
+      clients.delete(socket);
+
+      if (estimates.has(roomID)) {
+        estimates.get(roomID).delete(user);
+      }
+
+      broadcast(roomID, { type: 'user-left', message: `${user} has left the room` });
+
+      if (estimates.has(roomID) && estimates.get(roomID).size === 0) {
+        estimates.delete(roomID);
+        broadcast(roomID, { type: 'estimation-closed', message: 'Estimation closed' });
+      } else if (!estimates.has(roomID)) {
+        broadcast(roomID, { type: 'estimation-started', message: 'Estimation started again' });
+      }
+    });
+  });
+
+  wss.handleUpgrade(event, event.socket, Buffer.from(''), (ws) => {
+    wss.emit('connection', ws, event);
+  });
+
+  return {
+    statusCode: 200,
+    body: 'WebSocket server is running',
+  };
+};
+
+export default { handler };

src/routes/+page.svelte

@@ -1,7 +1,8 @@
-<script lang="ts">
+<script>
-	import type { PageData } from './$types';
+	import {generateRoomID} from './estimation/estimation.js';
 
-	export let data: PageData;
+	let roomID = generateRoomID();
+	console.log(roomID);
 </script>
 
 <h1>Estimation Poker</h1>

src/routes/estimation/[roomId]/+page.js

@@ -0,0 +1,4 @@
+/** @type {import('./$types').PageLoad} */
+export function load({ params }) {
+  return params;
+}

src/routes/estimation/[roomId]/+page.svelte

@@ -1,8 +1,20 @@
 <script lang="ts">
+	/** @type {import('./$types').PageData} */
+    export let data;
+
 	import { onMount } from 'svelte';
-	import UsersList from '../../components/UsersList.svelte';
+	import UsersList from '../../../components/UsersList.svelte';
-	import EstimateGroupsList from '../../components/EstimateGroupsList.svelte';
+	import EstimateGroupsList from '../../../components/EstimateGroupsList.svelte';
-	import AverageEstimate from '../../components/AverageEstimate.svelte';
+	import AverageEstimate from '../../../components/AverageEstimate.svelte';
+	import { connectToWebSocket, sendMessage } from '../estimation.js';
+
+	let socket;
+	console.log(data.roomId);
+
+	onMount(() => {
+		// Connect to WebSocket server with the room ID
+		socket = connectToWebSocket(data.roomId);
+	});
 
 	let estimates = [
 		{ name: 'User 1', estimate: 8 },

src/routes/estimation/estimation.js

@@ -0,0 +1,39 @@
+import { v4 as uuidv4 } from 'uuid';
+
+function generateRoomID() {
+	const id = uuidv4();
+	return id;
+}
+
+function connectToWebSocket(roomID, onMessageReceived) {
+    const socketPath = `.netlify/functions/websocket/${roomID}`;
+	let socket = new WebSocket(`wss://estimationpoker.jcreek.co.uk/${socketPath}`);
+	
+    // const isDevelopment = import.meta.env.DEV;
+	// if (isDevelopment) {
+	// 	socket = new WebSocket(`wss://localhost:4173/${socketPath}`);
+	// } else {
+	// 	socket = new WebSocket(`wss://estimationpoker.jcreek.co.uk/${socketPath}`);
+	// }
+
+	socket.addEventListener('open', () => {
+		console.log('Connected to WebSocket server');
+	});
+
+	socket.addEventListener('message', (event) => {
+		const message = JSON.parse(event.data);
+		onMessageReceived(message);
+	});
+
+	socket.addEventListener('close', () => {
+		console.log('Disconnected from WebSocket server');
+	});
+
+	return socket;
+}
+
+function sendMessage(socket, message) {
+	socket.send(JSON.stringify(message));
+}
+
+export { generateRoomID, connectToWebSocket, sendMessage };