From 05de3ec5d7381284022910375cdd2b5caf2e18a7 Mon Sep 17 00:00:00 2001
From: Yingtong Li <runassudo@yingtongli.me>
Date: Mon, 8 Jan 2018 14:29:01 +0800
Subject: [PATCH] Fully implement drop-down selections

Closes #8
---
 .../preferential/selections_make.html         | 56 +++++++++++++++++--
 1 file changed, 50 insertions(+), 6 deletions(-)

diff --git a/eosweb/core/static/nunjucks/question/preferential/selections_make.html b/eosweb/core/static/nunjucks/question/preferential/selections_make.html
index 33c169f..f54da5d 100644
--- a/eosweb/core/static/nunjucks/question/preferential/selections_make.html
+++ b/eosweb/core/static/nunjucks/question/preferential/selections_make.html
@@ -107,9 +107,7 @@
 	
 	function choicesChanged() {
 		// Recalculate numbers
-		$(".preferential-choices .preferential-choice .number select").each(function(i, el) {
-			$(el).val("");
-		});
+		$(".preferential-choices .preferential-choice .number select").val("");
 		var selectedChoices = $("#question-choices-selected .dragarea > .preferential-choice > .number select");
 		selectedChoices.each(function(i, el) {
 			$(el).val(i + 1);
@@ -147,6 +145,10 @@
 		choicesChanged();
 	}
 	
+	// =============
+	// DRAG AND DROP
+	// =============
+	
 	var dragulaChoices = dragula(
 		[document.querySelector("#question-choices-selected .dragarea"), document.querySelector("#question-choices-remaining .dragarea")].concat([].slice.apply(document.querySelectorAll(".ticket-choices"))),
 		{
@@ -164,9 +166,10 @@
 	);
 	
 	function breakTicket(ticket) {
-		ticket.find(".ticket-choices .preferential-choice").each(function(i, el) {
-			$(el).detach().insertAfter(ticket);
-		});
+		//ticket.find(".ticket-choices .preferential-choice").each(function(i, el) {
+		//	$(el).detach().insertAfter(ticket);
+		//});
+		ticket.find(".ticket-choices .preferential-choice").detach().insertAfter(ticket);
 		ticket.remove();
 	}
 	
@@ -182,6 +185,47 @@
 		choicesChanged();
 	});
 	
+	// ===============
+	// DROP DOWN BOXES
+	// ===============
+	
+	$(".preferential-choices .preferential-choice .number select").change(function(evt) {
+		var index = parseInt($(this).val());
+		
+		var choiceEl = $(this).parents(".preferential-choice").first();
+		var ticket = null;
+		
+		// If the source is within a ticket, break the ticket afterwards
+		// (It is impossible for the target to be within a ticket)
+		if (choiceEl.parents(".ticket").length > 0) {
+			ticket = choiceEl.parents(".ticket").first();
+		}
+		
+		// Simulate drag-and-drop
+		var selectedChoices = $("#question-choices-selected .dragarea > .preferential-choice");
+		if ($(this).val() === "") {
+			// Deselect
+			choiceEl.detach().appendTo($("#question-choices-remaining .dragarea"));
+		} else if (index > selectedChoices.length) {
+			// Append to end
+			choiceEl.detach().appendTo($("#question-choices-selected .dragarea"));
+		} else {
+			// Insert in the middle
+			choiceEl.detach().insertBefore(selectedChoices[index - 1]);
+		}
+		
+		// Now break the ticket
+		if (ticket !== null) {
+			breakTicket(ticket);
+		}
+		
+		choicesChanged();
+	});
+	
+	// =======
+	// GENERAL
+	// =======
+	
 	function saveSelections() {
 		selections = [];
 		$("#question-choices-selected .preferential-choice:not(.ticket)").each(function(i, el) {