https://fluxcd.io/calendar.js

1(() => {
2  // <stdin>
3  var $ = window.$;
4  $(".calendar-list li").click(function() {
5    var card = $(this).children(".calendar-card");
6    $(".calendar-card").not(card).slideUp(500);
7    card.slideDown(500);
8  });
9  (() => {
10    const application = Stimulus.Application.start();
11    application.register("calendar", class extends Stimulus.Controller {
12      static targets = ["localtz"];
13      connect() {
14        let tz_description = Intl.DateTimeFormat().resolvedOptions().timeZone;
15        this.localtzTarget.innerHTML = `<b>localized for ${tz_description}</b>`;
16      }
17    });
18    application.register("calrow", class extends Stimulus.Controller {
19      static targets = ["timestamp", "time", "date"];
20      connect() {
21        if (this.hasTimestampTarget && this.hasDateTarget && this.hasTimeTarget) {
22          let ts = Date.parse(this.timestampTarget.innerHTML);
23          let dto = new Date(ts);
24          let locale = navigator.language;
25          let dt_string = dto.toLocaleDateString(locale, {
26            month: "numeric",
27            day: "numeric",
28            year: "numeric",
29            timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone
30          });
31          this.dateTarget.innerHTML = dt_string;
32          let tm_string = dto.toLocaleTimeString(locale, {
33            hour: "2-digit",
34            minute: "2-digit",
35            timeZoneName: "short"
36          });
37          this.timeTarget.innerHTML = tm_string;
38        }
39      }
40    });
41  })();
42})();