Merge remote-tracking branch 'origin/ac_main' into mdev

wled00/data/index.js

@@ -735,22 +735,22 @@ function populateSegments(s)
 		}
 		// WLEDMM: jMap
 		let map2D = `<div id="seg${i}map2D" data-map="map2D" class="lbl-s hide">Expand 1D FX<br>
-			<div class="sel-p"><select class="sel-p" id="seg${i}mp12" onchange="setMp12(${i})">
-				<option value="0" ${inst.mp12==0?' selected':''}>Pixels</option>
-				<option value="1" ${inst.mp12==1?' selected':''}>Bar</option>
-				<option value="2" ${inst.mp12==2?' selected':''}>Arc</option>
-				<option value="3" ${inst.mp12==3?' selected':''}>Corner</option>
-				<option value="4" ${inst.mp12==4?' selected':''}>jMap</option>
-				<option value="5" ${inst.mp12==5?' selected':''}>Circles</option>
-				<option value="6" ${inst.mp12==6?' selected':''}>Block</option>
+			<div class="sel-p"><select class="sel-p" id="seg${i}m12" onchange="setM12(${i})">
+				<option value="0" ${inst.m12==0?' selected':''}>Pixels</option>
+				<option value="1" ${inst.m12==1?' selected':''}>Bar</option>
+				<option value="2" ${inst.m12==2?' selected':''}>Arc</option>
+				<option value="3" ${inst.m12==3?' selected':''}>Corner</option>
+				<option value="4" ${inst.m12==4?' selected':''}>jMap</option>
+				<option value="5" ${inst.m12==5?' selected':''}>Circles</option>
+				<option value="6" ${inst.m12==6?' selected':''}>Block</option>
 			</select></div>
 		</div>`;
