From 6f5147e45b08dda97ba3f5952c3c1c84bc30639d Mon Sep 17 00:00:00 2001
From: dl35 <dl35@illinois.edu>
Date: Wed, 5 Mar 2025 20:29:14 -0600
Subject: [PATCH] Replace index.html

---
 index.html | 72 +++++++++++++++++++++++++++++++++++++++++++++---------
 1 file changed, 60 insertions(+), 12 deletions(-)

diff --git a/index.html b/index.html
index 5aa3114..6fc6b64 100644
--- a/index.html
+++ b/index.html
@@ -1,17 +1,65 @@
+<!DOCTYPE html>
 <html>
+  <head>
+    <meta charset="UTF-8">
+    <style>
+      .container{
+                  display: flex;
+                }
+    </style>
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+    <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
+    <script src="./index.js"></script>
+    
+  </head>
 
-<script src="index.js"></script> 
+  <body>
+    <div class="container">
+  
+      <div class="jumbotron">
+      <h2>CS498: IoT -- Lab 2</h2>
 
-<body>
-    <h1>My First Website</h1>
-    <p>Hello IoT!</p>
+      <!-- <video class="center" width="600" height="400" controls>
+        <source src="samplevid.mp4" type="video/mp4">
+          Your browser does not support the video tag.
+      </video> -->
+      <img src="./media/default_background.png" id='pics'>
+    </div> 
+  
+  </div>
 
-    My name is: <input id="myName" type="text" placeholder="name" />
-    <button class="btn btn-success" onclick="greeting()">Submit</button>
-    <br>
-    <span id="greet"> </span>
-    <br>
-    <span id="greet_from_server"></span>
-</body>
+  <div class="row">
+    <div class="container">
+        <div class="jumbotron text-center col-md-6">
+            <span>&nbsp;&nbsp;</span> 
+            <span id="upArrow" style='font-size:50px; color:grey;'>&#8679;</span>
+            <br>
+            <span id="leftArrow" style='font-size:45px; color:grey;'>&#8678;</span>
+            <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span> 
+            <span id="rightArrow" style='font-size:45px; color:grey;'>&#8680;</span>
+            <br>
+            <span>&nbsp;&nbsp;</span> 
+            <span id="downArrow" style='font-size:50px; color:grey;'>&#8681;</span>
+        </div>
+
+        <div class="jumbotron text-left col-md-6">
+        <input id="message" type="text" placeholder="message to Pi"/>
+        <button class="btn btn-success" onclick="update_data()">Sumbit</button>
+          <p>
+            <span id="direction_dot" style="color:Green">&bull;</span> Car Direction: <span id="direction"> </span>
+           <br>
+           <span id="speed_dot" style="color:green">&bull;</span> Speed: <span id="speed">0.0</span>  
+           <br>
+           <span id="distance_dot" style="color:green">&bull;</span> Distance Traveled: <span id="distance">0.0</span>
+           <br>
+           <span id="temprature_dot" style="color:green">&bull;</span> Temperature of the Pi: <span id="temperature">0.0</span>
+           <br>
+           Bluetooth return value: <span id="bluetooth"> </span>
+          </p>  
+        </div>
+    </div>
+</div>
+
+  </body>
+</html>
 
-</html>
\ No newline at end of file
-- 
GitLab