-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
50 lines (50 loc) · 2.5 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
<!DOCTYPE html>
<html lang="en" xml:lang="en">
<head>
<meta charset="UTF-8"/>
<title>Parliament Distribution Chart</title>
<script src="https://tools-static.wmflabs.org/cdnjs/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<link rel="stylesheet" href="stylesheet.css">
</head>
<body>
<div id="title">Parliament Diagram Generator</div>
<div class="container" id="outerSettingsContainer">
<div class="container" id="settingsContainer">
<div class="inputHeader">Position:</div>
<div class="autocomplete">
<input type="text" id="parliament" class="input" required>
</div>
<div class="inputHeader">Term:</div>
<div class="autocomplete">
<input type="text" id="term" class="input" required>
</div>
<div class="inputHeader" id="dateHeader">Date:</div>
<input type="date" id="date" class="input" required>
<div class="inputHeader" id="languageHeader">Language:</div>
<input type="text" id="language" class="input" required>
<button class="button" onClick="update()">Generate!</button>
</div>
<div class="container" id="descriptionContainer">This tool queries wikidata for details of memberships of parliaments. <br/>
Items for the members of parliament need to contain position held (<a href="https://www.wikidata.org/wiki/Property:P39">P39</a>) statements with all of the following qualifiers in order for the tool to work:
<ul>
<li>start time (<a href="https://www.wikidata.org/wiki/Property:P580">P580</a>)</li>
<li>end dates (<a href="https://www.wikidata.org/wiki/Property:P582">P582</a>) (where appropriate)</li>
<li>parliamentary term (<a href="https://www.wikidata.org/wiki/Property:P2937">P2937</a>)</li>
<li>parliamentary group (<a href="https://www.wikidata.org/wiki/Property:P4100">P4100</a>)</li>
</ul>
In addition, for colours to appear on the chart, the item for the parliamentary group must have an sRGB color hex triplet (<a href="https://www.wikidata.org/wiki/Property:P465">P465</a>) statement. Items without this statement will appear in black.
</div>
</div>
<div class="container">
<div class="container" id="svgOuterContainer">
<div class="container" id="svgContainer"></div>
<div class="container" id="legend"></div>
</div>
<div class="container" id="codeContainer">
<div id="svgCodeHeader">Copy and paste the following code into your text editor and save the file as a .svg file.</div>
<div id="svgCode"></div>
</div>
</div>
<script type="text/javascript" src="script.js"></script>
</body>
</html>