diff --git a/mockWebsock.js b/mockWebsock.js new file mode 100644 index 0000000..fb8c83d --- /dev/null +++ b/mockWebsock.js @@ -0,0 +1,73 @@ +const WebSocket = require('ws'); + +// Define the WebSocket server port +const PORT = 5135; + +// Define the server's local IP address +const serverIpAddress = 'localhost'; + +// Create a new WebSocket server using the server's local IP address and port +const wss = new WebSocket.Server({ host: serverIpAddress, port: PORT }); + +console.log(`Mock WebSocket server listening on ws://${serverIpAddress}:${PORT}/ws`); + +// Event listener for new client connections +wss.on('connection', (ws) => { + console.log('New client connected'); + + // Sample vehicle data object + let vehicleData = { + key: 'Vehicle 3', + speed: 1.1, + pitch: 2.2, + yaw: 3.3, + roll: 4.4, + altitude: 5.5, + batteryLife: 6.6, + lastUpdated: '00:00:00', + currentPosition: { + latitude: 7.7, + longitude: 8.8, + }, + vehicleStatus: 0, + }; + + // Send the initial sample data to the client + ws.send(JSON.stringify(vehicleData)); + // continuously send random battery values to client + setInterval(() => { + vehicleData.altitude = Math.random() * 10000; + vehicleData.batteryLife = Math.floor((Math.random() * (100 - 0 + 1)) + 0); + vehicleData.currentPosition.longitude = Number(((Math.random() * (180 - (-180) + 1)) + (-180)).toFixed(6)); + vehicleData.currentPosition.latitude = Number(((Math.random() * (180 - (-180) + 1)) + (-180)).toFixed(6)); + vehicleData.lastUpdated = new Date().toLocaleTimeString(); + + ws.send(JSON.stringify(vehicleData)); + }, 1000); + + // Event listener for messages from the client + ws.on('message', (message) => { + console.log(`Received message from client: ${message}`); + + // Parse the received message as JSON + const updatedData = JSON.parse(message); + + // Update the vehicleData object with the received data + vehicleData = { + ...vehicleData, + ...updatedData, // Merge the updated data into the existing data + lastUpdated: new Date().toLocaleTimeString() // Update the last updated time + }; + + // Print out the updated data + console.log('Updated vehicle data:', vehicleData); + + // Optionally, you can send the updated data back to the client + ws.send(JSON.stringify(vehicleData)); + }); + + // Event listener for client disconnection + ws.on('close', () => { + console.log('Client disconnected'); + }); +}); diff --git a/src/views/StaticScreen.vue b/src/views/StaticScreen.vue index ba8dadd..87a49da 100644 --- a/src/views/StaticScreen.vue +++ b/src/views/StaticScreen.vue @@ -4,19 +4,26 @@ import Status from '../components/VehicleStatusComponent.vue'; import NavBar from '../components/Navbar.vue'; import { onMounted, ref } from 'vue'; +const receivedData = ref(null); +const battery1 = ref(0); +const latitude = ref(7.7); +const longitude = ref(8.8); // create websocket connection once Static Screen finishes initial rendering onMounted(() => { - let client = new WebSocket('ws://localhost:3000/'); + let client = new WebSocket('ws://localhost:5135/'); console.log("Connected to server"); client.addEventListener("message", (event) => { - console.log(`Message from server: ${event.data}`); - battery1.value = event.data; + // Handle incoming message + const data = JSON.parse(event.data); + receivedData.value = data; + console.log("Received data:", receivedData); + battery1.value = receivedData.value.batteryLife; }); }); // --- testing with dummy reactive data --- // -let battery1 = ref(100); +//let battery1 = ref(100); let battery2 = ref(50); let connection = ref(100); let testCoordinate = ref({longitude: 40.748440, latitude: -73.984559}) @@ -51,7 +58,9 @@ let testCoordinateObject2 = {
- +