Skip to content

Commit

Permalink
more UI debugging - at least one more RCV to go
Browse files Browse the repository at this point in the history
  • Loading branch information
windoverwater committed Mar 2, 2024
1 parent 9dcc01e commit 972f45e
Show file tree
Hide file tree
Showing 2 changed files with 37 additions and 35 deletions.
17 changes: 0 additions & 17 deletions blank-ballot.js
Original file line number Diff line number Diff line change
Expand Up @@ -37,9 +37,6 @@ const blankBallotJSON = `{
],
"contest_type": "ticket",
"max": 1,
"selection": [
"0: Circle Party Ticket"
],
"tally": "plurality",
"ticket_offices": [
"President",
Expand Down Expand Up @@ -76,11 +73,6 @@ const blankBallotJSON = `{
"party": "Hexagon Party"
}
],
"selection": [
"5: Francis Foxtrot",
"4: Emily Echo",
"3: David Delta"
],
"tally": "rcv",
"uid": "0001"
}
Expand All @@ -98,9 +90,6 @@ const blankBallotJSON = `{
}
],
"max": 1,
"selection": [
"1: Cosmo Spacely"
],
"tally": "plurality",
"uid": "0002"
}
Expand All @@ -115,9 +104,6 @@ const blankBallotJSON = `{
"James T. Kirk"
],
"max": 1,
"selection": [
"0: Jean-Luc Picard"
],
"tally": "plurality",
"uid": "0003"
}
Expand All @@ -132,9 +118,6 @@ const blankBallotJSON = `{
],
"description": "Should the Town of Concord start the annual Town Meeting at 6:30 PM instead of 7:00 PM?",
"max": 1,
"selection": [
"0: yes"
],
"tally": "plurality",
"uid": "0004"
}
Expand Down
55 changes: 37 additions & 18 deletions voting.html
Original file line number Diff line number Diff line change
Expand Up @@ -259,6 +259,7 @@ <h2>Your RCV selection:</h2>
}

// Make the RCV selection sortable by drag-and-drop
// Note - the class is on the li node
function initSortableList(target) {
target.classList.add("slist");
const items = target.getElementsByTagName("li");
Expand Down Expand Up @@ -323,7 +324,8 @@ <h2>Your RCV selection:</h2>
function setupRCVEventListeners(thisContestName, thisContestValue) {
// Event listener for selection in the first list (when a candidate is selected)
choiceList.addEventListener("click", (event) => {
if (event.target.tagName === "LI") {
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 newItem = document.createElement("li");
Expand All @@ -335,10 +337,9 @@ <h2>Your RCV selection:</h2>
newButton.classList.add("remove");
// add an event listener to the button
newButton.addEventListener("click", function (e) {
console.log("Running RCV eventListener:");
let itemName = e.target.parentNode.textContent.trim().replace(/\sremove$/, "");
let itemName = e.target.parentNode.textContent.trim().replace(/\s+remove$/, "");
e.target.parentNode.classList.remove("selected");
console.log("removing:", itemName);
console.log("Remove button eventListener: removing '" + itemName + "'");
// remove it from sortableList
e.target.parentNode.remove();
// add to choiceList
Expand All @@ -362,10 +363,12 @@ <h2>Your RCV selection:</h2>
textElement.innerText = selectedText;
textElement.innerHTML += extraSpace;

// Append everything ...
// Append everything to the li node
newItem.appendChild(svgIcon);
newItem.appendChild(textElement);
newItem.appendChild(newButton);

// Add the class to the li node
newItem.classList.add("selected");
// ... and append that to the bottom of sortableList
sortableList.appendChild(newItem);
Expand All @@ -387,27 +390,30 @@ <h2>Your RCV selection:</h2>
const listItem = event.target;
const itemText = listItem.textContent;
const itemIndex = Array.from(choiceList.children).indexOf(listItem);
if (listItem.tagName === "LI") {
if (listItem.classList.contains("selected")) {
// Deselect the item
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);
} else if (selectedCount < thisContestValue.max) {
// Note - one can (correctly) select the circle, or svg, or text,
// or the li
const theLi = listItem.closest("li");
if (theLi.classList.contains("unselected")) {
if (selectedCount < thisContestValue.max) {
// Select the item (up to maxSelection selections allowed)
listItem.classList.add("selected");
listItem.classList.remove("unselected");
theLi.classList.add("selected");
theLi.classList.remove("unselected");
// get the svg (first child) and set fill to on (black)
listItem.firstElementChild.style.fill = "black"
theLi.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")) {
// Deselect the item
theLi.classList.add("unselected");
theLi.classList.remove("selected");
theLi.firstElementChild.style.fill = selectBackgroundColor;
selectedCount--;
// get the svg (first child) and set fill to off
console.log("de-selected " + itemIndex + ", " + itemText);
}
});
}
Expand Down Expand Up @@ -464,6 +470,19 @@ <h2>Your RCV selection:</h2>
// Setup the checkout
function setupCheckout() {
console.log("setupCheckout: setting up checkout page");
// ZZZ
// The voter's selections are:
let index = 0;
for (const ggo of blankBallot.active_ggos) {
if (blankBallot.contests[ggo]) {
for (const contest of blankBallot.contests[ggo]) {
const contestName = Object.keys(contest)[0];
const selection = Object.values(contest)[0].selection;
index += 1;
console.log("contest " + index + ", selection = " + selection)
}
}
}
}

// Setup a new contest. Note - when navigating to a new contest,
Expand Down

0 comments on commit 972f45e

Please sign in to comment.