Changes for page Home

Summary

• Page properties (1 modified, 0 added, 0 removed)
• Objects (1 modified, 0 added, 0 removed)
  • XWiki.JavaScriptExtension[0]

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,14 +1,94 @@
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().filter(e => e));
	7	+ return ret;
	8	+ };
	9	+ const range = num => Array(num).fill().map((_, i) => i);
3	3	FC.defineView('monthCols', {
4	4	class: FC.View.extend({
5		- initialize() {
6		- console.log("foo bar");
	12	+ render() {
	13	+ console.debug("render");
7	7	},
8		- renderSekeleton() {
9		- this.el.addClass("fc-month-cols-view").html("");
10		- debugger;
	15	+ renderSkeleton() {
	16	+ console.debug("renderSkeleton");
11	11	},
	18	+ renderEvents(events) {
	19	+ console.debug("renderEvents", events);
	20	+ const cf = this.opt("columnFormat") ?? "MMM";
	21	+ const rf = this.opt("rowFormat") ?? "dd";
	22	+ const df = this.opt("cellFormat") ?? "ddd";
	23	+ const wf = this.opt("weekFormat") ?? "w";
	24	+ const colspan = (df || wf) ? (1 + !!df + !!wf) : null;
	25	+
	26	+ const ys = this.start;
	27	+ const ye = this.end;
	28	+ const yv = events.slice().sort((a,b) => a.start.diff(b.start) || a.end.diff(b.end));
	29	+
	30	+ const head = [];
	31	+ const days = Array(31).fill().map(_ => []);
	32	+
	33	+ if (rf) {
	34	+ head.push(E("th"));
	35	+ days.forEach((arr, day) => arr.push(E("th", {class: "fc-axis"}, ys.clone().add({day}).format(rf))));
	36	+ }
	37	+
	38	+ for (const month in Array(12).fill()) {
	39	+ const ms = ys.clone().add({month})
	40	+ const me = ms.clone().add({month: 1});
	41	+ const md = me.diff(ms, "days");
	42	+ const mv = yv.filter(t => ms.isBefore(t.end) || t.start.isBefore(me));
	43	+
	44	+ head.push(E("th", {colspan}, ms.format(cf)));
	45	+
	46	+ const bgc = new Array(md);
	47	+
	48	+ for (let day = 0; i < 31; i++) {
	49	+ if (i < md) {
	50	+ const ds = ms.clone().add({day});
	51	+ const de = ds.clone().add({day: 1});
	52	+
	53	+ const oc = [];
	54	+ while(mv[0]?.isBefore(de)) {
	55	+ const v = mv.shift();
	56	+ const d = Math.ceil(v.end.min(me).diff(ds, "days", true));
	57	+ if (t.rendering == "background")
	58	+ if (t.color)
	59	+ for (let i=0; i<d; i++)
	60	+ bgc[day + i] = t.color;
	61	+ else {
	62	+ const e = E("div", t.title);
	63	+ e.style.height = `${100 * d}%`;
	64	+ if (t.color) e.style.borderColor = e.style.backgroundColor = t.color;
	65	+ if (t.textColor) e.style.color = t.textColor;
	66	+ oc.push(e);
	67	+ // TODO: soft-columns
	68	+ }
	69	+ }
	70	+
	71	+ const da = {class: this.getDayClasses(d).join(" ")};
	72	+ if (df) days[i].push(E("td", da, ds.format(df)));
	73	+ if (bgc[day]) da.style = `background-color: ${bgc[day]};`;
	74	+ days[i].push(E("td", da, oc));
	75	+ if (wf) days[i].oush(E("td", ds.weekday() ? "" : ds.format(wf)));
	76	+ } else
	77	+ days[i].push(E("td", {colspan}));
	78	+ }
	79	+ }
	80	+
	81	+
	82	+ this.el.addClass("fc-month-cols-view").html(
	83	+ E(
	84	+ "table",
	85	+ E("thead", {class: "fc-head"}, E("tr", head)),
	86	+ E("tbody", {class: "fc-body"}, days.map(d => E("tr", d))),
	87	+ )
	88	+ );
	89	+
	90	+ //debugger;
	91	+ },
12	12	}),
13	13	duration: { year: 1 },
14	14	});

Use this extension

...	...	@@ -1,1 +1,1 @@
1		-currentPage
	1	+onDemand