-
Notifications
You must be signed in to change notification settings - Fork 4
/
index.html
88 lines (81 loc) · 4.05 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
---
permalink:
layout: default
---
<body id="clusterize">
<div id="scrollArea" class="clusterize-scroll">
<main>
<header>
<h1>{{ site.title }} | APK Systembolaget</h1>
<p id="subtitle">{{ site.description }}. Vilket här mäts i milliliter etanol per krona. <a href="/about">Mer info</a>. <a href="https://github.com/alkolist/alkolist.github.io">Källkod</a>. Senast uppdaterad: {{ site.time | date: "%Y-%m-%d %H:%M" }}. Tips filtrera efter typ "nyhet" för att se de senaste produkterna.</p>
<input class="left" type="search" id="name-search" placeholder="Filtrera namn" autocomplete="off" />
<input class="right" type="search" id="type-search" placeholder="Filtrera typ" autocomplete="off" />
<input class="left" type="button" id="hide-ordervara" onclick="hideOrdervara(this)" value="Dölj Ordervara">
<input class="right" type="button" id="hide-outofstock" onclick="hideOutOfStock(this)" value="Dölj Slut i lager">
<input class="left" type="button" id="show-filter" onclick="showFilter(this)" value="▼ Fler filter">
<div id="volume-slider" class="slider" style="display:none"></div>
<div class="left slider-min-max" id="minvol" style="display:none">
<label for="min-volume">min</label>
<input type="text" id="min-volume" value="0">
<span>ml</span>
</div>
<div class="right slider-min-max" id="maxvol" style="display:none">
<label for="max-volume">max</label>
<input type="text" id="max-volume" value="30000">
<span>ml</span>
</div>
<div id="price-slider" class="slider" style="display:none"></div>
<div class="left slider-min-max" id="minpri" style="display:none">
<label for="min-price">min</label>
<input type="text" id="min-price">
<span>kr</span>
</div>
<div class="right slider-min-max" id="maxpri" style="display:none">
<label for="max-price">max</label>
<input type="text" id="max-price">
<span>kr</span>
</div>
<div id="alko-slider" class="slider" style="display:none"></div>
<div class="left slider-min-max" id="minalko" style="display:none">
<label for="min-alko">min</label>
<input type="text" id="min-alko">
<span>%</span>
</div>
<div class="right slider-min-max" id="maxalko" style="display:none">
<label for="max-alko">max</label>
<input type="text" id="max-alko">
<span>%</span>
</div>
<input type="button" value="Clear" class="right" onclick="clearSearchBox()">
</header>
<table>
<thead>
<tr>
<th>Nr</th>
<th>APK</th>
<th>Namn</th>
<th>Typ</th>
<th>Alkohol</th>
<th>Volym</th>
<th>Pris</th>
</tr>
</thead>
<tbody id="contentArea" class="clusterize-content">
{% for row in site.data.apk limit:31 %}<tr><td>{{forloop.index}}</td><td>{{-row['apk'] | replace: '.', ','-}}</td><td><a href='https://www.systembolaget.se/{{-row['productNumber']-}}/' target='_blank' rel='noreferrer'><b>{{-row['productNameBold'] | replace: '"', '\"'-}}</b>{{-' ' | append: row['productNameThin'] | replace: '"', '\"'-}}</a></td><td>{{-row['tags'] | join: ', '-}}</td><td>{{-row['alcoholPercentage'] | replace: '.', ',' | append: ' %'-}}</td><td>{{-row['volume'] | append: ' ml'-}}</td><td>{{-row['price'] | replace: '.', ',' | append: ' kr'-}}</td></tr>
{% endfor %}
<tr class="clusterize-no-data">
<td colspan="7" >Laddar mer data…</td>
</tr>
</tbody>
</table>
<footer>
<p>Data från
<a href="https://github.com/C4illin/systembolaget-data">github.com/C4illin/systembolaget-data</a>
och källkoden till hemsidan:
<a href="https://github.com/alkolist/alkolist.github.io">github.com/alkolist/alkolist.github.io</a>.
</p>
</footer>
</main>
</div>
<script defer src="script.js"></script>
</body>