1 files changed, 84 insertions, 0 deletions
diff --git a/frontend/start/index.html b/frontend/start/index.html
new file mode 100644
index 0000000..7567ad5
--- /dev/null
+++ b/frontend/start/index.html
@@ -0,0 +1,84 @@
+<!doctype html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<link rel="stylesheet" href="/style.css">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>Victoria Hall LaundryWeb</title>
+		<script src="https://cdn.onesignal.com/sdks/web/v16/OneSignalSDK.page.js" defer></script>
+		<script>
+			window.OneSignalDeferred = window.OneSignalDeferred || [];
+			OneSignalDeferred.push(async function(OneSignal) {
+				await OneSignal.init({
+					appId: "83901cc7-d964-475a-90ec-9f854df4ba52",
+					welcomeNotification: {
+						disable: true,
+					},
+				});
+			});
+		</script>
+	</head>
+	<body>
+		<div class="section-container row bg-1" style="height: 164px;">
+			<span id="logo">Victoria Hall<br>LaundryWeb</span>
+			<span id="logo-id">H1</span>
+		</div>
+		<div class="section-container row bg-2" style="padding: 8px; gap: 8px;">
+			<button class="button button-tab bg-3" disabled>Timer</button>
+			<button class="button button-tab bg-3" onclick="window.location.href = '/status/'">Status</button>
+		</div>
+		<div class="section-container no-pad" style="opacity: .5;">
+			<h1>Selected Machine</h1>
+			<div class="machine-container">
+				<div class="txtcol-dryer" id="dryer1">
+					<span>Dryer 1</span>
+					<img src="/dryer_off.png" alt="" id="dryer1-img">
+					<span id="dryer1-span"></span>
+				</div>
+				<div class="txtcol-washer machine-selected" id="washer1">
+					<span>Washer 1</span>
+					<img src="/washer_off.png" alt="" id="washer1-img">
+					<span id="washer1-span"></span>
+				</div>
+				<div class="txtcol-dryer" id="dryer2">
+					<span>Dryer 2</span>
+					<img src="/dryer_off.png" alt="" id="dryer2-img">
+					<span id="dryer2-span"></span>
+				</div>
+				<div class="txtcol-washer" id="washer2">
+					<span>Washer 2</span>
+					<img src="/washer_off.png" alt="" id="washer2-img">
+					<span id="washer2-span"></span>
+				</div>
+			</div>
+		</div>
+		<div class="section-container no-pad">
+			<h1>Duration</h1>
+			<div class="input-field">
+				<button class="button bg-3" onclick="decreaseTime()" id="decTime" disabled>-</button>
+				<span id="min-field">30 minutes</span>
+				<button class="button bg-3" onclick="increaseTime()" id="incTime">+</button>
+			</div>
+		</div>
+		<div class="section-container no-pad">
+			<h1>Start</h1>
+			<div class="section-container row bg-red">
+				<div class="flex-center-container">
+					<span class="icon">🔔</span>
+				</div>
+				<div>
+					<span>Please allow this website to send you notifications to remind you about your laundry. That's like, the whole point of this website.</span>
+					<button id="notbtn" class="button bg-redder">Enable Required Permissions</button>
+				</div>
+			</div>
+			<button class="button bg-1" id="startbtn">Start</button>
+		</div>
+		<script src="/main.js"></script>
+		<script>
+			document.getElementById("startbtn").addEventListener("click", () => {
+				start();
+			});
+			startUpdateMachines();
+		</script>
+	</body>
+</html>