Skip to Content

Changes for page Nice Display

Last modified by Benjamin Fischer on 2025/03/26 13:19
From version 42.1
edited by Benjamin Fischer
on 2025/03/24 15:41
Change comment: There is no comment for this version
To version 45.29
edited by Benjamin Fischer
on 2025/03/26 13:16
Change comment: There is no comment for this version

Summary

Details

Page properties
Title
... ... @@ -1,1 +1,1 @@
1 -Industry meets ErUM-Data
1 +Nice Display
Parent
... ... @@ -1,1 +1,1 @@
1 -Main.WebHome
1 +Research Groups.WebHome
Content
... ... @@ -1,21 +10,19 @@
1 -{{box cssClass="floatinginfobox" title="**The list thrives on being filled.**"}}
2 -To be added (or removed) you can:
3 -
4 -* contact [[judith.steinfeld@erumdatahub.de>>mailto:judith.steinfeld@erumdatahub.de]]
5 -* add or update an entry yourself [[How-To (end of page)>>||anchor="howto"]]
6 -{{/box}}
7 -
8 -This is a collection of various groups in industry that are adjacent or in cooperation with ErUM-Data science.
9 -
10 10  {{locationSearch width="100%;clear:both;" className="Research Groups.Code.Research GroupsClass" description="Search, including in excerpts."/}}
11 11  
12 12  {{velocity}}
4 +#if ( $ntrg_tagCols == $null )
5 +#set( $ntrg_tagCols = [["Tags", true]] )
6 +#end
7 +#set ($shouldMinify = !$hasProgramming )
8 +#set ($discard = $xwiki.jsx.use('Research Groups.Nice Display.WebHome', {"minify": $shouldMinify}))
9 +
13 13  #set ($columnsProperties = {
14 14   'affiliation': {"filterable":true, "sortable":true, "html":true},
15 15   'URL': {"type": "hidden"},
16 16   "content": {"type": "hidden"},
17 - "coop": {},
18 - "tags": {"sortable": false, "filterable": false, "html": true, "headerClass": "tagsCol"},
14 + "coopDetails": {"type": "hidden"},
15 + "coop": {"html": true},
16 + "tags": {"sortable": false, "filterable": false, "html": true, "headerClass": "tagsCol", "aux": $ntrg_tagCols},
19 19   "doc.date": {"filterable": false, "displayName": "Last Updated"},
20 20   '_actions': {"actions":["view","edit"]}
21 21  })
... ... @@ -22,7 +22,7 @@
22 22  #set ($options = {
23 23   'className': 'Research Groups.Code.Research GroupsClass',
24 24   'translationPrefix': 'research groups.livetable.',
25 - 'extraParams': '&location=Industry%20meets%20ErUM-Data',
23 + 'extraParams': "&location=${escapetool.url($doc.getSpace())}",
26 26   'tagCloud': true,
27 27   'rowCount': 25,
28 28   'maxPages': 10,
... ... @@ -29,8 +29,11 @@
29 29   'selectedColumn': 'doc.date',
30 30   'defaultOrder': 'desc'
31 31  })
32 -#set ($columns = ['affiliation', 'URL', "content", "tags", "coop", "doc.date", '_actions'])
33 -#livetable('research_groups' $columns $columnsProperties $options)
30 +#set ($columns = ['affiliation', 'URL', "content", "coop", "coopDetails", "doc.date", '_actions'])
31 +#foreach ($ntrg_tagCol in $ntrg_tagCols)
32 +#set ($discard = $columns.add(3, "tags"))
33 +#end
34 +#livetable("research_groups" $columns $columnsProperties $options)
34 34  {{/velocity}}
35 35  
36 36  (% id="howto" %)
... ... @@ -41,14 +41,16 @@
41 41  === Add entry ===
42 42  
43 43  1. click {{html}}<button class="btn"><i class="fa fa-plus"/>Create</button>{{/html}} (top right)
44 -1. fill in the Title in the top left (must be unique), then click {{html}}<button class="btn btn-primary">Create</button>{{/html}} (bottom left)
45 -1. fill out the form, then click {{html}}<button class="btn btn-primary">Save & View</button>{{/html}} (bottom left)
46 -1. click on the [+] behind "Tags" too add tags.
45 +1. fill in the Title in the top left (must be unique)
46 +1. click {{html}}<button class="btn btn-primary">Create</button>{{/html}} (bottom left)
47 +1. fill out the form
48 +1. click {{html}}<button class="btn btn-primary">Save & View</button>{{/html}} (bottom left)
49 +1. add tags (bottom left): click on the [+] behind: "Tags:"
47 47  
48 48  === Modfiy entry ===
49 49  
50 50  1. click on {{icon name="pencil"/}} Edit
51 -1. update the form, then click {{html}}<button class="btn btn-primary">Save & View</button>{{/html}} (bottom left)
52 -1. update the Tags at the bottom, if necessary
54 +1. update the form
55 +1. click {{html}}<button class="btn btn-primary">Save & View</button>{{/html}} (bottom left)
56 +1. update the Tags (bottom left)
53 53  
54 -=== Demo Video - Coming Soon ===
people_in_erum_final.mp4
Author
... ... @@ -1,1 +1,0 @@
1 -XWiki.fischer
Size
... ... @@ -1,1 +1,0 @@
1 -1.8 MB
Content
XWiki.JavaScriptExtension[0]
Code
... ... @@ -1,87 +1,125 @@
1 -const tabName = "research_groups";
2 -const tagCols = [
3 - ["Tags", true],
4 -]
1 +(()=>{
2 + const tabName = "research_groups";
3 + const coopDetailsLabel = "Cooperation Details";
4 + const colTT = {
5 + "Community": [
6 + "KAT - Astroparticle Physics",
7 + "KET - Elementary Particles Physics",
8 + "KfB - Accelerator Physics",
9 + "KFN - Research with neutrons",
10 + "KFN - Research with synchrotron radiation",
11 + "KFSI - Research with nuclear probes and ion beams",
12 + "KHuK - Hadron and nuclear physics",
13 + "RDS - German Observatory Council"
14 + ].join("\n"),
15 + "Cooperation": "...",
16 + };
17 + let tagCols;
5 5  
6 -document.observe('xwiki:livetable:loading', () => {
7 - const mats = document.getElementById(tabName);
19 + document.observe('xwiki:livetable:loading', () => {
20 + const mats = document.getElementById(tabName);
21 + if (!mats) return;
8 8  
9 - // coulmn data sources
10 - const conf = JSON.parse(mats.dataset.settings);
11 - tagCols.forEach(([name], i) => {
12 - const cn = `tags-${i}`;
13 - conf.columns.splice(conf.columns.indexOf("tags"), 1, cn);
14 - conf.columnDescriptors[cn] = {
15 - displayName: name,
16 - headerClass: "tagsCol",
17 - html: true,
18 - sortable: false,
19 - };
20 - });
21 - mats.dataset.settings = JSON.stringify(conf);
23 + // coulmn data sources
24 + const conf = JSON.parse(mats.dataset.settings);
25 + tagCols = (conf.columnDescriptors.tags ?? {aux: []}).aux ?? [["Tags", true]];
26 + tagCols.forEach(([name], i) => {
27 + const cn = `tags-${i}`;
28 + conf.columns.splice(conf.columns.indexOf("tags"), 1, cn);
29 + conf.columnDescriptors[cn] = {
30 + displayName: name,
31 + headerClass: "tagsCol",
32 + html: true,
33 + sortable: false,
34 + };
35 + });
36 + mats.dataset.settings = JSON.stringify(conf);
22 22  
23 - // column headers
24 - mats.querySelectorAll(".xwiki-livetable-display-header .tagsCol").forEach(
25 - (v, i) => v.textContent = tagCols[i][0]
26 - );
38 + // column headers
39 + mats.querySelectorAll(".xwiki-livetable-display-header .tagsCol").forEach(
40 + (v, i) => v.textContent = tagCols[i][0]
41 + );
27 27  
28 - // handle clicks for tags
29 - document.getElementById(`${tabName}-display`).addEventListener("click", ev => {
30 - if (ev.button) return; // only left click
31 - if (ev.target.nodeName !== "SPAN") return;
32 - if (!ev.target.classList.contains("ltTag")) return;
33 - const tag = ev.target.textContent;
34 - ev.preventDefault();
35 - const lt = mats.__liveTable;
36 - const st = lt.tagCloud.selectedTags;
37 - if (tag in st) delete st[tag];
38 - else st[tag] = {};
39 - lt.tags = Object.keys(st);
40 - lt.clearCache();
41 - lt.showRows(1, lt.limit);
42 - })
43 -});
43 + // column tooltips
44 + mats.querySelectorAll(".xwiki-livetable-display-header-text").forEach(
45 + el => {
46 + const c = colTT[el.textContent]
47 + if (c) {
48 + el.title = el.textContent;
49 + el.dataset.content = c;
50 + el.dataset.toggle = "popover";
51 + el.dataset.placement = "top";
52 + }
53 + }
54 + )
44 44  
45 -document.observe(`xwiki:livetable:${tabName}:receivedEntries`, ({memo: {data}}) => {
46 - for (const row of data.rows) {
47 - const a = new Element("a", { href: row.URL });
48 - a.innerHTML = row.affiliation_value.split("\n").map((a, i) => i ? a : `<b class="wikiexternallink">${a}</b>`).join("<br/>");
49 - a.title = row.doc_title;
50 - if (row.content !== "-") {
51 - a.dataset.content = row.content;
52 - a.dataset.toggle = "popover";
53 - }
56 + // handle clicks for tags
57 + document.getElementById(`${tabName}-display`).addEventListener("click", ev => {
58 + if (ev.button) return; // only left click
59 + if (ev.target.nodeName !== "SPAN") return;
60 + if (!ev.target.classList.contains("ltTag")) return;
61 + const tag = ev.target.textContent;
62 + ev.preventDefault();
63 + const lt = mats.__liveTable;
64 + const st = lt.tagCloud.selectedTags;
65 + if (tag in st) delete st[tag];
66 + else st[tag] = {};
67 + lt.tags = Object.keys(st);
68 + lt.clearCache();
69 + lt.showRows(1, lt.limit);
70 + })
71 + });
54 54  
55 - row.affiliation = a.outerHTML;
73 + document.observe(`xwiki:livetable:${tabName}:receivedEntries`, ({memo: {data}}) => {
74 + for (const row of data.rows) {
75 + const a = new Element("a", { href: row.URL });
76 + a.innerHTML = row.affiliation_value.split("\n").map((a, i) => i ? a : `<b class="wikiexternallink">${a}</b>`).join("<br/>");
77 + a.title = row.doc_title;
78 + if (row.content !== "-") {
79 + let c = row.content;
80 + if (row.coopDetails !== "-")
81 + c = `${c}<br/><b>${coopDetailsLabel}:</b> ${row.coopDetails}`;
82 + a.dataset.content = c;
83 + a.dataset.toggle = "popover";
84 + }
85 + row.affiliation = a.outerHTML;
56 56  
57 - row.doc_date = row.doc_date.split(" ")[0].split("/").slice(0, 2).join("/");
87 + row.coop = row.coop.replace(/\b \.\.\. \b/g, " ...<br/>");
88 + if (row.coopDetails !== "-") {
89 + const d = new Element("div");
90 + d.innerHTML = row.coop;
91 + d.title = coopDetailsLabel;
92 + d.dataset.content = row.coopDetails;
93 + d.dataset.toggle = "popover";
94 + row.coop = d.outerHTML;
95 + }
58 58  
59 - // tags
60 - const tags = new Set(row.tags_value.slice(1, -1).split(", "));
61 - tagCols.forEach(([name, ...want], i) =>
62 - row[`tags-${i}`] = (
63 - want[0] === true
64 - ? Array.from(tags)
65 - : want.filter(tag => tags.delete(tag))
66 - ).sort().map(tag => `<span class="ltTag" style="cursor:pointer;">${tag}</span>`).join(", ")
67 - );
68 - }
69 -});
97 + row.doc_date = row.doc_date.split(" ")[0].split("/").slice(0, 2).join("/");
70 70  
71 -require(['jquery', 'bootstrap'], function($) {
72 - document.styleSheets[0].insertRule(`#mainContentArea .popover {max-width: 50%;}`)
99 + // tags
100 + const tags = new Set(row.tags_value.slice(1, -1).split(", "));
101 + tagCols.forEach(([name, ...want], i) =>
102 + row[`tags-${i}`] = (
103 + want[0] === true
104 + ? Array.from(tags)
105 + : want.filter(tag => tags.delete(tag))
106 + ).sort().map(tag => `<span class="ltTag" style="cursor:pointer;">${tag}</span>`).join(", ")
107 + );
108 + }
109 + });
73 73  
74 - const ttApply = () => {
75 - $(`#${tabName} [data-toggle="popover"]`).popover({
76 - html: true,
77 - container: `#mainContentArea`,
78 - trigger: "hover",
79 - });
80 - };
111 + require(['jquery', 'bootstrap'], function($) {
112 + document.styleSheets[0].insertRule(`#mainContentArea .popover {max-width: 50%;}`);
81 81  
82 - document.observe(`xwiki:livetable:${tabName}:displayComplete`, ttApply);
83 - ttApply();
84 -});
114 + const ttApply = () => {
115 + $(`#${tabName} [data-toggle="popover"]`).popover({
116 + html: true,
117 + container: `#mainContentArea`,
118 + trigger: "hover",
119 + });
120 + };
85 85  
86 -
87 -
122 + document.observe(`xwiki:livetable:${tabName}:displayComplete`, ttApply);
123 + ttApply();
124 + });
125 +})();
Name
... ... @@ -1,1 +1,1 @@
1 -Live Table - Research Groups
1 +Nice Table - Research Groups
Use this extension
... ... @@ -1,1 +1,1 @@
1 -currentPage
1 +onDemand