Safari and FIrefox and now compatible!

Lixie-Labs · May 8, 2024 · 9cbb0d9 · 9cbb0d9
1 parent 3b420a2
commit 9cbb0d9
Show file tree

Hide file tree

Showing 5 changed files with 51 additions and 37 deletions.
diff --git a/data/css/app.css b/data/css/app.css
@@ -29,6 +29,7 @@ body{
 	-webkit-user-select: none; /* Safari */
 	-ms-user-select: none; /* IE 10 and IE 11 */
 	user-select: none; /* Standard syntax */
+	height: 100%;
 }
 
 .horizontal_separator{
@@ -53,6 +54,7 @@ body{
     transition: opacity 0.15s ease-in-out;
 	background-color: rgba(var(--background), 0.75);
     backdrop-filter: blur(12px);
+	-webkit-backdrop-filter: blur(12px);
 	z-index: 999 !important;
 }
 
@@ -70,6 +72,7 @@ body{
     transition: opacity 0.15s ease-in-out;
 	background-color: rgba(var(--background), 0.0);
     backdrop-filter: blur(12px);
+	-webkit-backdrop-filter: blur(12px);
 	z-index: 50 !important;
 }
 
@@ -88,6 +91,7 @@ body{
     left: 0%;
 	background-color: rgba(var(--background), 0.45);
     backdrop-filter: blur(12px);
+	-webkit-backdrop-filter: blur(12px);
 }
 
 #page_menu{
@@ -103,6 +107,7 @@ body{
     left: 0%;
 	background-color: rgba(var(--background), 0.45);
     backdrop-filter: blur(12px);
+	-webkit-backdrop-filter: blur(12px);
 	z-index: 15;
 }
 
@@ -175,6 +180,7 @@ body{
     left: 0%;
     background-color: rgba(var(--background), 0.45);
     backdrop-filter: blur(12px);
+	-webkit-backdrop-filter: blur(12px);
 }
 
 #page_wifi_config{
@@ -189,6 +195,7 @@ body{
     left: 0%;
     background-color: rgba(var(--background), 0.45);
     backdrop-filter: blur(12px);
+	-webkit-backdrop-filter: blur(12px);
 }
 
 #page_presets{
@@ -206,6 +213,7 @@ body{
     left: 0%;
 	background-color: rgba(var(--background), 0.45);
     backdrop-filter: blur(12px);
+	-webkit-backdrop-filter: blur(12px);
 }
 
 #page_modes{
@@ -223,6 +231,7 @@ body{
     left: 0%;
     background-color: rgba(var(--background), 0.45);
     backdrop-filter: blur(12px);
+	-webkit-backdrop-filter: blur(12px);
 	z-index: 99;
 }
 
@@ -384,6 +393,7 @@ button{
 	border:2px solid var(--accent);
 	z-index:50;
 	backdrop-filter: blur(10px);
+	-webkit-backdrop-filter: blur(12px);
 	text-align: center;
 	pointer-events: none;
 	opacity:0.0;
@@ -414,6 +424,7 @@ button{
 	border:2px solid var(--accent);
 	z-index:50;
 	backdrop-filter: blur(10px);
+	-webkit-backdrop-filter: blur(12px);
 	text-align: center;
 	pointer-events: none;
 	opacity:0.0;

diff --git a/data/index.html b/data/index.html
@@ -1,6 +1,10 @@
-<html>
+<!DOCTYPE html>
+<html lang="en">
 <head>
+	<meta charset="UTF-8" />
+
 	<title>Emotiscope Setup</title>
+
 	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />    
 	<link rel="stylesheet" href="css/app.css">
 	<script src="js/fetch_mac.js"></script>
@@ -32,15 +36,29 @@
 		function update_wifi_credentials(){
 			let ssid = document.getElementById("ssid").value;
 			let pass = document.getElementById("pass").value;
-
-			// URL encode the ssid and pass
-			ssid = encodeURIComponent(ssid);
-			pass = encodeURIComponent(pass);
-
-			let wifi_endpoint = "/save-wifi?ssid="+ssid+"&pass="+pass;
-			fetch(wifi_endpoint);
-
-			window.location.href = "https://app.emotiscope.rocks/";
+
+			let wifi_endpoint = "/save-wifi";
+			let data = {
+				ssid: ssid,
+				pass: pass
+			};
+
+			fetch(wifi_endpoint, {
+				method: 'POST',
+				headers: {
+					'Content-Type': 'application/json; charset=UTF-8'
+				},
+				body: JSON.stringify(data)
+			})
+			.then(response => {
+				if (!response.ok) {
+					throw new Error('Network response was not ok');
+				}
+				window.location.href = "https://app.emotiscope.rocks/";
+			})
+			.catch(error => {
+				console.error('There was been a problem with update_wifi_credentials:', error);
+			});
 		}
 	</script>
 </body>

diff --git a/data/js/fetch_mac.js b/data/js/fetch_mac.js
@@ -1,6 +1,6 @@
 // Get the base URL of the current page
-const base_url = window.location.origin;
-let mac_str = "";
+var base_url = window.location.origin;
+var mac_str = "";
 
 function get_mac_string(){
 	// Fetch the text result from the /mac endpoint

diff --git a/data/remote.html b/data/remote.html
@@ -1,6 +1,7 @@
 <html>
 <head>
 	<title>Emotiscope by Lixie Labs</title>
+	<meta charset="UTF-8">
 
 	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
 	<link rel="stylesheet" href="css/app.css">

diff --git a/src/wireless.h b/src/wireless.h
@@ -233,43 +233,27 @@ void init_web_server() {
 		return response.send();
 	});
 
-	server.on("/save-wifi", HTTP_GET, [](PsychicRequest *request) {
-		if(wifi_config_mode == true){
-			esp_err_t result = ESP_OK;
-			String ssid = "";
-			String pass = "";
+	server.on("/mac", HTTP_GET, [](PsychicRequest *request) {
+   		return request->reply(mac_str);
+	});
 
-			if(request->hasParam("ssid") == true){
-				ssid += request->getParam("ssid")->value();
-			}
-			else{
-				printf("MISSING SSID PARAM!\n");
-				return request->reply(400);
-			}
-
-			if(request->hasParam("pass") == true){
-				pass += request->getParam("pass")->value();
-			}
-			else{
-				printf("MISSING PASS PARAM!\n");
-				return request->reply(400);
-			}
+	server.on("/save-wifi", HTTP_POST, [](PsychicRequest *request) {
+		if(wifi_config_mode == true){
+			String ssid = request->getParam("ssid")->value();
+			String pass = request->getParam("pass")->value();
 
 			printf("GOT NEW WIFI CONFIG: '%s|%s'\n", ssid.c_str(), pass.c_str());
+
 			update_network_credentials(ssid, pass);
 
-			return result;
+			return request->reply(200);
 		}
 		else{
 			printf("Can't access WIFI config endpoint outside of config AP mode for security reasons!\n");
 			return request->reply(400);
 		}
 	});
 
-	server.on("/mac", HTTP_GET, [](PsychicRequest *request) {
-   		return request->reply(mac_str);
-	});
-
 	server.on("/*", HTTP_GET, [](PsychicRequest *request) {
 		esp_err_t result = ESP_OK;
 		String path = "";