-
Notifications
You must be signed in to change notification settings - Fork 12
/
index.html
146 lines (127 loc) · 6.48 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Instant-runoff voting</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="page-header">
<h1>Instant-runoff voting tool</h1>
<p class="lead">Calculate the result of an Instant-runoff vote from your browser.</p>
<nav class="language">
<ul>
<li>
<a href="de/">Deutsch</a>
</li>
<li>
<a href="./">English</a>
</li>
</ul>
</nav>
</div>
<h2>About</h2>
<p>
This webapp calculates the result of an
<a href="https://en.wikipedia.org/wiki/Instant-runoff_voting">instant-runoff vote</a>.
It's programmed with javascript powered by <a href="http://jquery.com/">jQuery</a>
and structured and styled with HTML and CSS on the basis of
<a href="http://getbootstrap.com/">bootstrap</a>. The Sourcecode is licensed under the
<a href="http://opensource.org/licenses/MIT">MIT License</a> and available on
<a href="https://github.com/PeterTheOne/IRV">GitHub</a>, contributions are welcome.
The code is <a href="./test/">unit-tested</a> with <a href="http://qunitjs.com/">QUnit</a>,
but that doesn't guarantee it being bug free. It was written by
<a href="http://petergrassberger.com">Peter Grassberger</a> aka.
<a href="https://twitter.com/PeterTheOne">PeterTheOne</a>, with victory threshold option added by <a href="http://wtadler.com">Will Adler</a>.
</p>
<hr />
<h2>Input</h2>
<form role="form">
<div class="form-group col-md-6">
<h3>Candidates List</h3>
<p>
Please enter the names of the candidates, one candidate per
line. This list of candidates works like a template for the
ballots. The order of candidates has significance, so be
careful not to change the order of the candidates after
entering the ballots.
</p>
<div class="col-md-4">
<p>Example</p>
<pre>Barack Obama<br />François Hollande<br />Angela Merkel<br /></pre>
</div>
<div class="col-md-8">
<label for="candidates">Candidates</label>
<textarea id="candidates" class="form-control" rows="5"></textarea>
</div>
</div>
<div class="form-group col-md-6">
<h3>Ballots</h3>
<p>
Please enter one ballot per line. A ballot consists of
ranking numbers <code>1 2 3 4 ...</code> in a row separated
by a comma <code>,</code>. A ballot has the same amount
of ranking numbers as there are candidates. The numbers are
in the same order as the candidates in the candidates list,
the first number is the rank of the first candidate of the
candidate list on this ballot, the second number is the rank
of the second candidate and so on.
Spaces are ignored. Incomplete ballots can be created by
using <code>0</code> as a placeholder or leaving the
position empty like this <code>1, 0, 2, , 3</code>.
</p>
<div class="col-md-4">
<p>Example</p>
<pre>3, 2, 1<br />3, 2, 1<br />1, 2, 3<br />3, 1, 2<br />2, 3, 1<br />1, 2, 3</pre>
</div>
<div class="col-md-8">
<label for="ballots">Ballots</label>
<textarea id="ballots" class="form-control" rows="10"></textarea>
</div>
</div>
<div class="form-group">
<h3>Options</h3>
<div class="checkbox">
<label>
<input id="incompleteBallots" type="checkbox">
Accept incomplete or partial ballots.
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="tiebreaker" id="tiebreakerRandom" value="random" checked>
Tiebreaker: Randomly choose a candidate to break the tie.
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="tiebreaker" id="tiebreakerSecondary" value="secondary">
Tiebreaker: Before choosing randomly try to use second, third, etc. votes to break the tie.
</label>
</div>
<label id="thresholdcontainer">
Victory threshold:
<div class="input-group" id="thresholdbox">
<input type="text" class="form-control decimal" id="threshold" name="threshold" value="50" placeholder="50">
<span class="input-group-addon">%</span>
</div>
</label>
<button id="submit" type="submit" class="btn btn-primary">Submit</button>
</div>
<hr />
</form>
<div id="result-group">
<h2>Result</h2>
<pre id="result">Please submit your request.</pre>
<hr />
</div>
</div>
<script src="js/lib/jquery-1.10.2.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="js/irv.js"></script>
<script src="js/script.js"></script>
</body>
</html>