aboutsummaryrefslogtreecommitdiffstats
path: root/templates/template.html.j2
blob: 72cf5205945687164d13c8ebfbcaf094ac26e2a0 (plain)
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
<!DOCTYPE HTML>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>UK Gender Pay Gap :: {{ title }}</title>
	<!-- JQuery and JQurty UI current version -->
    <script src='https://code.jquery.com/jquery-3.6.0.js'></script>
	<script src="https://code.jquery.com/ui/1.13.1/jquery-ui.js"></script>

	<!-- Highcharts libraries -->
	<script type="text/javascript" src="https://code.highcharts.com/highcharts.js"></script>
	<script type="text/javascript" src="https://code.highcharts.com/highcharts-more.js"></script>
	<script type="text/javascript" src="https://code.highcharts.com/modules/exporting.js"></script>
	<script type="text/javascript" src="https://code.highcharts.com/modules/export-data.js"></script>
	<script type="text/javascript" src="https://code.highcharts.com/modules/accessibility.js"></script>	
	
	<script type="text/javascript" src="https://code.highcharts.com/maps/modules/map.js"></script>
	<script type="text/javascript" src="https://code.highcharts.com/mapdata/custom/world-robinson.js"></script>

	<!-- local Javascript files -->
	<script type="text/javascript" src="{{ url_for('static', filename='scripts.js') }}"></script>
	<!-- remote and local CSS stylesheet -->
	<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
</head>

<body>
    <header>
        <a href="/"><h1>{{ title }}</h1></a>
        <p>Data provided by the <a href="https://gender-pay-gap.service.gov.uk/">UK Government</a></p>
    </header>

    <aside>
        <form id="searchform" action="/search_click" method="POST">
            <input type="search" id="search_entry" name="search" required>
            <input type="submit" value="Search" id="search_btn">
        </form>
        {% if filters is defined %}
            <h4>Filters</h4>
            <form id="filterform">
                {% for filter_name, filter_content in filters.items() %}
                    <h5>{{ filter_name }}</h5>
                    {% if len(filter_content["options"]) > 5 %}
                        <button class="collapsetoggle" id="collapsetoggle/{{ filter_name }}" onclick="collapseTogglePress('collapsable/{{ filter_name }}')">
                            {{ "Un-hide %d hidden filters" % len(filter_content["options"]) }}
                        </button>
                        <div class="collapsable" id="collapsable/{{ filter_name }}">
                    {% endif %}
                    {% for option in filter_content["options"] %}
                        {% if filter_name in current_filters.keys() %}
                            {% if current_filters[filter_name] == option %}
                                <input type="radio" id="{{ option }}" name="{{ filter_name }}" value = "{{ option }}" checked="checked">
                            {% else %}
                                <input type="radio" id="{{ option }}" name="{{ filter_name }}" value = "{{ option }}">
                            {% endif %}
                        {% else %}
                            <input type="radio" id="{{ option }}" name="{{ filter_name }}" value = "{{ option }}">
                        {% endif %}
                        <label for="{{ option }}">{{ option }}</label><br>
                    {% endfor %}
                    {% if len(filter_content["default"]) < 2 %}
                        <input type="radio" id="No filter" name="{{ filter_name }}" value = "No filter">
                        <label for="No filter">No filter</label><br>
                    {% endif %}
                    {% if len(filter_content["options"]) > 5 %}
                        </div>
                    {% endif %}
                {% endfor %}
            </form>
        {% endif %}
    </aside>

    <div id="main_content">
        {% block content %}
        {% endblock %}
    </div>

    <footer>
        <p>Source code released under GPLv3</p>
    </footer>
</body>