Files
rangevote/rangevote.html
2023-10-18 15:13:23 -04:00

59 lines
1.8 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Ballot Experiments</title>
</head>
<body>
<style>
form, table, th, td {
border:1px solid black;
border-collapse: collapse;
}
</style>
<form id="my-form" style="background-color:#E0E0E0" action="/range_vote" method="post" oninput=UpdateValues(event)>
This page is an experiment in voting. Half of the people who visit this site will use Plurality Voting, and half will use Range Voting. I do ask that anyone unlikely to vote in the Republican primary use the "Just show me the Results" option below.<br><br>
In Plurality Voting, voters select their top candidate, and the winner is the candidate with the most votes. Most elections in the United States use Plurality Voting.<br><br>
In Range Voting, voters score all candidates <i>that they know</i> based on how happy they would be should that candidate win. <br><br>
<b>You have been randomly selected to vote using Range Voting.</b>
<br>
<br>
<table>
<tr>
<th>Candidate</th>
<th style="width:50%"><span id="spanid"> </th>
<th>Happiness</th>
</tr>
<!-- INJECT -->
</table>
<br>
<button type="submit" value="submit">Submit</button><br>
Or, just show me the <a href="results">Results</a>
</form>
</body>
<script>
function CanId(c)
{
let w=c.split(" ");
let lastname=w[w.length-1].toLowerCase();
let id=lastname.split("-");
let rval=id[id.length-1];
return(rval);
}
function UpdateValues(event)
{
let id=event.srcElement.id;
console.log(id);
let slider=document.getElementById(id);
let output=document.getElementById('o-'+CanId(id));
if (slider.value==-1) output.innerHTML="No Opinion";
else output.innerHTML=slider.value+"%";
}
</script>