Änderungen von Dokument Data Protection & Ethics
Zuletzt geändert von Veronika Kocher am Freitag, 18 Sep. 2026 16:47
Von Version 1.9
bearbeitet von Veronika Kocher
am Donnerstag, 03 Sep. 2026 13:04
am Donnerstag, 03 Sep. 2026 13:04
Änderungskommentar:
Es gibt keinen Kommentar für diese Version
Auf Version 1.6
bearbeitet von Veronika Kocher
am Donnerstag, 03 Sep. 2026 9:18
am Donnerstag, 03 Sep. 2026 9:18
Änderungskommentar:
Es gibt keinen Kommentar für diese Version
Zusammenfassung
-
Seiteneigenschaften (1 geändert, 0 hinzugefügt, 0 gelöscht)
Details
- Seiteneigenschaften
-
- Inhalt
-
... ... @@ -44,7 +44,7 @@ 44 44 45 45 == Wer ist zuständig? == 46 46 47 - 47 +{{html}}<!-- ARSN_TOPIC_ROUTING_V1 -->{{/html}} 48 48 {{info title="Service-Routing"}} 49 49 **Primäre Fachzuständigkeit:** Datenschutzbeauftragter für Fragen zu personenbezogenen Daten; Projekt-/tragende Einheit und der jeweils anwendbare Ethik- bzw. Förderweg für ethische Prüfungen. 50 50 ... ... @@ -69,100 +69,21 @@ 69 69 {{/html}} 70 70 71 71 {{html clean="false"}} 72 -<!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_START --> 73 - 74 -<style data-sn-service-navigator-master="1"> 75 -/* ========================================================= 76 - MASTER TYPOGRAPHY 77 - ========================================================= */ 78 -#xwikicontent h1, 79 -#xwikicontent h2, 80 -#xwikicontent h3, 81 -#xwikicontent h4, 82 -#xwikicontent h5, 83 -#xwikicontent h6, 84 -#xwikicontent .box-title, 85 -#xwikicontent [role="heading"], 86 -#xwikicontent h1 a, 87 -#xwikicontent h2 a, 88 -#xwikicontent h3 a, 89 -#xwikicontent h4 a, 90 -#xwikicontent h5 a, 91 -#xwikicontent h6 a, 92 -#xwikicontent .box-title a, 93 -#xwikicontent [role="heading"] a{ 94 - text-align:left!important; 95 - text-justify:auto!important; 96 - word-spacing:normal!important; 72 +<!-- SN_HORIZONTAL_BOX_HARMONIZER_START --> 73 +<style data-sn-horizontal-box-harmonizer="1"> 74 +[data-sn-equal-height-managed="1"]{box-sizing:border-box} 75 +@media(max-width:767px){ 76 + [data-sn-equal-height-managed="1"]{min-height:0!important} 97 97 } 98 - 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{ 127 - box-sizing:border-box!important; 128 - border-left:4px solid #21b6d7!important; 129 - border-radius:8px; 130 - text-align:left!important; 131 - word-spacing:normal!important; 132 -} 133 - 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, 141 -#xwikicontent .errormessage{ 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; 147 -} 148 - 149 -[data-sn-master-equal-height], 150 -[data-sn-master-first-row]{ 151 - box-sizing:border-box; 152 -} 153 153 </style> 154 - 155 -<script data-sn-service-navigator-master="1"> 79 +<script data-sn-horizontal-box-harmonizer="1"> 156 156 (function(){ 157 157 "use strict"; 158 158 159 - var PAGE_KIND="detail"; 160 - var PLACEHOLDER=true; 161 - var PLACEHOLDER_LABEL="IN VORBEREITUNG"; 162 - 163 163 var MOBILE_MAX=767; 164 - var ROW_TOLERANCE=6; 165 - var RESIZE_DEBOUNCE=220; 84 + var ROW_TOLERANCE=4; 85 + var MIN_W=150; 86 + var MIN_H=36; 166 166 167 167 var root= 168 168 document.getElementById("xwikicontent")|| ... ... @@ -172,1044 +172,212 @@ 172 172 173 173 if(!root)return; 174 174 175 - var managedHeight=new Set(); 176 - var managedMargin=new Set(); 177 - var originalHeight=new WeakMap(); 178 - var originalMargin=new WeakMap(); 96 + var managed=new Set(); 97 + var raf=0; 179 179 180 - var resizeTimer=0; 181 - var running=false; 182 - 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 - ] 244 - } 245 - ]; 246 - 247 - function num(value){ 248 - var n=parseFloat(value); 99 + function num(v){ 100 + var n=parseFloat(v); 249 249 return Number.isFinite(n)?n:0; 250 250 } 251 251 252 - function norm(value){ 253 - return String(value||"") 254 - .replace(/\s+/g," ") 255 - .trim() 256 - .toUpperCase(); 257 - } 258 - 259 259 function visible(el){ 260 260 if(!el||el.nodeType!==1)return false; 261 - 262 - var style=getComputedStyle(el); 263 - var rect=el.getBoundingClientRect(); 264 - 265 - return ( 266 - style.display!=="none"&& 267 - style.visibility!=="hidden"&& 268 - rect.width>20&& 269 - rect.height>4 270 - ); 106 + var s=getComputedStyle(el); 107 + if(s.display==="none"||s.visibility==="hidden"||Number(s.opacity)===0)return false; 108 + var r=el.getBoundingClientRect(); 109 + return r.width>=MIN_W&&r.height>=MIN_H; 271 271 } 272 272 273 - function saveStyle(el,map,property){ 274 - if(map.has(el))return; 275 - 276 - map.set(el,{ 277 - value:el.style.getPropertyValue(property), 278 - priority:el.style.getPropertyPriority(property) 279 - }); 280 - } 281 - 282 - function restoreStyle(el,map,property){ 283 - var original=map.get(el); 284 - 285 - if(original&&original.value){ 286 - el.style.setProperty( 287 - property, 288 - original.value, 289 - original.priority||"" 290 - ); 291 - }else{ 292 - el.style.removeProperty(property); 293 - } 294 - } 295 - 296 - function resetRuntime(){ 297 - managedHeight.forEach(function(el){ 298 - restoreStyle( 299 - el, 300 - originalHeight, 301 - "min-height" 302 - ); 303 - el.removeAttribute( 304 - "data-sn-master-equal-height" 305 - ); 306 - }); 307 - 308 - managedMargin.forEach(function(el){ 309 - restoreStyle( 310 - el, 311 - originalMargin, 312 - "margin-top" 313 - ); 314 - el.removeAttribute( 315 - "data-sn-master-first-row" 316 - ); 317 - }); 318 - 319 - managedHeight.clear(); 320 - managedMargin.clear(); 321 - } 322 - 323 - function themeFor(text){ 324 - var value=norm(text); 325 - 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]; 329 - 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; 342 - } 343 - 344 - /* ======================================================= 345 - PLACEHOLDER BADGE 346 - ======================================================= */ 347 - 348 - function applyPlaceholderBadge(){ 349 - if(!PLACEHOLDER)return; 350 - 351 - if( 352 - document.querySelector( 353 - ".sn-coming-soon-badge" 354 - ) 355 - ){ 356 - return; 357 - } 358 - 359 - var title= 360 - document.querySelector( 361 - "#document-title" 362 - )|| 363 - document.querySelector( 364 - "h1" 365 - ); 366 - 367 - if(!title)return; 368 - 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 112 + function excluded(el){ 113 + return !el.matches||el.matches( 114 + "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]" 383 383 ); 384 - 385 - title.appendChild( 386 - badge 387 - ); 388 388 } 389 389 390 - /* ======================================================= 391 - DETAIL PAGE OWN-ACCENT PROPAGATION 392 - ======================================================= */ 393 - 394 - function parseRGB(value){ 395 - var match=String(value||"").match( 396 - /rgba?\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)/i 397 - ); 398 - 399 - if(!match)return null; 400 - 401 - return [ 402 - Number(match[1]), 403 - Number(match[2]), 404 - Number(match[3]) 405 - ]; 118 + function namedLikeBox(el){ 119 + var c=typeof el.className==="string"?el.className:""; 120 + return /(^|[\s_-])(box|card|tile|panel|role|check|service|source|call|area|detail|resource|topic|warn|info)([\s_-]|$)/i.test(c); 406 406 } 407 407 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) 123 + function boxLike(el){ 124 + if(!visible(el)||excluded(el))return false; 125 + var s=getComputedStyle(el); 126 + var r=el.getBoundingClientRect(); 127 + var border= 128 + num(s.borderTopWidth)+num(s.borderRightWidth)+ 129 + num(s.borderBottomWidth)+num(s.borderLeftWidth); 130 + var radius=Math.max( 131 + num(s.borderTopLeftRadius),num(s.borderTopRightRadius), 132 + num(s.borderBottomLeftRadius),num(s.borderBottomRightRadius) 413 413 ); 134 + var bg=s.backgroundColor&&s.backgroundColor!=="rgba(0, 0, 0, 0)"&&s.backgroundColor!=="transparent"; 135 + var shadow=s.boxShadow&&s.boxShadow!=="none"; 136 + return namedLikeBox(el)||border>=1||(bg&&radius>=3)||(shadow&&r.width>=180); 414 414 } 415 415 416 - function paletteMatch(cssColor){ 417 - var rgb=parseRGB(cssColor); 139 + function pickTarget(child){ 140 + if(!visible(child))return null; 141 + if(boxLike(child))return child; 418 418 419 - if(!rgb)return null; 420 - 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 - ]; 427 - 428 - var best=null; 429 - var bestDistance=Infinity; 430 - 431 - palette.forEach(function(item){ 432 - var d=distance(rgb,item.rgb); 433 - 434 - if(d<bestDistance){ 435 - best=item; 436 - bestDistance=d; 437 - } 143 + var cr=child.getBoundingClientRect(); 144 + var q=[]; 145 + Array.from(child.children||[]).forEach(function(el){ 146 + q.push({el:el,depth:1}); 438 438 }); 439 439 440 - return bestDistance<=30 441 - ?best 442 - :null; 443 - } 149 + var best=null,bestScore=-1; 444 444 445 - function propagateDetailAccents(){ 446 - if(PAGE_KIND!=="detail")return; 151 + while(q.length){ 152 + var item=q.shift(); 153 + var el=item.el; 154 + if(!visible(el))continue; 447 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; 156 + var r=el.getBoundingClientRect(); 455 455 456 - var style=getComputedStyle(el); 457 - 458 - if( 459 - num(style.borderTopWidth)>=2 460 - ){ 461 - var match= 462 - paletteMatch( 463 - style.borderTopColor 464 - ); 465 - 466 - if(match){ 467 - el.style.setProperty( 468 - "border-left", 469 - "4px solid "+match.hex, 470 - "important" 471 - ); 158 + if(r.width>=cr.width*.72&&boxLike(el)){ 159 + var widthFit=1-Math.min(1,Math.abs(cr.width-r.width)/Math.max(1,cr.width)); 160 + var topFit=1-Math.min(1,Math.abs(cr.top-r.top)/80); 161 + var score=widthFit*5+topFit*2+Math.min(r.height,600)/600; 162 + if(score>bestScore){ 163 + best=el; 164 + bestScore=score; 472 472 } 473 473 } 474 - }); 475 475 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; 484 - 485 - el.style.setProperty( 486 - "border-left", 487 - "4px solid #e94b13", 488 - "important" 489 - ); 490 - }); 491 - 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; 499 - 500 - el.style.setProperty( 501 - "border-left", 502 - "4px solid #21b6d7", 503 - "important" 504 - ); 505 - }); 506 - } 507 - 508 - /* ======================================================= 509 - OVERVIEW SEMANTIC THEME PALETTE 510 - ======================================================= */ 511 - 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; 520 - 521 - return !Array.from( 522 - el.children||[] 523 - ).some(function(child){ 524 - return !!themeFor( 525 - child.textContent 526 - ); 527 - }); 528 - }); 529 - } 530 - 531 - function findOverviewCard(header){ 532 - var node=header.parentElement; 533 - var candidates=[]; 534 - 535 - while(node&&node!==root){ 536 - var rect=node.getBoundingClientRect(); 537 - var style=getComputedStyle(node); 538 - 539 - var border= 540 - num(style.borderTopWidth)+ 541 - num(style.borderRightWidth)+ 542 - num(style.borderBottomWidth)+ 543 - num(style.borderLeftWidth); 544 - 545 - if( 546 - rect.width>=220&& 547 - rect.width<=800&& 548 - rect.height>=120&& 549 - border>=1 550 - ){ 551 - candidates.push(node); 168 + if(item.depth<3){ 169 + Array.from(el.children||[]).forEach(function(next){ 170 + q.push({el:next,depth:item.depth+1}); 171 + }); 552 552 } 553 - 554 - node=node.parentElement; 555 555 } 556 556 557 - if(!candidates.length)return null; 558 - 559 - candidates.sort(function(a,b){ 560 - return ( 561 - b.getBoundingClientRect().height- 562 - a.getBoundingClientRect().height 563 - ); 564 - }); 565 - 566 - return candidates[0]; 175 + return best; 567 567 } 568 568 569 - function rowCandidates(link,card){ 570 - var result=[]; 571 - var cardRect= 572 - card.getBoundingClientRect(); 573 - 574 - var node=link; 575 - 576 - while(node&&node!==card){ 577 - if(visible(node)){ 578 - var rect= 579 - node.getBoundingClientRect(); 580 - 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 - } 591 - 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){ 608 - return ( 609 - num( 610 - getComputedStyle(el) 611 - .borderLeftWidth 612 - )>=1 613 - ); 614 - }); 615 - 616 - var pool= 617 - bordered.length 618 - ?bordered 619 - :candidates; 620 - 621 - pool.sort(function(a,b){ 622 - var ar= 623 - a.getBoundingClientRect(); 624 - 625 - var br= 626 - b.getBoundingClientRect(); 627 - 628 - return ( 629 - ar.left-br.left|| 630 - br.width-ar.width 631 - ); 178 + function reset(){ 179 + managed.forEach(function(el){ 180 + el.style.removeProperty("min-height"); 181 + el.removeAttribute("data-sn-equal-height-managed"); 632 632 }); 633 - 634 - return pool[0]||link; 183 + managed.clear(); 635 635 } 636 636 637 - function applyOverviewPalette(){ 638 - if(PAGE_KIND!=="overview"){ 639 - return []; 186 + function horizontalLayout(parent){ 187 + if(!visible(parent))return false; 188 + var s=getComputedStyle(parent); 189 + if(s.display==="grid"||s.display==="inline-grid")return true; 190 + if(s.display==="flex"||s.display==="inline-flex"){ 191 + return s.flexDirection==="row"||s.flexDirection==="row-reverse"; 640 640 } 641 - 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 - }; 656 - }) 657 - .filter(function(row){ 658 - return !!row.card; 659 - }); 660 - 661 - var unique=[]; 662 - var seenHeaders=new Set(); 663 - 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 - ); 679 - 680 - if(!seenHeaders.has(key)){ 681 - seenHeaders.add(key); 682 - unique.push(row); 683 - } 684 - }); 685 - 686 - unique.forEach(function(row){ 687 - var headerRect= 688 - row.el 689 - .getBoundingClientRect(); 690 - 691 - row.el.style.setProperty( 692 - "background", 693 - row.theme.bg, 694 - "important" 695 - ); 696 - 697 - row.el.style.setProperty( 698 - "color", 699 - row.theme.text, 700 - "important" 701 - ); 702 - 703 - row.el.style.setProperty( 704 - "text-align", 705 - "left", 706 - "important" 707 - ); 708 - 709 - row.el.style.setProperty( 710 - "word-spacing", 711 - "normal", 712 - "important" 713 - ); 714 - 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 - }); 736 - 737 - var stopTop= 738 - later.length 739 - ?later[0].el 740 - .getBoundingClientRect() 741 - .top 742 - :Infinity; 743 - 744 - Array.from( 745 - row.card.querySelectorAll("a") 746 - ).forEach(function(link){ 747 - if(!visible(link))return; 748 - 749 - var rect= 750 - link.getBoundingClientRect(); 751 - 752 - if( 753 - rect.top<= 754 - headerRect.bottom-2|| 755 - rect.top>= 756 - stopTop-2 757 - ){ 758 - return; 759 - } 760 - 761 - var candidates= 762 - rowCandidates( 763 - link, 764 - row.card 765 - ); 766 - 767 - var target= 768 - chooseOuterRow( 769 - candidates, 770 - link 771 - ); 772 - 773 - candidates.forEach(function(el){ 774 - el.style.setProperty( 775 - "border-left", 776 - "0 solid transparent", 777 - "important" 778 - ); 779 - }); 780 - 781 - target.style.setProperty( 782 - "border-left", 783 - "3px solid "+ 784 - row.theme.accent, 785 - "important" 786 - ); 787 - 788 - target.style.setProperty( 789 - "box-sizing", 790 - "border-box", 791 - "important" 792 - ); 793 - }); 794 - }); 795 - 796 - return unique; 193 + return false; 797 797 } 798 798 799 - /* ======================================================= 800 - OVERVIEW CARD HEIGHT + FIRST THEMATIC ROW 801 - ======================================================= */ 802 - 803 - function alignOverviewCards(headers){ 804 - if( 805 - PAGE_KIND!=="overview"|| 806 - window.innerWidth<=MOBILE_MAX 807 - ){ 808 - return; 809 - } 810 - 811 - var cards=[]; 812 - var seen=new Set(); 813 - 814 - headers.forEach(function(row){ 815 - if(!seen.has(row.card)){ 816 - seen.add(row.card); 817 - cards.push(row.card); 818 - } 819 - }); 820 - 821 - if(cards.length<2){ 822 - return; 823 - } 824 - 825 - // Group cards by actual top position. 196 + function rowGroups(entries){ 826 826 var groups=[]; 827 - 828 - cards.forEach(function(card){ 829 - var top= 830 - card.getBoundingClientRect().top; 831 - 198 + entries.slice().sort(function(a,b){ 199 + return a.rect.top-b.rect.top||a.rect.left-b.rect.left; 200 + }).forEach(function(entry){ 832 832 var group=null; 833 - 834 834 for(var i=0;i<groups.length;i++){ 835 - if( 836 - Math.abs( 837 - groups[i].top-top 838 - )<=ROW_TOLERANCE 839 - ){ 203 + if(Math.abs(groups[i].top-entry.rect.top)<=ROW_TOLERANCE){ 840 840 group=groups[i]; 841 841 break; 842 842 } 843 843 } 844 - 845 845 if(!group){ 846 - group={ 847 - top:top, 848 - cards:[] 849 - }; 209 + group={top:entry.rect.top,entries:[]}; 850 850 groups.push(group); 851 851 } 852 - 853 - group.cards.push(card); 212 + group.entries.push(entry); 854 854 }); 214 + return groups; 215 + } 855 855 856 - groups.forEach(function(group){ 857 - if(group.cards.length<2){ 858 - return; 859 - } 217 + function run(){ 218 + reset(); 860 860 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 - }); 220 + if(window.innerWidth<=MOBILE_MAX)return; 878 878 879 - return candidates.length 880 - ?candidates[0] 881 - :null; 882 - }); 222 + var parents=Array.from(root.querySelectorAll("*")).filter(function(el){ 223 + return el.children&&el.children.length>=2&&horizontalLayout(el); 224 + }); 883 883 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 - ); 226 + parents.forEach(function(parent){ 227 + var entries=[]; 903 903 904 - firstHeaders.forEach(function(row){ 905 - var relativeTop= 906 - row.el 907 - .getBoundingClientRect() 908 - .top- 909 - row.card 910 - .getBoundingClientRect() 911 - .top; 912 - 913 - var delta= 914 - targetTop-relativeTop; 915 - 916 - if(delta>1){ 917 - saveStyle( 918 - row.el, 919 - originalMargin, 920 - "margin-top" 921 - ); 922 - 923 - var current= 924 - num( 925 - getComputedStyle( 926 - row.el 927 - ).marginTop 928 - ); 929 - 930 - row.el.style.setProperty( 931 - "margin-top", 932 - ( 933 - current+delta 934 - )+"px" 935 - ); 936 - 937 - row.el.setAttribute( 938 - "data-sn-master-first-row", 939 - "1" 940 - ); 941 - 942 - managedMargin.add( 943 - row.el 944 - ); 945 - } 229 + Array.from(parent.children).forEach(function(child){ 230 + if(!visible(child))return; 231 + var target=pickTarget(child); 232 + if(!target)return; 233 + entries.push({ 234 + target:target, 235 + rect:target.getBoundingClientRect() 946 946 }); 947 - } 948 - 949 - var maxHeight=0; 950 - 951 - group.cards.forEach(function(card){ 952 - maxHeight= 953 - Math.max( 954 - maxHeight, 955 - card 956 - .getBoundingClientRect() 957 - .height 958 - ); 959 959 }); 960 960 961 - maxHeight= 962 - Math.ceil(maxHeight); 239 + if(entries.length<2)return; 963 963 964 - group.cards.forEach(function(card){ 965 - saveStyle( 966 - card, 967 - originalHeight, 968 - "min-height" 969 - ); 241 + rowGroups(entries).forEach(function(group){ 242 + if(group.entries.length<2)return; 970 970 971 - card.style.setProperty( 972 - "min-height", 973 - maxHeight+"px" 974 - ); 244 + var lefts=group.entries.map(function(e){return e.rect.left;}).sort(function(a,b){return a-b;}); 245 + if(lefts[lefts.length-1]-lefts[0]<80)return; 975 975 976 - card.setAttribute( 977 - "data-sn-master-equal-height", 978 - "1" 979 - ); 247 + var targets=[]; 248 + var seen=new Set(); 980 980 981 - managedHeight.add( 982 - card 983 - ); 984 - }); 985 - }); 986 - } 987 - 988 - /* ======================================================= 989 - DETAIL GRID EQUAL HEIGHT, DESKTOP ONLY 990 - ======================================================= */ 991 - 992 - function equaliseDetailGrids(){ 993 - if( 994 - PAGE_KIND!=="detail"|| 995 - window.innerWidth<=MOBILE_MAX 996 - ){ 997 - return; 998 - } 999 - 1000 - var selectors=[ 1001 - ".arsn-grid", 1002 - ".arsn-grid-2", 1003 - ".arsn-grid-3", 1004 - ".dmp-grid", 1005 - ".ido-grid", 1006 - ".pp-grid" 1007 - ]; 1008 - 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); 1017 - 1018 - if(children.length<2){ 1019 - return; 1020 - } 1021 - 1022 - var groups=[]; 1023 - 1024 - children.forEach(function(child){ 1025 - var top= 1026 - child 1027 - .getBoundingClientRect() 1028 - .top; 1029 - 1030 - var group=null; 1031 - 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 - } 250 + group.entries.forEach(function(e){ 251 + if(!seen.has(e.target)){ 252 + seen.add(e.target); 253 + targets.push(e.target); 1041 1041 } 255 + }); 1042 1042 1043 - if(!group){ 1044 - group={ 1045 - top:top, 1046 - items:[] 1047 - }; 1048 - groups.push(group); 1049 - } 257 + if(targets.length<2)return; 1050 1050 1051 - group.items.push(child); 259 + var max=0; 260 + targets.forEach(function(el){ 261 + max=Math.max(max,el.getBoundingClientRect().height); 1052 1052 }); 1053 1053 1054 - groups.forEach(function(group){ 1055 - if(group.items.length<2){ 1056 - return; 1057 - } 264 + max=Math.ceil(max); 265 + if(max<MIN_H)return; 1058 1058 1059 - var maxHeight=0; 1060 - 1061 - group.items.forEach(function(item){ 1062 - maxHeight= 1063 - Math.max( 1064 - maxHeight, 1065 - item 1066 - .getBoundingClientRect() 1067 - .height 1068 - ); 1069 - }); 1070 - 1071 - maxHeight= 1072 - Math.ceil(maxHeight); 1073 - 1074 - group.items.forEach(function(item){ 1075 - saveStyle( 1076 - item, 1077 - originalHeight, 1078 - "min-height" 1079 - ); 1080 - 1081 - item.style.setProperty( 1082 - "min-height", 1083 - maxHeight+"px" 1084 - ); 1085 - 1086 - item.setAttribute( 1087 - "data-sn-master-equal-height", 1088 - "1" 1089 - ); 1090 - 1091 - managedHeight.add(item); 1092 - }); 267 + targets.forEach(function(el){ 268 + el.style.setProperty("min-height",max+"px"); 269 + el.setAttribute("data-sn-equal-height-managed","1"); 270 + managed.add(el); 1093 1093 }); 1094 1094 }); 1095 1095 }); 1096 1096 } 1097 1097 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 - } 1125 - }finally{ 1126 - running=false; 1127 - } 276 + function schedule(){ 277 + if(raf)cancelAnimationFrame(raf); 278 + raf=requestAnimationFrame(function(){ 279 + raf=requestAnimationFrame(function(){ 280 + raf=0; 281 + run(); 282 + }); 283 + }); 1128 1128 } 1129 1129 1130 - function onResize(){ 1131 - if(resizeTimer){ 1132 - clearTimeout( 1133 - resizeTimer 1134 - ); 1135 - } 286 + addEventListener("resize",schedule,{passive:true}); 287 + addEventListener("load",schedule,{once:true}); 1136 1136 1137 - resizeTimer= 1138 - setTimeout( 1139 - function(){ 1140 - resizeTimer=0; 1141 - run(); 1142 - }, 1143 - RESIZE_DEBOUNCE 1144 - ); 1145 - } 289 + root.addEventListener("click",function(){ 290 + setTimeout(schedule,0); 291 + },true); 1146 1146 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 - 1169 - var images= 1170 - Array.from( 1171 - root.querySelectorAll("img") 1172 - ); 1173 - 1174 - await Promise.all( 1175 - images.map(function(img){ 1176 - if(img.complete){ 1177 - return Promise.resolve(); 1178 - } 1179 - 1180 - return new Promise(function(resolve){ 1181 - var done=function(){ 1182 - resolve(); 1183 - }; 1184 - 1185 - img.addEventListener( 1186 - "load", 1187 - done, 1188 - {once:true} 1189 - ); 1190 - 1191 - img.addEventListener( 1192 - "error", 1193 - done, 1194 - {once:true} 1195 - ); 1196 - }); 1197 - }) 1198 - ); 1199 - 1200 - run(); 293 + if(document.fonts&&document.fonts.ready){ 294 + document.fonts.ready.then(schedule); 1201 1201 } 1202 1202 1203 - window.addEventListener( 1204 - "resize", 1205 - onResize, 1206 - {passive:true} 1207 - ); 1208 - 1209 - waitForReady(); 297 + schedule(); 298 + setTimeout(schedule,250); 299 + setTimeout(schedule,900); 1210 1210 })(); 1211 1211 </script> 1212 - 1213 -<!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_END --> 302 +<!-- SN_HORIZONTAL_BOX_HARMONIZER_END --> 1214 1214 {{/html}} 1215 1215