Changes for page Home
Last modified by Benjamin Fischer on 2025/06/04 14:20
From version 72.76
edited by Benjamin Fischer
on 2024/11/07 13:41
on 2024/11/07 13:41
Change comment:
There is no comment for this version
To version 73.15
edited by Benjamin Fischer
on 2024/11/08 10:40
on 2024/11/08 10:40
Change comment:
There is no comment for this version
Summary
-
Page properties (1 modified, 0 added, 0 removed)
-
Objects (2 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -1,6 +1,6 @@ 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>>https://wiki.erumdatahub.de/de/mailing-lists]] 4 4 {{displayIcon name="world"/}} [[Website>>https://erumdatahub.de/]] 5 5 {{/box}} 6 6
- XWiki.JavaScriptExtension[0]
-
- Code
-
... ... @@ -9,12 +9,6 @@ 9 9 const range = num => Array(num).fill().map((_, i) => i); 10 10 FC.defineView('monthCols', { 11 11 class: FC.View.extend({ 12 - render() { 13 - console.debug("render"); 14 - }, 15 - renderSkeleton() { 16 - console.debug("renderSkeleton"); 17 - }, 18 18 renderEvents(events) { 19 19 console.debug("renderEvents", events); 20 20 debugger; ... ... @@ -57,6 +57,13 @@ 57 57 head.push(E("th", {colspan}, ms.format(cf))); 58 58 59 59 const bgc = new Array(md); 54 + let scc = []; 55 + let scu = []; 56 + const scs = col => el => { 57 + const step = 100 / scc.length; 58 + el.style.left = `${col * step}%`; 59 + el.style.width = `${step}%`; 60 + }; 60 60 61 61 for (const day of range(31)) { 62 62 if (day < md) { ... ... @@ -72,15 +72,30 @@ 72 72 for (const i of range(d)) 73 73 bgc[day + i] = v.color; 74 74 } else { 75 - const e = E("div", v.title); 76 + const href = v.html.match(/<span class="wikiexternallink"><a href="([^"]+)">\1</)?.[1] ?? v.url; 77 + const e = E("div", E("a", {href}, v.title)); 76 76 e.style.height = `${100 * d}%`; 77 77 if (v.color) e.style.borderColor = e.style.backgroundColor = v.color; 78 78 if (v.textColor) e.style.color = v.textColor; 81 + if (v.start.isBefore(ms)) e.classList.add("fc-cut-start"); 82 + if (me.isBefore(v.end)) e.classList.add("fc-cut-end"); 79 79 oc.push(e); 80 - // TODO: soft-columns 84 + const i = scu.indexOf(0); 85 + if (i < 0) { 86 + scc.push([e]); 87 + scu.push(d); 88 + scc.forEach((els, col) => els.forEach(scs(col))); 89 + } else { 90 + scc[i].push(e); 91 + scu[i] = d; 92 + scs(i)(e); 93 + } 81 81 } 82 82 } 83 83 97 + scu = scu.map(u => Math.max(0, u - 1)); 98 + if (!scu.some()) {scc = []; scu = [];} 99 + 84 84 const style = bgc[day] && `background-color: ${bgc[day]};`; 85 85 const dc = this.getDayClasses(ds); 86 86 const da = sub => ({class: dc.concat(sub).join(" "), style}); ... ... @@ -133,7 +133,7 @@ 133 133 right: "month,monthCols", 134 134 }, 135 135 timeFormat: "H:mm", 136 - defaultView: "month", 152 + defaultView: "monthCols", 137 137 firstDay: "1", 138 138 minTime: "8:00", 139 139 maxTime: "23:00",
- XWiki.StyleSheetExtension[0]
-
- Code
-
... ... @@ -1,6 +1,7 @@ 1 +@weekend-color: #f5f5f5; 1 1 #calendarCustom.fc { 2 2 td.fc-sat, td.fc-sun { 3 - background-color: #f5f5f5;4 + background-color: @weekend-color; 4 4 } 5 5 .fc-month-cols-view > table { 6 6 table-layout: auto; ... ... @@ -10,23 +10,60 @@ 10 10 col.fc-fitCol { 11 11 width: 1px; 12 12 } 13 - col.fc-borderLeft { 14 - border-left-width: 1px; 15 - } 16 - .fc-body { 14 + tbody.fc-body { 17 17 td { 16 + background-color: #fff; 17 + &.fc-sat, &.fc-sun { 18 + background-color: @weekend-color; 19 + &.fc-dayVal { 20 + background-color: @weekend-color !important; 21 + } 22 + } 23 + } 24 + tr:nth-child(4n+3) > * { 25 + border-top: 1px solid #ddd; 26 + } 27 + tr:nth-child(4n+5) > * { 28 + border-top: 1px solid #bbb; 29 + } 30 + tr:hover > th { 31 + background-color: #ccc; 32 + } 33 + td.fc-mainVal { 18 18 position: relative; 19 19 & > div { 36 + z-index: 5; 20 20 position: absolute; 21 21 width: 100%; 39 + overflow: hidden; 40 + border-radius: 4px; 41 + &.fc-cut-start { 42 + border-top-left-radius: 0px; 43 + border-top-right-radius: 0px; 44 + } 45 + &.fc-cut-end { 46 + border-bottom-left-radius: 0px; 47 + border-bottom-right-radius: 0px; 48 + } 49 + &:hover { 50 + width: auto !important; 51 + max-width: 10vw; 52 + height: auto !important; 53 + z-index: 10; 54 + } 55 + & > a { 56 + display: block; 57 + color: inherit; 58 + background-color: inherit; 59 + } 22 22 } 23 23 } 62 + td.fc-dayVal, td.fc-weekVal { 63 + color: desaturate(lighten(#1D3B58, 50%), 80%); 64 + } 24 24 td.fc-weekVal { 25 25 text-align: right; 26 26 } 27 - .fc-fade { 28 - opacity: 0.3; 29 - } 30 - } 31 - } 68 + } 69 + } 32 32 }