update app
This commit is contained in:
@@ -44,8 +44,8 @@ type Value struct {
|
|||||||
var (
|
var (
|
||||||
sources = map[string]string{
|
sources = map[string]string{
|
||||||
"Algemeen": "algemeen",
|
"Algemeen": "algemeen",
|
||||||
"Groningen": "groningen",
|
|
||||||
"Amsterdam": "AT5",
|
"Amsterdam": "AT5",
|
||||||
|
"Groningen": "groningen",
|
||||||
"Literatuur": "literatuur",
|
"Literatuur": "literatuur",
|
||||||
"Vlaanderen": "VRT",
|
"Vlaanderen": "VRT",
|
||||||
}
|
}
|
||||||
|
|||||||
1
www/DATA-2026-16-1.json
Normal file
1
www/DATA-2026-16-1.json
Normal file
File diff suppressed because one or more lines are too long
1
www/DATA-2026-16-4.json
Normal file
1
www/DATA-2026-16-4.json
Normal file
File diff suppressed because one or more lines are too long
36
www/app.html
36
www/app.html
@@ -13,7 +13,7 @@
|
|||||||
<body>
|
<body>
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<h1>Woord van de maand</h1>
|
<h1>Woord van de maand</h1>
|
||||||
terugkijkend over vier weken
|
<p>terugkijkend over vier weken</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="form">
|
<div class="form">
|
||||||
<form name="choice">
|
<form name="choice">
|
||||||
@@ -30,18 +30,18 @@
|
|||||||
id="rsAlgemeen"
|
id="rsAlgemeen"
|
||||||
value="Algemeen" />
|
value="Algemeen" />
|
||||||
<label for="rsAlgemeen">Algemeen</label><br />
|
<label for="rsAlgemeen">Algemeen</label><br />
|
||||||
<input
|
|
||||||
type="radio"
|
|
||||||
name="rSource"
|
|
||||||
id="rsGroningen"
|
|
||||||
value="Groningen" />
|
|
||||||
<label for="rsGroningen">Groningen</label><br />
|
|
||||||
<input
|
<input
|
||||||
type="radio"
|
type="radio"
|
||||||
name="rSource"
|
name="rSource"
|
||||||
id="rsAmsterdam"
|
id="rsAmsterdam"
|
||||||
value="Amsterdam" />
|
value="Amsterdam" />
|
||||||
<label for="rsAmsterdam">Amsterdam</label><br />
|
<label for="rsAmsterdam">Amsterdam</label><br />
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name="rSource"
|
||||||
|
id="rsGroningen"
|
||||||
|
value="Groningen" />
|
||||||
|
<label for="rsGroningen">Groningen</label><br />
|
||||||
<input
|
<input
|
||||||
type="radio"
|
type="radio"
|
||||||
name="rSource"
|
name="rSource"
|
||||||
@@ -55,7 +55,9 @@
|
|||||||
value="Vlaanderen" />
|
value="Vlaanderen" />
|
||||||
<label for="rsVlaanderen">Vlaanderen</label><br />
|
<label for="rsVlaanderen">Vlaanderen</label><br />
|
||||||
<input type="radio" name="rSource" id="rsAlles" value="alles" />
|
<input type="radio" name="rSource" id="rsAlles" value="alles" />
|
||||||
<label for="rsAlles">alles</label><br />
|
<label for="rsAlles"
|
||||||
|
> </label
|
||||||
|
>
|
||||||
</td>
|
</td>
|
||||||
|
|
||||||
<td>
|
<td>
|
||||||
@@ -76,14 +78,22 @@
|
|||||||
<input type="radio" name="rPart" id="rpA" value="andere namen" />
|
<input type="radio" name="rPart" id="rpA" value="andere namen" />
|
||||||
<label for="rpA">andere namen</label><br />
|
<label for="rpA">andere namen</label><br />
|
||||||
<input type="radio" name="rPart" id="rpAll" value="alles" />
|
<input type="radio" name="rPart" id="rpAll" value="alles" />
|
||||||
<label for="rpAll">alles</label><br />
|
<label for="rpAll"
|
||||||
|
> </label
|
||||||
|
>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td colspan="2" style="text-align: center">
|
||||||
|
<p>to do: selecteer een periode</p>
|
||||||
|
<p>
|
||||||
|
<button type="button" onclick="kies()">
|
||||||
|
— kies —
|
||||||
|
</button>
|
||||||
|
</p>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
<p>to do: selecteer een periode</p>
|
|
||||||
<p>
|
|
||||||
<button type="button" onclick="kies()">kies</button>
|
|
||||||
</p>
|
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div class="title">
|
<div class="title">
|
||||||
|
|||||||
39
www/app.js
39
www/app.js
@@ -1,4 +1,4 @@
|
|||||||
var dates = ['2026-15', '2026-14', '2026-13', '2026-12', '2026-11', '2026-10']
|
var dates
|
||||||
|
|
||||||
var parts = [
|
var parts = [
|
||||||
'nieuwe namen',
|
'nieuwe namen',
|
||||||
@@ -9,10 +9,14 @@ var parts = [
|
|||||||
'andere namen',
|
'andere namen',
|
||||||
]
|
]
|
||||||
|
|
||||||
var sources = ['Algemeen', 'Groningen', 'Amsterdam', 'Literatuur', 'Vlaanderen']
|
var sources = ['Algemeen', 'Amsterdam', 'Groningen', 'Literatuur', 'Vlaanderen']
|
||||||
|
|
||||||
var data = new Map()
|
var data = new Map()
|
||||||
|
|
||||||
|
function sleep(ms) {
|
||||||
|
return new Promise((resolve) => setTimeout(resolve, ms))
|
||||||
|
}
|
||||||
|
|
||||||
function getJSON(url) {
|
function getJSON(url) {
|
||||||
return new Promise(function (resolve, reject) {
|
return new Promise(function (resolve, reject) {
|
||||||
var xhr = new XMLHttpRequest()
|
var xhr = new XMLHttpRequest()
|
||||||
@@ -30,15 +34,6 @@ function getJSON(url) {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
async function getData(week) {
|
|
||||||
/*
|
|
||||||
if (data.has(week)) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
data[week] = await getJSON('DATA-' + week + '-4.json')
|
|
||||||
}
|
|
||||||
|
|
||||||
function escape(s) {
|
function escape(s) {
|
||||||
return s
|
return s
|
||||||
.replace('&', '&')
|
.replace('&', '&')
|
||||||
@@ -54,7 +49,6 @@ function makeTD(title, values) {
|
|||||||
h3.appendChild(txt)
|
h3.appendChild(txt)
|
||||||
td.appendChild(h3)
|
td.appendChild(h3)
|
||||||
const tab = document.createElement('table')
|
const tab = document.createElement('table')
|
||||||
console.log(values)
|
|
||||||
|
|
||||||
var max
|
var max
|
||||||
for (var i = 0; i < 20; i++) {
|
for (var i = 0; i < 20; i++) {
|
||||||
@@ -165,20 +159,31 @@ async function loadWeken(source, part) {
|
|||||||
document.getElementById('data').innerHTML = d.innerHTML
|
document.getElementById('data').innerHTML = d.innerHTML
|
||||||
}
|
}
|
||||||
|
|
||||||
function kies() {
|
async function kies() {
|
||||||
let source = document.forms['choice']['rSource'].value
|
let source = document.forms['choice']['rSource'].value
|
||||||
let part = document.forms['choice']['rPart'].value
|
let part = document.forms['choice']['rPart'].value
|
||||||
console.log(source)
|
|
||||||
console.log(part)
|
|
||||||
if ((source == 'alles' || source == '') && (part == 'alles' || part == '')) {
|
if ((source == 'alles' || source == '') && (part == 'alles' || part == '')) {
|
||||||
alert('Kies een bron en/of een onderdeel')
|
alert('Kies een bron en/of een onderdeel')
|
||||||
} else if (source == 'alles' || source == '') {
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const dd = document.getElementById('data')
|
||||||
|
dd.classList.add('fade')
|
||||||
|
await sleep(20)
|
||||||
|
|
||||||
|
if (source == 'alles' || source == '') {
|
||||||
loadPart(part, dates[0])
|
loadPart(part, dates[0])
|
||||||
} else if (part == 'alles' || part == '') {
|
} else if (part == 'alles' || part == '') {
|
||||||
loadSource(source, dates[0])
|
loadSource(source, dates[0])
|
||||||
} else {
|
} else {
|
||||||
loadWeken(source, part)
|
loadWeken(source, part)
|
||||||
}
|
}
|
||||||
|
dd.classList.remove('fade')
|
||||||
}
|
}
|
||||||
|
|
||||||
loadSource('Algemeen', dates[0])
|
async function init() {
|
||||||
|
dates = await getJSON('index4.json')
|
||||||
|
loadSource('Algemeen', dates[0])
|
||||||
|
}
|
||||||
|
|
||||||
|
init()
|
||||||
|
|||||||
1
www/index1.json
Normal file
1
www/index1.json
Normal file
@@ -0,0 +1 @@
|
|||||||
|
["2026-16", "2026-15", "2026-14", "2026-13", "2026-12", "2026-11", "2026-10"]
|
||||||
1
www/index4.json
Normal file
1
www/index4.json
Normal file
@@ -0,0 +1 @@
|
|||||||
|
["2026-16", "2026-15", "2026-14", "2026-13", "2026-12", "2026-11", "2026-10"]
|
||||||
@@ -14,14 +14,14 @@ html {
|
|||||||
body {
|
body {
|
||||||
border: 0px;
|
border: 0px;
|
||||||
margin: 0px;
|
margin: 0px;
|
||||||
padding: 0px 0px 1em 0px;
|
padding: 0px 0px 2em 0px;
|
||||||
color: black;
|
color: black;
|
||||||
background-color: #fcfffc;
|
background-color: #fcfffc;
|
||||||
}
|
}
|
||||||
|
|
||||||
.main {
|
.main {
|
||||||
margin: 2em 0px 0px 0px;
|
margin: 1em 0px 0px 0px;
|
||||||
padding: 0.4em 0.2em;
|
padding: 0px 0.2em;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
}
|
}
|
||||||
@@ -34,7 +34,6 @@ body {
|
|||||||
|
|
||||||
.title {
|
.title {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding-bottom: 4em;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
@@ -118,16 +117,35 @@ table table td > div {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.form {
|
.form {
|
||||||
margin: 0px auto;
|
margin: 2em auto 0px auto;
|
||||||
width: 100%;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
line-height: 150%;
|
||||||
}
|
}
|
||||||
|
|
||||||
table.choice {
|
table.choice {
|
||||||
|
padding-top: 1em;
|
||||||
margin: 0px auto;
|
margin: 0px auto;
|
||||||
|
border: 1px solid #62757f;
|
||||||
}
|
}
|
||||||
|
|
||||||
table.choice td {
|
table.choice td {
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
padding: 0.4em 1.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
label {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
label:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
#data {
|
||||||
|
background-color: inherit;
|
||||||
|
transition: all 200ms linear;
|
||||||
|
}
|
||||||
|
#data.fade {
|
||||||
|
background-color: #ffa54f;
|
||||||
|
transition: all 20ms linear;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user