Skip to Content

Changes for page Home

Last modified by Benjamin Fischer on 2025/06/04 14:20
From version 72.25
edited by Benjamin Fischer
on 2024/11/06 13:15
Change comment: There is no comment for this version
To version 72.44
edited by Benjamin Fischer
on 2024/11/06 16:58
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -20,9 +20,8 @@
20 20  
21 21  {{velocity output="false"}}
22 22  $xwiki.ssx.use("Calendar.FullCalendar")
23 -$xwiki.ssx.use("MoccaCalendar.Code.Macro")
24 24  $xwiki.jsx.use("Calendar.FullCalendar", {'defer': false})
25 -$xwiki.jsx.use("MoccaCalendar.Code.Macro", {'defer': false})
24 +$xwiki.jsx.use("Main.WebHome", {'defer': false, 'minify': false})
26 26  {{/velocity}}
27 27  
28 28  (% id="calendarCustom" %)
XWiki.JavaScriptExtension[0]
Code
... ... @@ -1,11 +1,90 @@
1 1  require(["jquery", "fullcalendar"], function (jq) {
2 2   const FC = jq.fullCalendar;
3 + const E = (tag, ...childs) => {
4 + const attrs = childs[0]?.constructor === Object ? childs.shift() : {};
5 + const ret = Element(tag, attrs);
6 + ret.append(...childs.flat());
7 + return ret;
8 + };
3 3   FC.defineView('monthCols', {
4 4   class: FC.View.extend({
5 - renderSekeleton() {
6 - this.el.addClass("fc-month-cols-view").html("");
11 + render() {
12 + const chf = this.opt("columnFormat") ?? "MMM";
13 + const start = this.start ?? FC.moment({year: FC.moment().year()});
14 + const months = Array(12).fill().map((_, month) => start.clone().add({month}));
15 +
16 + this.el.addClass("fc-month-cols-view").html(
17 + E(
18 + "table",
19 + E("thead", {class: "fc-head"},
20 + E("tr", E("th"), months.map(m => E("th", m.format(chf))))),
21 + E("tbody", {class: "fc-body"},
22 + Array(31).fill().map((_, day) => E("tr",
23 + E("th", {class: "fc-axis"}, `${day + 1}`),
24 + months.map(m => m.clone().add({day})).map(d =>
25 + d.date() === day + 1
26 + ? E("td", {class: this.getDayClasses(d).join(" ")}, [d.format("dd")])
27 + : E("td")
28 + )))
29 + ),
30 + )
31 + );
32 + },
33 + renderEvents(ev) {
34 + const todo = ev.slice().sort((a,b) => a.start.diff(b.start) || a.end.diff(b.end));
35 + const cols = [];
36 +
37 + for(
38 + let s = this.start.clone(), e = s.clone().add({day: 1}), col = [], occ = [], bgc, bgt, bgn = 0, sim;
39 + s.isBefore(this.end);
40 + s.add({day: 1}), e.add({day: 1}), bgn--, occ = occ.map(o => o--).filter(o => o > 0)
41 + ) {
42 + // calculate maximum number of simultaneous events
43 + if (s.date() == 1) {
44 + const e2 = s.clone().add({month: 1});
45 + sim = Math.max(0, ...todo
46 + .filter(t => s.isBefore(t.end) && t.start.isBefore(e2))
47 + .map((t, i, arr) => arr.slice(i).filter(o => o.start.isBefore(t.end)).length)
48 + );
49 + }
50 + const cells = [E("td", s.format("dd"))];
51 + // new events
52 + while (todo && todo[0].start.isBefore(e)) {
53 + const t = todo.shift();
54 + const d = Math.ceil(t.end.diff(t.start, "days", true));
55 + if (t.rendering == "background") {
56 + bgc = t.color;
57 + bgt = t.title;
58 + bgn = d;
59 + } else {
60 + const e = E("td", t.title);
61 + if (t.color) e.style.borderColor = e.style.backgroundColor = t.color;
62 + if (t.textColor) e.style.color = t.textColor;
63 + if (d > 1) e.rowspan = d;
64 + occ.push(d);
65 + }
66 + }
67 + // fill the rest
68 + const m = sim - occ.length;
69 + if (m) cells.push(E("td", {colspan: m}));
70 + cells.push(E("td", s.weekday() ? "" : s.weekYear()));
71 + // apply background color
72 + if (bgn && bgc) {
73 + for (const c of cells) {
74 + e.style.backgroundColor ||= bgc;
75 + if (bgr) e.title ||= bgt;
76 + }
77 + }
78 + // flush month
79 + if (s.month() != e.month()) {
80 + while(col.length < 31) col.push();
81 + cols.push(col);
82 + col = [];
83 + }
84 + }
85 +
7 7   debugger;
8 - }
87 + },
9 9   }),
10 10   duration: { year: 1 },
11 11   });
Use this extension
... ... @@ -1,1 +1,1 @@
1 -currentPage
1 +onDemand