From dd32be28c014ec3534659c4d62523395f993f5f2 Mon Sep 17 00:00:00 2001
From: Tom Hubrecht <tom.hubrecht@ens.fr>
Date: Fri, 16 Apr 2021 11:01:54 +0200
Subject: [PATCH] =?UTF-8?q?On=20cr=C3=A9e=20des=20templates=20diff=C3=A9re?=
 =?UTF-8?q?nts=20pour=20les=20modes=20de=20vote?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 elections/templates/elections/vote.html       | 89 +------------------
 elections/templates/elections/vote/rank.html  | 62 +++++++++++++
 .../templates/elections/vote/select.html      | 40 +++++++++
 elections/views.py                            |  4 +-
 4 files changed, 107 insertions(+), 88 deletions(-)
 create mode 100644 elections/templates/elections/vote/rank.html
 create mode 100644 elections/templates/elections/vote/select.html

diff --git a/elections/templates/elections/vote.html b/elections/templates/elections/vote.html
index 6a23440..9692d75 100644
--- a/elections/templates/elections/vote.html
+++ b/elections/templates/elections/vote.html
@@ -2,92 +2,6 @@
 {% load i18n %}
 
 
-{% block extra_head %}
-{% if question.vote_type == 'select' %}
-<script>
-  document.addEventListener('DOMContentLoaded', () => {
-    document.getElementById('confirm-button').addEventListener('click', () => {
-      var $modal_body = document.getElementById('modal-body');
-
-      var selected_rows = '';
-
-      (document.querySelectorAll('.checkbox input') || []).forEach($checkbox => {
-        if ($checkbox.checked) {
-          let option_text = $checkbox.nextSibling.textContent.trim();
-          selected_rows += '<tr><td>' + option_text + '</td></tr>\n';
-        }
-      });
-
-      $modal_body.innerHTML = `
-      <table class="table is-fullwidth">
-        <thead>
-          <tr>
-            <th>{% trans "Option(s) selectionnée(s)" %}</th>
-          </tr>
-        </thead>
-        <tbody>
-          ${selected_rows}
-        </tbody>
-      </table>`;
-    });
-  });
-
-</script>
-{% elif question.vote_type == 'rank' %}
-<script>
-  document.addEventListener('DOMContentLoaded', () => {
-    document.getElementById('confirm-button').addEventListener('click', () => {
-      var $modal_body = document.getElementById('modal-body');
-
-      var ranks = new Array({{ nb_options }} + 1);
-
-      (document.querySelectorAll('.control .input') || []).forEach($input => {
-        var rank = parseInt($input.value);
-        if ($input.value == '') {
-          rank = {{ nb_options }};
-        }
-
-        var option = $input.closest('.field').querySelector('.label label').innerHTML;
-        option = option.substring(0, option.length - 1).trim();
-
-        if (rank > 0 && rank <= {{ nb_options }}) {
-          ranks[rank] = (ranks[rank] || []).concat([option]); // TODO: chercher une meilleure méthode
-        }
-      });
-
-      var table_rows = '';
-
-      for (let i = 1; i <= {{ nb_options }}; i++) {
-        var option_list = '';
-
-        if (!(typeof ranks[i] === 'undefined')) {
-          for (option of ranks[i]) {
-            option_list += `${option}<br>`;
-          }
-        }
-        table_rows += `<tr><th>${i}</th><td><div>${option_list}</div></td></tr>\n`
-      }
-
-      $modal_body.innerHTML = `
-      <table class="table is-fullwidth is-striped">
-        <thead>
-          <tr>
-            <th>{% trans "Classement" %}</th>
-            <th>{% trans "Option(s) selectionnée(s)" %}</th>
-          </tr>
-        </thead>
-        <tbody>
-          ${table_rows}
-        </tbody>
-      </table>`;
-
-    });
-  });
-
-</script>
-{% endif %}
-{% endblock %}
-
 {% block content %}
 
 <div class="level">
@@ -111,10 +25,11 @@
 
 <div class="columns is-centered">
   <div class="column is-two-thirds">
+
     <form action="" method="post">
       {% csrf_token %}
 
-      {% include "forms/formset.html" %}
+    {% block vote_form %}{% endblock %}
 
       <div class="field is-grouped is-centered">
         <div class="control is-expanded">
