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

Opción para ocultar los acordes.

Browse source
This commit is contained in:
Carlos Galindo 2021-06-30 17:20:46 +02:00
parent bbf76fa6a3
commit 9c7fcd1ec3
3 changed files with 90 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
res/static/sizes.js
View file

@ -1,12 +0,0 @@
SIZE_STEPS = [30, 50, 67, 80, 90, 100, 110, 120, 133, 150, 170, 200, 240, 300];
currSize = SIZE_STEPS.indexOf(100)
/** Changes the size of the lyrics and chords. */
function size(steps) {
if (steps === 0) {
currSize = SIZE_STEPS.indexOf(100);
}
currSize += steps;
document.getElementById('wholeSongDiv').style.fontSize = SIZE_STEPS[currSize] + '%';
}

43
res/static/transpose.js → res/static/song.js
View file

@ -1,3 +1,24 @@
/* ===========================================
FONT SIZE
=========================================== */
SIZE_STEPS = [30, 50, 67, 80, 90, 100, 110, 120, 133, 150, 170, 200, 240, 300];
currSize = SIZE_STEPS.indexOf(100)
/** Changes the size of the lyrics and chords. */
function size(steps) {
if (steps === 0) {
currSize = SIZE_STEPS.indexOf(100);
}
currSize += steps;
document.getElementById('wholeSongDiv').style.fontSize = SIZE_STEPS[currSize] + '%';
}
/* ===========================================
TRANSPOSE CHORDS
=========================================== */
ENG_INDEX = {'C': 0, 'C#': 1, 'Db': 1, 'D': 2, 'D#': 3, 'Eb': 3, 'E': 4, 'Fb': 4, 'F': 5, 'E#': 5, 'F#': 6, 'Gb': 6, 'G': 7, 'G#': 8, 'Ab': 8, 'A': 9, 'A#': 10, 'Bb': 10, 'B': 11, 'Cb': 11, 'B#': 0}
LAT_INDEX = {'Do': 0, 'Do#': 1, 'Reb': 1, 'Re': 2, 'Re#': 3, 'Mib': 3, 'Mi': 4, 'Fab': 4, 'Fa': 5, 'Mi#': 5, 'Fa#': 6, 'Solb': 6, 'Sol': 7, 'Sol#': 8, 'Lab': 8, 'La': 9, 'La#': 10, 'Sib': 10, 'Si': 11, 'Dob': 11, 'Si#': 0}
CHORDS_LAT = ['Do', 'Do#', 'Re', 'Re#', 'Mi', 'Fa', 'Fa#', 'Sol', 'Sol#', 'La', 'Sib', 'Si']
@ -42,3 +63,25 @@ function setTransposeSelector(n) {
function getTranspose() {
return Number.parseInt(document.getElementById("transposeSelect").value)
}
/* ===========================================
HIDE CHORDS
=========================================== */
// Init
document.addEventListener("DOMContentLoaded", function () {
var show = localStorage.getItem("show_chords") == "true";
showChords(show);
document.getElementById("showChords").checked = show;
}, false);
function showChords(show) {
if (show || show == "true") {
document.getElementById("songLyrics").style.display = "none";
document.getElementById("songChords").style.display = "block";
} else {
document.getElementById("songLyrics").style.display = "block";
document.getElementById("songChords").style.display = "none";
}
localStorage.setItem("show_chords", show);
}

17
res/templates/song.html
View file

@ -3,8 +3,7 @@
<head>
{% include "head.html" with path=".." only %}
<link rel="stylesheet" type="text/css" href="../song.css"/>
<script async src="../transpose.js"></script>
<script async src="../sizes.js"></script>
<script async src="../song.js"></script>
</head>
<body>
{% include "header.html" with path=".." %}
@ -26,6 +25,9 @@
<button class="small" onclick="size(+1)">+</button>
</div>
{% if song.chorded %}
<div>
<label><input id="showChords" type="checkbox" checked onchange="showChords(this.checked)"/> Mostrar acordes</label>
</div>
<div>
<label>Transponer acordes </label>
<button class="small" onclick="transposeAdd(-2)">-2</button>
@ -58,6 +60,16 @@
{% endif %}
<h3>Canción</h3>
<div id="wholeSongDiv">
<div id="songLyrics" style="display: none;">
{% for verse in song.verses %}
<div class="{{ verse.kind }}">
{% for line in verse.lines %}
{{ line }}<br/>
{% endfor %}
</div>
{% endfor %}
</div>
<div id="songChords">
{% for verse in song.verses %}
<div class="{{ verse.kind }}">
{% for line in verse.lines %}
@ -93,6 +105,7 @@
</div>
{% endfor %}
</div>
</div>
{% for audio in audios %}
{% if forloop.first %}
<h3>Audios</h3>