parroquia-san-leandro/cancionero-web
1
0
Fork 0
mirror of https://gitlab.com/parroquia-san-leandro/cancionero-web.git synced 2024-12-22 08:43:33 +01:00
Code Releases Activity

minimizar espacio vertical y mostrar-ocultar acordes

Browse source
This commit is contained in:
Carlos Galindo 2022-11-22 19:22:00 +01:00
parent e6b10585b7
commit e838b066de
2 changed files with 14 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
res/static/song.js
View file

@ -73,20 +73,18 @@ function getTranspose() {
// Init
window.onload = function () {
var show = localStorage.getItem("show_chords") == "true";
var show = localStorage.getItem("show_chords") != "false";
showChords(show);
document.getElementById("showChords").checked = show;
};
function showChords(show) {
if (show || show == "true") {
document.getElementById("songLyrics").style.display = "none";
document.getElementById("songChords").style.display = "block";
document.getElementById("transposeControls").style.display = "block";
for (let e of document.getElementsByClassName("showChords")) { e.style.display = "block"; }
for (let e of document.getElementsByClassName("showLyrics")) { e.style.display = "none"; }
} else {
document.getElementById("songLyrics").style.display = "block";
document.getElementById("songChords").style.display = "none";
document.getElementById("transposeControls").style.display = "none";
for (let e of document.getElementsByClassName("showChords")) { e.style.display = "none"; }
for (let e of document.getElementsByClassName("showLyrics")) { e.style.display = "block"; }
}
localStorage.setItem("show_chords", show);
}

17
res/templates/song.html
View file

@ -9,15 +9,15 @@
{% include "header.html" with path=".." %}
<main>
<div class="song">
<h2>{{song.number}}. {{ song.name}}</h2>
<a href="../#{{ song.category|slugify }}"><span>Categoría: {{ song.category|title }}</span></a>
<h2 style="display: inline-block;">{{song.number}}. {{ song.name}}</h2>
{% if song.author %}
<span>por <strong>{{ song.author }}</strong></span>
{% endif %}
{% if song.origin %}
<span>basada en: <strong>{{ song.origin }}</strong></span>
{% endif %}
<h3>Ajustes</h3>
<details>
<summary><h3 style="display: inline-block;">Ajustes</h3></summary>
<div>
<label>Cambiar tamaño de letra </label>
<button class="small" onclick="size(-1)">-</button>
@ -28,7 +28,7 @@
<div>
<label><input id="showChords" type="checkbox" checked onchange="showChords(this.checked)"/> Mostrar acordes</label>
</div>
<div id="transposeControls">
<div id="transposeControls" class="showChords">
<label>Transponer acordes </label>
<button class="small" onclick="transposeAdd(-2)">-2</button>
<button class="small" onclick="transposeAdd(-1)">-1</button>
@ -51,16 +51,17 @@
<button class="small" onclick="transposeAdd(2)">+2</button>
<button onclick="transpose(0)">Reset</button>
</div>
{% endif %}
{% if song.capo != 0 %}
<div>
<div class="showChords">
<span class="capo">Tono original: Cejilla {{ song.capo }}</span>
<button style="margin-left: 0.5em;" onclick="transpose({{ song.capo}})">Transponer para quitarla</button>
</div>
{% endif %}
{% endif %}
</details>
<h3>Canción</h3>
<div id="wholeSongDiv">
<div id="songLyrics" style="display: none;">
<div id="songLyrics" class="showLyrics" style="display: none;">
{% for verse in song.verses %}
<div class="{{ verse.kind }}">
{% for line in verse.lines %}
@ -69,7 +70,7 @@
</div>
{% endfor %}
</div>
<div id="songChords">
<div id="songChords" class="showChords">
{% for verse in song.verses %}
<div class="{{ verse.kind }}">
{% for line in verse.lines %}