From 6eb1c61197072806b13c8fdb0afe3e3f1c5f8458 Mon Sep 17 00:00:00 2001
From: Steven C <huanshengc@cpp.edu>
Date: Sat, 13 Apr 2024 02:18:45 -0700
Subject: [PATCH] merge DEMO WS

---
 mockWebsock.js => mockWebsock.cjs |  2 +-
 src/components/mockWS.vue         | 35 +++++++++++++++++--------------
 2 files changed, 20 insertions(+), 17 deletions(-)
 rename mockWebsock.js => mockWebsock.cjs (98%)

diff --git a/mockWebsock.js b/mockWebsock.cjs
similarity index 98%
rename from mockWebsock.js
rename to mockWebsock.cjs
index fb8c83d..bed72e3 100644
--- a/mockWebsock.js
+++ b/mockWebsock.cjs
@@ -17,7 +17,7 @@ wss.on('connection', (ws) => {
 
     // Sample vehicle data object
     let vehicleData = {
-        key: 'Vehicle 3',
+        key: 'ERU',
         speed: 1.1,
         pitch: 2.2,
         yaw: 3.3,
diff --git a/src/components/mockWS.vue b/src/components/mockWS.vue
index c1b845c..cbaa9da 100644
--- a/src/components/mockWS.vue
+++ b/src/components/mockWS.vue
@@ -7,15 +7,15 @@ const socket = ref<WebSocket | null>(null);
 const receivedData = ref<any>(null);
 
 // Reactive variables for user input
-const key = ref("Vehicle 2");
-const speed = ref<number>(1.1);
-const pitch = ref<number>(2.2);
-const yaw = ref<number>(3.3);
-const roll = ref<number>(4.4);
-const altitude = ref<number>(5.5);
-const batteryLife = ref<number>(6.6);
-const latitude = ref<number>(7.7);
-const longitude = ref<number>(8.8);
+const key = ref("Vehicle");
+const speed = ref<number>(0);
+const pitch = ref<number>(0);
+const yaw = ref<number>(0);
+const roll = ref<number>(0);
+const altitude = ref<number>(0);
+const batteryLife = ref<number>(0);
+const latitude = ref<number>(0);
+const longitude = ref<number>(0);
 
 // Function to establish the WebSocket connection
 function establishWebSocketConnection() {
@@ -94,7 +94,10 @@ onBeforeUnmount(() => {
       <p><strong>Altitude:</strong> {{ receivedData.altitude }}</p>
       <p><strong>Battery Life:</strong> {{ receivedData.batteryLife }}</p>
       <p><strong>Last Updated:</strong> {{ receivedData.lastUpdated }}</p>
-      <p><strong>Current Position:</strong> Latitude: {{ receivedData.currentPosition.latitude }}, Longitude: {{ receivedData.currentPosition.longitude }}</p>
+      <p><strong>Current Position:</strong> 
+        <p>Latitude: {{ receivedData.currentPosition.latitude }}</p>
+        <P>Longitude: {{ receivedData.currentPosition.longitude }}</P>
+      </p>
       <p><strong>Vehicle Status:</strong> {{ receivedData.vehicleStatus }}</p>
     </div>
     <div v-else>
@@ -123,22 +126,22 @@ onBeforeUnmount(() => {
         <label>Roll:</label>
         <input type="number" v-model="roll" step="0.1" />
       </div>
-      <div>
+      <!-- <div>
         <label>Altitude:</label>
         <input type="number" v-model="altitude" step="0.1" />
-      </div>
-      <div>
+      </div> -->
+      <!-- <div>
         <label>Battery Life:</label>
         <input type="number" v-model="batteryLife" step="0.1" />
-      </div>
-      <div>
+      </div> -->
+      <!-- <div>
         <label>Latitude:</label>
         <input type="number" v-model="latitude" step="0.1" />
       </div>
       <div>
         <label>Longitude:</label>
         <input type="number" v-model="longitude" step="0.1" />
-      </div>
+      </div> -->
       <button type="submit">Send Updated Data</button>
     </form>
   </div>