change checkbox to radio buttons and simplify handling

This commit is contained in:
Carlos Galindo 2026-01-23 19:42:01 +01:00
commit 8c1c0d47c3

View file

@ -46,8 +46,8 @@ span.songSelector {
<input type="button" onclick="shareList(event)" value="compartirla">.</p>
<p>Si prefieres crear un PDF, <a href="https://cgj.es/cancionero-generador/">pulsa aquí</a>.</p>
<p>
<label class="forCheckbox"><input class="init" id="controlsCheckbox" type="checkbox" onchange="toggleControls(event)" checked> Modificar la lista</label>
<label class="forCheckbox"><input class="init" id="previewCheckbox" type="checkbox" onchange="togglePreview(event)"> Ver las canciones</label>
<label class="forCheckbox"><input class="init" id="controlsCheckbox" type="radio" name="mode" onchange="toggleControls(event)" checked> Modificar la lista</label>
<label class="forCheckbox"><input class="init" id="previewCheckbox" type="radio" name="mode" onchange="togglePreview(event)"> Ver las canciones</label>
<label class="forCheckbox"><input id="showChords" type="checkbox" checked onchange="showChords(this.checked)"/> Mostrar acordes</label>
</p>
<p class="controls mainButtons">
@ -197,32 +197,20 @@ function getSongList() {
}
function toggleControls(event) {
if (event.target.checked) {
document.body.classList.remove("hideControls");
} else {
if (getSongList().length == 0) {
event.target.checked = true;
} else {
document.body.classList.add("hideControls");
let preview = document.getElementById('previewCheckbox');
if (!preview.checked) {
preview.checked = true;
preview.dispatchEvent(new Event("change"));
}
}
}
toggleMode(event.target.checked);
}
function togglePreview(event) {
if (event.target.checked) {
document.body.classList.remove("hidePreview");
} else {
document.body.classList.add("hidePreview");
let controls = document.getElementById('controlsCheckbox');
if (!controls.checked) {
controls.checked = true;
controls.dispatchEvent(new Event("change"));
toggleMode(!event.target.checked);
}
function toggleMode(controls) {
if (controls) {
document.body.classList.remove("hideControls");
document.body.classList.add("hidePreview");
} else {
document.body.classList.add("hideControls");
document.body.classList.remove("hidePreview");
}
}