Live ui server

client_secret.json

@@ -0,0 +1,12 @@
+{
+  "type": "service_account",
+  "project_id": "park-smart-264116",
+  "private_key_id": "faa6b1219eaea92fc3aeebdb43b874df58561a79",
+  "private_key": "-----BEGIN PRIVATE KEY-----\nMIIEvAIBADANBgkqhkiG9w0BAQEFAASCBKYwggSiAgEAAoIBAQCziHnxhbxnaZ64\nXzySGvYjBrOHXace2EF478dvOnZQhlwdHgQ10kjA44Oqe3KrDtNfDmRQhUHa/9Wh\njRw/ejMt/Vpj419EENkl6nu3T92Mk88nLicyGKYbfTexKO7poE8ZBpTzYJoV0RIj\nz2dcQUjvSZ3hk1V42312jZoSeXbnf1Qk0uwdYXT3+fu4vXjcZPW18cgA/jKzjpkM\nCKDJR4T6lQlMoxzsDN9wZmeezjzUADydLul9lg8X31bJoAUvWEI6MbtGh9nmyKzY\ns9niLYosYZEtEnqn+yCLxaCQz/QoSJEyNFTrll8p6Jg8iANQ/l1g8dmWh+bn/q1e\nUufxL+pDAgMBAAECggEAFcH/+VfaXfQMcs7D8fcHhnYs8sZUVyYhRS1WD7JXnWmz\nJyo4m2c5PvszvUkJvBZnYnlFigakVQy1UMdfuYevRS8TsdBf/slF79Trmms47+0H\n6Xkr8ePP2bwCsFtEHRc7Ds7f5WD7O5KjbqiXn7QfyTQ0SJ7I+IUtPt1pYzzKPsLZ\nKXNlIogzjEeo7Xd979bIsPT0Crk7TjWfx26nCGHWnMdmPfnRWcK1zTbYVH3Bc9A/\nRs0YZB6GQ4thQnEQh7UQWO3Br83txCIzIlEuVWBRi/9Lc9arRuRD/3s7vfOEgC1y\ndzRd06EsIMmXY8ccWn6WwEY3Hs6pBt3kblB8FY6idQKBgQDedstfsnauNFilqxK6\nOqZsoIYS+njTur3RHTNIT2zuzI/Zt+nmszob6smqW1+Yl3KyxRkvxBD+k1QB9FPR\nTx/uTs1SSglB3+awWq7YnX62ZhNn5r8A2jg/tBJZG9ZF0kSVoAIe2A86ugwrzkoB\nQkNX5hS8U9bcgg7a1wVxB+5qvQKBgQDOmOp5CFuiDYv9+e17wa3CB33zRnW0mOV5\nXc8og5/L13pUx8KpSVcOfsZAlJrZXkLCEhcCMM/Yg1S4nLA8Ca7bpbQ6ZLpdff74\nVXZDHaEdem/krnJRWd70pBcHaBtEl/7WTm85ipNZjlhZPatJBz0ReXqV4wTZKdft\n2rRqa4d4/wKBgAcuxro8ROCzB/mxYFVq91yigjGyrJwJd3989d7r0ZSUPkDFU2QD\nfWjRV9mMQbXnjeh/vKRyLCpMD3ZQsTQc3ecP3Ek/4rShygz/oI2V6DVzbkT4iko4\nwYAtDDqcT3rJozVBiU/9oeA/iY0QiAsqXIpF/31lJ5bPDDO8pYxUuTnxAoGACZr0\nc9IeqIcmthUzpGhZ0saUZYYmHNJrANyKsCCGgmyvRFfRRhuhz4u3XfNKy8ZlJi6/\nIRvx3eglPTwTuYbduVqX6YsbWxNrklIu4Gn1PrCdmS0/JWcfRZKHe5GsiuDiOUaG\nR0+ZEDXdB7ElUIzkmvZh66wVYp9eabGcZ8I+FzMCgYADFEdhUBCvQ6CU5UWUeeZI\nF07UpWTFqyuVM2BpUhHx98wy41y/m3zT1qBXgZqLl+56kuGNx+gVc+5HFqhREkgT\nx3Okx5QqQZJXziItIkjM0xRz3GcYxW1GIJ/Efj1kKAoy2Z0oK2F+NPZLZyRo1GeK\ny5E2EI6b/Pe0MzyRO/7Vvg==\n-----END PRIVATE KEY-----\n",
+  "client_email": "hyhack2020@park-smart-264116.iam.gserviceaccount.com",
+  "client_id": "105179077660095096187",
+  "auth_uri": "https://accounts.google.com/o/oauth2/auth",
+  "token_uri": "https://oauth2.googleapis.com/token",
+  "auth_provider_x509_cert_url": "https://www.googleapis.com/oauth2/v1/certs",
+  "client_x509_cert_url": "https://www.googleapis.com/robot/v1/metadata/x509/hyhack2020%40park-smart-264116.iam.gserviceaccount.com"
+}

