Changes for page Home
Last modified by Benjamin Fischer on 2025/06/04 14:20
From version 72.38
edited by Benjamin Fischer
on 2024/11/06 15:08
on 2024/11/06 15:08
Change comment:
There is no comment for this version
To version 72.49
edited by Benjamin Fischer
on 2024/11/07 12:00
on 2024/11/07 12:00
Change comment:
There is no comment for this version
Summary
-
Objects (1 modified, 0 added, 0 removed)
Details
- XWiki.JavaScriptExtension[0]
-
- Code
-
... ... @@ -3,34 +3,98 @@ 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 11 render() { 13 + console.debug("render"); 14 + }, 15 + renderSkeleton() { 16 + console.debug("renderSkeleton"); 17 + }, 18 + renderEvents(events) { 19 + console.debug("renderEvents", events); 20 + try { 21 + this._renderFun(events); 22 + } catch (e) { 23 + console.exception(e); 24 + } 12 12 debugger; 13 - const chf = this.opt("columnFormat") ?? "MMM"; 14 - const start = this.start ?? FC.moment({year: FC.moment().year()}); 15 - const months = Array(12).fill().map((_, month) => start.clone().add({month})); 26 + }, 27 + _renderFun(events) { 28 + const cf = this.opt("columnFormat") ?? "MMM"; 29 + const rf = this.opt("rowFormat") ?? "dd"; 30 + const df = this.opt("cellFormat") ?? "ddd"; 31 + const wf = this.opt("weekFormat") ?? "w"; 32 + const colspan = (df || wf) ? (1 + !!df + !!wf) : null; 16 16 34 + const ys = this.start; 35 + const ye = this.end; 36 + const yv = events.slice().sort((a,b) => a.start.diff(b.start) || a.end.diff(b.end)); 37 + 38 + const head = []; 39 + const days = Array(31).fill().map(_ => []); 40 + 41 + if (rf) { 42 + head.push(E("th")); 43 + days.forEach((arr, day) => arr.push(E("th", {class: "fc-axis"}, ys.clone().add({day}).format(rf)))); 44 + } 45 + 46 + for (const month in Array(12).fill()) { 47 + const ms = ys.clone().add({month}) 48 + const me = ms.clone().add({month: 1}); 49 + const md = me.diff(ms, "days"); 50 + const mv = yv.filter(t => ms.isBefore(t.end) || t.start.isBefore(me)); 51 + 52 + head.push(E("th", {colspan}, ms.format(cf))); 53 + 54 + const bgc = new Array(md); 55 + 56 + for (let day = 0; i < 31; i++) { 57 + if (i < md) { 58 + const ds = ms.clone().add({day}); 59 + const de = ds.clone().add({day: 1}); 60 + 61 + const oc = []; 62 + while(mv[0]?.isBefore(de)) { 63 + const v = mv.shift(); 64 + const d = Math.ceil(v.end.min(me).diff(ds, "days", true)); 65 + if (t.rendering == "background") 66 + if (t.color) 67 + for (let i=0; i<d; i++) 68 + bgc[day + i] = t.color; 69 + else { 70 + const e = E("div", t.title); 71 + e.style.height = `${100 * d}%`; 72 + if (t.color) e.style.borderColor = e.style.backgroundColor = t.color; 73 + if (t.textColor) e.style.color = t.textColor; 74 + oc.push(e); 75 + // TODO: soft-columns 76 + } 77 + } 78 + 79 + const da = {class: this.getDayClasses(d).join(" ")}; 80 + if (df) days[i].push(E("td", da, ds.format(df))); 81 + if (bgc[day]) da.style = `background-color: ${bgc[day]};`; 82 + days[i].push(E("td", da, oc)); 83 + if (wf) days[i].oush(E("td", ds.weekday() ? "" : ds.format(wf))); 84 + } else 85 + days[i].push(E("td", {colspan})); 86 + } 87 + } 88 + 89 + 17 17 this.el.addClass("fc-month-cols-view").html( 18 18 E( 19 19 "table", 20 - E("thead", {class: "fc-head"}, 21 - E("tr", months.map(m => E("td", m.format(chf))))), 22 - E("tbody", {class: "fc-body"}, 23 - Array(31).fill().map((_, day) => E("tr", 24 - months.map(m => m.clone().add({day})).map(d => 25 - d.day() === day + 1 26 - ? E("td", {class: this.getDayClasses(d).join(" ")}, [d.format("ddd")]) 27 - : E("td") 28 - ))) 29 - ), 93 + E("thead", {class: "fc-head"}, E("tr", head)), 94 + E("tbody", {class: "fc-body"}, days.map(d => E("tr", d))), 30 30 ) 31 31 ); 32 - 33 - }, 97 + } 34 34 }), 35 35 duration: { year: 1 }, 36 36 });