feat(polls): add option to import from csv

Ion.egg-info/SOURCES.txt

@@ -1154,6 +1154,7 @@ intranet/static/js/vendor/jquery-1.10.2.min.js
 intranet/static/js/vendor/jquery-1.10.2.min.map
 intranet/static/js/vendor/jquery.are-you-sure.js
 intranet/static/js/vendor/jquery.cookie.js
+intranet/static/js/vendor/jquery.csv.min.js
 intranet/static/js/vendor/jquery.formset.js
 intranet/static/js/vendor/jquery.overscroll.min.js
 intranet/static/js/vendor/jquery.scrollto.min.js

intranet/static/css/polls.form.scss

@@ -8,6 +8,28 @@
     padding-bottom: 10px;
 }
 
+#import_from_csv {
+    width: 150px;
+}
+
+#csv_wrapper {
+    padding-top: 10px;
+    padding-bottom: 10px;
+}
+
+#csv_input {
+    display: none;
+    width: 0;
+    height: 0;
+}
+
+#csv_error {
+    padding-left: 10px;
+    width: 50px;
+    color: red;
+    text-decoration: none;
+}
+
 #questions {
     .question {
         position: relative;

intranet/static/js/polls.js

@@ -58,6 +58,74 @@ $(function() {
         addInline(v);
     });
 
+    $("#import_from_csv").click(async function (e) {
+        e.preventDefault();
+        $("#csv_input").click();
+    });
+
+    $("#csv_input").on("change", function (e) {
+        e.preventDefault();
+        let file = $("#csv_input").prop("files")[0];
+        let file_reader = new FileReader();
+        file_reader.onload = async function (e) {
+            // csv should have the following headers
+            // name, position, platform, slogan
+            let csv_data = $.csv.toArrays(file_reader.result);
+            if (csv_data.length === 0) {
+                $("#csv_error").text("Empty CSV");
+                return;
+            }
+
+            let required_labels = ["position", "name", "platform", "slogan"]
+            let labels = csv_data[0].map(l => l.toLowerCase());
+            if (!required_labels.every(l => labels.includes(l))) {
+                let missing_labels = required_labels.filter(l => !labels.includes(l))
+                $("#csv_error").text(`Missing required label(s): ${missing_labels.join(", ")}`)
+                return;
+            }
+            $("#csv_error").text("");
+
+            let content = csv_data.slice(1);
+            let map = {}; // (position) -> (name, platform, slogan)
+            for (let line of content) {
+                let position = line[labels.indexOf("position")];
+                let name = line[labels.indexOf("name")];
+                let platform = line[labels.indexOf("platform")];
+                let slogan = line[labels.indexOf("slogan")];
+
+                if (!(position in map)) {
+                    map[position] = [];
+                }
+                map[position].push([name, platform, slogan]);
+            }
+
+            let sleep = async () => { await new Promise(resolve => setTimeout(resolve, 0)); };
+
+            for (let [position, choices] of Object.entries(map)) {
+                $("#add_question").click();
+                let question_element = $("#questions .question:last-child");
+                await sleep();
+
+                // set position, type, and max choices of question
+                question_element.find(".text").html(position);
+                question_element.find(".type").data('selectize').setValue("RAN");
+                question_element.find(".max").val(`${Math.min(choices.length, 3)}`);
+
+                for (let choice of choices) {
+                    let [name, platform, slogan] = choice;
+
+                    question_element.find(".add_choice").click();
+                    await sleep();
+
+                    let text_field = question_element.find(".choices .choice:last-child .info");
+                    let text = $(`<a href="${platform}">${name} | ${slogan}</a>`)
+                    text_field.html(text);
+                }
+            }
+        };
+        file_reader.readAsText(file);
+    });
+
     $("#poll-form").submit(function() {
         var out = [];
         $("#questions .question").each(function() {

intranet/templates/polls/add_modify.html

@@ -13,6 +13,7 @@
     <script src="{% static 'vendor/datetimepicker-2.4.5/jquery.datetimepicker.js' %}"></script>
     <script src="{% static 'vendor/selectize.js-0.12.4/dist/js/standalone/selectize.min.js' %}"></script>
     <script src="{% static 'js/vendor/underscore-min.js' %}"></script>
+    <script src="{% static 'js/vendor/jquery.csv.min.js' %}"></script>
     <script src="{% static 'js/polls.js' %}"></script>
     <script>
         var poll_questions = $.parseJSON("{{ poll_questions|escapejs }}");
@@ -112,6 +113,17 @@ <h2 style="padding-left:0">
             <button id="add_question"><i class="fas fa-plus"></i> Add Question</button>
         </td>
     </tr>
+    <tr id="csv_wrapper">
+        <td>From CSV:</td>
+        <td>
+            <button id="import_from_csv">
+                <i class="fas fa-plus"></i>
+                Load from CSV
+            </button>
+            <a id="csv_error"></a>
+        </td>
+        <input id="csv_input" type="file"/>
+    </tr>
     <tr><td>&nbsp;</td><td>
         <input type="submit" style="width:200px">
         {% if poll.id %}