driver-ui-app/server.py → server.py

@@ -9,13 +9,6 @@
 import os, sys, traceback
 from flask import Flask, render_template, request, jsonify
 
-# Make local modules in other directories accessible by modifying the
-# python "path" dictionary
-sys.path.append("./../util")
-
-# Import local modules
-import sheets
-
 # main Flask server application object
 app = Flask(__name__)
 
@@ -71,11 +64,9 @@ def updateParkingSpace():
         if int(req_isOccupied) == 0:
             req_isOccupied = False
             parkingSpaces[req_id].isOccupied = req_isOccupied
-            sheets.setVacant(req_id)
         elif int(req_isOccupied) == 1:
             req_isOccupied = True
             parkingSpaces[req_id].isOccupied = req_isOccupied
-            sheets.setOccupied(req_id)
         else:
             return jsonify(
                 success = False,
@@ -96,13 +87,13 @@ def updateParkingSpace():
 server_address = "0.0.0.0"
 port_number = 8080
 
+# put the ten parking spaces in the array
+for i in range (10):
+    parkingSpaces.append(ParkingSpace(i, False))
+
 # start of program
 if __name__ == "__main__":
-
-    # put the ten parking spaces in the array
-    for i in range (10):
-        parkingSpaces.append(ParkingSpace(i, False))
 
     # run server
     app.run(host = os.getenv('IP', server_address), 
-            port = int(os.getenv('PORT', port_number)))
+            port = int(os.getenv('PORT', port_number)))

driver-ui-app/static/script.js → static/script.js

@@ -1,5 +1,5 @@
 // Number of milleseconds between updates
-var INTERVAL = 5000;
+var INTERVAL = 2000;
 
 // Function for updating the parking spaces
 function updateParkingSpaces()

driver-ui-app/static/stylesheet.css → static/stylesheet.css

@@ -4,7 +4,7 @@ html {
 
 body {
     height: 100%;
-    background-color: #000000;
+    background-color: black;
 }
 
 p {
@@ -32,11 +32,11 @@ a {
     display: flex;
     align-items: center;
     justify-content: center;
-    padding: 170px 50px 170px 50px;
+    padding: 10px 50px 170px 50px;
 }
 
 #right-col {
-    background-color: #9999ff;
+    background-color: #95b49f;
     padding-bottom: 30px;
 }
 
@@ -49,13 +49,33 @@ a {
 }
 
 #left-text-box {
-    background-color: #ffffff;
-    padding: 50px 50px 50px 50px;
-    border-radius: 10px;
+    background-color: #9999ff;
+    padding: 0px 0px 0px 0px;
+    border-radius: 15px;
+}
+
+.logo-container {
+    width: 100%;
+    border-radius: 10px 10px 0px 0px;
+    background-color: #3a3535;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding-right: 5px;
+    padding-top: 5px;
+}
+
+.logo {
+    width: 400px;
+}
+
+.cars-image {
+    width: 100%;
+    border-radius: 0px 0px 10px 10px;
 }
 
 #bottom-text-box {
-    background-color: #ffffff;
+    background-color: rgba(0, 0, 0, 0.0);
     padding: 50px 50px 40px 50px;
     border-radius: 10px;
 }
