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
89
90
91
92
93
94
95
96
97
98
99
100
101
|
import { Temporal } from "temporal-polyfill";
import { t } from "./framework.js";
let _;
async function getShows() {
if (_) {
return _;
}
const response = await fetch("/shows");
_ = await response.json();
return _;
}
const ulShows = document.getElementById("ulShows");
const search = document.getElementById("search");
const renderShowsBtn = document.getElementById("renderShowsBtn");
const {timeZoneId: tzId} = Temporal.Now.zonedDateTimeISO();
renderShowsBtn.addEventListener("click", () => {
renderShows();
search.value = "";
});
function dateString(date, small = false) {
date = date + "+00:00";
if (small) {
return Temporal.Instant.from(date).toZonedDateTimeISO(tzId).toPlainDateTime().toLocaleString("nb-NO", {
weekday: "long",
calendar: "gregory",
hour: "2-digit",
minute: "2-digit",
month: "long",
day: "numeric"
});
}
return Temporal.Instant.from(date).toZonedDateTimeISO(tzId).toPlainDateTime().toLocaleString("nb-NO", {
weekday: "long",
calendar: "gregory",
hour: "2-digit",
minute: "2-digit",
era: "long",
year: "numeric",
month: "long",
day: "numeric"
});
}
search.addEventListener("input", e => renderShows(e.currentTarget.value));
async function renderShows(query) {
query = query?.trim();
const searchParams = new URLSearchParams(location.search);
if (!query && searchParams.has("q")) {
query = searchParams.get("q");
}
searchParams.set("q", query);
let lis = [];
const shows = (await getShows()).reduce((acc, curr) => {
const key = curr.title;
if (!acc[key]) {
acc[key] = [];
}
acc[key].push(curr);
return acc;
}, {});
async function share(show) {
const shareData = {
title: `${show.title} ${dateString(show.startDateTime, true)} på vega`,
text: "",
url: `#${show.title}-${show.startDateTime}`,
};
await navigator.share(shareData);
}
for (const showKey of Object.keys(shows).sort((a, b) => a.localeCompare(b))) {
const times = shows[showKey].sort((a, b) => Temporal.PlainDate.compare(Temporal.PlainDate.from(a.startDateTime), Temporal.PlainDate.from(b.startDateTime)));
if (query && !showKey.toLowerCase().match(query.toLowerCase())) {
continue;
}
if (times.every(e => e.ticketUrl === "")) {
continue;
}
lis.push(t("li", {class: "show", id: showKey}, [t("span", {class: "title italic"}, showKey), t("ul", undefined, [t("li", undefined,
times.filter(e => e.ticketUrl !== "").map(e => t("li", {class: `time time-${e.id}`, id: `${showKey}-${e.startDateTime}`}, [t("a", undefined, [
t("div", undefined, [
t("span", {title: e.startDateTime}, dateString(e.startDateTime)),
t("span", undefined, `${e.scene} - ${[e.type, ...e.tags].join(", ")}`),
t("div", {class: "actions"}, [
t("a", {href: e.ticketUrl}, "Billetter"),
t("button", {onclick: () => share(e)}, "Del tid")
])
])
])])))])]));
}
ulShows.replaceChildren(...lis);
}
renderShows();
|
