111 lines
3.1 KiB
HTML
111 lines
3.1 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
body {
|
|
background-color: #ffffff;
|
|
}
|
|
</style>
|
|
<title>ESP Captive Portal</title>
|
|
</head>
|
|
<body>
|
|
<h1>ESP Captive Portal</h1>
|
|
<p>Hello World, this is ESP32!</p>
|
|
|
|
<div id="interface">
|
|
<form id="submit_form">
|
|
</form>
|
|
</div>
|
|
<script>
|
|
function outputSuccess(response_object) {
|
|
let root = document.getElementById("interface");
|
|
root.innerHTML = "";
|
|
|
|
root.innerHTML = `<b>${response_object.response_str}</b>`;
|
|
}
|
|
|
|
function outputFailure(response_object) {
|
|
let root = document.getElementById("interface");
|
|
root.innerHTML = "";
|
|
|
|
root.innerHTML = `<p><b>Request failed.</b></br>Reason:${response_object.response_str}</p>`;
|
|
}
|
|
|
|
function submitFormHandler(event) {
|
|
console.log("In the post handler.");
|
|
event.preventDefault();
|
|
|
|
const form_data = new FormData(document.getElementById("submit_form"));
|
|
let configuration_data = [];
|
|
for (const pair of form_data.entries()) {
|
|
configuration_data.push({
|
|
nvs_name: pair[0],
|
|
value: pair[1]
|
|
});
|
|
}
|
|
|
|
console.log(`Posting data: ${JSON.stringify(configuration_data)}`);
|
|
|
|
fetch("configure", {
|
|
method: "POST",
|
|
headers: {
|
|
"Content-Type": "application/json"
|
|
},
|
|
body: JSON.stringify(configuration_data)
|
|
}).then((r) => {
|
|
console.log("Got a response.");
|
|
console.log(r);
|
|
|
|
if (r.ok) {
|
|
outputSuccess(r.json());
|
|
} else {
|
|
outputFailure(r.json());
|
|
}
|
|
});
|
|
}
|
|
|
|
async function getParameterFields() {
|
|
const response = await fetch("parameters", {
|
|
method: "GET",
|
|
})
|
|
|
|
return response.json();
|
|
}
|
|
|
|
async function populateSubmitForm(form_root) {
|
|
const data = await getParameterFields();
|
|
for (let param of data) {
|
|
let input = document.createElement("input");
|
|
input.setAttribute("id", param.nvs_name);
|
|
input.setAttribute("name", param.nvs_name);
|
|
|
|
if (param.type === 0 || param.type === 1) {
|
|
input.setAttribute("type", "number");
|
|
} else {
|
|
input.setAttribute("type", "text");
|
|
}
|
|
|
|
let label = document.createElement("label");
|
|
label.setAttribute("for", param.nvs_name);
|
|
label.innerHTML = param.name + ":";
|
|
|
|
form_root.appendChild(label);
|
|
form_root.appendChild(document.createElement("br"));
|
|
form_root.appendChild(input);
|
|
form_root.appendChild(document.createElement("br"));
|
|
}
|
|
|
|
let submit = document.createElement("input");
|
|
submit.setAttribute("type", "submit");
|
|
submit.setAttribute("value", "Configure");
|
|
|
|
form_root.appendChild(submit);
|
|
|
|
form_root.addEventListener("submit", submitFormHandler, true);
|
|
}
|
|
|
|
populateSubmitForm(document.getElementById("submit_form"));
|
|
</script>
|
|
</body>
|
|
</html>
|