@@ -68,25 +88,43 @@ a {
     display: flex;
     align-items: center;
     justify-content: center;
+    height: 95%;
+    min-height: 550px;
+    min-width: 200px;
 }
 
 #parking-map-background {
     display: flex;
-    align-items: center;
+/*    align-items: center;*/
     justify-content: center;
-    width: 200px;
-    height: 550px;
-    padding: 20px, 0px, 20px, 0px;
+    width: 55%;
+    min-width: 200px;
+    height: 100%;
+    padding: 10% 0px 20px 0px;
     border-radius: 10px;
     background-color: #3a3535;
 }
 
+@media screen and (min-width: 992px)
+{
+    #parking-map-background {
+        width: 200px;
+    }
+}
+
+#parking-map {
+    width: 30%;
+    height: 90%;
+    min-width: 75px;
+}
+
 .parking-spot-cell {
     border-color: yellow;
     border-width: 5px 5px 5px 0px;
     border-style: solid;
-    width: 75px;
-    height: 45px;
+    width: 100%;
+    height: 10%;
+    min-height: 45px;
     padding-top: 0px;
     padding-bottom: 0px;
     text-align: center;

driver-ui-app/templates/index.html → templates/index.html

@@ -2,7 +2,7 @@
 {% extends "template.html" %}
 
 {% block title %}
-Park Smart
+ParkSmart
 {% endblock %}
 
 {% block description %}
@@ -23,19 +23,10 @@
 
 	<div class="col-lg-7 d-none d-lg-block" id="left-col">
 		<div id="left-text-box">
-			<h2 id="left-text-header">Logo Goes Here</h2>
-			<p>
-				Some nice text or aesthetic image or something.
-				Lorem ipsum dolor sit amet, consectetur adipiscing elit,
-				sed do eiusmod tempor incididunt ut labore et dolore 
-				magna aliqua. Ut enim ad minim veniam, quis nostrud 
-				exercitation ullamco laboris nisi ut aliquip ex ea 
-				commodo consequat. Duis aute irure dolor in 
-				reprehenderit in voluptate velit esse cillum dolore eu 
-				fugiat nulla pariatur. Excepteur sint occaecat cupidatat 
-				non proident, sunt in culpa qui officia deserunt mollit 
-				anim id est laborum.
-			</p>
+			<div class="logo-container">
+				<img class="logo" src="{{ url_for('static', filename='images/logo.png') }}" alt="ParkSmart Logo" />
+			</div>
+			<img class="cars-image" src="{{ url_for('static', filename='images/parked-cars-cropped.jpg') }}" alt="An aerial photograph of parked cars." />
 		</div><!-- end div: "left-text-box" -->
 	</div><!-- end div: "left-col" -->
 
@@ -60,20 +51,11 @@ <h2 id="left-text-header">Logo Goes Here</h2>
 
 <div class="row d-lg-none" id="row-2">
 	<div id="bottom-text-box">
-		<h2 id="bottom-text-header">Logo Goes Here</h2>
-		<p>
-			Some nice text or aesthetic image or something.
-			Lorem ipsum dolor sit amet, consectetur adipiscing elit,
-			sed do eiusmod tempor incididunt ut labore et dolore 
-			magna aliqua. Ut enim ad minim veniam, quis nostrud 
-			exercitation ullamco laboris nisi ut aliquip ex ea 
-			commodo consequat. Duis aute irure dolor in 
-			reprehenderit in voluptate velit esse cillum dolore eu 
-			fugiat nulla pariatur. Excepteur sint occaecat cupidatat 
-			non proident, sunt in culpa qui officia deserunt mollit 
-			anim id est laborum.
-		</p>
-	</div><!-- end div: "left-text-box" -->
+		<div class="logo-container">
+			<img class="logo" src="{{ url_for('static', filename='images/logo.png') }}" alt="ParkSmart Logo" />
+		</div>
+		<img class="cars-image" src="{{ url_for('static', filename='images/parked-cars-cropped.jpg') }}" alt="An aerial photograph of parked cars." />
+	</div><!-- end div: "bottom-text-box" -->
 </div><!-- end div: "row-2" -->
 
 {% endblock %}