Changes for page Helpers

Summary

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

Details

Page properties

Content

...	...	@@ -1,1 +1,0 @@
1		-Contains JSX helpers for customized LiveTable views.

XWiki.JavaScriptExtension[0]

Code

...	...	@@ -1,17 +1,15 @@
1		-((() => {
2		- const livetableRowHook = {};
3		- const tagCols = {};
	1	+define("xwiki-custom-livetable", [], function () {
	2	+ const func = (tabName, rowFunc, colTT = {}) => {
	3	+ let tagCols;
4	4
5		- document.observe('xwiki:livetable:loading', () => {
6		- for (const tab of document.querySelectorAll(".xwiki-livetable")) {
7		- const tableId = tab.id;
8		- if (!tableId) continue;
	5	+ document.observe('xwiki:livetable:loading', () => {
	6	+ const tab = document.getElementById(tabName);
	7	+ if (!tab) return;
9	9
10	10	// coulmn data sources
11	11	const conf = JSON.parse(tab.dataset.settings);
12		-
13		- tagCols[tableId] = (conf.columnDescriptors.tags ?? { aux: [] }).aux ?? [["Tags", true]];
14		- tagCols[tableId].forEach(([name], i) => {
	11	+ tagCols = (conf.columnDescriptors.tags ?? { aux: [] }).aux ?? [["Tags", true]];
	12	+ tagCols.forEach(([name], i) => {
15	15	const cn = `tags-${i}`;
16	16	conf.columns.splice(conf.columns.indexOf("tags"), 1, cn);
17	17	conf.columnDescriptors[cn] = {
...	...	@@ -25,19 +25,14 @@
25	25
26	26	// column headers
27	27	tab.querySelectorAll(".xwiki-livetable-display-header .tagsCol").forEach(
28		- (v, i) => v.textContent = tagCols[tableId][i][0]
	26	+ (v, i) => v.textContent = tagCols[i][0]
29	29	);
30	30
31		- // filter fields
32		- tab.querySelectorAll(".xwiki-livetable-display-header-filter input[type=text]").forEach(
33		- v => v.placeholder = "Filter ..."
34		- );
35		-
36	36	// column tooltips
37	37	tab.querySelectorAll(".xwiki-livetable-display-header-text").forEach(
38	38	el => {
39	39	const t = el.textContent.trim();
40		- const c = conf.columnDescriptors[t]?.tooltip;
	33	+ const c = conf.columnDescriptors[t].tooltip ?? colTT[t];
41	41	if (c) {
42	42	el.title = t;
43	43	el.dataset.content = c;
...	...	@@ -48,7 +48,7 @@
48	48	)
49	49
50	50	// handle clicks for tags
51		- tab.getElementsByClassName("xwiki-livetable-display-body")[0].addEventListener("click", ev => {
	44	+ document.getElementById(`${tabName}-display`).addEventListener("click", ev => {
52	52	if (ev.button) return; // only left click
53	53	if (ev.target.nodeName !== "SPAN") return;
54	54	if (!ev.target.classList.contains("ltTag")) return;
...	...	@@ -61,121 +61,26 @@
61	61	lt.tags = Object.keys(st);
62	62	lt.clearCache();
63	63	lt.showRows(1, lt.limit);
64		- });
	57	+ })
	58	+ });
65	65
66		- }
67		- });
	60	+ document.observe(`xwiki:livetable:${tabName}:receivedEntries`, ({ memo: { data } }) => {
	61	+ for (const row of data.rows) {
	62	+ if (rowFunc) rowFunc(row)
68	68
69		- document.observe("xwiki:livetable:receivedEntries", ({ memo: { data, tableId } }) => {
70		- const rf = livetableRowHook[tableId];
71		- for (const row of data.rows) {
72		- if (rf) rf(row);
73		-
74		- // tags
75		- const tags = new Set(row.tags_value.slice(1, -1).split(", "));
76		- tagCols[tableId]?.forEach(([name, ...want], i) =>
77		- row[`tags-${i}`] = (
78		- want[0] === true
79		- ? Array.from(tags)
80		- : want.filter(tag => tags.delete(tag))
81		- ).sort().map(tag => `<span class="ltTag" style="cursor:pointer;white-space:nowrap;">${tag}</span>`).join(", ")
82		- );
83		- }
84		- });
85		-
86		- livetableRowHook.jobs = row => {
87		- const a = new Element("a", { href: row.link });
88		- a.innerHTML = `<b class="wikiexternallink">${row.doc_title}</b>`;
89		- row.doc_title = a.outerHTML;
90		-
91		- row.doc_date = row.doc_date.split(" ")[0];
	64	+ // tags
	65	+ const tags = new Set(row.tags_value.slice(1, -1).split(", "));
	66	+ tagCols.forEach(([name, ...want], i) =>
	67	+ row[`tags-${i}`] = (
	68	+ want[0] === true
	69	+ ? Array.from(tags)
	70	+ : want.filter(tag => tags.delete(tag))
	71	+ ).sort().map(tag => `<span class="ltTag" style="cursor:pointer;">${tag}</span>`).join(", ")
	72	+ );
	73	+ }
	74	+ });
92	92	};
93	93
94		- livetableRowHook.materials = row => {
95		- const ol = new DOMParser().parseFromString(row.doc_location, "text/xml").documentElement;
96		- const li = ol.children;
97		-
98		- switch (li[0].textContent) {
99		- case "MoccaCalendar":
100		- li[1].remove(); // the sub calendar
101		- case "Material collection":
102		- li[0].remove(); // the "app"
103		- }
104		- for (let i = 1; i < li.length - 1; i++) // intermediate
105		- li[i].textContent = li[i].textContent; // remove link
106		-
107		- const a = li[li.length - 1].children[0];
108		- const b = a.ownerDocument.createElement("b");
109		- a.replaceWith(b);
110		- b.appendChild(a);
111		- a.textContent = row.doc_title;
112		-
113		- const u = new URL(row.link_value);
114		- let icon;
115		- if (u.hostname.includes("github")) icon = "github";
116		- if (u.hostname.includes("github.io")) icon = "book";
117		- if (u.hostname.includes("gitlab")) icon = "gitlab";
118		- if (u.hostname.includes("google")) icon = "google";
119		- if (u.hostname.includes("colab")) icon = "code";
120		- if (u.hostname.includes("youtube")) icon = "youtube-play";
121		- if (u.pathname.endsWith(".pdf")) icon = "file-pdf-o";
122		- if (u.pathname.endsWith(".pptx")) icon = "file-powerpoint-o";
123		- if (u.pathname.endsWith(".ipynb")) icon = "code";
124		- if (icon) {
125		- const s = a.ownerDocument.createElement("span");
126		- s.appendChild(a.ownerDocument.createElement("wbr"));
127		- s.setAttribute("class", `fa fa-${icon}`);
128		- s.setAttribute("style", "padding-right: .3em;");
129		- a.insertBefore(s, a.firstChild);
130		- }
131		- a.setAttribute("class", "wikiexternallink");
132		- a.setAttribute("href", u.href);
133		-
134		- row.doc_location = ol.outerHTML;
135		- };
136		-
137		- const coopDetailsLabel = "Cooperation Details";
138		- livetableRowHook.research_groups = row => {
139		- const a = new Element("a", { href: row.URL });
140		- a.innerHTML = row.affiliation_value.split("\n").map((a, i) => i ? a : `<b class="wikiexternallink">${a}</b>`).join("<br/>");
141		- a.title = row.doc_title;
142		- if (row.content !== "-") {
143		- let c = row.content;
144		- if (row.coopDetails !== "-")
145		- c = `${c}<br/><b>${coopDetailsLabel}:</b> ${row.coopDetails}`;
146		- a.dataset.content = c;
147		- a.dataset.toggle = "popover";
148		- }
149		- row.affiliation = a.outerHTML;
150		-
151		- row.coop = row.coop.replace(/\b \.\.\. \b/g, " ...<br/>");
152		- if (row.coopDetails !== "-") {
153		- const d = new Element("div");
154		- d.innerHTML = row.coop;
155		- d.title = coopDetailsLabel;
156		- d.dataset.content = row.coopDetails;
157		- d.dataset.toggle = "popover";
158		- row.coop = d.outerHTML;
159		- }
160		-
161		- row.doc_date = row.doc_date.split(" ")[0].split("/").slice(0, 2).join("/");
162		- };
163		-
164		- require(['jquery', 'bootstrap'], function($) {
165		- document.styleSheets[0].insertRule(`#mainContentArea .popover {max-width: 50%;}`);
166		-
167		- const ttApply = ({ memo: { tableId } }) => {
168		- if (tableId)
169		- $(`#${tableId} [data-toggle="popover"]`).popover({
170		- html: true,
171		- container: `#mainContentArea`,
172		- trigger: "hover",
173		- });
174		- };
175		-
176		- document.observe(`xwiki:livetable:displayComplete`, ttApply);
177		- for (const tab of document.querySelectorAll(".xwiki-livetable"))
178		- ttApply({ memo: { tableId: tab.id }});
179		- });
180		-})());
181		-
	77	+ func.func = func;
	78	+ return func;
	79	+});