reaktor2: extract agenda.html into separate file

This commit is contained in:
lassulus 2023-07-30 17:21:20 +02:00
parent 8534fe4290
commit 6043552115
2 changed files with 104 additions and 107 deletions

View File

@ -0,0 +1,91 @@
<!DOCTYPE html>
<html>
<head>
<title>Agenda</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<style>
html {
font-family: monospace;
}
dt {
float: left;
clear: left;
width: 30px;
text-align: right;
font-weight: bold;
}
dd {
margin: 0 0 0 40px;
padding: 0 0 0.5em 0;
}
.date {
color: grey;
font-style: italic;
}
</style>
</head>
<body>
<dl id="agenda"></dl>
<script>
const urlSearchParams = new URLSearchParams(window.location.search);
const params = Object.fromEntries(urlSearchParams.entries());
if (params.hasOwnProperty("style")) {
const cssUrls = params["style"].split(" ").filter((x) => x.length > 0);
for (const cssUrl of cssUrls)
fetch(cssUrl)
.then((response) =>
response.text().then((css) => {
const title = document.getElementsByTagName("head")[0];
const style = document.createElement("style");
style.appendChild(document.createTextNode(css));
title.appendChild(style);
})
)
.catch(console.log);
}
fetch("/agenda.json")
.then((response) => {
response.json().then((agenda) => {
const dl = document.getElementById("agenda");
for (const agendaItem of agenda) {
if (agendaItem.status !== "pending") continue;
// task warrior date format to ISO
const entryDate = agendaItem.entry.replace(
/(\d{4})(\d{2})(\d{2})T(\d{2})(\d{2})(\d{2})Z/,
"$1-$2-$3T$4:$5:$6Z"
);
const dt = document.createElement("dt");
dt.className = "id";
dt.appendChild(document.createTextNode(agendaItem.id.toString()));
dl.appendChild(dt);
const spanDate = document.createElement("span");
spanDate.className = "date";
spanDate.title = new Date(entryDate).toString();
spanDate.appendChild(document.createTextNode(entryDate));
const link = document.createElement("a");
link.href = "http://wiki.r/agenda/" + encodeURIComponent(agendaItem.description.replaceAll("/", "\u29F8")); // we use big solidus instead of slash because gollum will create directories
link.appendChild(document.createTextNode(agendaItem.description));
const dd = document.createElement("dd");
dd.className = "description";
dd.appendChild(link);
dd.appendChild(document.createTextNode(" "));
dd.appendChild(spanDate);
dl.appendChild(dd);
}
});
})
.then((data) => console.log(data));
</script>
</body>
</html>

View File

@ -483,113 +483,19 @@ in {
''}'';
};
services.nginx = {
virtualHosts."agenda.r" = {
serverAliases = [ "kri.r" ];
locations."= /index.html".extraConfig = ''
alias ${pkgs.writeText "agenda.html" ''
<!DOCTYPE html>
<html>
<head>
<title>Agenda</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<style>
html {
font-family: monospace;
}
dt {
float: left;
clear: left;
width: 30px;
text-align: right;
font-weight: bold;
}
dd {
margin: 0 0 0 40px;
padding: 0 0 0.5em 0;
}
.date {
color: grey;
font-style: italic;
}
</style>
</head>
<body>
<dl id="agenda"></dl>
<script>
const urlSearchParams = new URLSearchParams(window.location.search);
const params = Object.fromEntries(urlSearchParams.entries());
if (params.hasOwnProperty("style")) {
const cssUrls = params["style"].split(" ").filter((x) => x.length > 0);
for (const cssUrl of cssUrls)
fetch(cssUrl)
.then((response) =>
response.text().then((css) => {
const title = document.getElementsByTagName("head")[0];
const style = document.createElement("style");
style.appendChild(document.createTextNode(css));
title.appendChild(style);
})
)
.catch(console.log);
}
fetch("/agenda.json")
.then((response) => {
response.json().then((agenda) => {
const dl = document.getElementById("agenda");
for (const agendaItem of agenda) {
if (agendaItem.status !== "pending") continue;
// task warrior date format to ISO
const entryDate = agendaItem.entry.replace(
/(\d{4})(\d{2})(\d{2})T(\d{2})(\d{2})(\d{2})Z/,
"$1-$2-$3T$4:$5:$6Z"
);
const dt = document.createElement("dt");
dt.className = "id";
dt.appendChild(document.createTextNode(agendaItem.id.toString()));
dl.appendChild(dt);
const spanDate = document.createElement("span");
spanDate.className = "date";
spanDate.title = new Date(entryDate).toString();
spanDate.appendChild(document.createTextNode(entryDate));
const link = document.createElement("a");
link.href = "http://wiki.r/agenda/" + encodeURIComponent(agendaItem.description.replaceAll("/", "\u29F8")); // we use big solidus instead of slash because gollum will create directories
link.appendChild(document.createTextNode(agendaItem.description));
const dd = document.createElement("dd");
dd.className = "description";
dd.appendChild(link);
dd.appendChild(document.createTextNode(" "));
dd.appendChild(spanDate);
dl.appendChild(dd);
}
});
})
.then((data) => console.log(data));
</script>
</body>
</html>
''};
'';
locations."/agenda.json".extraConfig = ''
proxy_set_header Host $host;
proxy_pass http://localhost:8009;
'';
extraConfig = ''
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
'';
};
services.nginx.virtualHosts."agenda.r" = {
serverAliases = [ "kri.r" ];
locations."= /index.html".extraConfig = ''
alias ./agenda.html;
'';
locations."/agenda.json".extraConfig = ''
proxy_set_header Host $host;
proxy_pass http://localhost:8009;
'';
extraConfig = ''
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
'';
};
systemd.services.reaktor2-r.serviceConfig.DynamicUser = mkForce false;