diff --git a/voting.html b/voting.html index ea79425..cebeedc 100644 --- a/voting.html +++ b/voting.html @@ -327,7 +327,7 @@

Your RCV selection:

if (event.target.closest("li") && event.target.closest("li").classList.contains("unselected")) { console.log("Running RCV eventListener:"); // Create a new selected item with a remove button - const selectedText = event.target.textContent; + const selectedText = event.target.closest("li").textContent; const newItem = document.createElement("li"); newItem.classList.add("flex-item"); // Apply a class for styling @@ -339,7 +339,7 @@

Your RCV selection:

newButton.addEventListener("click", function (e) { let itemName = e.target.parentNode.textContent.trim().replace(/\s+remove$/, ""); e.target.parentNode.classList.remove("selected"); - console.log("Remove button eventListener: removing '" + itemName + "'"); + console.log("Remove button eventListener: removing '" + itemName + "' (parentNode=" + e.target.parentNode.innerText + ")"); // remove it from sortableList e.target.parentNode.remove(); // add to choiceList @@ -373,8 +373,8 @@

Your RCV selection:

// ... and append that to the bottom of sortableList sortableList.appendChild(newItem); - // Remove the selected item from the first list - event.target.remove(); + // Remove the containing li for the selected item from the first list + event.target.closest("li").remove(); // Initialize the sortable list initSortableList(document.getElementById("sortableList")); @@ -387,30 +387,29 @@

Your RCV selection:

let selectedCount = 0; choiceList.addEventListener("click", (event) => { console.log("Running plurality eventListener:"); - const listItem = event.target; - const itemText = listItem.textContent; - const itemIndex = Array.from(choiceList.children).indexOf(listItem); // Note - one can (correctly) select the circle, or svg, or text, // or the li - const theLi = listItem.closest("li"); - if (theLi.classList.contains("unselected")) { + const listItem = event.target.closest("li"); + const itemText = listItem.textContent; + const itemIndex = Array.from(choiceList.children).indexOf(listItem); + if (listItem.classList.contains("unselected")) { if (selectedCount < thisContestValue.max) { // Select the item (up to maxSelection selections allowed) - theLi.classList.add("selected"); - theLi.classList.remove("unselected"); + listItem.classList.add("selected"); + listItem.classList.remove("unselected"); // get the svg (first child) and set fill to on (black) - theLi.firstElementChild.style.fill = "black" + listItem.firstElementChild.style.fill = "black" selectedCount++; console.log("selected " + itemIndex + ", " + itemText); } else { // Overvote console.log("rejected (overvote) - ignoring " + itemIndex + ", " + itemText); } - } else if (theLi.classList.contains("selected")) { + } else if (listItem.classList.contains("selected")) { // Deselect the item - theLi.classList.add("unselected"); - theLi.classList.remove("selected"); - theLi.firstElementChild.style.fill = selectBackgroundColor; + listItem.classList.add("unselected"); + listItem.classList.remove("selected"); + listItem.firstElementChild.style.fill = selectBackgroundColor; selectedCount--; // get the svg (first child) and set fill to off console.log("de-selected " + itemIndex + ", " + itemText);