add button to view mac

Author: Sorunome

www/styles.css

@@ -194,7 +194,9 @@ img {
     src: url(fonts/seurat.otf);
 }
 
-
+.mac-address {
+	font-family: "Lucida Console", "Courier New", monospace;
+}
 
 .flex, .flexreturn {
 display:flex;

www/user.js

@@ -119,9 +119,11 @@ doRequest("GET", `${BASE_URL}/account/me`, null, (text) => {
 	// build the console html
 	let html = "";
 	for (const console of account_data.consoles) {
+		const machtml = escapeHtml(console.mac.toString());
 		html += '<form class="console-edit-form">';
-		html += `<input type="hidden" name="mac" value="${escapeHtml(console.mac.toString())}" />`;
+		html += `<input type="hidden" name="mac" value="${machtml}" />`;
 		html += `<p><b>Name:</b><input name="name" type="text" class="txt" maxlength="50" value="${escapeHtml(console.name || "")}" /></p>`;
+		html += `<p><b>Mac: <a class="show-mac-${machtml}" href="#">Click to show</a></p>`
 		if (account_data.permission >= 10) html += `<b>Set Mii to Special:</b> <input name="special_mii" type="checkbox" ${console.special_mii ? "checked" : ""} /><br>`;
 		if (account_data.permission >= 20) html += `<p><b>Set Mii Country:</b><input name="mii_country" type="text" class="txt" maxlength="50" value="${escapeHtml(console.mii_country || "")}" /></p>`;
 		if (account_data.permission >= 20) html += `<p><b>Set Mii Region:</b> <input name="mii_region" type="text" class="txt" maxlength="15" value="${escapeHtml(console.mii_region || "")}" /></p>`;
@@ -146,6 +148,19 @@ doRequest("GET", `${BASE_URL}/account/me`, null, (text) => {
 			doRequest("PUT", `${BASE_URL}/account/me/console/${form.elements["mac"].value}`, post_data, reload, reload);
 			return false;
 		});
+		const mac_element = document.getElementById("show-mac-" + escapeHtml(console.mac.toString());
+		mac_element.addEventListener("click", (e) => {
+			e.preventDefault();
+			const mac = [...parseInt(form.elements["mac"].value, 10)
+				.toString(16)
+				.padStart(12, "0")
+				.padStart(12, "0")
+				.split("")
+				.entries()
+				.map(entry => entry[1] + (entry[0] % 2 ? ":" : ""))
+			].join("").slice(0, -1);
+			mac_element.outerHTML = `<span class="mac-address">${escapeHtml(mac)}</span>`;
+		});
 	}
 
 	// add new console callback