diff --git a/elections/templates/elections/vote/rank.html b/elections/templates/elections/vote/rank.html
new file mode 100644
index 0000000..556343d
--- /dev/null
+++ b/elections/templates/elections/vote/rank.html
@@ -0,0 +1,62 @@
+{% extends "elections/vote.html" %}
+{% load i18n %}
+
+
+{% block extra_head %}
+<script>
+  document.addEventListener('DOMContentLoaded', () => {
+    document.getElementById('confirm-button').addEventListener('click', () => {
+      var $modal_body = document.getElementById('modal-body');
+
+      var ranks = new Array({{ nb_options }} + 1);
+
+      (document.querySelectorAll('.control .input') || []).forEach($input => {
+        var rank = parseInt($input.value);
+        if ($input.value == '') {
+          rank = {{ nb_options }};
+        }
+
+        var option = $input.closest('.field').querySelector('.label label').innerHTML;
+        option = option.substring(0, option.length - 1).trim();
+
+        if (rank > 0 && rank <= {{ nb_options }}) {
+          ranks[rank] = (ranks[rank] || []).concat([option]); // TODO: chercher une meilleure méthode
+        }
+      });
+
+      var table_rows = '';
+
+      for (let i = 1; i <= {{ nb_options }}; i++) {
+        var option_list = '';
+
+        if (!(typeof ranks[i] === 'undefined')) {
+          for (option of ranks[i]) {
+            option_list += `${option}<br>`;
+          }
+        }
+        table_rows += `<tr><th>${i}</th><td><div>${option_list}</div></td></tr>\n`
+      }
+
+      $modal_body.innerHTML = `
+      <table class="table is-fullwidth is-striped">
+        <thead>
+          <tr>
+            <th>{% trans "Classement" %}</th>
+            <th>{% trans "Option(s) selectionnée(s)" %}</th>
+          </tr>
+        </thead>
+        <tbody>
+          ${table_rows}
+        </tbody>
+      </table>`;
+
+    });
+  });
+
+</script>
+{% endblock %}
+
+
+{% block vote_form %}
+{% include "forms/formset.html" %}
+{% endblock %}
diff --git a/elections/templates/elections/vote/select.html b/elections/templates/elections/vote/select.html
new file mode 100644
index 0000000..1471e75
--- /dev/null
+++ b/elections/templates/elections/vote/select.html
@@ -0,0 +1,40 @@
+{% extends "elections/vote.html" %}
+{% load i18n %}
+
+
+{% block extra_head %}
+<script>
+  document.addEventListener('DOMContentLoaded', () => {
+    document.getElementById('confirm-button').addEventListener('click', () => {
+      var $modal_body = document.getElementById('modal-body');
+
+      var selected_rows = '';
+
+      (document.querySelectorAll('.checkbox input') || []).forEach($checkbox => {
+        if ($checkbox.checked) {
+          let option_text = $checkbox.nextSibling.textContent.trim();
+          selected_rows += '<tr><td>' + option_text + '</td></tr>\n';
+        }
+      });
+
+      $modal_body.innerHTML = `
+      <table class="table is-fullwidth">
+        <thead>
+          <tr>
+            <th>{% trans "Option(s) selectionnée(s)" %}</th>
+          </tr>
+        </thead>
+        <tbody>
+          ${selected_rows}
+        </tbody>
+      </table>`;
+    });
+  });
+
+</script>
+{% endblock %}
+
+
+{% block vote_form %}
+{% include "forms/formset.html" %}
+{% endblock %}
diff --git a/elections/views.py b/elections/views.py
index 4b0a2c3..34e20b0 100644
--- a/elections/views.py
+++ b/elections/views.py
@@ -481,7 +481,6 @@ class ElectionVotersView(NotArchivedMixin, DetailView):
 
 class VoteView(OpenElectionOnlyMixin, DetailView):
     model = Question
-    template_name = "elections/vote.html"
 
     def dispatch(self, request, *args, **kwargs):
         # Si l'utilisateur n'est pas connecté on renvoie sur la vue de l'élection
@@ -491,6 +490,9 @@ class VoteView(OpenElectionOnlyMixin, DetailView):
             )
         return super().dispatch(request, *args, **kwargs)
 
+    def get_template_names(self):
+        return [f"elections/vote/{self.object.vote_type}.html"]
+
     def get_next_url(self):
         return reverse("election.view", args=[self.object.election.pk])