-		let sndSim = `<div data-snd="ssim" class="lbl-s hide">Sound sim<br>
-			<div class="sel-p"><select class="sel-p" id="seg${i}ssim" onchange="setSSim(${i})">
-				<option value="0" ${inst.ssim==0?' selected':''}>BeatSin</option>
-				<option value="1" ${inst.ssim==1?' selected':''}>WeWillRockYou</option>
-				<option value="2" ${inst.ssim==2?' selected':''}>U10_3</option>
-				<option value="3" ${inst.ssim==3?' selected':''}>U14_3</option>
+		let sndSim = `<div data-snd="si" class="lbl-s hide">Sound sim<br>
+			<div class="sel-p"><select class="sel-p" id="seg${i}si" onchange="setSi(${i})">
+				<option value="0" ${inst.si==0?' selected':''}>BeatSin</option>
+				<option value="1" ${inst.si==1?' selected':''}>WeWillRockYou</option>
+				<option value="2" ${inst.si==2?' selected':''}>U10_3</option>
+				<option value="3" ${inst.si==3?' selected':''}>U14_3</option>
 			</select></div>
 		</div>`;
 		//WLEDMM Custom Effects
@@ -1220,7 +1220,7 @@ function updateSelectedFx()
 		var selectedName = selectedEffect.querySelector(".lstIname").innerText;
 		var segs = gId("segcont").querySelectorAll(`div[data-map="map2D"]`);
 		for (const seg of segs) if (selectedName.indexOf("\u25A6")<0) seg.classList.remove("hide"); else seg.classList.add("hide");
-		var segs = gId("segcont").querySelectorAll(`div[data-snd="ssim"]`);
+		var segs = gId("segcont").querySelectorAll(`div[data-snd="si"]`);
 		for (const seg of segs) if (selectedName.indexOf("\u266A")<0 && selectedName.indexOf("\266B")<0) seg.classList.add("hide"); else seg.classList.remove("hide"); // also "♫ "?
 	}
 }
@@ -2098,17 +2098,17 @@ function setMiY(s)
 	requestJson(obj);
 }
 
-function setMp12(s)
+function setM12(s)
 {
-	var value = gId(`seg${s}mp12`).selectedIndex;
-	var obj = {"seg": {"id": s, "mp12": value}};
+	var value = gId(`seg${s}m12`).selectedIndex;
+	var obj = {"seg": {"id": s, "m12": value}};
 	requestJson(obj);
 }
 
-function setSSim(s)
+function setSi(s)
 {
-	var value = gId(`seg${s}ssim`).selectedIndex;
-	var obj = {"seg": {"id": s, "ssim": value}};
+	var value = gId(`seg${s}si`).selectedIndex;
+	var obj = {"seg": {"id": s, "si": value}};
 	requestJson(obj);
 }
 

wled00/data/settings_wifi.htm

@@ -6,18 +6,111 @@
 	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"/>
 	<title>WiFi Settings</title>
 	<script>
-		var d=document;
+		var d = document;
 		var loc = false, locip;
+		var scanLoops = 0, preScanSSID = "";
+
+		function gId(e) { return d.getElementById(e); }
+		function cE(e) { return d.createElement(e); }
 		function H(){window.open("https://kno.wled.ge/features/settings/#wifi-settings");}
 		function B(){window.open("/settings","_self");}
+		function N() {
+			const url = (loc?`http://${locip}`:"") + "/json/net";
+
+			const button = gId("scan");
+			button.disabled = true;
+			button.innerHTML = "Scanning...";
+
+			fetch(url).then((response) => {
+				return response.json();
+			}).then((json) => {
+				// Get the list of networks only, defaulting to an empty array.
+				return Object.assign(
+					{},
+					{"networks": []},
+					json,
+				).networks.sort(
+					// Sort by signal strength, descending.
+					(a, b) => b.rssi - a.rssi
+				).reduce(
+					// Filter out duplicate SSIDs. Since it is sorted by signal
+					// strength, the strongest signal will be kept in the
+					// order it orginally appeared in the array.
+					(unique, other) => {
+						if(!unique.some(obj => obj.ssid === other.ssid)) {
+							unique.push(other);
+						}
+						return unique;
+					},
+					[],
+				);
+			}).then((networks) => {
+				// If there are no networks, fetch it again in a second.
+				// but only do this a few times.
+				if (networks.length === 0 && scanLoops < 10) {
+					scanLoops++;
+					setTimeout(N, 1000);
+					return;
+				}
+				scanLoops = 0;
+
+				let cs = gId("CS");
+				if (cs) {
+					let select = cE("select");
+					select.setAttribute("id", "CS");
+					select.setAttribute("name", "CS");
+					select.setAttribute("onchange", "T()");
+					preScanSSID = cs.value;
+
+					for (let i = 0; i < select.children.length; i++) {
+						select.removeChild(select.children[i]);
+					}
+
+					for (let i = 0; i < networks.length; i++) {
+						const option = cE("option");
+
+						option.setAttribute("value", networks[i].ssid);
+						option.innerHTML = `${networks[i].ssid} (${networks[i].rssi} dBm)`;
+
+						if (networks[i].ssid === cs.value) {
+							option.setAttribute("selected", "selected");
+						}
+
+						select.appendChild(option);
+					}
+					const option = cE("option");
+
+					option.setAttribute("value", "!Cs");
+					option.innerHTML = `Other network...`;
+					select.appendChild(option);
+
+					cs.replaceWith(select);
+				}
+
+				button.disabled = false;
+				button.innerHTML = "Scan";
+			});
+		}
+		// replace WiFi select with custom SSID input field again
+		function T() {
+			let cs = gId("CS");
+			if (!cs || cs.value != "!Cs") return;
+			let input = cE("input");
+			input.type = "text";
+			input.id = "CS";
+			input.name ="CS";
+			input.setAttribute("maxlength",32);
+			input.value = preScanSSID;
+			cs.replaceWith(input);
+		}
 		// https://www.educative.io/edpresso/how-to-dynamically-load-a-js-file-in-javascript
 		function loadJS(FILE_URL, async = true) {
-			let scE = d.createElement("script");
+			let scE = cE("script");
 			scE.setAttribute("src", FILE_URL);
 			scE.setAttribute("type", "text/javascript");
 			scE.setAttribute("async", async);
 			d.body.appendChild(scE);
-			// success event 
+			// success event
 			scE.addEventListener("load", () => {
 				//console.log("File loaded");
 				GetV();
@@ -31,13 +124,13 @@
 		function S() {
 			if (window.location.protocol == "file:") {
 				loc = true;
-				locip = localStorage.getItem('locIp');
+				locip = localStorage.getItem("locIp");
 				if (!locip) {
 					locip = prompt("File Mode. Please enter WLED IP!");
-					localStorage.setItem('locIp', locip);
+					localStorage.setItem("locIp", locip);
 				}
 			}
-			var url = (loc?`http://${locip}`:'') + '/settings/s.js?p=1';
+			let url = (loc?`http://${locip}`:'') + '/settings/s.js?p=1';
 			loadJS(url, false);	// If we set async false, file is loaded and executed, then next statement is processed
 		}
 	</script>
@@ -51,7 +144,9 @@
 		</div>
 		<h2>WiFi setup</h2>
 		<h3>Connect to existing network</h3>
-		Network name (SSID, empty to not connect): <br><input type="text" name="CS" maxlength="32"><br>
+		<button type="button" id="scan" onclick="N()">Scan</button><br>
+		Network name (SSID, empty to not connect):<br>
+		<input type="text" id="CS" name="CS" maxlength="32"><br>
 		Network password: <br> <input type="password" name="CP" maxlength="63"><br>
 		Static IP (leave at 0.0.0.0 for DHCP):<br>
 		<input name="I0" type="number" class="s" min="0" max="255" required> .
@@ -68,7 +163,7 @@
 		<input name="S1" type="number" class="s" min="0" max="255" required> .
 		<input name="S2" type="number" class="s" min="0" max="255" required> .
 		<input name="S3" type="number" class="s" min="0" max="255" required><br>
-		mDNS address (leave empty for no mDNS):<br/>
+		mDNS address (leave empty for no mDNS):<br>
 		http:// <input type="text" name="CM" maxlength="32"> .local<br>
 		Client IP: <span class="sip"> Not connected </span> <br>
 		<h3>Configure Access Point</h3>
@@ -105,4 +200,4 @@
 		<button type="button" onclick="B()">Back</button><button type="submit">Save & Connect</button>
 	</form>
 </body>
-</html>
+</html>

wled00/data/style.css

@@ -41,6 +41,9 @@ button.sml {
   min-width: 40px;
   margin: 0 0 0 10px;
 }
+#scan {
+  margin-top: -10px;
+}
 .toprow {
   top: 0;
   position: sticky;