Add unranked zone notification & better zones

This commit is contained in:
Tom Hubrecht 2021-04-20 14:40:02 +02:00
parent 2f769e84ab
commit 4f05dd0df0

View file

@ -7,7 +7,6 @@
const nb_options = {{ nb_options }}; const nb_options = {{ nb_options }};
var ranks_used = nb_options; var ranks_used = nb_options;
var rank_zones = new Array(nb_options + 1); var rank_zones = new Array(nb_options + 1);
var ranked = 0;
var $unranked; var $unranked;
function getLabelText($input) { function getLabelText($input) {
@ -109,9 +108,6 @@
var $input = document.getElementById($tile.dataset.input); var $input = document.getElementById($tile.dataset.input);
$input.value = rank; $input.value = rank;
// On modifie ranked pour savoir combien d'options on a classé
ranked += ($target.id == 'unranked' ? -1 : 1);
collapseRanks(); collapseRanks();
} }
@ -173,6 +169,7 @@
if ($hide.classList.contains('is-hidden')) { if ($hide.classList.contains('is-hidden')) {
$method_button.innerHTML = "{% trans "Utiliser le formulaire classique" %}"; $method_button.innerHTML = "{% trans "Utiliser le formulaire classique" %}";
moveOptions(); moveOptions();
collapseRanks(); collapseRanks();
} else { } else {
@ -207,6 +204,11 @@
moveOptions(); moveOptions();
collapseRanks(); collapseRanks();
document.querySelectorAll('.drop-zone').forEach($zone => {
$zone.addEventListener('drop', drop_handler);
$zone.addEventListener('dragover', dragover_handler);
});
}); });
</script> </script>
@ -227,14 +229,14 @@
<div id="drag-zone" class="tile is-ancestor"> <div id="drag-zone" class="tile is-ancestor">
<div class="tile is-vertical"> <div class="tile is-vertical">
{% for i in range_options %} {% for i in range_options %}
<div class="tile is-parent is-flex-grow-0 {% if not forloop.first %}is-hidden{% endif %}" ondrop="drop_handler(event)" ondragover="dragover_handler(event)"> <div class="tile is-parent is-flex-grow-0 {% if not forloop.first %}is-hidden{% endif %}">
<div id="rank-{{ i }}" class="tile is-child notification is-primary is-light pl-3 pt-3 drop-zone" data-rank="{{ i }}"> <div id="rank-{{ i }}" class="tile is-child notification is-primary is-light pl-3 pt-3 drop-zone" data-rank="{{ i }}">
<div class="tag is-medium is-primary">{% blocktrans %}Rang {{ i }}{% endblocktrans %}</div> <div class="tag is-medium is-primary">{% blocktrans %}Rang {{ i }}{% endblocktrans %}</div>
</div> </div>
</div> </div>
{% endfor %} {% endfor %}
<div class="tile is-parent is-flex-grow-0" ondrop="drop_handler(event)" ondragover="dragover_handler(event)"> <div class="tile is-parent is-flex-grow-0">
<div id="rank-add" class="tile is-child notification has-text-centered drop-zone"> <div id="rank-add" class="tile is-child notification has-text-centered drop-zone">
<span class="icon-text subtitle has-text-primary"> <span class="icon-text subtitle has-text-primary">
<span class="icon"> <span class="icon">
@ -246,7 +248,9 @@
</div> </div>
</div> </div>
<div id="unranked" class="tile is-vertical drop-zone" ondrop="drop_handler(event)" ondragover="dragover_handler(event)" data-rank=""> <div class="tile is-parent">
<div id="unranked" class="tile is-vertical drop-zone notification" data-rank="">
</div>
</div> </div>
</div> </div>