1 files changed, 83 insertions, 4 deletions

diff --git a/frontend/main.js b/frontend/main.js
index c455d86..cfacc86 100644
--- a/frontend/main.js
+++ b/frontend/main.js
@@ -2,11 +2,75 @@
 const data = {
 	duration: 1, // will be multiplied by 30
 	machine_id: "",
-	onesignal_subscription_id: "",
 }
 
 const API_URL = "https://backend.laundryweb.altafcreator.com"
 
+const PUBLIC_VAPID_KEY = "BCvVfKfWBtHKtzdakJfhYy604yTn0_FgZxy2sNtxcQm6YyC3qdzBBuCJLbVcG6pmbz_CZLa0I44Z-b5UVBbegGw"
+
+// --- REGISTER SERVICE WORKERS
+if ('serviceWorker' in navigator) {
+	navigator.serviceWorker.register('/sw.js', {
+		scope: '/',
+	});
+}
+
+// --- subscribe
+async function subscribe() {
+	if (!('serviceWorker' in navigator)) {
+		alert("err: no service worker");
+		return;
+	}
+
+	console.log(await Notification.requestPermission());
+
+	const registration = await navigator.serviceWorker.ready;
+
+	try {
+		const subscription = await registration.pushManager.subscribe({
+			userVisibleOnly: true,
+			applicationServerKey: urlBase64ToUint8Array(PUBLIC_VAPID_KEY),
+		});
+
+		console.log(subscription);
+
+		console.log("sw regis pass, write to db");
+	
+		const db_reply = await fetch(`${API_URL}/notifsubscribe`, {
+			method: 'POST',
+			credentials: "include",
+			body: JSON.stringify(subscription),
+			headers: {
+				"Content-Type": "application/json",
+			},
+		});
+
+		console.log(db_reply)
+	
+		return db_reply.ok;
+	} catch (e) {
+		console.log("ERR in regis, ", e);
+		return false;
+	}
+
+}
+
+/// copied from somewhere
+const urlBase64ToUint8Array = (base64String) => {
+	const padding = '='.repeat((4 - base64String.length % 4) % 4);
+	const base64 = (base64String + padding)
+		.replace(/\-/g, '+')
+		.replace(/_/g, '/');
+
+	const rawData = window.atob(base64);
+	const outputArray = new Uint8Array(rawData.length);
+
+	for (let i = 0; i < rawData.length; ++i) {
+		outputArray[i] = rawData.charCodeAt(i);
+	}
+	return outputArray;
+};
+
 // --- check machine status
 // returns a 2d array representing machines
 // []: root array
@@ -53,11 +117,14 @@ async function start() {
 		if (data == "all good bro timer started") {
 			window.location.href = "/timer/";
 		}
+		cookieStore.delete("last_used_url");
 	});
 }
 
 // --- information loading + cookie setting (from server)
 async function information(urlParam = null) {
+	const urlCookie = await cookieStore.get("last_used_url");
+
 	const response = await fetch(`${API_URL}/info`, {
 		credentials: "include",
 		method: "POST",
@@ -145,7 +212,18 @@ async function updateMachines() {
 			const end = Date.parse(status[2][i]);
 			const minsLeft = Math.ceil((end - now) / 60000).toString();
 			machineTxts[i].innerHTML = minsLeft + " min(s) left";
-			if (machineDetailImgs[0]) machineDetailTitles[i].innerHTML = minsLeft + " minutes left"
+			if (machineDetailImgs[0]) machineDetailTitles[i].innerHTML = minsLeft + " minute(s) left"
+		} else if (status[0][i] == "OUTOFSERVICE") {
+			if ((i + 1) % 2 == 0) {
+				machineImgs[i].src = "/assets/img/washer_down.png";
+				if (machineDetailImgs[0]) machineDetailImgs[i].src = "/assets/img/washer_down.png";
+			} else {
+				machineImgs[i].src = "/assets/img/dryer_down.png";
+				if (machineDetailImgs[0]) machineDetailImgs[i].src = "/assets/img/dryer_down.png";
+			}
+			machineTxts[i].innerHTML = "Down"
+			if (machineDetailImgs[0]) machineDetailTitles[i].innerHTML = "Out of Service"
+			if (machineDetailImgs[0]) machineDetailDescs[i].innerHTML = "This machine is currently out of service, and is unavailable to use."
 		} else if (status[0][i] == "FINISHED") {
 			if ((i + 1) % 2 == 0) {
 				machineImgs[i].src = "/assets/img/washer_clothes.png";
@@ -188,6 +266,7 @@ async function startLoadTimers() {
 	const timers = timersData[1];
 
 	const container = document.getElementById("timer-container")
+	if (timers.length > 0) container.innerHTML = '';
 
 	const textList = []
 	const progList = []
@@ -228,7 +307,6 @@ async function startLoadTimers() {
 
 		textList.push(`timer-txt-${i}`);
 		progList.push(`timer-prog-${i}`);
-		console.log()
 		endTimestamps.push(Date.parse(timers[i]["end_time"]));
 		startTimestamps.push(Date.parse(timers[i]["start_time"]));
 	}
@@ -241,6 +319,7 @@ async function startLoadTimers() {
 	}
 	
 	console.log(textList);
+	console.log(progList);
 	console.log(endTimestamps);
 	console.log(startTimestamps);
 
@@ -257,7 +336,7 @@ async function startLoadTimers() {
 			text.innerText += seconds.toString().padStart(2, '0');
 			
 			const prog = document.getElementById(progList[i]);
-			const totalTime = endTimestamps - startTimestamps;
+			const totalTime = endTimestamps[0] - startTimestamps[0];
 			prog.style.width = ((timeRemaining / (totalTime / 1000)) * 100).toString() + "%";
 
 			if (timeRemaining <= 0) {