added class to form and added section to prepare next commit

This commit is contained in:
RaffaelW 2024-12-19 17:26:05 +01:00
parent 4ac0681a9a
commit 90f8d7c07e
6 changed files with 157 additions and 151 deletions

View file

@ -11,6 +11,7 @@
<script type="module" src="/networks.js" defer></script>
<script type="module" src="/submit.js" defer></script>
<script type="module" src="/reset.js" defer></script>
<script type="module" src="/status.js" defer></script>
</head>
<body>
<main>
@ -29,7 +30,8 @@
</div>
</section>
<form class="hidden">
<section class="content hidden">
<form class="config">
<h1>Konfiguration</h1>
<fieldset>
<legend>Verbindung</legend>
@ -109,7 +111,10 @@
id="refresh-networks"
class="icon-button"
>
<img src="/icons/refresh.svg" alt="Neu laden" />
<img
src="/icons/refresh.svg"
alt="Neu laden"
/>
</button>
</label>
</div>
@ -182,6 +187,7 @@
<button type="submit">Speichern</button>
</div>
</form>
</section>
</main>
</body>
</html>

View file

@ -1,4 +1,4 @@
const form = document.querySelector("form");
const form = document.querySelector("form.config");
const dynamicInputs = form.querySelectorAll("[data-field][data-values]");
document.addEventListener("change", updateVisibility);

View file

@ -4,7 +4,7 @@ import {
hideLoadingScreen,
} from "./loading-screen.js";
const form = document.querySelector("form");
const form = document.querySelector("form.config");
export async function loadData(timeout = null) {
const req = await fetch("/config", {

View file

@ -1,11 +1,11 @@
const form = document.querySelector("form");
const content = document.querySelector("section.content");
const loadingScreen = document.querySelector(".loading-screen");
const loadingMsg = loadingScreen.querySelector("h2");
const spinner = loadingScreen.querySelector(".spinner");
const reloadBtn = loadingScreen.querySelector(".reload");
export function showLoadingScreen(msg) {
hide(form, reloadBtn);
hide(content, reloadBtn);
show(loadingScreen, spinner);
loadingMsg.classList.remove("error");
loadingMsg.textContent = msg;
@ -22,7 +22,7 @@ export function showError(msg) {
export function hideLoadingScreen() {
hide(loadingScreen, reloadBtn);
show(form);
show(content);
loadingMsg.classList.remove("error");
loadingMsg.textContent = "";
}

View file

@ -1,6 +1,6 @@
import { updateConfig } from "/submit.js";
const form = document.querySelector("form");
const form = document.querySelector("form.config");
form.addEventListener("reset", async (event) => {
event.preventDefault();

View file

@ -5,7 +5,7 @@ import {
showError,
} from "./loading-screen.js";
const form = document.querySelector("form");
const form = document.querySelector("form.config");
function parseValue(input) {
if (input.type === "checkbox") {