ctbk/dmx-interface
1
0
Fork 0
mirror of https://github.com/HendrikRauh/dmx-interface.git synced 2025-05-18 21:55:34 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

implemented reset of config

Browse source
This commit is contained in:
RaffaelW 2024-11-03 22:27:12 +01:00
parent 2ee16f6452
commit 8a3bd49686
5 changed files with 47 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
data/index.html
View file

@ -8,6 +8,7 @@
<script type="module" src="/input-visibility.js" defer></script>
<script type="module" src="/load-data.js" defer></script>
<script type="module" src="/submit.js" defer></script>
<script type="module" src="/reset.js" defer></script>
</head>
<body>
<main>
@ -152,7 +153,10 @@
/>
</label>
</fieldset>
<button type="submit">Speichern</button>
<div class="buttons">
<button type="reset">Zurücksetzen</button>
<button type="submit">Speichern</button>
</div>
</form>
</main>
</body>

2
data/load-data.js
View file

@ -18,7 +18,7 @@ async function loadData() {
}
}
function writeDataToInput(data) {
export function writeDataToInput(data) {
console.log("write data", typeof data);
for (const [key, value] of Object.entries(data)) {
const element = document.querySelector(`[name=${key}]`);

21
data/reset.js Normal file
View file

@ -0,0 +1,21 @@
import { writeDataToInput } from "/load-data.js";
const form = document.querySelector("form");
form.addEventListener("reset", async (event) => {
event.preventDefault();
try {
const res = await fetch("/reset", {
method: "POST",
});
if (!res.ok) {
throw new Error(`Response status: ${res.status}`);
}
const json = await res.json();
writeDataToInput(json);
} catch (error) {
console.error(error.message);
}
});

14
data/style.css
View file

@ -1,6 +1,7 @@
:root {
--color-primary: #087e8b;
--color-on-primary: white;
--color-danger: #fa2b58;
}
body {
@ -59,14 +60,16 @@ select:focus {
}
button {
display: block;
border: none;
inset: none;
border-radius: 8px;
background-color: var(--color-primary);
color: var(--color-on-primary);
padding: 8px 16px;
margin: 0 auto;
}
button[type="reset"] {
background-color: var(--color-danger);
}
:is(div:has(:is(input, select)), input, select, label)
@ -126,3 +129,10 @@ label.switch input:checked + .slider::before {
left: 100%;
translate: -100% -50%;
}
.buttons {
display: flex;
flex-direction: row;
justify-content: center;
gap: 8px;
}

8
src/main.cpp
View file

@ -84,6 +84,14 @@ void setup()
server.on("/config", HTTP_GET, [](AsyncWebServerRequest *request)
{ onGetConfig(config, request); });
server.on("/reset", HTTP_POST, [](AsyncWebServerRequest *request)
{
config.begin("dmx", false);
config.clear();
config.end();
// respond with default config
onGetConfig(config, request); });
server.onRequestBody([](AsyncWebServerRequest *request, uint8_t *data, size_t len, size_t index, size_t total)
{
if (request->url() == "/config" && request->method() == HTTP_PUT) {