Changes for page Home

Last modified by Benjamin Fischer on 2025/06/04 14:20

From version 72.44
edited by Benjamin Fischer
on 2024/11/06 16:58
Change comment: There is no comment for this version
To version 81.1
edited by Judith Steinfeld
on 2024/11/12 13:01
Change comment: There is no comment for this version

Summary

Details

Page properties
Author
... ... @@ -1,1 +1,1 @@
1 -XWiki.fischer
1 +XWiki.JudithSteinfeld
Content
... ... @@ -1,14 +1,21 @@
1 1  {{box cssClass="floatinginfobox" image="https://wiki.test.erumdatahub.de/bin/download/Main/WebHome/logo_horizontal_23_neu.png?width=200"}}
2 2  {{displayIcon name="application_view_tile"/}} [[Indico>>https://indico.desy.de/category/984/]]
3 -{{displayIcon name="email"/}} [[Mailing Lists]]
3 +{{displayIcon name="email"/}} [[Mailing Lists>>doc:DIG-UM.Mailing Lists.WebHome]]
4 4  {{displayIcon name="world"/}} [[Website>>https://erumdatahub.de/]]
5 +
6 +//{{icon name="info-circle"/}}//ErUM =** Er**forschung von** U**niversum & **M**aterie
7 +(Research on Universe and Matter)
5 5  {{/box}}
6 6  
7 -Welcome to the new ErUM-Data-Hub Wiki - a place for all ErUM-Data communities, to interact and share information with one another.
10 +==== **Welcome to the new ErUM-Data-Hub Wiki - a place for all ErUM-Data communities, to interact and share information with one another.** ====
8 8  
9 9  If you have any ideas for new features or content that you would want to find here, feel free to get in contact with us.
10 10  Otherwise, you can always create an account and contribute improvements or novel content yourself. For now, the registration is not open to the puplic.
11 11  
15 +{{icon name="question-circle"}}{{/icon}}Further information, answers to all questions you may have regarding the ErUM-Data-Hub and more about our aims and work can be found on our [[website>>https://erumdatahub.de/]].
16 +
17 += =
18 +
12 12  = What is new? =
13 13  
14 14  Have a look at our new comprehensive:
... ... @@ -16,6 +16,8 @@
16 16  * [[Material collection]] of learning and teaching materials, and
17 17  * [[People in ErUM-Data]] list of research groups and contact information of people who work in ErUM-Data.
18 18  
26 += =
27 +
19 19  = ErUM-Data Calendar =
20 20  
21 21  {{velocity output="false"}}
XWiki.JavaScriptExtension[0]
Code
... ... @@ -3,88 +3,123 @@
3 3   const E = (tag, ...childs) => {
4 4   const attrs = childs[0]?.constructor === Object ? childs.shift() : {};
5 5   const ret = Element(tag, attrs);
6 - ret.append(...childs.flat());
6 + ret.append(...childs.flat().filter(e => e));
7 7   return ret;
8 8   };
9 + const range = num => Array(num).fill().map((_, i) => i);
9 9   FC.defineView('monthCols', {
10 10   class: FC.View.extend({
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}));
12 + renderEvents(events) {
13 + console.debug("renderEvents", events);
14 + debugger;
15 + try {
16 + this._renderFun(events);
17 + } catch (e) {
18 + console.exception(e);
19 + }
20 + },
21 + _renderFun(events) {
22 + const cf = this.opt("columnFormat") ?? "MMM";
23 + const rf = this.opt("rowFormat") ?? "D";
24 + const df = this.opt("cellFormat") ?? "dd";
25 + const wf = this.opt("weekFormat") ?? "w";
26 + const colspan = (df || wf) ? (1 + !!df + !!wf) : null;
15 15  
28 + const ys = this.start;
29 + const ye = this.end;
30 + const yv = events.slice().sort((a,b) => a.start.diff(b.start) || a.end.diff(b.end));
31 +
32 + const cols = [];
33 + const head = [];
34 + const days = Array(31).fill().map(_ => []);
35 +
36 + if (rf) {
37 + cols.push(E("col", {class: "fc-fitCol"}));
38 + head.push(E("th"));
39 + days.forEach((arr, day) => arr.push(E("th", {class: "fc-axis"}, ys.clone().add({day}).format(rf))));
40 + }
41 +
42 + for (const month of range(12)) {
43 + const ms = ys.clone().add({month})
44 + const me = ms.clone().add({month: 1});
45 + const md = me.diff(ms, "days");
46 + const mv = yv.filter(t => ms.isBefore(t.end) && t.start.isBefore(me));
47 +
48 + if (df) cols.push(E("col", {class: "fc-fitCol"}));
49 + cols.push(E("col"));
50 + if (wf) cols.push(E("col", {class: "fc-fitCol"}));
51 + head.push(E("th", {colspan}, ms.format(cf)));
52 +
53 + const bgc = new Array(md);
54 + const bgt = new Array(md);
55 + let scc = [];
56 + let scu = [];
57 + const scs = col => el => {
58 + const step = 100 / scc.length;
59 + el.style.left = `${col * step}%`;
60 + el.style.width = `${step}%`;
61 + };
62 +
63 + for (const day of range(31)) {
64 + if (day < md) {
65 + const ds = ms.clone().add({day});
66 + const de = ds.clone().add({day: 1});
67 +
68 + const oc = [];
69 + while(mv[0]?.start.isBefore(de)) {
70 + const v = mv.shift();
71 + const d = Math.ceil(v.end.max(me).diff(ds, "days", true));
72 + if (v.rendering == "background") {
73 + if (v.color)
74 + for (const i of range(d)) {
75 + bgc[day + i] = v.color;
76 + bgt[day + i] = v.title;
77 + }
78 + } else {
79 + const e = E("div", E("a", {href: v.url}, v.title));
80 + e.style.height = `${100 * d}%`;
81 + if (v.color) e.style.borderColor = e.style.backgroundColor = v.color;
82 + if (v.textColor) e.style.color = v.textColor;
83 + if (v.start.isBefore(ms)) e.classList.add("fc-cut-start");
84 + if (me.isBefore(v.end)) e.classList.add("fc-cut-end");
85 + oc.push(e);
86 + const i = scu.indexOf(0);
87 + if (i < 0) {
88 + scc.push([e]);
89 + scu.push(d);
90 + scc.forEach((els, col) => els.forEach(scs(col)));
91 + } else {
92 + scc[i].push(e);
93 + scu[i] = d;
94 + scs(i)(e);
95 + }
96 + }
97 + }
98 +
99 + scu = scu.map(u => Math.max(0, u - 1));
100 + if (!scu.some()) {scc = []; scu = [];}
101 +
102 + const style = bgc[day] && `background-color: ${bgc[day]};`;
103 + const dc = this.getDayClasses(ds);
104 + const da = (sub, title = bgt[day] ?? null) => ({class: dc.concat(sub).join(" "), style, title});
105 + if (df) days[day].push(E("td", da("fc-dayVal", ds.format("D")), ds.format(df)));
106 + days[day].push(E("td", da("fc-mainVal"), oc));
107 + if (wf) days[day].push(E("td", da("fc-weekVal"), ds.weekday() ? "" : ds.format(wf)));
108 + } else
109 + days[day].push(E("td", {colspan}));
110 + }
111 + }
112 +
113 +
16 16   this.el.addClass("fc-month-cols-view").html(
17 17   E(
18 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 - ),
117 + E("colgroup", cols),
118 + E("thead", {class: "fc-head"}, E("tr", head)),
119 + E("tbody", {class: "fc-body"}, days.map(d => E("tr", d))),
30 30   )
31 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 -
86 - debugger;
87 - },
122 + }
88 88   }),
89 89   duration: { year: 1 },
90 90   });
... ... @@ -99,6 +99,7 @@
99 99   },
100 100   monthCols: {
101 101   columnFormat: "MMM",
137 + weekFormat: "W",
102 102   titleFormat: "YYYY",
103 103   buttonText: "year",
104 104   },
... ... @@ -115,14 +115,16 @@
115 115   right: "month,monthCols",
116 116   },
117 117   timeFormat: "H:mm",
118 - defaultView: "month",
154 + defaultView: "monthCols",
119 119   firstDay: "1",
120 120   minTime: "8:00",
121 121   maxTime: "23:00",
122 - defaultDate: "2024-11-06",
123 123   editable: false,
124 124   eventDataTransform: event => {
125 - if (event.url.split("/")[4] === "Holidays") event.rendering = "background";
160 + const cal = event.url.split("/")[4];
161 + if (cal === "Holidays" || cal == "Blocked" || cal.includes("Conference")) event.rendering = "background";
162 + event.viewUrl = event.url;
163 + event.url = event.html.match(/<span class="wikiexternallink"><a href="([^"]+)">\1</)?.[1] ?? event.url;
126 126   return event;
127 127   },
128 128   eventRender: function (event, element) {
XWiki.StyleSheetExtension[0]
Code
... ... @@ -1,5 +1,74 @@
1 -#calendarCustom {
1 +@weekend-color: #f5f5f5;
2 +#calendarCustom.fc {
2 2   td.fc-sat, td.fc-sun {
3 - background-color: #f5f5f5;
4 + background-color: @weekend-color;
4 4   }
6 + .fc-month-cols-view > table {
7 + table-layout: auto;
8 + td, th {
9 + border-width: 0px;
10 + }
11 + col.fc-fitCol {
12 + width: 1px;
13 + }
14 + tbody.fc-body {
15 + td {
16 + &.fc-sat, &.fc-sun {
17 + background-color: @weekend-color;
18 + &.fc-dayVal {
19 + background-color: @weekend-color !important;
20 + }
21 + }
22 + }
23 + tr:nth-child(4n+3) > * {
24 + border-top: 1px solid #ddd;
25 + }
26 + tr:nth-child(4n+5) > * {
27 + border-top: 1px solid #bbb;
28 + }
29 + tr:hover > th {
30 + background-color: #ccc;
31 + }
32 + td.fc-mainVal {
33 + position: relative;
34 + & > div {
35 + z-index: 5;
36 + position: absolute;
37 + width: 100%;
38 + overflow: hidden;
39 + border-radius: 4px;
40 + &.fc-cut-start {
41 + border-top-left-radius: 0px;
42 + border-top-right-radius: 0px;
43 + }
44 + &.fc-cut-end {
45 + border-bottom-left-radius: 0px;
46 + border-bottom-right-radius: 0px;
47 + }
48 + &:hover {
49 + width: auto !important;
50 + max-width: 10vw;
51 + height: auto !important;
52 + z-index: 10;
53 + }
54 + & > a {
55 + display: block;
56 + color: inherit;
57 + background-color: inherit;
58 + }
59 + }
60 + }
61 + td.fc-dayVal, td.fc-weekVal {
62 + color: #7f95aa;
63 + cursor: default;
64 + }
65 + td.fc-dayVal {
66 + font-size: small;
67 + }
68 + td.fc-weekVal {
69 + font-size: smaller;
70 + text-align: right;
71 + }
72 + }
73 + }
5 5  }