Changes for page Copyright, Rights & Licences
Last modified by Veronika Kocher on Friday, 18 Sep 2026 16:47
From version 5.10
edited by Veronika Kocher
on Thursday, 03 Sep 2026 10:09
on Thursday, 03 Sep 2026 10:09
Change comment:
There is no comment for this version
To version 5.11
edited by Veronika Kocher
on Thursday, 03 Sep 2026 13:04
on Thursday, 03 Sep 2026 13:04
Change comment:
There is no comment for this version
Summary
-
Page properties (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -44,7 +44,7 @@ 44 44 45 45 == Who is responsible? == 46 46 47 - {{html}}<!-- ARSN_TOPIC_ROUTING_V1 -->{{/html}}47 + 48 48 {{info title="Service routing"}} 49 49 **Primary specialist service(s):** Legal Department for binding legal questions and contracts; Publications and/or University Library for publication and licensing practice where relevant. 50 50 ... ... @@ -68,12 +68,13 @@ 68 68 <!-- ARSN_SEARCH_TERMS_END --> 69 69 {{/html}} 70 70 71 -\n\n 72 -\n\n{{html clean="false"}} 73 -<!-- SN_HORIZONTAL_BOX_HARMONIZER_START --> 71 +{{html clean="false"}} 72 +<!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_START --> 74 74 75 -<style data-sn-horizontal-box-harmonizer="7"> 76 -/* ---------- Typography: never justify headings ---------- */ 74 +<style data-sn-service-navigator-master="1"> 75 +/* ========================================================= 76 + MASTER TYPOGRAPHY 77 + ========================================================= */ 77 77 #xwikicontent h1, 78 78 #xwikicontent h2, 79 79 #xwikicontent h3, ... ... @@ -95,88 +95,73 @@ 95 95 word-spacing:normal!important; 96 96 } 97 97 98 -/* ---------- Native XWiki semantic callouts ---------- */ 99 -#xwikicontent .box.infomessage, 100 -#xwikicontent .infomessage, 101 -#xwikicontent .box.warningmessage, 102 -#xwikicontent .warningmessage, 103 -#xwikicontent .box.successmessage, 104 -#xwikicontent .successmessage, 105 -#xwikicontent .box.errormessage, 106 -#xwikicontent .errormessage, 107 -#xwikicontent [data-sn-callout-harmonized="1"]{ 99 +/* ========================================================= 100 + COMING SOON / IN VORBEREITUNG 101 + ========================================================= */ 102 +.sn-coming-soon-badge{ 103 + display:inline-block; 104 + vertical-align:middle; 105 + margin-left:10px; 106 + padding:4px 8px; 107 + border-radius:14px; 108 + border:1px solid #efd9cc; 109 + background:#fff4ee; 110 + color:#8a4d36; 111 + font-size:11px; 112 + font-weight:700; 113 + letter-spacing:.055em; 114 + line-height:1.2; 115 + white-space:nowrap; 116 +} 117 + 118 +/* ========================================================= 119 + NATIVE / DETAIL CALLOUT GEOMETRY 120 + Preserve existing backgrounds. 121 + ========================================================= */ 122 +#xwikicontent .arsn-info, 123 +#xwikicontent .dmp-info, 124 +#xwikicontent .ido-info, 125 +#xwikicontent .pp-info, 126 +#xwikicontent .infomessage{ 108 108 box-sizing:border-box!important; 109 - border-radius:8px!important; 110 - border-top:1px solid rgba(0,0,0,.08)!important; 111 - border-right:1px solid rgba(0,0,0,.08)!important; 112 - border-bottom:1px solid rgba(0,0,0,.08)!important; 113 - border-left:4px solid var(--sn-callout-accent,#21b6d7)!important; 114 - padding:14px 16px!important; 128 + border-left:4px solid #21b6d7!important; 129 + border-radius:8px; 115 115 text-align:left!important; 116 - text-justify:auto!important; 117 117 word-spacing:normal!important; 118 - box-shadow:none!important; 119 119 } 120 120 121 -#xwikicontent .box.infomessage, 122 -#xwikicontent .infomessage{ 123 - --sn-callout-accent:#21b6d7; 124 - background:#eaf7fb!important; 125 -} 126 - 127 -#xwikicontent .box.warningmessage, 128 -#xwikicontent .warningmessage{ 129 - --sn-callout-accent:#f0aa00; 130 - background:#fff8e7!important; 131 -} 132 - 133 -#xwikicontent .box.successmessage, 134 -#xwikicontent .successmessage{ 135 - --sn-callout-accent:#38b76a; 136 - background:#edf9f1!important; 137 -} 138 - 139 -#xwikicontent .box.errormessage, 134 +#xwikicontent .arsn-warn, 135 +#xwikicontent .dmp-warn, 136 +#xwikicontent .ido-warn, 137 +#xwikicontent .pp-warn, 138 +#xwikicontent .warn, 139 +#xwikicontent .warning, 140 +#xwikicontent .warningmessage, 140 140 #xwikicontent .errormessage{ 141 - --sn-callout-accent:#e94b13; 142 - background:#fff1ec!important; 142 + box-sizing:border-box!important; 143 + border-left:4px solid #e94b13!important; 144 + border-radius:8px; 145 + text-align:left!important; 146 + word-spacing:normal!important; 143 143 } 144 144 145 -#xwikicontent [data-sn-callout-harmonized="1"] > :first-child, 146 -#xwikicontent .infomessage > :first-child, 147 -#xwikicontent .warningmessage > :first-child, 148 -#xwikicontent .successmessage > :first-child, 149 -#xwikicontent .errormessage > :first-child{ 150 - margin-top:0!important; 151 -} 152 - 153 -#xwikicontent [data-sn-callout-harmonized="1"] > :last-child, 154 -#xwikicontent .infomessage > :last-child, 155 -#xwikicontent .warningmessage > :last-child, 156 -#xwikicontent .successmessage > :last-child, 157 -#xwikicontent .errormessage > :last-child{ 158 - margin-bottom:0!important; 159 -} 160 - 161 -#xwikicontent [data-sn-equal-height-managed], 162 -#xwikicontent [data-sn-first-section-aligned], 163 -#xwikicontent [data-sn-first-content-aligned]{ 149 +[data-sn-master-equal-height], 150 +[data-sn-master-first-row]{ 164 164 box-sizing:border-box; 165 165 } 166 166 </style> 167 167 168 -<script data-sn- horizontal-box-harmonizer="7">155 +<script data-sn-service-navigator-master="1"> 169 169 (function(){ 170 170 "use strict"; 171 171 159 + var PAGE_KIND="detail"; 160 + var PLACEHOLDER=true; 161 + var PLACEHOLDER_LABEL="COMING SOON"; 162 + 172 172 var MOBILE_MAX=767; 173 173 var ROW_TOLERANCE=6; 174 - var MIN_W=150; 175 - var MIN_H=36; 176 - var MAX_PARENT_CHILDREN=18; 177 - var SEARCH_DEPTH=5; 178 178 var RESIZE_DEBOUNCE=220; 179 - var MIN_WIDTH_CHANGE=2; 180 180 181 181 var root= 182 182 document.getElementById("xwikicontent")|| ... ... @@ -186,142 +186,114 @@ 186 186 187 187 if(!root)return; 188 188 189 - var heightManaged=new Set(); 190 - var sectionManaged=new Set(); 191 - var contentManaged=new Set(); 175 + var managedHeight=new Set(); 176 + var managedMargin=new Set(); 177 + var originalHeight=new WeakMap(); 178 + var originalMargin=new WeakMap(); 192 192 193 - var originalMinHeight=new WeakMap(); 194 - var originalMarginTop=new WeakMap(); 195 - 196 196 var resizeTimer=0; 197 - var lastWidth=-1; 198 - var hasApplied=false; 199 - var applying=false; 181 + var running=false; 200 200 201 - function num(v){ 202 - var n=parseFloat(v); 203 - return Number.isFinite(n)?n:0; 204 - } 205 - 206 - function visible(el,minW,minH){ 207 - if(!el||el.nodeType!==1)return false; 208 - 209 - var s=getComputedStyle(el); 210 - 211 - if( 212 - s.display==="none"|| 213 - s.visibility==="hidden"|| 214 - Number(s.opacity)===0 215 - ){ 216 - return false; 183 + var THEMES=[ 184 + { 185 + name:"BLUE", 186 + accent:"#21b6d7", 187 + bg:"#eaf7fb", 188 + text:"#315d68", 189 + labels:[ 190 + "HIER STARTEN", 191 + "ENTSCHEIDEN", 192 + "ÜBERPRÜFEN & ANPASSEN", 193 + "START HERE", 194 + "DECIDE", 195 + "REVIEW & ADAPT" 196 + ] 197 + }, 198 + { 199 + name:"RED", 200 + accent:"#e94b13", 201 + bg:"#fff1ec", 202 + text:"#8a4d36", 203 + labels:[ 204 + "PLANEN & ORGANISIEREN", 205 + "ORGANISIEREN & DOKUMENTIEREN", 206 + "PUBLIZIEREN & PRÄSENTIEREN", 207 + "PLAN & ORGANISE", 208 + "PLAN & ORGANIZE", 209 + "ORGANISE & DOCUMENT", 210 + "ORGANIZE & DOCUMENT", 211 + "PUBLISH & PRESENT" 212 + ] 213 + }, 214 + { 215 + name:"YELLOW", 216 + accent:"#f0aa00", 217 + bg:"#fff8e7", 218 + text:"#785b17", 219 + labels:[ 220 + "SCHÜTZEN & KLÄREN", 221 + "STANDARDISIEREN & IDENTIFIZIEREN", 222 + "ÖFFNEN, NACHNUTZEN & AUFFINDBAR MACHEN", 223 + "PROTECT & CLARIFY", 224 + "STANDARDISE & IDENTIFY", 225 + "STANDARDIZE & IDENTIFY", 226 + "OPEN, REUSE & MAKE FINDABLE" 227 + ] 228 + }, 229 + { 230 + name:"GREEN", 231 + accent:"#38b76a", 232 + bg:"#edf9f1", 233 + text:"#3f7451", 234 + labels:[ 235 + "INFRASTRUKTUR EINRICHTEN", 236 + "INFRASTRUKTUR & ZUSAMMENARBEIT EINRICHTEN", 237 + "SPEICHERN & ZUGRIFF STEUERN", 238 + "REPOSITORIUM, ERHALTEN & ÜBERGEBEN", 239 + "SET UP INFRASTRUCTURE", 240 + "SET UP INFRASTRUCTURE & COLLABORATION", 241 + "STORE & CONTROL ACCESS", 242 + "REPOSITORY, PRESERVE & HAND OVER" 243 + ] 217 217 } 245 + ]; 218 218 219 - var r=el.getBoundingClientRect(); 220 - 221 - return ( 222 - r.width>=(minW||1)&& 223 - r.height>=(minH||1) 224 - ); 247 + function num(value){ 248 + var n=parseFloat(value); 249 + return Number.isFinite(n)?n:0; 225 225 } 226 226 227 - function normal izeText(text){228 - return String( text||"")252 + function norm(value){ 253 + return String(value||"") 229 229 .replace(/\s+/g," ") 230 230 .trim() 231 231 .toUpperCase(); 232 232 } 233 233 234 - function excluded(el){ 235 - return ( 236 - !el.matches|| 237 - el.matches( 238 - "button,input,select,textarea,option,label,img,svg,canvas,table,thead,tbody,tfoot,tr,td,th,summary,script,style,noscript,template,.btn,.chip,[role=button]" 239 - ) 240 - ); 241 - } 259 + function visible(el){ 260 + if(!el||el.nodeType!==1)return false; 242 242 243 - /* ---------- Custom coloured callouts ---------- */ 262 + var style=getComputedStyle(el); 263 + var rect=el.getBoundingClientRect(); 244 244 245 - function nativeCallout(el){ 246 - var c= 247 - typeof el.className==="string" 248 - ? el.className.toLowerCase() 249 - : ""; 250 - 251 251 return ( 252 - /(^|\s)(infomessage|warningmessage|successmessage|errormessage)(\s|$)/.test(c) 266 + style.display!=="none"&& 267 + style.visibility!=="hidden"&& 268 + rect.width>20&& 269 + rect.height>4 253 253 ); 254 254 } 255 255 256 - function customCallout(el){ 257 - if(!visible(el,220,42)||excluded(el))return false; 258 - 259 - var r=el.getBoundingClientRect(); 260 - 261 - if(r.height>520)return false; 262 - 263 - var s=getComputedStyle(el); 264 - 265 - var bg= 266 - s.backgroundColor&& 267 - s.backgroundColor!=="rgba(0, 0, 0, 0)"&& 268 - s.backgroundColor!=="transparent"&& 269 - s.backgroundColor!=="rgb(255, 255, 255)"; 270 - 271 - var left= 272 - num(s.borderLeftWidth); 273 - 274 - return ( 275 - bg&& 276 - left>=2 277 - ); 278 - } 279 - 280 - function harmoniseCustomCallouts(){ 281 - Array.from( 282 - root.querySelectorAll( 283 - "div,aside,section" 284 - ) 285 - ).forEach(function(el){ 286 - if(nativeCallout(el))return; 287 - if(!customCallout(el))return; 288 - 289 - var s=getComputedStyle(el); 290 - 291 - el.setAttribute( 292 - "data-sn-callout-harmonized", 293 - "1" 294 - ); 295 - 296 - if( 297 - s.borderLeftColor 298 - ){ 299 - el.style.setProperty( 300 - "--sn-callout-accent", 301 - s.borderLeftColor 302 - ); 303 - } 304 - }); 305 - } 306 - 307 - /* ---------- Restore only values V7 itself changed ---------- */ 308 - 309 - function saveOriginal(el,map,property){ 273 + function saveStyle(el,map,property){ 310 310 if(map.has(el))return; 311 311 312 312 map.set(el,{ 313 - value: 314 - el.style.getPropertyValue( 315 - property 316 - ), 317 - priority: 318 - el.style.getPropertyPriority( 319 - property 320 - ) 277 + value:el.style.getPropertyValue(property), 278 + priority:el.style.getPropertyPriority(property) 321 321 }); 322 322 } 323 323 324 - function restore Original(el,map,property){282 + function restoreStyle(el,map,property){ 325 325 var original=map.get(el); 326 326 327 327 if(original&&original.value){ ... ... @@ -331,770 +331,845 @@ 331 331 original.priority||"" 332 332 ); 333 333 }else{ 334 - el.style.removeProperty( 335 - property 336 - ); 292 + el.style.removeProperty(property); 337 337 } 338 338 } 339 339 340 340 function resetRuntime(){ 341 - heightManaged.forEach(function(el){342 - restore Original(297 + managedHeight.forEach(function(el){ 298 + restoreStyle( 343 343 el, 344 - original MinHeight,300 + originalHeight, 345 345 "min-height" 346 346 ); 347 - 348 348 el.removeAttribute( 349 - "data-sn-equal-height -managed"304 + "data-sn-master-equal-height" 350 350 ); 351 351 }); 352 352 353 - sectionManaged.forEach(function(el){354 - restore Original(308 + managedMargin.forEach(function(el){ 309 + restoreStyle( 355 355 el, 356 - originalMargin Top,311 + originalMargin, 357 357 "margin-top" 358 358 ); 359 - 360 360 el.removeAttribute( 361 - "data-sn-first- section-aligned"315 + "data-sn-master-first-row" 362 362 ); 363 363 }); 364 364 365 - contentManaged.forEach(function(el){ 366 - restoreOriginal( 367 - el, 368 - originalMarginTop, 369 - "margin-top" 370 - ); 371 - 372 - el.removeAttribute( 373 - "data-sn-first-content-aligned" 374 - ); 375 - }); 376 - 377 - heightManaged.clear(); 378 - sectionManaged.clear(); 379 - contentManaged.clear(); 319 + managedHeight.clear(); 320 + managedMargin.clear(); 380 380 } 381 381 382 - /* ---------- Card detection ---------- */ 323 + function themeFor(text){ 324 + var value=norm(text); 383 383 384 - function namedLikeBox(el){ 385 - var c= 386 - typeof el.className==="string" 387 - ? el.className 388 - : ""; 326 + for(var i=0;i<THEMES.length;i++){ 327 + for(var j=0;j<THEMES[i].labels.length;j++){ 328 + var label=THEMES[i].labels[j]; 389 389 390 - return /(^|[\s_-])(box|card|tile|panel|role|check|service|source|call|area|detail|resource|topic|warn|info)([\s_-]|$)/i.test(c); 330 + if( 331 + value===label|| 332 + value.indexOf(label+" ")===0|| 333 + value.indexOf(label+" -")===0|| 334 + value.indexOf(label+" ·")===0 335 + ){ 336 + return THEMES[i]; 337 + } 338 + } 339 + } 340 + 341 + return null; 391 391 } 392 392 393 - function boxLike(el){ 344 + /* ======================================================= 345 + PLACEHOLDER BADGE 346 + ======================================================= */ 347 + 348 + function applyPlaceholderBadge(){ 349 + if(!PLACEHOLDER)return; 350 + 394 394 if( 395 - !visible(el,MIN_W,MIN_H)|| 396 - excluded(el) 352 + document.querySelector( 353 + ".sn-coming-soon-badge" 354 + ) 397 397 ){ 398 - return false;356 + return; 399 399 } 400 400 401 - var s=getComputedStyle(el); 402 - var r=el.getBoundingClientRect(); 359 + var title= 360 + document.querySelector( 361 + "#document-title" 362 + )|| 363 + document.querySelector( 364 + "h1" 365 + ); 403 403 404 - var border= 405 - num(s.borderTopWidth)+ 406 - num(s.borderRightWidth)+ 407 - num(s.borderBottomWidth)+ 408 - num(s.borderLeftWidth); 367 + if(!title)return; 409 409 410 - var radius=Math.max( 411 - num(s.borderTopLeftRadius), 412 - num(s.borderTopRightRadius), 413 - num(s.borderBottomLeftRadius), 414 - num(s.borderBottomRightRadius) 369 + var badge= 370 + document.createElement( 371 + "span" 372 + ); 373 + 374 + badge.className= 375 + "sn-coming-soon-badge"; 376 + 377 + badge.textContent= 378 + PLACEHOLDER_LABEL; 379 + 380 + badge.setAttribute( 381 + "aria-label", 382 + PLACEHOLDER_LABEL 415 415 ); 416 416 417 - var bg=418 - s.backgroundColor&&419 - s.backgroundColor!=="rgba(0, 0, 0, 0)"&&420 - s.backgroundColor!=="transparent";385 + title.appendChild( 386 + badge 387 + ); 388 + } 421 421 422 - var shadow=423 - s.boxShadow&&424 - s.boxShadow!=="none";390 + /* ======================================================= 391 + DETAIL PAGE OWN-ACCENT PROPAGATION 392 + ======================================================= */ 425 425 426 - return ( 427 - namedLikeBox(el)|| 428 - border>=1|| 429 - (bg&&radius>=3)|| 430 - (shadow&&r.width>=180) 394 + function parseRGB(value){ 395 + var match=String(value||"").match( 396 + /rgba?\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)/i 431 431 ); 398 + 399 + if(!match)return null; 400 + 401 + return [ 402 + Number(match[1]), 403 + Number(match[2]), 404 + Number(match[3]) 405 + ]; 432 432 } 433 433 434 - function pickTarget(child){ 435 - if(!visible(child,MIN_W,MIN_H))return null; 408 + function distance(a,b){ 409 + return Math.sqrt( 410 + Math.pow(a[0]-b[0],2)+ 411 + Math.pow(a[1]-b[1],2)+ 412 + Math.pow(a[2]-b[2],2) 413 + ); 414 + } 436 436 437 - if(boxLike(child))return child; 416 + function paletteMatch(cssColor){ 417 + var rgb=parseRGB(cssColor); 438 438 439 - var cr=child.getBoundingClientRect(); 440 - var q=[]; 419 + if(!rgb)return null; 441 441 442 - Array.from(child.children||[]).forEach(function(el){ 443 - q.push({el:el,depth:1}); 444 - }); 421 + var palette=[ 422 + {hex:"#21b6d7",rgb:[33,182,215]}, 423 + {hex:"#e94b13",rgb:[233,75,19]}, 424 + {hex:"#f0aa00",rgb:[240,170,0]}, 425 + {hex:"#38b76a",rgb:[56,183,106]} 426 + ]; 445 445 446 446 var best=null; 447 - var best Score=-Infinity;429 + var bestDistance=Infinity; 448 448 449 - while(q.length){ 450 - var item=q.shift(); 451 - var el=item.el; 431 + palette.forEach(function(item){ 432 + var d=distance(rgb,item.rgb); 452 452 453 - if(!visible(el,MIN_W,MIN_H))continue; 434 + if(d<bestDistance){ 435 + best=item; 436 + bestDistance=d; 437 + } 438 + }); 454 454 455 - var r=el.getBoundingClientRect(); 440 + return bestDistance<=30 441 + ?best 442 + :null; 443 + } 456 456 445 + function propagateDetailAccents(){ 446 + if(PAGE_KIND!=="detail")return; 447 + 448 + Array.from( 449 + root.querySelectorAll( 450 + ".arsn-call,.dmp-call,.ido-call,.pp-call,"+ 451 + ".arsn-source,.dmp-source,.ido-source,.pp-source" 452 + ) 453 + ).forEach(function(el){ 454 + if(!visible(el))return; 455 + 456 + var style=getComputedStyle(el); 457 + 457 457 if( 458 - r.width>=cr.width*.68&& 459 - boxLike(el) 459 + num(style.borderTopWidth)>=2 460 460 ){ 461 - var widthFit= 462 - 1-Math.min( 463 - 1, 464 - Math.abs(cr.width-r.width)/ 465 - Math.max(1,cr.width) 461 + var match= 462 + paletteMatch( 463 + style.borderTopColor 466 466 ); 467 467 468 - var topFit= 469 - 1-Math.min( 470 - 1, 471 - Math.abs(cr.top-r.top)/100 466 + if(match){ 467 + el.style.setProperty( 468 + "border-left", 469 + "4px solid "+match.hex, 470 + "important" 472 472 ); 473 - 474 - var score= 475 - widthFit*6+ 476 - topFit*3+ 477 - Math.min(r.height,900)/450+ 478 - Math.min(r.width*r.height,900000)/900000; 479 - 480 - if(score>bestScore){ 481 - best=el; 482 - bestScore=score; 483 483 } 484 484 } 474 + }); 485 485 486 - if(item.depth<SEARCH_DEPTH){ 487 - Array.from(el.children||[]).forEach(function(next){ 488 - q.push({ 489 - el:next, 490 - depth:item.depth+1 491 - }); 492 - }); 493 - } 494 - } 476 + // Warning families: explicit safety override. 477 + Array.from( 478 + root.querySelectorAll( 479 + ".arsn-warn,.dmp-warn,.ido-warn,.pp-warn,"+ 480 + ".warn,.warning,.warningmessage,.errormessage" 481 + ) 482 + ).forEach(function(el){ 483 + if(!visible(el))return; 495 495 496 - return best; 497 - } 485 + el.style.setProperty( 486 + "border-left", 487 + "4px solid #e94b13", 488 + "important" 489 + ); 490 + }); 498 498 499 - function groupRows(entries){ 500 - var groups=[]; 492 + // Info families: explicit orientation override. 493 + Array.from( 494 + root.querySelectorAll( 495 + ".arsn-info,.dmp-info,.ido-info,.pp-info,.infomessage" 496 + ) 497 + ).forEach(function(el){ 498 + if(!visible(el))return; 501 501 502 - entries 503 - .slice() 504 - .sort(function(a,b){ 505 - return ( 506 - a.rect.top-b.rect.top|| 507 - a.rect.left-b.rect.left 508 - ); 509 - }) 510 - .forEach(function(entry){ 511 - var group=null; 500 + el.style.setProperty( 501 + "border-left", 502 + "4px solid #21b6d7", 503 + "important" 504 + ); 505 + }); 506 + } 512 512 513 - for(var i=0;i<groups.length;i++){ 514 - if( 515 - Math.abs( 516 - groups[i].top- 517 - entry.rect.top 518 - )<=ROW_TOLERANCE 519 - ){ 520 - group=groups[i]; 521 - break; 522 - } 523 - } 508 + /* ======================================================= 509 + OVERVIEW SEMANTIC THEME PALETTE 510 + ======================================================= */ 524 524 525 - if(!group){ 526 - group={ 527 - top:entry.rect.top, 528 - entries:[] 529 - }; 530 - groups.push(group); 531 - } 512 + function smallestThemeHeaders(){ 513 + return Array.from( 514 + root.querySelectorAll( 515 + "div,span,p,strong,h3,h4,h5,h6" 516 + ) 517 + ).filter(function(el){ 518 + if(!visible(el))return false; 519 + if(!themeFor(el.textContent))return false; 532 532 533 - group.entries.push(entry); 521 + return !Array.from( 522 + el.children||[] 523 + ).some(function(child){ 524 + return !!themeFor( 525 + child.textContent 526 + ); 534 534 }); 535 - 536 - return groups; 528 + }); 537 537 } 538 538 539 - function validRow(group){ 540 - if(group.entries.length<2)return false; 531 + function findOverviewCard(header){ 532 + var node=header.parentElement; 533 + var candidates=[]; 541 541 542 - var lefts= 543 - group.entries 544 - .map(function(e){return e.rect.left;}) 545 - .sort(function(a,b){return a-b;}); 535 + while(node&&node!==root){ 536 + var rect=node.getBoundingClientRect(); 537 + var style=getComputedStyle(node); 546 546 547 - if( 548 - lefts[lefts.length-1]- 549 - lefts[0]< 550 - 80 551 - ){ 552 - return false; 553 - } 539 + var border= 540 + num(style.borderTopWidth)+ 541 + num(style.borderRightWidth)+ 542 + num(style.borderBottomWidth)+ 543 + num(style.borderLeftWidth); 554 554 555 - var widths= 556 - group.entries 557 - .map(function(e){return e.rect.width;}) 558 - .filter(function(w){return w>0;}); 545 + if( 546 + rect.width>=220&& 547 + rect.width<=800&& 548 + rect.height>=120&& 549 + border>=1 550 + ){ 551 + candidates.push(node); 552 + } 559 559 560 - if(widths.length<2)return false; 554 + node=node.parentElement; 555 + } 561 561 562 - var minW= 563 - Math.min.apply(Math,widths); 557 + if(!candidates.length)return null; 564 564 565 - var maxW= 566 - Math.max.apply(Math,widths); 567 - 568 - return ( 569 - maxW/ 570 - Math.max(1,minW)<= 571 - 1.9 572 - ); 573 - } 574 - 575 - /* ---------- Known ARSN first section bars ---------- */ 576 - 577 - function knownBar(el){ 578 - var text= 579 - normalizeText( 580 - el.textContent 559 + candidates.sort(function(a,b){ 560 + return ( 561 + b.getBoundingClientRect().height- 562 + a.getBoundingClientRect().height 581 581 ); 564 + }); 582 582 583 - return ( 584 - text==="HIER STARTEN"|| 585 - text==="ORGANISIEREN & DOKUMENTIEREN"|| 586 - text==="ENTSCHEIDEN"|| 587 - text==="START HERE"|| 588 - text==="GET STARTED"|| 589 - text==="ORGANISE & DOCUMENT"|| 590 - text==="ORGANIZE & DOCUMENT"|| 591 - text==="DECIDE" 592 - ); 566 + return candidates[0]; 593 593 } 594 594 595 - function findKnownBar(card){ 569 + function rowCandidates(link,card){ 570 + var result=[]; 596 596 var cardRect= 597 597 card.getBoundingClientRect(); 598 598 599 - var rows= 600 - Array.from( 601 - card.querySelectorAll( 602 - "div,p,span,strong,h3,h4,h5,h6" 603 - ) 604 - ) 605 - .filter(function(el){ 606 - if(!visible(el,20,6))return false; 607 - if(!knownBar(el))return false; 574 + var node=link; 608 608 609 - var r=el.getBoundingClientRect(); 576 + while(node&&node!==card){ 577 + if(visible(node)){ 578 + var rect= 579 + node.getBoundingClientRect(); 610 610 611 - var rel= 612 - r.top- 613 - cardRect.top; 581 + if( 582 + rect.height<=105&& 583 + rect.width>= 584 + cardRect.width*.50&& 585 + rect.width<= 586 + cardRect.width*1.03 587 + ){ 588 + result.push(node); 589 + } 590 + } 614 614 592 + node=node.parentElement; 593 + } 594 + 595 + return result; 596 + } 597 + 598 + function chooseOuterRow( 599 + candidates, 600 + link 601 + ){ 602 + if(!candidates.length){ 603 + return link; 604 + } 605 + 606 + var bordered= 607 + candidates.filter(function(el){ 615 615 return ( 616 - rel>=35&& 617 - rel<= 618 - cardRect.height*.75 609 + num( 610 + getComputedStyle(el) 611 + .borderLeftWidth 612 + )>=1 619 619 ); 620 - }) 621 - .sort(function(a,b){ 622 - return ( 623 - a.getBoundingClientRect().top- 624 - b.getBoundingClientRect().top 625 - ); 626 626 }); 627 627 628 - return rows[0]||null; 629 - } 616 + var pool= 617 + bordered.length 618 + ?bordered 619 + :candidates; 630 630 631 - function alignKnownBars(cards){ 632 - var rows= 633 - cards.map(function(card){ 634 - var bar= 635 - findKnownBar(card); 621 + pool.sort(function(a,b){ 622 + var ar= 623 + a.getBoundingClientRect(); 636 636 637 - if(!bar)return null; 625 + var br= 626 + b.getBoundingClientRect(); 638 638 639 - var cr= 640 - card.getBoundingClientRect(); 628 + return ( 629 + ar.left-br.left|| 630 + br.width-ar.width 631 + ); 632 + }); 641 641 642 - varbr=643 - bar.getBoundingClientRect();634 + return pool[0]||link; 635 + } 644 644 645 - return { 646 - bar:bar, 647 - relativeTop: 648 - br.top- 649 - cr.top 650 - }; 651 - }); 652 - 653 - if( 654 - rows.some(function(row){ 655 - return !row; 656 - }) 657 - ){ 658 - return false; 637 + function applyOverviewPalette(){ 638 + if(PAGE_KIND!=="overview"){ 639 + return []; 659 659 } 660 660 661 - var target= 662 - Math.max.apply( 663 - Math, 664 - rows.map(function(row){ 665 - return row.relativeTop; 642 + var headers= 643 + smallestThemeHeaders() 644 + .map(function(el){ 645 + return { 646 + el:el, 647 + theme: 648 + themeFor( 649 + el.textContent 650 + ), 651 + card: 652 + findOverviewCard( 653 + el 654 + ) 655 + }; 666 666 }) 667 - ); 657 + .filter(function(row){ 658 + return !!row.card; 659 + }); 668 668 669 - rows.forEach(function(row){ 670 - var delta= 671 - target- 672 - row.relativeTop; 661 + var unique=[]; 662 + var seenHeaders=new Set(); 673 673 674 - if(delta<=1)return; 664 + headers.forEach(function(row){ 665 + var key= 666 + row.theme.name+ 667 + "|"+ 668 + Math.round( 669 + row.card 670 + .getBoundingClientRect() 671 + .left 672 + )+ 673 + "|"+ 674 + Math.round( 675 + row.el 676 + .getBoundingClientRect() 677 + .top 678 + ); 675 675 676 - sa veOriginal(677 - r ow.bar,678 - originalMarginTop,679 - "margin-top"680 - );680 + if(!seenHeaders.has(key)){ 681 + seenHeaders.add(key); 682 + unique.push(row); 683 + } 684 + }); 681 681 682 - var current= 683 - num( 684 - getComputedStyle( 685 - row.bar 686 - ).marginTop 687 - ); 686 + unique.forEach(function(row){ 687 + var headerRect= 688 + row.el 689 + .getBoundingClientRect(); 688 688 689 - row.bar.style.setProperty( 690 - "margin-top", 691 - ( 692 - current+ 693 - delta 694 - )+"px" 691 + row.el.style.setProperty( 692 + "background", 693 + row.theme.bg, 694 + "important" 695 695 ); 696 696 697 - row.bar.setAttribute( 698 - "data-sn-first-section-aligned", 699 - "7" 697 + row.el.style.setProperty( 698 + "color", 699 + row.theme.text, 700 + "important" 700 700 ); 701 701 702 - sectionManaged.add( 703 - row.bar 703 + row.el.style.setProperty( 704 + "text-align", 705 + "left", 706 + "important" 704 704 ); 705 - }); 706 706 707 - return true; 708 - } 709 + row.el.style.setProperty( 710 + "word-spacing", 711 + "normal", 712 + "important" 713 + ); 709 709 710 - /* ---------- Generic first content after heading ---------- */ 715 + var later= 716 + unique 717 + .filter(function(other){ 718 + return ( 719 + other.card===row.card&& 720 + other.el 721 + .getBoundingClientRect() 722 + .top> 723 + headerRect.top+2 724 + ); 725 + }) 726 + .sort(function(a,b){ 727 + return ( 728 + a.el 729 + .getBoundingClientRect() 730 + .top- 731 + b.el 732 + .getBoundingClientRect() 733 + .top 734 + ); 735 + }); 711 711 712 - function heading(card){ 713 - var cr= 714 - card.getBoundingClientRect(); 737 + var stopTop= 738 + later.length 739 + ?later[0].el 740 + .getBoundingClientRect() 741 + .top 742 + :Infinity; 715 715 716 - var rows= 717 717 Array.from( 718 - card.querySelectorAll( 719 - "h1,h2,h3,h4,h5,h6,.box-title,[role=heading]" 720 - ) 721 - ) 722 - .filter(function(el){ 723 - if(!visible(el,20,8))return false; 745 + row.card.querySelectorAll("a") 746 + ).forEach(function(link){ 747 + if(!visible(link))return; 724 724 725 - var r=el.getBoundingClientRect(); 749 + var rect= 750 + link.getBoundingClientRect(); 726 726 727 - var rel= 728 - r.top- 729 - cr.top; 730 - 731 - return ( 732 - rel>=0&& 733 - rel<= 734 - Math.min( 735 - 160, 736 - cr.height*.45 737 - ) 738 - ); 739 - }) 740 - .sort(function(a,b){ 741 - return ( 742 - a.getBoundingClientRect().top- 743 - b.getBoundingClientRect().top 744 - ); 745 - }); 746 - 747 - return rows[0]||null; 748 - } 749 - 750 - function firstContent(card,h){ 751 - if(!h)return null; 752 - 753 - var cr= 754 - card.getBoundingClientRect(); 755 - 756 - var hr= 757 - h.getBoundingClientRect(); 758 - 759 - var rows= 760 - Array.from( 761 - card.querySelectorAll( 762 - "p,div,ul,ol,dl,blockquote" 763 - ) 764 - ) 765 - .filter(function(el){ 766 766 if( 767 - el===h|| 768 - h.contains(el)|| 769 - el.contains(h) 753 + rect.top<= 754 + headerRect.bottom-2|| 755 + rect.top>= 756 + stopTop-2 770 770 ){ 771 - return false;758 + return; 772 772 } 773 773 774 - if(!visible(el,30,8))return false; 761 + var candidates= 762 + rowCandidates( 763 + link, 764 + row.card 765 + ); 775 775 776 - var text= 777 - String(el.textContent||"") 778 - .replace(/\s+/g," ") 779 - .trim(); 767 + var target= 768 + chooseOuterRow( 769 + candidates, 770 + link 771 + ); 780 780 781 - if(text.length<3)return false; 773 + candidates.forEach(function(el){ 774 + el.style.setProperty( 775 + "border-left", 776 + "0 solid transparent", 777 + "important" 778 + ); 779 + }); 782 782 783 - var r=el.getBoundingClientRect(); 781 + target.style.setProperty( 782 + "border-left", 783 + "3px solid "+ 784 + row.theme.accent, 785 + "important" 786 + ); 784 784 785 - if( 786 - r.top< 787 - hr.bottom-1 788 - ){ 789 - return false; 790 - } 791 - 792 - if( 793 - r.top-cr.top> 794 - Math.min( 795 - 280, 796 - cr.height*.65 797 - ) 798 - ){ 799 - return false; 800 - } 801 - 802 - if( 803 - r.height> 804 - cr.height*.58 805 - ){ 806 - return false; 807 - } 808 - 809 - return true; 810 - }) 811 - .sort(function(a,b){ 812 - var ar= 813 - a.getBoundingClientRect(); 814 - 815 - var br= 816 - b.getBoundingClientRect(); 817 - 818 - return ( 819 - ar.top-br.top|| 820 - ar.height-br.height 788 + target.style.setProperty( 789 + "box-sizing", 790 + "border-box", 791 + "important" 821 821 ); 822 822 }); 794 + }); 823 823 824 - return rows[0]||null;796 + return unique; 825 825 } 826 826 827 - function alignGeneric(cards){ 828 - var rows= 829 - cards.map(function(card){ 830 - var h= 831 - heading(card); 799 + /* ======================================================= 800 + OVERVIEW CARD HEIGHT + FIRST THEMATIC ROW 801 + ======================================================= */ 832 832 833 - var c= 834 - firstContent( 835 - card, 836 - h 837 - ); 838 - 839 - if(!h||!c)return null; 840 - 841 - var cr= 842 - card.getBoundingClientRect(); 843 - 844 - var rr= 845 - c.getBoundingClientRect(); 846 - 847 - return { 848 - content:c, 849 - relativeTop: 850 - rr.top-cr.top 851 - }; 852 - }); 853 - 803 + function alignOverviewCards(headers){ 854 854 if( 855 - rows.some(function(row){ 856 - return !row; 857 - }) 805 + PAGE_KIND!=="overview"|| 806 + window.innerWidth<=MOBILE_MAX 858 858 ){ 859 - return false;808 + return; 860 860 } 861 861 862 - var target= 863 - Math.max.apply( 864 - Math, 865 - rows.map(function(row){ 866 - return row.relativeTop; 867 - }) 868 - ); 811 + var cards=[]; 812 + var seen=new Set(); 869 869 870 - rows.forEach(function(row){ 871 - var delta= 872 - target- 873 - row.relativeTop; 814 + headers.forEach(function(row){ 815 + if(!seen.has(row.card)){ 816 + seen.add(row.card); 817 + cards.push(row.card); 818 + } 819 + }); 874 874 875 - if(delta<=1)return; 821 + if(cards.length<2){ 822 + return; 823 + } 876 876 877 - saveOriginal( 878 - row.content, 879 - originalMarginTop, 880 - "margin-top" 881 - ); 825 + // Group cards by actual top position. 826 + var groups=[]; 882 882 883 - var current= 884 - num( 885 - getComputedStyle( 886 - row.content 887 - ).marginTop 888 - ); 828 + cards.forEach(function(card){ 829 + var top= 830 + card.getBoundingClientRect().top; 889 889 890 - row.content.style.setProperty( 891 - "margin-top", 892 - ( 893 - current+ 894 - delta 895 - )+"px" 896 - ); 832 + var group=null; 897 897 898 - row.content.setAttribute( 899 - "data-sn-first-content-aligned", 900 - "7" 901 - ); 834 + for(var i=0;i<groups.length;i++){ 835 + if( 836 + Math.abs( 837 + groups[i].top-top 838 + )<=ROW_TOLERANCE 839 + ){ 840 + group=groups[i]; 841 + break; 842 + } 843 + } 902 902 903 - contentManaged.add( 904 - row.content 905 - ); 845 + if(!group){ 846 + group={ 847 + top:top, 848 + cards:[] 849 + }; 850 + groups.push(group); 851 + } 852 + 853 + group.cards.push(card); 906 906 }); 907 907 908 - return true; 909 - } 856 + groups.forEach(function(group){ 857 + if(group.cards.length<2){ 858 + return; 859 + } 910 910 911 - function applyRow(group){ 912 - if(!validRow(group))return false; 861 + var firstHeaders= 862 + group.cards.map(function(card){ 863 + var candidates= 864 + headers 865 + .filter(function(row){ 866 + return row.card===card; 867 + }) 868 + .sort(function(a,b){ 869 + return ( 870 + a.el 871 + .getBoundingClientRect() 872 + .top- 873 + b.el 874 + .getBoundingClientRect() 875 + .top 876 + ); 877 + }); 913 913 914 - var cards=[]; 915 - var seen=new Set(); 879 + return candidates.length 880 + ?candidates[0] 881 + :null; 882 + }); 916 916 917 - group.entries.forEach(function(entry){ 918 - if(!seen.has(entry.target)){ 919 - seen.add(entry.target); 920 - cards.push(entry.target); 921 - } 922 - }); 884 + if( 885 + !firstHeaders.some(function(row){ 886 + return !row; 887 + }) 888 + ){ 889 + var targetTop= 890 + Math.max.apply( 891 + Math, 892 + firstHeaders.map(function(row){ 893 + return ( 894 + row.el 895 + .getBoundingClientRect() 896 + .top- 897 + row.card 898 + .getBoundingClientRect() 899 + .top 900 + ); 901 + }) 902 + ); 923 923 924 - if(cards.length<2)return false; 904 + firstHeaders.forEach(function(row){ 905 + var relativeTop= 906 + row.el 907 + .getBoundingClientRect() 908 + .top- 909 + row.card 910 + .getBoundingClientRect() 911 + .top; 925 925 926 - if( 927 - !alignKnownBars(cards) 928 - ){ 929 - alignGeneric(cards); 930 - } 913 + var delta= 914 + targetTop-relativeTop; 931 931 932 - var maxHeight=0; 916 + if(delta>1){ 917 + saveStyle( 918 + row.el, 919 + originalMargin, 920 + "margin-top" 921 + ); 933 933 934 - cards.forEach(function(card){ 935 - maxHeight= 936 - Math.max( 937 - maxHeight, 938 - card.getBoundingClientRect().height 939 - ); 940 - }); 923 + var current= 924 + num( 925 + getComputedStyle( 926 + row.el 927 + ).marginTop 928 + ); 941 941 942 - maxHeight= 943 - Math.ceil( 944 - maxHeight 945 - ); 930 + row.el.style.setProperty( 931 + "margin-top", 932 + ( 933 + current+delta 934 + )+"px" 935 + ); 946 946 947 - if(maxHeight<MIN_H)return false; 937 + row.el.setAttribute( 938 + "data-sn-master-first-row", 939 + "1" 940 + ); 948 948 949 - cards.forEach(function(card){950 - saveOriginal(951 - card,952 - originalMinHeight,953 - "min-height"954 - );942 + managedMargin.add( 943 + row.el 944 + ); 945 + } 946 + }); 947 + } 955 955 956 - card.style.setProperty( 957 - "min-height", 958 - maxHeight+"px" 959 - ); 949 + var maxHeight=0; 960 960 961 - card.setAttribute( 962 - "data-sn-equal-height-managed", 963 - "7" 964 - ); 951 + group.cards.forEach(function(card){ 952 + maxHeight= 953 + Math.max( 954 + maxHeight, 955 + card 956 + .getBoundingClientRect() 957 + .height 958 + ); 959 + }); 965 965 966 - heightManaged.add(card);967 - });961 + maxHeight= 962 + Math.ceil(maxHeight); 968 968 969 - return true; 970 - } 964 + group.cards.forEach(function(card){ 965 + saveStyle( 966 + card, 967 + originalHeight, 968 + "min-height" 969 + ); 971 971 972 - function calculate(force){ 973 - if(applying)return; 971 + card.style.setProperty( 972 + "min-height", 973 + maxHeight+"px" 974 + ); 974 974 975 - varwidth=976 - Math.round(977 - window.innerWidth978 - ); 976 + card.setAttribute( 977 + "data-sn-master-equal-height", 978 + "1" 979 + ); 979 979 980 - var meaningful= 981 - lastWidth<0|| 982 - Math.abs( 983 - width- 984 - lastWidth 985 - )>= 986 - MIN_WIDTH_CHANGE; 981 + managedHeight.add( 982 + card 983 + ); 984 + }); 985 + }); 986 + } 987 987 988 + /* ======================================================= 989 + DETAIL GRID EQUAL HEIGHT, DESKTOP ONLY 990 + ======================================================= */ 991 + 992 + function equaliseDetailGrids(){ 988 988 if( 989 - hasApplied&& 990 - !force&& 991 - !meaningful 994 + PAGE_KIND!=="detail"|| 995 + window.innerWidth<=MOBILE_MAX 992 992 ){ 993 993 return; 994 994 } 995 995 996 - applying=true; 1000 + var selectors=[ 1001 + ".arsn-grid", 1002 + ".arsn-grid-2", 1003 + ".arsn-grid-3", 1004 + ".dmp-grid", 1005 + ".ido-grid", 1006 + ".pp-grid" 1007 + ]; 997 997 998 - try{ 999 - harmoniseCustomCallouts(); 1009 + selectors.forEach(function(selector){ 1010 + Array.from( 1011 + root.querySelectorAll(selector) 1012 + ).forEach(function(grid){ 1013 + var children= 1014 + Array.from( 1015 + grid.children||[] 1016 + ).filter(visible); 1000 1000 1001 - if(width<=MOBILE_MAX){ 1002 - if(hasApplied){ 1003 - resetRuntime(); 1018 + if(children.length<2){ 1019 + return; 1004 1004 } 1005 1005 1006 - hasApplied=false; 1007 - lastWidth=width; 1008 - return; 1009 - } 1022 + var groups=[]; 1010 1010 1011 - if(hasApplied){ 1012 - resetRuntime(); 1013 - } 1024 + children.forEach(function(child){ 1025 + var top= 1026 + child 1027 + .getBoundingClientRect() 1028 + .top; 1014 1014 1015 - var parents= 1016 - Array.from( 1017 - root.querySelectorAll("*") 1018 - ) 1019 - .filter(function(parent){ 1020 - return ( 1021 - visible( 1022 - parent, 1023 - MIN_W, 1024 - MIN_H 1025 - )&& 1026 - parent.children&& 1027 - parent.children.length>=2&& 1028 - parent.children.length<= 1029 - MAX_PARENT_CHILDREN 1030 - ); 1031 - }); 1030 + var group=null; 1032 1032 1033 - var touched= 1034 - new Set(); 1032 + for(var i=0;i<groups.length;i++){ 1033 + if( 1034 + Math.abs( 1035 + groups[i].top-top 1036 + )<=ROW_TOLERANCE 1037 + ){ 1038 + group=groups[i]; 1039 + break; 1040 + } 1041 + } 1035 1035 1036 - parents.forEach(function(parent){ 1037 - var entries=[]; 1043 + if(!group){ 1044 + group={ 1045 + top:top, 1046 + items:[] 1047 + }; 1048 + groups.push(group); 1049 + } 1038 1038 1039 - Array.from( 1040 - parent.children 1041 - ).forEach(function(child){ 1042 - if( 1043 - !visible( 1044 - child, 1045 - MIN_W, 1046 - MIN_H 1047 - ) 1048 - ){ 1051 + group.items.push(child); 1052 + }); 1053 + 1054 + groups.forEach(function(group){ 1055 + if(group.items.length<2){ 1049 1049 return; 1050 1050 } 1051 1051 1052 - var target= 1053 - pickTarget(child); 1059 + var maxHeight=0; 1054 1054 1055 - if(!target)return; 1056 - 1057 - entries.push({ 1058 - target:target, 1059 - rect: 1060 - target.getBoundingClientRect() 1061 + group.items.forEach(function(item){ 1062 + maxHeight= 1063 + Math.max( 1064 + maxHeight, 1065 + item 1066 + .getBoundingClientRect() 1067 + .height 1068 + ); 1061 1061 }); 1062 - }); 1063 1063 1064 - groupRows( 1065 - entries 1066 - ).forEach(function(group){ 1067 - if(!validRow(group))return; 1071 + maxHeight= 1072 + Math.ceil(maxHeight); 1068 1068 1069 - var targets= 1070 - group.entries.map(function(entry){ 1071 - return entry.target; 1072 - }); 1074 + group.items.forEach(function(item){ 1075 + saveStyle( 1076 + item, 1077 + originalHeight, 1078 + "min-height" 1079 + ); 1073 1073 1074 - if( 1075 - !targets.some(function(el){ 1076 - return !touched.has(el); 1077 - }) 1078 - ){ 1079 - return; 1080 - } 1081 + item.style.setProperty( 1082 + "min-height", 1083 + maxHeight+"px" 1084 + ); 1081 1081 1082 - if(applyRow(group)){ 1083 - targets.forEach(function(el){ 1084 - touched.add(el); 1085 - }); 1086 - } 1086 + item.setAttribute( 1087 + "data-sn-master-equal-height", 1088 + "1" 1089 + ); 1090 + 1091 + managedHeight.add(item); 1092 + }); 1087 1087 }); 1088 1088 }); 1095 + }); 1096 + } 1089 1089 1090 - lastWidth=width; 1091 - hasApplied=true; 1098 + /* ======================================================= 1099 + RUN / RESPONSIVE SCHEDULING 1100 + ======================================================= */ 1101 + 1102 + function run(){ 1103 + if(running)return; 1104 + 1105 + running=true; 1106 + 1107 + try{ 1108 + resetRuntime(); 1109 + applyPlaceholderBadge(); 1110 + propagateDetailAccents(); 1111 + 1112 + var headers= 1113 + applyOverviewPalette(); 1114 + 1115 + if( 1116 + window.innerWidth> 1117 + MOBILE_MAX 1118 + ){ 1119 + alignOverviewCards( 1120 + headers 1121 + ); 1122 + 1123 + equaliseDetailGrids(); 1124 + } 1092 1092 }finally{ 1093 - applying=false;1126 + running=false; 1094 1094 } 1095 1095 } 1096 1096 1097 - function resize(){1130 + function onResize(){ 1098 1098 if(resizeTimer){ 1099 1099 clearTimeout( 1100 1100 resizeTimer ... ... @@ -1105,19 +1105,40 @@ 1105 1105 setTimeout( 1106 1106 function(){ 1107 1107 resizeTimer=0; 1108 - calculate(false);1141 + run(); 1109 1109 }, 1110 1110 RESIZE_DEBOUNCE 1111 1111 ); 1112 1112 } 1113 1113 1114 - function waitImages(){ 1147 + async function waitForReady(){ 1148 + if( 1149 + document.readyState!=="complete" 1150 + ){ 1151 + await new Promise(function(resolve){ 1152 + window.addEventListener( 1153 + "load", 1154 + resolve, 1155 + {once:true} 1156 + ); 1157 + }); 1158 + } 1159 + 1160 + if( 1161 + document.fonts&& 1162 + document.fonts.ready 1163 + ){ 1164 + try{ 1165 + await document.fonts.ready; 1166 + }catch(error){} 1167 + } 1168 + 1115 1115 var images= 1116 1116 Array.from( 1117 1117 root.querySelectorAll("img") 1118 1118 ); 1119 1119 1120 - returnPromise.all(1174 + await Promise.all( 1121 1121 images.map(function(img){ 1122 1122 if(img.complete){ 1123 1123 return Promise.resolve(); ... ... @@ -1142,46 +1142,20 @@ 1142 1142 }); 1143 1143 }) 1144 1144 ); 1145 - } 1146 1146 1147 - async function initial(){ 1148 - if( 1149 - document.readyState!== 1150 - "complete" 1151 - ){ 1152 - await new Promise(function(resolve){ 1153 - addEventListener( 1154 - "load", 1155 - resolve, 1156 - {once:true} 1157 - ); 1158 - }); 1159 - } 1160 - 1161 - if( 1162 - document.fonts&& 1163 - document.fonts.ready 1164 - ){ 1165 - try{ 1166 - await document.fonts.ready; 1167 - }catch(error){} 1168 - } 1169 - 1170 - await waitImages(); 1171 - 1172 - // Exactly one initial layout calculation. 1173 - calculate(true); 1200 + run(); 1174 1174 } 1175 1175 1176 - addEventListener( 1203 + window.addEventListener( 1177 1177 "resize", 1178 - resize,1205 + onResize, 1179 1179 {passive:true} 1180 1180 ); 1181 1181 1182 - i nitial();1209 + waitForReady(); 1183 1183 })(); 1184 1184 </script> 1185 1185 1186 -<!-- SN_HORIZONTAL_BOX_HARMONIZER_END --> 1187 -{{/html}}\n 1213 +<!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_END --> 1214 +{{/html}} 1215 +