Changes for page Project Planning & Organisation
Last modified by Veronika Kocher on Friday, 04 Sep 2026 14:45
From version 9.7
edited by Veronika Kocher
on Thursday, 03 Sep 2026 14:15
on Thursday, 03 Sep 2026 14:15
Change comment:
There is no comment for this version
To version 9.4
edited by Veronika Kocher
on Thursday, 03 Sep 2026 9:34
on Thursday, 03 Sep 2026 9:34
Change comment:
There is no comment for this version
Summary
-
Page properties (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -426,132 +426,23 @@ 426 426 {{/html}} 427 427 428 428 {{html clean="false"}} 429 -<!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_START --> 430 - 431 -<style data-sn-service-navigator-master="1"> 432 -/* ========================================================= 433 - MASTER TYPOGRAPHY 434 - ========================================================= */ 435 -#xwikicontent h1, 436 -#xwikicontent h2, 437 -#xwikicontent h3, 438 -#xwikicontent h4, 439 -#xwikicontent h5, 440 -#xwikicontent h6, 441 -#xwikicontent .box-title, 442 -#xwikicontent [role="heading"], 443 -#xwikicontent h1 a, 444 -#xwikicontent h2 a, 445 -#xwikicontent h3 a, 446 -#xwikicontent h4 a, 447 -#xwikicontent h5 a, 448 -#xwikicontent h6 a, 449 -#xwikicontent .box-title a, 450 -#xwikicontent [role="heading"] a{ 451 - text-align:left!important; 452 - text-justify:auto!important; 453 - word-spacing:normal!important; 454 -} 455 - 456 -/* ========================================================= 457 - COMING SOON / IN VORBEREITUNG 458 - ========================================================= */ 459 -.sn-coming-soon-badge{ 460 - display:inline-block; 461 - vertical-align:middle; 462 - margin-left:10px; 463 - padding:4px 8px; 464 - border-radius:14px; 465 - border:1px solid #efd9cc; 466 - background:#fff4ee; 467 - color:#8a4d36; 468 - font-size:11px; 469 - font-weight:700; 470 - letter-spacing:.055em; 471 - line-height:1.2; 472 - white-space:nowrap; 473 -} 474 - 475 -/* ========================================================= 476 - NATIVE / DETAIL CALLOUT GEOMETRY 477 - Preserve existing backgrounds. 478 - ========================================================= */ 479 -#xwikicontent .arsn-info, 480 -#xwikicontent .dmp-info, 481 -#xwikicontent .ido-info, 482 -#xwikicontent .pp-info, 483 -#xwikicontent .infomessage{ 484 - box-sizing:border-box!important; 485 - border-left:4px solid #21b6d7!important; 486 - border-radius:8px; 487 - text-align:left!important; 488 - word-spacing:normal!important; 489 -} 490 - 491 -#xwikicontent .arsn-warn, 492 -#xwikicontent .dmp-warn, 493 -#xwikicontent .ido-warn, 494 -#xwikicontent .pp-warn, 495 -#xwikicontent .warn, 496 -#xwikicontent .warning, 497 -#xwikicontent .warningmessage, 498 -#xwikicontent .errormessage{ 499 - box-sizing:border-box!important; 500 - border-left:4px solid #e94b13!important; 501 - border-radius:8px; 502 - text-align:left!important; 503 - word-spacing:normal!important; 504 -} 505 - 506 -[data-sn-master-equal-height], 507 -[data-sn-master-first-row]{ 429 +<!-- SN_HORIZONTAL_BOX_HARMONIZER_START --> 430 +<style data-sn-horizontal-box-harmonizer="4"> 431 +[data-sn-equal-height-managed], 432 +[data-sn-first-section-aligned]{ 508 508 box-sizing:border-box; 509 509 } 510 - 511 -/* ========================================================= 512 - FULL-WIDTH THREE-LINE NUMBER / TITLE / SUBTITLE BLOCKS 513 - ========================================================= */ 514 -#xwikicontent .arsn-area-label[data-sn-three-line="1"]{ 515 - display:grid!important; 516 - grid-template-columns:minmax(0,1fr)!important; 517 - grid-auto-rows:auto!important; 518 - width:100%!important; 519 - max-width:none!important; 520 - box-sizing:border-box!important; 521 - justify-items:start!important; 522 - align-items:start!important; 523 - gap:2px!important; 524 - text-align:left!important; 525 - text-align-last:left!important; 526 - text-justify:auto!important; 527 - word-spacing:normal!important; 528 - white-space:normal!important; 529 -} 530 -#xwikicontent .arsn-area-label[data-sn-three-line="1"] > .arsn-area-number, 531 -#xwikicontent .arsn-area-label[data-sn-three-line="1"] > .sn-area-label-title, 532 -#xwikicontent .arsn-area-label[data-sn-three-line="1"] > .arsn-area-action{ 533 - display:block!important; 534 - width:100%!important; 535 - margin:0!important; 536 - text-align:left!important; 537 - text-align-last:left!important; 538 - text-justify:auto!important; 539 - word-spacing:normal!important; 540 - white-space:normal!important; 541 -} 542 542 </style> 543 - 544 -<script data-sn-service-navigator-master="1"> 436 +<script data-sn-horizontal-box-harmonizer="4"> 545 545 (function(){ 546 546 "use strict"; 547 547 548 - var PAGE_KIND="detail"; 549 - var PLACEHOLDER=false; 550 - var PLACEHOLDER_LABEL="COMING SOON"; 551 - 552 552 var MOBILE_MAX=767; 553 553 var ROW_TOLERANCE=6; 554 - var RESIZE_DEBOUNCE=220; 442 + var MIN_W=150; 443 + var MIN_H=36; 444 + var MAX_PARENT_CHILDREN=16; 445 + var SEARCH_DEPTH=5; 555 555 556 556 var root= 557 557 document.getElementById("xwikicontent")|| ... ... @@ -561,105 +561,93 @@ 561 561 562 562 if(!root)return; 563 563 564 - var managedHeight=new Set(); 565 - var managedMargin=new Set(); 566 - var originalHeight=new WeakMap(); 567 - var originalMargin=new WeakMap(); 455 + var heightManaged=new Set(); 456 + var sectionManaged=new Set(); 457 + var originalMinHeight=new WeakMap(); 458 + var originalMarginTop=new WeakMap(); 459 + var raf=0; 568 568 569 - var resizeTimer=0; 570 - var running=false; 461 + function num(v){ 462 + var n=parseFloat(v); 463 + return Number.isFinite(n)?n:0; 464 + } 571 571 572 - var THEMES=[ 573 - { 574 - name:"BLUE", 575 - accent:"#21b6d7", 576 - bg:"#eaf7fb", 577 - text:"#315d68", 578 - labels:[ 579 - "HIER STARTEN", 580 - "ENTSCHEIDEN", 581 - "ÜBERPRÜFEN & ANPASSEN", 582 - "START HERE", 583 - "DECIDE", 584 - "REVIEW & ADAPT" 585 - ] 586 - }, 587 - { 588 - name:"RED", 589 - accent:"#e94b13", 590 - bg:"#fff1ec", 591 - text:"#8a4d36", 592 - labels:[ 593 - "PLANEN & ORGANISIEREN", 594 - "ORGANISIEREN & DOKUMENTIEREN", 595 - "PUBLIZIEREN & PRÄSENTIEREN", 596 - "PLAN & ORGANISE", 597 - "PLAN & ORGANIZE", 598 - "ORGANISE & DOCUMENT", 599 - "ORGANIZE & DOCUMENT", 600 - "PUBLISH & PRESENT" 601 - ] 602 - }, 603 - { 604 - name:"YELLOW", 605 - accent:"#f0aa00", 606 - bg:"#fff8e7", 607 - text:"#785b17", 608 - labels:[ 609 - "SCHÜTZEN & KLÄREN", 610 - "STANDARDISIEREN & IDENTIFIZIEREN", 611 - "ÖFFNEN, NACHNUTZEN & AUFFINDBAR MACHEN", 612 - "PROTECT & CLARIFY", 613 - "STANDARDISE & IDENTIFY", 614 - "STANDARDIZE & IDENTIFY", 615 - "OPEN, REUSE & MAKE FINDABLE" 616 - ] 617 - }, 618 - { 619 - name:"GREEN", 620 - accent:"#38b76a", 621 - bg:"#edf9f1", 622 - text:"#3f7451", 623 - labels:[ 624 - "INFRASTRUKTUR EINRICHTEN", 625 - "INFRASTRUKTUR & ZUSAMMENARBEIT EINRICHTEN", 626 - "SPEICHERN & ZUGRIFF STEUERN", 627 - "REPOSITORIUM, ERHALTEN & ÜBERGEBEN", 628 - "SET UP INFRASTRUCTURE", 629 - "SET UP INFRASTRUCTURE & COLLABORATION", 630 - "STORE & CONTROL ACCESS", 631 - "REPOSITORY, PRESERVE & HAND OVER" 632 - ] 466 + function visible(el,minW,minH){ 467 + if(!el||el.nodeType!==1)return false; 468 + 469 + var s=getComputedStyle(el); 470 + 471 + if( 472 + s.display==="none"|| 473 + s.visibility==="hidden"|| 474 + Number(s.opacity)===0 475 + ){ 476 + return false; 633 633 } 634 - ]; 635 635 636 - function num(value){ 637 - var n=parseFloat(value); 638 - return Number.isFinite(n)?n:0; 479 + var r=el.getBoundingClientRect(); 480 + 481 + return ( 482 + r.width>=(minW||1)&& 483 + r.height>=(minH||1) 484 + ); 639 639 } 640 640 641 - function norm(value){ 642 - return String(value||"") 643 - .replace(/\s+/g," ") 644 - .trim() 645 - .toUpperCase(); 487 + function excluded(el){ 488 + return ( 489 + !el.matches|| 490 + el.matches( 491 + "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]" 492 + ) 493 + ); 646 646 } 647 647 648 - function visible(el){ 649 - if(!el||el.nodeType!==1)return false; 496 + function namedLikeBox(el){ 497 + var c= 498 + typeof el.className==="string" 499 + ? el.className 500 + : ""; 650 650 651 - var style=getComputedStyle(el);652 - var rect=el.getBoundingClientRect();502 + return /(^|[s_-])(box|card|tile|panel|role|check|service|source|call|area|detail|resource|topic|warn|info)([s_-]|$)/i.test(c); 503 + } 653 653 505 + function boxLike(el){ 506 + if(!visible(el,MIN_W,MIN_H)||excluded(el))return false; 507 + 508 + var s=getComputedStyle(el); 509 + var r=el.getBoundingClientRect(); 510 + 511 + var border= 512 + num(s.borderTopWidth)+ 513 + num(s.borderRightWidth)+ 514 + num(s.borderBottomWidth)+ 515 + num(s.borderLeftWidth); 516 + 517 + var radius=Math.max( 518 + num(s.borderTopLeftRadius), 519 + num(s.borderTopRightRadius), 520 + num(s.borderBottomLeftRadius), 521 + num(s.borderBottomRightRadius) 522 + ); 523 + 524 + var bg= 525 + s.backgroundColor&& 526 + s.backgroundColor!=="rgba(0, 0, 0, 0)"&& 527 + s.backgroundColor!=="transparent"; 528 + 529 + var shadow= 530 + s.boxShadow&& 531 + s.boxShadow!=="none"; 532 + 654 654 return ( 655 - style.display!=="none"&&656 - style.visibility!=="hidden"&&657 - r ect.width>20&&658 - r ect.height>4534 + namedLikeBox(el)|| 535 + border>=1|| 536 + (bg&&radius>=3)|| 537 + (shadow&&r.width>=180) 659 659 ); 660 660 } 661 661 662 - function save Style(el,map,property){541 + function saveOriginal(el,map,property){ 663 663 if(map.has(el))return; 664 664 665 665 map.set(el,{ ... ... @@ -668,7 +668,7 @@ 668 668 }); 669 669 } 670 670 671 - function restore Style(el,map,property){550 + function restoreOriginal(el,map,property){ 672 672 var original=map.get(el); 673 673 674 674 if(original&&original.value){ ... ... @@ -682,470 +682,247 @@ 682 682 } 683 683 } 684 684 685 - function reset Runtime(){686 - managedHeight.forEach(function(el){687 - restore Style(564 + function reset(){ 565 + heightManaged.forEach(function(el){ 566 + restoreOriginal( 688 688 el, 689 - originalHeight, 568 + originalMinHeight, 690 690 "min-height" 691 691 ); 571 + 692 692 el.removeAttribute( 693 - "data-sn- master-equal-height"573 + "data-sn-equal-height-managed" 694 694 ); 695 695 }); 696 696 697 - managedMargin.forEach(function(el){698 - restore Style(577 + sectionManaged.forEach(function(el){ 578 + restoreOriginal( 699 699 el, 700 - originalMargin, 580 + originalMarginTop, 701 701 "margin-top" 702 702 ); 583 + 703 703 el.removeAttribute( 704 - "data-sn- master-first-row"585 + "data-sn-first-section-aligned" 705 705 ); 706 706 }); 707 707 708 - managedHeight.clear();709 - managedMargin.clear();589 + heightManaged.clear(); 590 + sectionManaged.clear(); 710 710 } 711 711 712 - function themeFor(text){713 - v ar value=norm(text);593 + function pickTarget(child){ 594 + if(!visible(child,MIN_W,MIN_H))return null; 714 714 715 - for(var i=0;i<THEMES.length;i++){ 716 - for(var j=0;j<THEMES[i].labels.length;j++){ 717 - var label=THEMES[i].labels[j]; 718 - 719 - if( 720 - value===label|| 721 - value.indexOf(label+" ")===0|| 722 - value.indexOf(label+" -")===0|| 723 - value.indexOf(label+" ·")===0 724 - ){ 725 - return THEMES[i]; 726 - } 727 - } 596 + if(boxLike(child)){ 597 + return child; 728 728 } 729 729 730 - retu rnnull;731 - }600 + var cr=child.getBoundingClientRect(); 601 + var q=[]; 732 732 733 - /* ======================================================= 734 - BORDERLESS FILLED RED/ORANGE CTA BUTTONS 735 - ======================================================= */ 736 - 737 - function colourDistance(a,b){ 738 - return Math.sqrt( 739 - Math.pow(a[0]-b[0],2)+ 740 - Math.pow(a[1]-b[1],2)+ 741 - Math.pow(a[2]-b[2],2) 742 - ); 743 - } 744 - 745 - function makeFilledRedOrangeCTAsBorderless(){ 746 - var RED_ORANGE=[233,75,19]; 747 - 748 - Array.from( 749 - root.querySelectorAll( 750 - 'a,button,[role="button"],input[type="submit"],input[type="button"]' 751 - ) 752 - ).forEach(function(el){ 753 - if(!visible(el))return; 754 - 755 - var style=getComputedStyle(el); 756 - var rgb=parseRGB(style.backgroundColor); 757 - 758 - if(!rgb)return; 759 - 760 - if( 761 - colourDistance( 762 - rgb, 763 - RED_ORANGE 764 - )>55 765 - ){ 766 - return; 767 - } 768 - 769 - var rect=el.getBoundingClientRect(); 770 - 771 - if( 772 - rect.width<80|| 773 - rect.height<24 774 - ){ 775 - return; 776 - } 777 - 778 - el.style.setProperty( 779 - "border", 780 - "none", 781 - "important" 782 - ); 783 - 784 - el.style.setProperty( 785 - "border-left", 786 - "none", 787 - "important" 788 - ); 789 - 790 - el.style.setProperty( 791 - "border-top", 792 - "none", 793 - "important" 794 - ); 795 - 796 - el.style.setProperty( 797 - "border-right", 798 - "none", 799 - "important" 800 - ); 801 - 802 - el.style.setProperty( 803 - "border-bottom", 804 - "none", 805 - "important" 806 - ); 807 - 808 - el.style.setProperty( 809 - "box-shadow", 810 - "none", 811 - "important" 812 - ); 603 + Array.from(child.children||[]).forEach(function(el){ 604 + q.push({el:el,depth:1}); 813 813 }); 814 - } 815 815 816 - /* ======================================================= 817 - FULL-WIDTH THREE-LINE AREA LABELS 818 - ======================================================= */ 607 + var best=null; 608 + var bestScore=-Infinity; 819 819 820 - function compactText(value){ 821 - return String(value||"") 822 - .replace(/\s+/g," ") 823 - .trim(); 824 - } 610 + while(q.length){ 611 + var item=q.shift(); 612 + var el=item.el; 825 825 826 - function makeThreeLineAreaLabels(){ 827 - Array.from( 828 - root.querySelectorAll( 829 - ".arsn-area-label" 830 - ) 831 - ).forEach(function(label){ 832 - if( 833 - label.getAttribute( 834 - "data-sn-three-line" 835 - )==="1" 836 - ){ 837 - return; 838 - } 614 + if(!visible(el,MIN_W,MIN_H))continue; 839 839 840 - var number= 841 - label.querySelector( 842 - ":scope > .arsn-area-number" 843 - ); 616 + var r=el.getBoundingClientRect(); 844 844 845 - var action= 846 - label.querySelector( 847 - ":scope > .arsn-area-action" 848 - ); 849 - 850 850 if( 851 - !number||852 - !action619 + r.width>=cr.width*.68&& 620 + boxLike(el) 853 853 ){ 854 - return; 855 - } 622 + var widthFit= 623 + 1-Math.min( 624 + 1, 625 + Math.abs(cr.width-r.width)/ 626 + Math.max(1,cr.width) 627 + ); 856 856 857 - var clone= 858 - label.cloneNode(true); 629 + var topFit= 630 + 1-Math.min( 631 + 1, 632 + Math.abs(cr.top-r.top)/100 633 + ); 859 859 860 - var cloneNumber= 861 - clone.querySelector( 862 - ":scope > .arsn-area-number" 863 - ); 635 + var score= 636 + widthFit*6+ 637 + topFit*3+ 638 + Math.min(r.height,900)/450+ 639 + Math.min(r.width*r.height,900000)/900000; 864 864 865 - var cloneAction= 866 - clone.querySelector( 867 - ":scope > .arsn-area-action" 868 - ); 869 - 870 - if(cloneNumber){ 871 - cloneNumber.remove(); 641 + if(score>bestScore){ 642 + best=el; 643 + bestScore=score; 644 + } 872 872 } 873 873 874 - if(cloneAction){ 875 - cloneAction.remove(); 647 + if(item.depth<SEARCH_DEPTH){ 648 + Array.from(el.children||[]).forEach(function(next){ 649 + q.push({ 650 + el:next, 651 + depth:item.depth+1 652 + }); 653 + }); 876 876 } 655 + } 877 877 878 - var titleText= 879 - compactText( 880 - clone.textContent 881 - ); 657 + return best; 658 + } 882 882 883 - if(!titleText){ 884 - return; 885 - } 660 + function groupsByVisualRow(entries){ 661 + var groups=[]; 886 886 887 - var numberNode= 888 - number.cloneNode(true); 889 - 890 - var actionNode= 891 - action.cloneNode(true); 892 - 893 - var titleNode= 894 - document.createElement( 895 - "span" 663 + entries 664 + .slice() 665 + .sort(function(a,b){ 666 + return ( 667 + a.rect.top-b.rect.top|| 668 + a.rect.left-b.rect.left 896 896 ); 670 + }) 671 + .forEach(function(entry){ 672 + var group=null; 897 897 898 - titleNode.className= 899 - "sn-area-label-title"; 674 + for(var i=0;i<groups.length;i++){ 675 + if( 676 + Math.abs( 677 + groups[i].top- 678 + entry.rect.top 679 + )<=ROW_TOLERANCE 680 + ){ 681 + group=groups[i]; 682 + break; 683 + } 684 + } 900 900 901 - titleNode.textContent= 902 - titleText; 686 + if(!group){ 687 + group={ 688 + top:entry.rect.top, 689 + entries:[] 690 + }; 691 + groups.push(group); 692 + } 903 903 904 - while(label.firstChild){ 905 - label.removeChild( 906 - label.firstChild 907 - ); 908 - } 694 + group.entries.push(entry); 695 + }); 909 909 910 - label.appendChild( 911 - numberNode 912 - ); 913 - 914 - label.appendChild( 915 - titleNode 916 - ); 917 - 918 - label.appendChild( 919 - actionNode 920 - ); 921 - 922 - label.setAttribute( 923 - "data-sn-three-line", 924 - "1" 925 - ); 926 - 927 - var head= 928 - label.closest( 929 - ".arsn-area-head" 930 - ); 931 - 932 - if(head){ 933 - head.style.setProperty( 934 - "width", 935 - "100%", 936 - "important" 937 - ); 938 - 939 - head.style.setProperty( 940 - "max-width", 941 - "100%", 942 - "important" 943 - ); 944 - 945 - head.style.setProperty( 946 - "box-sizing", 947 - "border-box", 948 - "important" 949 - ); 950 - } 951 - }); 697 + return groups; 952 952 } 953 953 954 - /* ======================================================= 955 - PLACEHOLDER BADGE 956 - ======================================================= */ 700 + function validHorizontalGroup(group){ 701 + if(group.entries.length<2)return false; 957 957 958 - function applyPlaceholderBadge(){ 959 - if(!PLACEHOLDER)return; 703 + var lefts= 704 + group.entries 705 + .map(function(e){return e.rect.left;}) 706 + .sort(function(a,b){return a-b;}); 960 960 961 961 if( 962 - document.querySelector(963 - ".sn-coming-soon-badge"964 - )709 + lefts[lefts.length-1]- 710 + lefts[0]< 711 + 80 965 965 ){ 966 - return; 713 + return false; 967 967 } 968 968 969 - var title= 970 - document.querySelector( 971 - "#document-title" 972 - )|| 973 - document.querySelector( 974 - "h1" 975 - ); 716 + var widths= 717 + group.entries 718 + .map(function(e){return e.rect.width;}) 719 + .filter(function(w){return w>0;}); 976 976 977 - if( !title)return;721 + if(widths.length<2)return false; 978 978 979 - var badge= 980 - document.createElement( 981 - "span" 982 - ); 723 + var minWidth=Math.min.apply(Math,widths); 724 + var maxWidth=Math.max.apply(Math,widths); 983 983 984 - badge.className= 985 - "sn-coming-soon-badge"; 986 - 987 - badge.textContent= 988 - PLACEHOLDER_LABEL; 989 - 990 - badge.setAttribute( 991 - "aria-label", 992 - PLACEHOLDER_LABEL 726 + return ( 727 + maxWidth/ 728 + Math.max(1,minWidth)<= 729 + 1.9 993 993 ); 731 + } 994 994 995 - title.appendChild( 996 - badge 997 - ); 733 + function normalizeText(text){ 734 + return String(text||"") 735 + .replace(/s+/g," ") 736 + .trim() 737 + .toUpperCase(); 998 998 } 999 999 1000 - /* ======================================================= 1001 - DETAIL PAGE OWN-ACCENT PROPAGATION 1002 - ======================================================= */ 740 + function exactKnownFirstSection(el){ 741 + var text=normalizeText(el.textContent); 1003 1003 1004 - function parseRGB(value){ 1005 - var match=String(value||"").match( 1006 - /rgba?\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)/i 743 + return ( 744 + text==="HIER STARTEN"|| 745 + text==="ORGANISIEREN & DOKUMENTIEREN"|| 746 + text==="ENTSCHEIDEN"|| 747 + text==="START HERE"|| 748 + text==="GET STARTED"|| 749 + text==="ORGANISE & DOCUMENT"|| 750 + text==="ORGANIZE & DOCUMENT"|| 751 + text==="DECIDE" 1007 1007 ); 1008 - 1009 - if(!match)return null; 1010 - 1011 - return [ 1012 - Number(match[1]), 1013 - Number(match[2]), 1014 - Number(match[3]) 1015 - ]; 1016 1016 } 1017 1017 1018 - function distance(a,b){ 1019 - return Math.sqrt( 1020 - Math.pow(a[0]-b[0],2)+ 1021 - Math.pow(a[1]-b[1],2)+ 1022 - Math.pow(a[2]-b[2],2) 1023 - ); 1024 - } 755 + function visuallyFirstSectionBar(card){ 756 + var cardRect=card.getBoundingClientRect(); 757 + var candidates=[]; 1025 1025 1026 - function paletteMatch(cssColor){ 1027 - var rgb=parseRGB(cssColor); 1028 - 1029 - if(!rgb)return null; 1030 - 1031 - var palette=[ 1032 - {hex:"#21b6d7",rgb:[33,182,215]}, 1033 - {hex:"#e94b13",rgb:[233,75,19]}, 1034 - {hex:"#f0aa00",rgb:[240,170,0]}, 1035 - {hex:"#38b76a",rgb:[56,183,106]} 1036 - ]; 1037 - 1038 - var best=null; 1039 - var bestDistance=Infinity; 1040 - 1041 - palette.forEach(function(item){ 1042 - var d=distance(rgb,item.rgb); 1043 - 1044 - if(d<bestDistance){ 1045 - best=item; 1046 - bestDistance=d; 1047 - } 1048 - }); 1049 - 1050 - return bestDistance<=30 1051 - ?best 1052 - :null; 1053 - } 1054 - 1055 - function propagateDetailAccents(){ 1056 - if(PAGE_KIND!=="detail")return; 1057 - 1058 1058 Array.from( 1059 - root.querySelectorAll( 1060 - ".arsn-call,.dmp-call,.ido-call,.pp-call,"+ 1061 - ".arsn-source,.dmp-source,.ido-source,.pp-source" 760 + card.querySelectorAll( 761 + "div,p,span,strong,h3,h4,h5,h6" 1062 1062 ) 1063 1063 ).forEach(function(el){ 1064 - if(!visible(el))return; 764 + if(!visible(el,20,6))return; 765 + if(excluded(el))return; 1065 1065 1066 - var style=getComputedStyle(el); 767 + var r=el.getBoundingClientRect(); 768 + var relativeTop=r.top-cardRect.top; 1067 1067 1068 1068 if( 1069 - num(style.borderTopWidth)>=2 771 + relativeTop<45|| 772 + relativeTop>cardRect.height*.72 1070 1070 ){ 1071 - var match= 1072 - paletteMatch( 1073 - style.borderTopColor 1074 - ); 1075 - 1076 - if(match){ 1077 - el.style.setProperty( 1078 - "border-left", 1079 - "4px solid "+match.hex, 1080 - "important" 1081 - ); 1082 - } 774 + return; 1083 1083 } 1084 - }); 1085 1085 1086 - // Warning families: explicit safety override. 1087 - Array.from( 1088 - root.querySelectorAll( 1089 - ".arsn-warn,.dmp-warn,.ido-warn,.pp-warn,"+ 1090 - ".warn,.warning,.warningmessage,.errormessage" 1091 - ) 1092 - ).forEach(function(el){ 1093 - if(!visible(el))return; 777 + var widthRatio= 778 + r.width/ 779 + Math.max(1,cardRect.width); 1094 1094 1095 - el.style.setProperty( 1096 - "border-left", 1097 - "4px solid #e94b13", 1098 - "important" 1099 - ); 1100 - }); 781 + if( 782 + widthRatio<.55|| 783 + widthRatio>1.05|| 784 + r.height>54 785 + ){ 786 + return; 787 + } 1101 1101 1102 - // Info families: explicit orientation override. 1103 - Array.from( 1104 - root.querySelectorAll( 1105 - ".arsn-info,.dmp-info,.ido-info,.pp-info,.infomessage" 1106 - ) 1107 - ).forEach(function(el){ 1108 - if(!visible(el))return; 789 + var text=normalizeText(el.textContent); 1109 1109 1110 - el.style.setProperty( 1111 - "border-left", 1112 - "4px solid #21b6d7", 1113 - "important" 1114 - ); 1115 - }); 1116 - } 791 + if( 792 + text.length<2|| 793 + text.length>90 794 + ){ 795 + return; 796 + } 1117 1117 1118 - /* ======================================================= 1119 - OVERVIEW SEMANTIC THEME PALETTE 1120 - ======================================================= */ 798 + var style=getComputedStyle(el); 1121 1121 1122 - function smallestThemeHeaders(){ 1123 - return Array.from( 1124 - root.querySelectorAll( 1125 - "div,span,p,strong,h3,h4,h5,h6" 1126 - ) 1127 - ).filter(function(el){ 1128 - if(!visible(el))return false; 1129 - if(!themeFor(el.textContent))return false; 800 + var bg= 801 + style.backgroundColor&& 802 + style.backgroundColor!=="rgba(0, 0, 0, 0)"&& 803 + style.backgroundColor!=="transparent"; 1130 1130 1131 - return !Array.from( 1132 - el.children||[] 1133 - ).some(function(child){ 1134 - return !!themeFor( 1135 - child.textContent 1136 - ); 1137 - }); 1138 - }); 1139 - } 1140 - 1141 - function findOverviewCard(header){ 1142 - var node=header.parentElement; 1143 - var candidates=[]; 1144 - 1145 - while(node&&node!==root){ 1146 - var rect=node.getBoundingClientRect(); 1147 - var style=getComputedStyle(node); 1148 - 1149 1149 var border= 1150 1150 num(style.borderTopWidth)+ 1151 1151 num(style.borderRightWidth)+ ... ... @@ -1152,677 +1152,315 @@ 1152 1152 num(style.borderBottomWidth)+ 1153 1153 num(style.borderLeftWidth); 1154 1154 1155 - if( 1156 - rect.width>=220&& 1157 - rect.width<=800&& 1158 - rect.height>=120&& 1159 - border>=1 1160 - ){ 1161 - candidates.push(node); 1162 - } 811 + var mostlyUpper= 812 + text.length>=3&& 813 + text===text.toUpperCase(); 1163 1163 1164 - node=node.parentElement; 1165 - } 815 + var exact=exactKnownFirstSection(el); 1166 1166 1167 - if(!candidates.length)return null; 817 + var score= 818 + (exact?20:0)+ 819 + (bg?6:0)+ 820 + (border>=1?2:0)+ 821 + (mostlyUpper?4:0)+ 822 + (num(style.fontWeight)>=600?1:0); 1168 1168 1169 - candidates.sort(function(a,b){ 1170 - return ( 1171 - b.getBoundingClientRect().height- 1172 - a.getBoundingClientRect().height 1173 - ); 824 + if(score>=7){ 825 + candidates.push({ 826 + el:el, 827 + relativeTop:relativeTop, 828 + width:r.width, 829 + score:score 830 + }); 831 + } 1174 1174 }); 1175 1175 1176 - return candidates[0]; 1177 - } 834 + if(!candidates.length)return null; 1178 1178 1179 - function rowCandidates(link,card){ 1180 - var result=[]; 1181 - var cardRect= 1182 - card.getBoundingClientRect(); 1183 - 1184 - var node=link; 1185 - 1186 - while(node&&node!==card){ 1187 - if(visible(node)){ 1188 - var rect= 1189 - node.getBoundingClientRect(); 1190 - 1191 - if( 1192 - rect.height<=105&& 1193 - rect.width>= 1194 - cardRect.width*.50&& 1195 - rect.width<= 1196 - cardRect.width*1.03 1197 - ){ 1198 - result.push(node); 1199 - } 836 + candidates.sort(function(a,b){ 837 + if(a.score!==b.score)return b.score-a.score; 838 + if(Math.abs(a.relativeTop-b.relativeTop)>3){ 839 + return a.relativeTop-b.relativeTop; 1200 1200 } 841 + return b.width-a.width; 842 + }); 1201 1201 1202 - node=node.parentElement; 1203 - } 844 + // For exact known labels always prefer the earliest exact match. 845 + var exacts=candidates.filter(function(c){ 846 + return exactKnownFirstSection(c.el); 847 + }); 1204 1204 1205 - return result; 1206 - } 1207 - 1208 - function chooseOuterRow( 1209 - candidates, 1210 - link 1211 - ){ 1212 - if(!candidates.length){ 1213 - return link; 849 + if(exacts.length){ 850 + exacts.sort(function(a,b){ 851 + return a.relativeTop-b.relativeTop||b.width-a.width; 852 + }); 853 + return exacts[0].el; 1214 1214 } 1215 1215 1216 - var bordered= 1217 - candidates.filter(function(el){ 1218 - return ( 1219 - num( 1220 - getComputedStyle(el) 1221 - .borderLeftWidth 1222 - )>=1 1223 - ); 1224 - }); 856 + // Generic fallback: earliest high-confidence bar. 857 + candidates.sort(function(a,b){ 858 + return a.relativeTop-b.relativeTop||b.score-a.score||b.width-a.width; 859 + }); 1225 1225 1226 - var pool= 1227 - bordered.length 1228 - ?bordered 1229 - :candidates; 861 + return candidates[0].el; 862 + } 1230 1230 1231 - pool.sort(function(a,b){ 1232 - var ar= 1233 - a.getBoundingClientRect(); 864 + function alignFirstSections(cards){ 865 + var rows= 866 + cards.map(function(card){ 867 + var bar= 868 + visuallyFirstSectionBar(card); 1234 1234 1235 - var br= 1236 - b.getBoundingClientRect(); 870 + if(!bar)return null; 1237 1237 1238 - return ( 1239 - ar.left-br.left|| 1240 - br.width-ar.width 1241 - ); 1242 - }); 872 + var cardRect= 873 + card.getBoundingClientRect(); 1243 1243 1244 - ret urn pool[0]||link;1245 - }875 + var barRect= 876 + bar.getBoundingClientRect(); 1246 1246 1247 - function applyOverviewPalette(){ 1248 - if(PAGE_KIND!=="overview"){ 1249 - return []; 878 + return { 879 + card:card, 880 + bar:bar, 881 + relativeTop: 882 + barRect.top-cardRect.top, 883 + label: 884 + normalizeText(bar.textContent) 885 + }; 886 + }); 887 + 888 + // Conservative: only align when every card in the horizontal row 889 + // has a reliable first section bar. 890 + if( 891 + rows.some(function(row){ 892 + return !row; 893 + }) 894 + ){ 895 + return null; 1250 1250 } 1251 1251 1252 - var headers= 1253 - smallestThemeHeaders() 1254 - .map(function(el){ 1255 - return { 1256 - el:el, 1257 - theme: 1258 - themeFor( 1259 - el.textContent 1260 - ), 1261 - card: 1262 - findOverviewCard( 1263 - el 1264 - ) 1265 - }; 898 + var targetTop= 899 + Math.max.apply( 900 + Math, 901 + rows.map(function(row){ 902 + return row.relativeTop; 1266 1266 }) 1267 - .filter(function(row){ 1268 - return !!row.card; 1269 - }); 904 + ); 1270 1270 1271 - var unique=[]; 1272 - var seenHeaders=new Set(); 906 + rows.forEach(function(row){ 907 + var delta= 908 + targetTop- 909 + row.relativeTop; 1273 1273 1274 - headers.forEach(function(row){ 1275 - var key= 1276 - row.theme.name+ 1277 - "|"+ 1278 - Math.round( 1279 - row.card 1280 - .getBoundingClientRect() 1281 - .left 1282 - )+ 1283 - "|"+ 1284 - Math.round( 1285 - row.el 1286 - .getBoundingClientRect() 1287 - .top 1288 - ); 911 + if(delta<=1)return; 1289 1289 1290 - if(!seenHeaders.has(key)){ 1291 - seenHeaders.add(key); 1292 - unique.push(row); 1293 - } 1294 - }); 1295 - 1296 - unique.forEach(function(row){ 1297 - var headerRect= 1298 - row.el 1299 - .getBoundingClientRect(); 1300 - 1301 - row.el.style.setProperty( 1302 - "background", 1303 - row.theme.bg, 1304 - "important" 913 + saveOriginal( 914 + row.bar, 915 + originalMarginTop, 916 + "margin-top" 1305 1305 ); 1306 1306 1307 - row.el.style.setProperty( 1308 - "color", 1309 - row.theme.text, 1310 - "important" 1311 - ); 919 + var currentMargin= 920 + num( 921 + getComputedStyle( 922 + row.bar 923 + ).marginTop 924 + ); 1312 1312 1313 - row.el.style.setProperty( 1314 - "text-align", 1315 - "left", 1316 - "important" 926 + row.bar.style.setProperty( 927 + "margin-top", 928 + ( 929 + currentMargin+ 930 + delta 931 + )+"px" 1317 1317 ); 1318 1318 1319 - row.el.style.setProperty( 1320 - "word-spacing", 1321 - "normal", 1322 - "important" 934 + row.bar.setAttribute( 935 + "data-sn-first-section-aligned", 936 + "4" 1323 1323 ); 1324 1324 1325 - var later= 1326 - unique 1327 - .filter(function(other){ 1328 - return ( 1329 - other.card===row.card&& 1330 - other.el 1331 - .getBoundingClientRect() 1332 - .top> 1333 - headerRect.top+2 1334 - ); 1335 - }) 1336 - .sort(function(a,b){ 1337 - return ( 1338 - a.el 1339 - .getBoundingClientRect() 1340 - .top- 1341 - b.el 1342 - .getBoundingClientRect() 1343 - .top 1344 - ); 1345 - }); 1346 - 1347 - var stopTop= 1348 - later.length 1349 - ?later[0].el 1350 - .getBoundingClientRect() 1351 - .top 1352 - :Infinity; 1353 - 1354 - Array.from( 1355 - row.card.querySelectorAll("a") 1356 - ).forEach(function(link){ 1357 - if(!visible(link))return; 1358 - 1359 - var rect= 1360 - link.getBoundingClientRect(); 1361 - 1362 - if( 1363 - rect.top<= 1364 - headerRect.bottom-2|| 1365 - rect.top>= 1366 - stopTop-2 1367 - ){ 1368 - return; 1369 - } 1370 - 1371 - var candidates= 1372 - rowCandidates( 1373 - link, 1374 - row.card 1375 - ); 1376 - 1377 - var target= 1378 - chooseOuterRow( 1379 - candidates, 1380 - link 1381 - ); 1382 - 1383 - candidates.forEach(function(el){ 1384 - el.style.setProperty( 1385 - "border-left", 1386 - "0 solid transparent", 1387 - "important" 1388 - ); 1389 - }); 1390 - 1391 - target.style.setProperty( 1392 - "border-left", 1393 - "3px solid "+ 1394 - row.theme.accent, 1395 - "important" 1396 - ); 1397 - 1398 - target.style.setProperty( 1399 - "box-sizing", 1400 - "border-box", 1401 - "important" 1402 - ); 1403 - }); 939 + sectionManaged.add(row.bar); 1404 1404 }); 1405 1405 1406 - return unique; 942 + return { 943 + labels: 944 + rows.map(function(row){ 945 + return row.label; 946 + }), 947 + targetRelativeTop: 948 + Math.round(targetTop) 949 + }; 1407 1407 } 1408 1408 1409 - /* ======================================================= 1410 - OVERVIEW CARD HEIGHT + FIRST THEMATIC ROW 1411 - ======================================================= */ 1412 - 1413 - function alignOverviewCards(headers){ 1414 - if( 1415 - PAGE_KIND!=="overview"|| 1416 - window.innerWidth<=MOBILE_MAX 1417 - ){ 1418 - return; 952 + function applyGroup(group){ 953 + if(!validHorizontalGroup(group)){ 954 + return null; 1419 1419 } 1420 1420 1421 1421 var cards=[]; 1422 1422 var seen=new Set(); 1423 1423 1424 - headers.forEach(function(row){1425 - if(!seen.has(r ow.card)){1426 - seen.add(r ow.card);1427 - cards.push(r ow.card);960 + group.entries.forEach(function(entry){ 961 + if(!seen.has(entry.target)){ 962 + seen.add(entry.target); 963 + cards.push(entry.target); 1428 1428 } 1429 1429 }); 1430 1430 1431 - if(cards.length<2){ 1432 - return; 1433 - } 967 + if(cards.length<2)return null; 1434 1434 1435 - // Groupcardsby actual top position.1436 - vargroups=[];969 + var firstSection= 970 + alignFirstSections(cards); 1437 1437 1438 - cards.forEach(function(card){1439 - vartop=1440 - card.getBoundingClientRect().top;972 + // The section alignment can change natural card heights. 973 + // Measure only afterwards. 974 + var maxHeight=0; 1441 1441 1442 - var group=null; 1443 - 1444 - for(var i=0;i<groups.length;i++){ 1445 - if( 1446 - Math.abs( 1447 - groups[i].top-top 1448 - )<=ROW_TOLERANCE 1449 - ){ 1450 - group=groups[i]; 1451 - break; 1452 - } 1453 - } 1454 - 1455 - if(!group){ 1456 - group={ 1457 - top:top, 1458 - cards:[] 1459 - }; 1460 - groups.push(group); 1461 - } 1462 - 1463 - group.cards.push(card); 976 + cards.forEach(function(card){ 977 + maxHeight=Math.max( 978 + maxHeight, 979 + card.getBoundingClientRect().height 980 + ); 1464 1464 }); 1465 1465 1466 - groups.forEach(function(group){ 1467 - if(group.cards.length<2){ 1468 - return; 1469 - } 983 + maxHeight=Math.ceil(maxHeight); 1470 1470 1471 - var firstHeaders= 1472 - group.cards.map(function(card){ 1473 - var candidates= 1474 - headers 1475 - .filter(function(row){ 1476 - return row.card===card; 1477 - }) 1478 - .sort(function(a,b){ 1479 - return ( 1480 - a.el 1481 - .getBoundingClientRect() 1482 - .top- 1483 - b.el 1484 - .getBoundingClientRect() 1485 - .top 1486 - ); 1487 - }); 985 + if(maxHeight<MIN_H)return null; 1488 1488 1489 - return candidates.length 1490 - ?candidates[0] 1491 - :null; 1492 - }); 987 + cards.forEach(function(card){ 988 + saveOriginal( 989 + card, 990 + originalMinHeight, 991 + "min-height" 992 + ); 1493 1493 1494 - if( 1495 - !firstHeaders.some(function(row){ 1496 - return !row; 1497 - }) 1498 - ){ 1499 - var targetTop= 1500 - Math.max.apply( 1501 - Math, 1502 - firstHeaders.map(function(row){ 1503 - return ( 1504 - row.el 1505 - .getBoundingClientRect() 1506 - .top- 1507 - row.card 1508 - .getBoundingClientRect() 1509 - .top 1510 - ); 1511 - }) 1512 - ); 994 + card.style.setProperty( 995 + "min-height", 996 + maxHeight+"px" 997 + ); 1513 1513 1514 - firstHeaders.forEach(function(row){ 1515 - var relativeTop= 1516 - row.el 1517 - .getBoundingClientRect() 1518 - .top- 1519 - row.card 1520 - .getBoundingClientRect() 1521 - .top; 999 + card.setAttribute( 1000 + "data-sn-equal-height-managed", 1001 + "4" 1002 + ); 1522 1522 1523 - var delta= 1524 - targetTop-relativeTop; 1525 - 1526 - if(delta>1){ 1527 - saveStyle( 1528 - row.el, 1529 - originalMargin, 1530 - "margin-top" 1531 - ); 1532 - 1533 - var current= 1534 - num( 1535 - getComputedStyle( 1536 - row.el 1537 - ).marginTop 1538 - ); 1539 - 1540 - row.el.style.setProperty( 1541 - "margin-top", 1542 - ( 1543 - current+delta 1544 - )+"px" 1545 - ); 1546 - 1547 - row.el.setAttribute( 1548 - "data-sn-master-first-row", 1549 - "1" 1550 - ); 1551 - 1552 - managedMargin.add( 1553 - row.el 1554 - ); 1555 - } 1556 - }); 1557 - } 1558 - 1559 - var maxHeight=0; 1560 - 1561 - group.cards.forEach(function(card){ 1562 - maxHeight= 1563 - Math.max( 1564 - maxHeight, 1565 - card 1566 - .getBoundingClientRect() 1567 - .height 1568 - ); 1569 - }); 1570 - 1571 - maxHeight= 1572 - Math.ceil(maxHeight); 1573 - 1574 - group.cards.forEach(function(card){ 1575 - saveStyle( 1576 - card, 1577 - originalHeight, 1578 - "min-height" 1579 - ); 1580 - 1581 - card.style.setProperty( 1582 - "min-height", 1583 - maxHeight+"px" 1584 - ); 1585 - 1586 - card.setAttribute( 1587 - "data-sn-master-equal-height", 1588 - "1" 1589 - ); 1590 - 1591 - managedHeight.add( 1592 - card 1593 - ); 1594 - }); 1004 + heightManaged.add(card); 1595 1595 }); 1006 + 1007 + return { 1008 + cards:cards.length, 1009 + height:maxHeight, 1010 + firstSection:firstSection 1011 + }; 1596 1596 } 1597 1597 1598 - /* ======================================================= 1599 - DETAIL GRID EQUAL HEIGHT, DESKTOP ONLY 1600 - ======================================================= */ 1014 + function run(){ 1015 + reset(); 1601 1601 1602 - function equaliseDetailGrids(){ 1603 1603 if( 1604 - PAGE_KIND!=="detail"|| 1605 1605 window.innerWidth<=MOBILE_MAX 1606 1606 ){ 1607 1607 return; 1608 1608 } 1609 1609 1610 - var selectors=[ 1611 - ".arsn-grid", 1612 - ".arsn-grid-2", 1613 - ".arsn-grid-3", 1614 - ".dmp-grid", 1615 - ".ido-grid", 1616 - ".pp-grid" 1617 - ]; 1618 - 1619 - selectors.forEach(function(selector){ 1023 + var parents= 1620 1620 Array.from( 1621 - root.querySelectorAll(selector) 1622 - ).forEach(function(grid){ 1623 - var children= 1624 - Array.from( 1625 - grid.children||[] 1626 - ).filter(visible); 1025 + root.querySelectorAll("*") 1026 + ).filter(function(parent){ 1027 + return ( 1028 + visible(parent,MIN_W,MIN_H)&& 1029 + parent.children&& 1030 + parent.children.length>=2&& 1031 + parent.children.length<=MAX_PARENT_CHILDREN 1032 + ); 1033 + }); 1627 1627 1628 - if(children.length<2){ 1629 - return; 1630 - } 1035 + var touched=new Set(); 1631 1631 1632 - var groups=[]; 1037 + parents.forEach(function(parent){ 1038 + var entries=[]; 1633 1633 1634 - children.forEach(function(child){ 1635 - var top= 1636 - child 1637 - .getBoundingClientRect() 1638 - .top; 1040 + Array.from(parent.children).forEach(function(child){ 1041 + if(!visible(child,MIN_W,MIN_H))return; 1639 1639 1640 - var group=null; 1043 + var target=pickTarget(child); 1044 + if(!target)return; 1641 1641 1642 - for(var i=0;i<groups.length;i++){ 1643 - if( 1644 - Math.abs( 1645 - groups[i].top-top 1646 - )<=ROW_TOLERANCE 1647 - ){ 1648 - group=groups[i]; 1649 - break; 1650 - } 1651 - } 1652 - 1653 - if(!group){ 1654 - group={ 1655 - top:top, 1656 - items:[] 1657 - }; 1658 - groups.push(group); 1659 - } 1660 - 1661 - group.items.push(child); 1046 + entries.push({ 1047 + target:target, 1048 + rect:target.getBoundingClientRect() 1662 1662 }); 1050 + }); 1663 1663 1664 - groups.forEach(function(group){ 1665 - if(group.items.length<2){ 1666 - return; 1667 - } 1052 + if(entries.length<2)return; 1668 1668 1669 - var maxHeight=0; 1054 + groupsByVisualRow(entries).forEach(function(group){ 1055 + if(!validHorizontalGroup(group))return; 1670 1670 1671 - group.items.forEach(function(item){ 1672 - maxHeight= 1673 - Math.max( 1674 - maxHeight, 1675 - item 1676 - .getBoundingClientRect() 1677 - .height 1678 - ); 1057 + var signature= 1058 + group.entries.map(function(entry){ 1059 + return entry.target; 1679 1679 }); 1680 1680 1681 - maxHeight= 1682 - Math.ceil(maxHeight); 1062 + if( 1063 + !signature.some(function(el){ 1064 + return !touched.has(el); 1065 + }) 1066 + ){ 1067 + return; 1068 + } 1683 1683 1684 - group.items.forEach(function(item){ 1685 - saveStyle( 1686 - item, 1687 - originalHeight, 1688 - "min-height" 1689 - ); 1070 + var applied= 1071 + applyGroup(group); 1690 1690 1691 - item.style.setProperty( 1692 - "min-height", 1693 - maxHeight+"px" 1694 - ); 1695 - 1696 - item.setAttribute( 1697 - "data-sn-master-equal-height", 1698 - "1" 1699 - ); 1700 - 1701 - managedHeight.add(item); 1073 + if(applied){ 1074 + signature.forEach(function(el){ 1075 + touched.add(el); 1702 1702 }); 1703 - } );1077 + } 1704 1704 }); 1705 1705 }); 1706 1706 } 1707 1707 1708 - /* ======================================================= 1709 - RUN / RESPONSIVE SCHEDULING 1710 - ======================================================= */ 1082 + function schedule(){ 1083 + if(raf)cancelAnimationFrame(raf); 1711 1711 1712 - function run(){ 1713 - if(running)return; 1714 - 1715 - running=true; 1716 - 1717 - try{ 1718 - resetRuntime(); 1719 - applyPlaceholderBadge(); 1720 - propagateDetailAccents(); 1721 - 1722 - var headers= 1723 - applyOverviewPalette(); 1724 - 1725 - makeThreeLineAreaLabels(); 1726 - makeFilledRedOrangeCTAsBorderless(); 1727 - 1728 - if( 1729 - window.innerWidth> 1730 - MOBILE_MAX 1731 - ){ 1732 - alignOverviewCards( 1733 - headers 1734 - ); 1735 - 1736 - equaliseDetailGrids(); 1737 - } 1738 - }finally{ 1739 - running=false; 1740 - } 1085 + raf=requestAnimationFrame(function(){ 1086 + raf=requestAnimationFrame(function(){ 1087 + raf=0; 1088 + run(); 1089 + }); 1090 + }); 1741 1741 } 1742 1742 1743 - function onResize(){ 1744 - if(resizeTimer){ 1745 - clearTimeout( 1746 - resizeTimer 1747 - ); 1748 - } 1093 + addEventListener("resize",schedule,{passive:true}); 1094 + addEventListener("load",schedule,{once:true}); 1749 1749 1750 - resizeTimer= 1751 - setTimeout( 1752 - function(){ 1753 - resizeTimer=0; 1754 - run(); 1755 - }, 1756 - RESIZE_DEBOUNCE 1757 - ); 1758 - } 1096 + root.addEventListener( 1097 + "click", 1098 + function(){ 1099 + setTimeout(schedule,0); 1100 + }, 1101 + true 1102 + ); 1759 1759 1760 - async function waitForReady(){ 1761 - if( 1762 - document.readyState!=="complete" 1763 - ){ 1764 - await new Promise(function(resolve){ 1765 - window.addEventListener( 1766 - "load", 1767 - resolve, 1768 - {once:true} 1769 - ); 1770 - }); 1104 + Array.from(root.querySelectorAll("img")).forEach(function(img){ 1105 + if(!img.complete){ 1106 + img.addEventListener("load",schedule,{once:true}); 1771 1771 } 1108 + }); 1772 1772 1773 - if( 1774 - document.fonts&& 1775 - document.fonts.ready 1776 - ){ 1777 - try{ 1778 - await document.fonts.ready; 1779 - }catch(error){} 1780 - } 1781 - 1782 - var images= 1783 - Array.from( 1784 - root.querySelectorAll("img") 1785 - ); 1786 - 1787 - await Promise.all( 1788 - images.map(function(img){ 1789 - if(img.complete){ 1790 - return Promise.resolve(); 1791 - } 1792 - 1793 - return new Promise(function(resolve){ 1794 - var done=function(){ 1795 - resolve(); 1796 - }; 1797 - 1798 - img.addEventListener( 1799 - "load", 1800 - done, 1801 - {once:true} 1802 - ); 1803 - 1804 - img.addEventListener( 1805 - "error", 1806 - done, 1807 - {once:true} 1808 - ); 1809 - }); 1810 - }) 1811 - ); 1812 - 1813 - run(); 1110 + if(document.fonts&&document.fonts.ready){ 1111 + document.fonts.ready.then(schedule); 1814 1814 } 1815 1815 1816 - window.addEventListener( 1817 - "resize", 1818 - onResize, 1819 - {passive:true} 1820 - ); 1821 - 1822 - waitForReady(); 1114 + schedule(); 1115 + setTimeout(schedule,200); 1116 + setTimeout(schedule,650); 1117 + setTimeout(schedule,1400); 1823 1823 })(); 1824 1824 </script> 1825 - 1826 -<!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_END --> 1120 +<!-- SN_HORIZONTAL_BOX_HARMONIZER_END --> 1827 1827 {{/html}} 1828 1828