MediaWiki:Common.js: Difference between revisions

Latest revision as of 20:49, 29 April 2026

/* MediaWiki:Common.js — grantha.io  (v7)
 *
 * Changes vs v6:
 *  1. BUG FIX: Main IIFE was never properly closed — About link block was
 *     pasted inside it without the closing }() ); which broke the module
 *     boundary and killed the by-Author toggle. Each block is now its
 *     own self-contained IIFE.
 *  2. TOC: "Beginning" link removed.
 *  3. TOC: Heading label → "विषयसूची".
 *  4. TOC: मूल / उल्लेख nav links injected at top of TOC panel.
 *  5. TOC: All subsections expanded by default.
 *  6. TOC: Only the active item is bold; all others are normal weight.
 *  7. About link URL derived from wgArticlePath — works under any
 *     sub-path install (e.g. /My_wiki/). Points to "My_wiki:About".
 *  8. TOC customisations skipped on Main_Page and About pages.
 */

( function () {

  var LS_SCRIPT_KEY = 'grantha_reader_script';
  var currentScript = 'deva';

  // ── IAST transliteration ────────────────────────────────────────
  function devanagariToIAST( text ) {
    var CONSONANTS = {
      'क':'k','ख':'kh','ग':'g','घ':'gh','ङ':'ṅ',
      'च':'c','छ':'ch','ज':'j','झ':'jh','ञ':'ñ',
      'ट':'ṭ','ठ':'ṭh','ड':'ḍ','ढ':'ḍh','ण':'ṇ',
      'त':'t','थ':'th','द':'d','ध':'dh','न':'n',
      'प':'p','फ':'ph','ब':'b','भ':'bh','म':'m',
      'य':'y','र':'r','ल':'l','ळ':'ḷ','व':'v',
      'श':'ś','ष':'ṣ','स':'s','ह':'h'
    };
    var DIACRITICS = {
      'ा':'ā','ि':'i','ी':'ī','ु':'u','ू':'ū',
      'ृ':'ṛ','ॄ':'ṝ','े':'e','ै':'ai','ो':'o','ौ':'au'
    };
    var VOWELS = {
      'अ':'a','आ':'ā','इ':'i','ई':'ī','उ':'u','ऊ':'ū',
      'ऋ':'ṛ','ॠ':'ṝ','ए':'e','ऐ':'ai','ओ':'o','औ':'au','ऽ':"'"
    };
    var MISC = {
      'ं':'ṃ','ः':'ḥ','ँ':'m̐','ॐ':'oṃ',
      '०':'0','१':'1','२':'2','३':'3','४':'4',
      '५':'5','६':'6','७':'7','८':'8','९':'9'
    };
    var HALANTA = '्';
    var chars = Array.from( text );
    var result = '';
    var i = 0;
    while ( i < chars.length ) {
      var ch   = chars[ i ];
      var next = chars[ i + 1 ];
      if ( CONSONANTS[ ch ] ) {
        var base = CONSONANTS[ ch ];
        if ( next === HALANTA )          { result += base;               i += 2; }
        else if ( DIACRITICS[ next ] )   { result += base + DIACRITICS[ next ]; i += 2; }
        else if ( next === 'ं' || next === 'ः' ) { result += base + 'a' + MISC[ next ]; i += 2; }
        else                             { result += base + 'a';         i++;    }
      } else if ( VOWELS[ ch ] )         { result += VOWELS[ ch ];       i++; }
      else if ( DIACRITICS[ ch ] )       { result += DIACRITICS[ ch ];   i++; }
      else if ( MISC[ ch ] )             { result += MISC[ ch ];         i++; }
      else                               { result += ch;                 i++; }
    }
    return result;
  }

  // ── Character maps for Kannada / Tamil ─────────────────────────
  var SCRIPT_MAP = {
    kn: {
      'अ':'ಅ','आ':'ಆ','इ':'ಇ','ई':'ಈ','उ':'ಉ','ऊ':'ಊ','ऋ':'ಋ',
      'ए':'ಏ','ऐ':'ಐ','ओ':'ಓ','औ':'ಔ','ऽ':'ಽ',
      'क':'ಕ','ख':'ಖ','ग':'ಗ','घ':'ಘ','ङ':'ಙ',
      'च':'ಚ','छ':'ಛ','ज':'ಜ','झ':'ಝ','ञ':'ಞ',
      'ट':'ಟ','ठ':'ಠ','ड':'ಡ','ढ':'ಢ','ण':'ಣ',
      'त':'ತ','थ':'ಥ','द':'ದ','ध':'ಧ','न':'ನ',
      'प':'ಪ','फ':'ಫ','ब':'ಬ','भ':'ಭ','म':'ಮ',
      'य':'ಯ','र':'ರ','ल':'ಲ','व':'ವ',
      'श':'ಶ','ष':'ಷ','स':'ಸ','ह':'ಹ',
      'ा':'ಾ','ि':'ಿ','ी':'ೀ','ु':'ು','ू':'ೂ',
      'ृ':'ೃ','े':'ೇ','ै':'ೈ','ो':'ೋ','ौ':'ೌ',
      'ं':'ಂ','ः':'ಃ','्':'್',
      '०':'೦','१':'೧','२':'೨','३':'೩','४':'೪',
      '५':'೫','६':'೬','७':'೭','८':'೮','९':'೯'
    },
    ta: {
      'अ':'அ','आ':'ஆ','इ':'இ','ई':'ஈ','उ':'உ','ऊ':'ஊ',
      'ऋ':'ரு','ॠ':'ரூ',
      'ए':'ஏ','ऐ':'ஐ','ओ':'ஓ','औ':'ஔ',
      'क':'க','ख':'க','ग':'க','घ':'க','ङ':'ங',
      'च':'ச','छ':'ச','ज':'ஜ','झ':'ஜ','ञ':'ஞ',
      'ट':'ட','ठ':'ட','ड':'ட','ढ':'ட','ண':'ண',
      'त':'த','थ':'த','द':'த','ध':'த','न':'ந',
      'प':'ப','फ':'ப','ब':'ப','भ':'ப','म':'ம',
      'य':'ய','र':'ர','ल':'ல','ळ':'ழ','व':'வ',
      'श':'ஶ','ष':'ஷ','स':'ஸ','ह':'ஹ',
      'ा':'ா','ि':'ி','ी':'ீ','ु':'ு','ू':'ூ',
      'ृ':'ு','ॄ':'ூ',
      'े':'ே','ை':'ை','ो':'ோ','ौ':'ௌ',
      'ं':'ம்','ः':':','ँ':'ம்','्':'்','ॐ':'ௐ','ऽ':'ௗ',
      '०':'0','१':'1','२':'2','३':'3','४':'4',
      '५':'5','६':'6','७':'7','८':'8','९':'9'
    }
  };

  var PRE = [
    [ /ङ्क/g, 'ंक' ], [ /ङ्ख/g, 'ंख' ], [ /ङ्ग/g, 'ंग' ], [ /ङ्घ/g, 'ंघ' ],
    [ /ञ्च/g, 'ंच' ], [ /ञ्ज/g, 'ंज' ], [ /ण्ट/g, 'ंट' ], [ /ण्ड/g, 'ंड' ],
    [ /न्त/g, 'ंत' ], [ /न्द/g, 'ंद' ], [ /म्ब/g, 'ंब' ], [ /म्भ/g, 'ंभ' ]
  ];

  function transliterateText( text, script ) {
    if ( script === 'en' ) return devanagariToIAST( text );
    var map = SCRIPT_MAP[ script ];
    if ( !map ) return text;
    var t = text;
    PRE.forEach( function ( p ) { t = t.replace( p[ 0 ], p[ 1 ] ); } );
    return Array.from( t ).map( function ( ch ) {
      return map[ ch ] !== undefined ? map[ ch ] : ch;
    } ).join( '' );
  }

  // ── Tag all transliteratable text nodes once per page ───────────
  var translatableSpans = [];

  function tagTextNodes() {
    var content = document.querySelector( '.mw-parser-output' );
    if ( content ) {
      var walker = document.createTreeWalker( content, NodeFilter.SHOW_TEXT );
      var nodes  = [];
      while ( walker.nextNode() ) nodes.push( walker.currentNode );

      nodes.forEach( function ( node ) {
        var p = node.parentNode;
        if ( !p ) return;
        if ( p.hasAttribute && p.hasAttribute( 'data-deva' ) ) return;
        if ( p.closest ) {
          if ( p.closest( '.gr-controls' )    ) return;
          if ( p.closest( '.mw-editsection' ) ) return;
          // #gr-toc-doc-nav buttons manage their own data-deva spans in makeBtn
        }
        var orig = node.textContent;
        if ( !orig.trim() ) return;
        var span = document.createElement( 'span' );
        span.setAttribute( 'data-deva', orig );
        span.textContent = orig;
        p.replaceChild( span, node );
        translatableSpans.push( span );
      } );
    }

    document.querySelectorAll( '.vector-toc .vector-toc-text' ).forEach( function ( span ) {
      if ( span.hasAttribute( 'data-deva' ) ) return;
      var orig = span.textContent;
      if ( !orig.trim() ) return;
      span.setAttribute( 'data-deva', orig );
      translatableSpans.push( span );
    } );
  }

  // ── Apply a script to all tagged spans ─────────────────────────
  function applyScript( script ) {
    currentScript = script;
    translatableSpans.forEach( function ( span ) {
      if ( !span.parentNode ) return;
      var orig = span.getAttribute( 'data-deva' );
      if ( !orig ) return;
      span.textContent = ( script === 'deva' )
        ? orig
        : transliterateText( orig, script );
    } );
  }

  // ── Pages where sidebar TOC should not be modified ──────────────
  function _isNoTocPage() {
    var pn = ( window.mw && mw.config && mw.config.get( 'wgPageName' ) ) || '';
    return pn === 'Main_Page' || /^[A-Za-z0-9_]+:About$/.test( pn );
  }

  // ── TOC: rename "Contents" → "विषयसूची" ────────────────────────
function renameTocTitle() {
  if ( _isNoTocPage() ) return;

  var toc = document.querySelector('.vector-toc');
  if ( !toc ) return;

  var titleEl =
    toc.querySelector('.vector-toc-title') ||
    toc.querySelector('.vector-pinnable-header-label');

  if ( !titleEl ) return;

  var LABEL = 'विषयसूची';

  /* If already inserted, just refresh text */
  var span = titleEl.querySelector('.gr-toc-title');

  if ( !span ) {
    titleEl.innerHTML = '';

    span = document.createElement('span');
    span.className = 'gr-toc-title';
    span.setAttribute('data-deva', LABEL);

    titleEl.appendChild(span);
    translatableSpans.push(span);   // uses your internal array
  }

  span.textContent =
    currentScript === 'deva'
      ? LABEL
      : transliterateText(LABEL, currentScript);
}
  // ── TOC: Remove the "Beginning" / top-of-page link ─────────────
  function removeTocBeginning() {
    if ( _isNoTocPage() ) return;
    var toc = document.querySelector( '.vector-toc' );
    if ( !toc ) return;
    // Try the dedicated id first (Vector 2022)
    var el = toc.querySelector( '#vector-toc-beginning' );
    if ( !el ) {
      // Fallback: first list-item whose link has no # anchor = the "Beginning" entry
      var items = toc.querySelectorAll( '.vector-toc-list-item' );
      for ( var i = 0; i < items.length; i++ ) {
        var a = items[ i ].querySelector( 'a' );
        if ( a ) {
          var href = a.getAttribute( 'href' ) || '';
          if ( href.indexOf( '#' ) === -1 ) { el = items[ i ]; break; }
        }
      }
    }
    if ( el && el.parentNode ) el.parentNode.removeChild( el );
  }

  // ── TOC: Expand all collapsed subsections on load ───────────────
  function expandTocSections() {
    if ( _isNoTocPage() ) return;
    var toc = document.querySelector( '.vector-toc' );
    if ( !toc ) return;
    toc.querySelectorAll( '.vector-toc-list-item-collapsed' ).forEach( function ( li ) {
      li.classList.remove( 'vector-toc-list-item-collapsed' );
    } );
  }

  // ── TOC: Inject मूल / उल्लेख nav links ─────────────────────────
  function injectTocDocNav() {
    if ( _isNoTocPage() ) return;
    var toc = document.querySelector( '.vector-toc' );
    if ( !toc ) return;
    if ( document.getElementById( 'gr-toc-doc-nav' ) ) return;

    var artPath   = ( window.mw && mw.config && mw.config.get( 'wgArticlePath' ) ) || '/wiki/$1';
    var pageTitle = ( window.mw && mw.config && mw.config.get( 'wgPageName'   ) ) || '';

    var teekaPage   = document.querySelector( '.gr-teeka-page' );
    var primarySlug = teekaPage ? ( teekaPage.getAttribute( 'data-primary' ) || '' ) : '';
    var docSlug     = teekaPage ? ( teekaPage.getAttribute( 'data-slug'    ) || '' ) : '';

    if ( !primarySlug ) {
      primarySlug = pageTitle.split( '/' )[ 0 ];
      docSlug     = primarySlug;
    }
    if ( !primarySlug ) return;

    function wikiUrl( slug ) {
      if ( window.mw && mw.util && mw.util.getUrl ) return mw.util.getUrl( slug );
      return artPath.replace( '$1', encodeURIComponent( slug ).replace( /%2F/g, '/' ) );
    }

    var moolaUrl   = wikiUrl( primarySlug );
    var ullekhaUrl = wikiUrl( primarySlug + '/Ullekha' );

    var docTitleEl  = document.querySelector( '.gr-doc-title' );
    var hasMoolaPage   = docTitleEl && docTitleEl.getAttribute( 'data-has-moola' )   === '1';
    var hasUllekhaPage = docTitleEl && docTitleEl.getAttribute( 'data-has-ullekha' ) === '1';

    var moolaPageUrl = wikiUrl( primarySlug + '/Moola' );

    var showMoolaPage  = !teekaPage && hasMoolaPage;
    var showMoolaBack  = !!teekaPage;
    var showUllekha    = hasUllekhaPage || !!teekaPage;

    if ( !showMoolaPage && !showMoolaBack && !showUllekha ) return;

    var nav = document.createElement( 'div' );
    nav.id = 'gr-toc-doc-nav';
    nav.setAttribute( 'class', 'toc-main-links');

    // ── CHANGE: makeBtn now wraps label in a data-deva span so
    // transliteration (script switching) applies to button text.
    function makeBtn( href, label ) {
      var a = document.createElement( 'a' );
      a.href = href;
      a.setAttribute( 'class', 'toc-main-link-item');
      var lspan = document.createElement( 'span' );
      lspan.setAttribute( 'data-deva', label );
      lspan.textContent = ( currentScript && currentScript !== 'deva' )
        ? transliterateText( label, currentScript )
        : label;
      translatableSpans.push( lspan );
      a.appendChild( lspan );
      a.addEventListener( 'mouseover', function () { this.style.opacity = '0.72'; } );
      a.addEventListener( 'mouseout',  function () { this.style.opacity = '1';    } );
      return a;
    }

    if ( showMoolaPage ) nav.appendChild( makeBtn( moolaPageUrl, 'मूलम्' ) );
    if ( showMoolaBack ) nav.appendChild( makeBtn( moolaUrl,     'मूल' ) );
    if ( showUllekha   ) nav.appendChild( makeBtn( ullekhaUrl,   'उल्लेख') );

    var tocContents = toc.querySelector( '.vector-toc-contents' );
    if ( tocContents ) toc.insertBefore( nav, tocContents );
    else               toc.appendChild( nav );
  }

  // ── TOC active-item highlight ────────────────────────────────────
  function watchTocActive() {
    if ( _isNoTocPage() ) return;
    var toc = document.querySelector( '.vector-toc' );
    if ( !toc ) return;
    if ( !window.MutationObserver ) return;

    if ( toc._grObserved ) {
      toc.querySelectorAll( '.vector-toc-list-item' ).forEach( attachHighlight );
      return;
    }
    toc._grObserved = true;

    var ACTIVE_COLOR = '#f57c00';

    function setActive( li, on ) {
      var link = li.querySelector( '.vector-toc-link' ) || li.querySelector( 'a' );
      if ( !link ) return;
      var hasActiveChild = !!li.querySelector(
        '.vector-toc-list-item .vector-toc-list-item-active'
      );
      var shouldHighlight = on && !hasActiveChild;
      if ( shouldHighlight ) {
        link.style.setProperty( 'color',       ACTIVE_COLOR, 'important' );
        link.style.setProperty( 'font-weight', '700',        'important' );
        link.querySelectorAll( '*' ).forEach( function ( el ) {
          el.style.setProperty( 'color',       ACTIVE_COLOR, 'important' );
          el.style.setProperty( 'font-weight', '700',        'important' );
        } );
      } else {
        link.style.removeProperty( 'color' );
        link.style.setProperty( 'font-weight', '400', 'important' );
        link.querySelectorAll( '*' ).forEach( function ( el ) {
          el.style.removeProperty( 'color' );
          el.style.setProperty( 'font-weight', '400', 'important' );
        } );
      }
    }

    function normaliseAll() {
      toc.querySelectorAll( '.vector-toc-list-item' ).forEach( function ( li ) {
        setActive( li, li.classList.contains( 'vector-toc-list-item-active' ) );
      } );
    }

    function attachHighlight( li ) {
      if ( li._grHighlightAttached ) return;
      li._grHighlightAttached = true;
      liObs.observe( li, { attributes: true, attributeFilter: [ 'class' ] } );
      setActive( li, li.classList.contains( 'vector-toc-list-item-active' ) );
    }

    var liObs = new MutationObserver( function ( mutations ) {
      mutations.forEach( function ( m ) {
        if ( m.attributeName !== 'class' ) return;
        var li     = m.target;
        var active = li.classList.contains( 'vector-toc-list-item-active' );
        setActive( li, active );

        if ( active ) {
          var anc = li.parentNode;
          while ( anc && anc !== document.body ) {
            if ( anc.classList &&
                 anc.classList.contains( 'vector-toc-list-item' ) &&
                 anc.classList.contains( 'vector-toc-list-item-collapsed' ) ) {
              anc.classList.remove( 'vector-toc-list-item-collapsed' );
            }
            anc = anc.parentNode;
          }

          var container = document.querySelector( '.vector-sticky-pinned-container' );
          if ( container ) {
            var vis = container.offsetHeight > 0 &&
                      container.offsetParent !== null &&
                      window.getComputedStyle( container ).display !== 'none' &&
                      window.getComputedStyle( container ).visibility !== 'hidden';
            if ( vis ) {
              var lr = li.getBoundingClientRect();
              var cr = container.getBoundingClientRect();
              if ( lr.top < cr.top + 4 || lr.bottom > cr.bottom - 4 ) {
                var sh = null, node = li.parentNode;
                while ( node && node !== document.body ) {
                  var ov = window.getComputedStyle( node ).overflowY;
                  if ( ( ov === 'auto' || ov === 'scroll' ) &&
                       node.scrollHeight > node.clientHeight ) { sh = node; break; }
                  node = node.parentNode;
                }
                if ( !sh && container.scrollHeight > container.clientHeight ) sh = container;
                if ( sh ) {
                  var hr  = sh.getBoundingClientRect();
                  var top = lr.top - hr.top + sh.scrollTop;
                  sh.scrollTop = Math.max( 0, top - sh.clientHeight / 2 + li.offsetHeight / 2 );
                }
              }
            }
          }
        }
      } );
    } );

    var structObs = new MutationObserver( function ( mutations ) {
      mutations.forEach( function ( m ) {
        if ( m.type !== 'childList' ) return;
        m.addedNodes.forEach( function ( n ) {
          if ( n.nodeType !== 1 ) return;
          if ( n.classList && n.classList.contains( 'vector-toc-list-item' ) ) attachHighlight( n );
          if ( n.querySelectorAll ) n.querySelectorAll( '.vector-toc-list-item' ).forEach( attachHighlight );
          var newSpans = [];
          if ( n.classList && n.classList.contains( 'vector-toc-text' ) ) newSpans.push( n );
          if ( n.querySelectorAll ) n.querySelectorAll( '.vector-toc-text' ).forEach( function ( s ) { newSpans.push( s ); } );
          newSpans.forEach( function ( span ) {
            if ( span.hasAttribute( 'data-deva' ) ) return;
            var orig = span.textContent;
            if ( !orig.trim() ) return;
            span.setAttribute( 'data-deva', orig );
            if ( currentScript !== 'deva' ) span.textContent = transliterateText( orig, currentScript );
            translatableSpans.push( span );
          } );
        } );
      } );
    } );

    toc.querySelectorAll( '.vector-toc-list-item' ).forEach( attachHighlight );
    structObs.observe( toc, { childList: true, subtree: true } );

    setTimeout( function () {
      normaliseAll();
      var active = toc.querySelector( '.vector-toc-list-item-active' );
      if ( active ) setActive( active, true );
    }, 300 );
  }

  // ── Custom TOC builder (replaces Vector heading-based TOC) ─────────
  // Reads span.gr-toc-anchor elements which have clean IDs set by the
  // importer — avoids MediaWiki's URL-encoded heading anchors entirely.
  // Mirrors the ref site's data-attribute approach: TOC entries come
  // from data-title / data-level on the anchor spans, not from headings.
  var _tocBuilt = false;

  function buildCustomToc() {
    if ( _isNoTocPage() ) return;
    var toc = document.querySelector( '.vector-toc' );
    if ( !toc ) return;

    // Collect all anchor spans in document order
    var anchors = Array.from(
      document.querySelectorAll( '.mw-parser-output .gr-toc-anchor' )
    );
    if ( !anchors.length ) {
      // No gr-toc-anchor spans — fall back to standard TOC customisations
      removeTocBeginning();
      renameTocTitle();
      expandTocSections();
      injectTocDocNav();
      watchTocActive();
      return;
    }

    // Build TOC data: [{id, title, level}]
    var entries = anchors.map( function ( span ) {
      return {
        id:    span.id,
        title: span.getAttribute( 'data-title' ) || span.id,
        level: parseInt( span.getAttribute( 'data-level' ) || '1', 10 ),
        el:    span,
      };
    } );

    // Build the <ul> tree (3 levels: adhyaya, pada, adhikarana)
    function buildList( items ) {
      var ul = document.createElement( 'ul' );
      ul.className = 'vector-toc-list';
      var i = 0;
      while ( i < items.length ) {
        var item = items[ i ];
        var li = document.createElement( 'li' );
        li.className = 'vector-toc-list-item vector-toc-level-' + item.level;
        li.setAttribute( 'data-toc-id', item.id );

        var a = document.createElement( 'a' );
        a.className = 'vector-toc-link';
        a.href = '#' + item.id;

        var textSpan = document.createElement( 'span' );
        textSpan.className = 'vector-toc-text';
        textSpan.setAttribute( 'data-deva', item.title );
        textSpan.textContent = currentScript !== 'deva'
          ? transliterateText( item.title, currentScript )
          : item.title;
        translatableSpans.push( textSpan );

        a.appendChild( textSpan );
        li.appendChild( a );

        // Collect children (higher level numbers)
        var children = [];
        var j = i + 1;
        while ( j < items.length && items[ j ].level > item.level ) {
          children.push( items[ j ] );
          j++;
        }
        if ( children.length ) {
          var childUl = buildList( children );
          li.appendChild( childUl );
          li.classList.add( 'vector-toc-list-item-with-children' );
          // Start collapsed for level 2+ if many children
          if ( item.level >= 2 && children.length > 4 ) {
            li.classList.add( 'vector-toc-list-item-collapsed' );
          }
        }
        ul.appendChild( li );
        i = j;
      }
      return ul;
    }

    // Inject into Vector TOC
    var contents = toc.querySelector( '.vector-toc-contents' );
    if ( !contents ) {
      contents = document.createElement( 'div' );
      contents.className = 'vector-toc-contents';
      toc.appendChild( contents );
    }
    contents.innerHTML = '';

    var listUl = buildList( entries );
    listUl.id = 'mw-panel-toc-list';
    contents.appendChild( listUl );

    _tocBuilt = true;

    // Rename title
    renameTocTitle();
    injectTocDocNav();

    // ── IntersectionObserver for active highlighting ──────────────
    if ( !window.IntersectionObserver ) return;

    var ACTIVE_COLOR  = '#f57c00';
    var _activeId     = null;

    function setTocActive( id ) {
      if ( _activeId === id ) return;
      _activeId = id;

      // Clear all active classes and inline styles
      contents.querySelectorAll( '.vector-toc-list-item' ).forEach( function ( li ) {
        li.classList.remove( 'vector-toc-list-item-active' );
        var lnk = li.querySelector( '.vector-toc-link' );
        if ( lnk ) {
          lnk.style.removeProperty( 'color' );
          lnk.style.setProperty( 'font-weight', '400', 'important' );
          lnk.querySelectorAll( '*' ).forEach( function ( el ) {
            el.style.removeProperty( 'color' );
            el.style.setProperty( 'font-weight', '400', 'important' );
          } );
        }
      } );

      if ( !id ) return;

      // Find matching li
      var activeLi = contents.querySelector( '[data-toc-id="' + id + '"]' );
      if ( !activeLi ) return;

      activeLi.classList.add( 'vector-toc-list-item-active' );

      // Only highlight if it is the innermost active item (no active child)
      var hasActiveChild = !!activeLi.querySelector(
        '.vector-toc-list-item .vector-toc-list-item-active'
      );
      if ( !hasActiveChild ) {
        var lnk = activeLi.querySelector( '.vector-toc-link' );
        if ( lnk ) {
          lnk.style.setProperty( 'color',       ACTIVE_COLOR, 'important' );
          lnk.style.setProperty( 'font-weight', '700',        'important' );
          lnk.querySelectorAll( '*' ).forEach( function ( el ) {
            el.style.setProperty( 'color',       ACTIVE_COLOR, 'important' );
            el.style.setProperty( 'font-weight', '700',        'important' );
          } );
        }
      }

      // Expand collapsed ancestors
      var anc = activeLi.parentNode;
      while ( anc && anc !== contents ) {
        if ( anc.classList && anc.classList.contains( 'vector-toc-list-item-collapsed' ) ) {
          anc.classList.remove( 'vector-toc-list-item-collapsed' );
        }
        anc = anc.parentNode;
      }

      // Scroll TOC entry into view
      var container = document.querySelector( '.vector-sticky-pinned-container' );
      if ( container ) {
        var lr = activeLi.getBoundingClientRect();
        var cr = container.getBoundingClientRect();
        if ( lr.top < cr.top + 4 || lr.bottom > cr.bottom - 4 ) {
          container.scrollTop += lr.top - cr.top - container.clientHeight / 2;
        }
      }
    }

    // Track which anchors are visible
    var _visibleIds = new Set();

    var observer = new IntersectionObserver( function ( entries ) {
      entries.forEach( function ( entry ) {
        var id = entry.target.id;
        if ( entry.isIntersecting ) {
          _visibleIds.add( id );
        } else {
          _visibleIds.delete( id );
        }
      } );

      // Find the topmost visible anchor
      var topId = null;
      var topY  = Infinity;
      _visibleIds.forEach( function ( id ) {
        var el = document.getElementById( id );
        if ( el ) {
          var y = el.getBoundingClientRect().top;
          if ( y < topY ) { topY = y; topId = id; }
        }
      } );

      // If nothing visible (scrolled past), find the last anchor above viewport
      if ( !topId ) {
        var best = null, bestBottom = -Infinity;
        anchors.forEach( function ( span ) {
          var r = span.getBoundingClientRect();
          if ( r.bottom < 80 && r.bottom > bestBottom ) {
            bestBottom = r.bottom;
            best = span.id;
          }
        } );
        topId = best;
      }

      setTocActive( topId );
    }, { rootMargin: '-60px 0px -70% 0px', threshold: 0 } );

    anchors.forEach( function ( span ) { observer.observe( span ); } );
  }

  // ── Run all TOC customisations ───────────────────────────────────
  function setupToc() {
    if ( _tocBuilt ) {
      // TOC already built — just re-run label/nav parts
      renameTocTitle();
      injectTocDocNav();
      return;
    }
    // Try custom TOC first; falls back to Vector customisations if no anchors
    buildCustomToc();
    if ( !_tocBuilt ) {
      removeTocBeginning();
      renameTocTitle();
      expandTocSections();
      injectTocDocNav();
      watchTocActive();
    }
  }

  // ── Init ────────────────────────────────────────────────────────
  function init() {
    var HIDE_IDS = [
      'vector-appearance',
      'vector-appearance-pinned-container',
      'vector-appearance-unpinned-container'
    ];
    function removeHiddenEls() {
      HIDE_IDS.forEach( function ( id ) {
        var el = document.getElementById( id );
        if ( el && el.parentNode ) el.parentNode.removeChild( el );
      } );
      var pt = document.getElementById( 'vector-page-tools' ) ||
               document.querySelector( '.vector-page-tools-pinned-container' );
      if ( pt ) {
        pt.querySelectorAll( '[aria-controls="vector-appearance"]' )
          .forEach( function ( el ) { if ( el.parentNode ) el.parentNode.removeChild( el ); } );
      }
    }
    removeHiddenEls();

    ( function detectTeekaMode() {
      var tp = document.querySelector( '.gr-teeka-page' );
      if ( !tp ) return;
      var primary = tp.getAttribute( 'data-primary' ) || '';
      var artPath = ( window.mw && mw.config.get( 'wgArticlePath' ) ) || '/wiki/$1';
      var mainUrl = artPath.replace( '$1', primary );
      var refParam = window.location.search.match( /[?&]ref=([01])/ );
      if ( refParam ) {
        document.body.classList.add( refParam[1] === '1' ? 'gr-ref-mode' : 'gr-standalone' );
        return;
      }
      var ref = document.referrer || '';
      document.body.classList.add(
        ( ref && primary && ref.indexOf( mainUrl ) !== -1 ) ? 'gr-ref-mode' : 'gr-standalone'
      );
    }() );

    if ( window.MutationObserver ) {
      var hideObs = new MutationObserver( function ( mutations ) {
        var dirty = false;
        mutations.forEach( function ( m ) { if ( m.addedNodes.length ) dirty = true; } );
        if ( dirty ) removeHiddenEls();
      } );
      hideObs.observe( document.body, { childList: true, subtree: false } );
      setTimeout( function () { hideObs.disconnect(); }, 6000 );
    }

    var content       = document.querySelector( '.mw-parser-output' );
    var alreadyTagged = content && content.querySelector( '[data-deva]' );
    if ( !alreadyTagged ) {
      translatableSpans = [];
      tagTextNodes();
    } else {
      document.querySelectorAll( '.vector-toc .vector-toc-text:not([data-deva])' ).forEach( function ( span ) {
        var orig = span.textContent;
        if ( !orig.trim() ) return;
        span.setAttribute( 'data-deva', orig );
        translatableSpans.push( span );
      } );
    }

    var saved = ( function () {
      try { return localStorage.getItem( LS_SCRIPT_KEY ); } catch ( e ) { return null; }
    }() );
    if ( saved && saved !== 'deva' ) { applyScript( saved ); }
    else { currentScript = 'deva'; }

    // Vector 2022 defers TOC render — retry at 300ms and 800ms
    setupToc();
    setTimeout( setupToc, 300 );
    setTimeout( setupToc, 800 );
  }

  // ── React to toolbar script-change events ──────────────────────
  window.addEventListener( 'gr-script-change', function ( e ) {
    var script = e && e.detail && e.detail.script;
    if ( script ) applyScript( script );
  } );

  // ── React to gr-new-content (siteNav panel rendered new items) ──
  // Tag any new text nodes added by the documents panel
  window.addEventListener( 'gr-new-content', function ( e ) {
    var container = e && e.detail && e.detail.container;
    if ( !container ) return;
    var walker = document.createTreeWalker( container, NodeFilter.SHOW_TEXT );
    var nodes = [];
    while ( walker.nextNode() ) nodes.push( walker.currentNode );
    nodes.forEach( function ( node ) {
      var p = node.parentNode;
      if ( !p || ( p.hasAttribute && p.hasAttribute( 'data-deva' ) ) ) return;
      var orig = node.textContent;
      if ( !orig.trim() ) return;
      var span = document.createElement( 'span' );
      span.setAttribute( 'data-deva', orig );
      span.textContent = currentScript !== 'deva' ? transliterateText( orig, currentScript ) : orig;
      p.replaceChild( span, node );
      translatableSpans.push( span );
    } );
  } );

  // ── React to script changes from OTHER tabs (BroadcastChannel) ──
  try {
    var _grBC = new BroadcastChannel( 'gr-script' );
    _grBC.onmessage = function ( e ) {
      var script = e && e.data && e.data.script;
      if ( script ) {
        currentScript = script;
        var sel = document.querySelector( '.gr-script-sel' );
        if ( sel ) sel.value = script;
        applyScript( script );
      }
    };
  } catch ( e ) {}

  // ── MediaWiki SPA-style navigation ──────────────────────────────
  if ( window.mw ) {
    mw.hook( 'wikipage.content' ).add( function () {
      setTimeout( function () {
        var content       = document.querySelector( '.mw-parser-output' );
        var alreadyTagged = content && content.querySelector( '[data-deva]' );
        if ( !alreadyTagged ) {
          translatableSpans = [];
          tagTextNodes();
        } else {
          document.querySelectorAll( '.vector-toc .vector-toc-text:not([data-deva])' ).forEach( function ( span ) {
            var orig = span.textContent;
            if ( !orig.trim() ) return;
            span.setAttribute( 'data-deva', orig );
            translatableSpans.push( span );
          } );
        }
        if ( currentScript !== 'deva' ) applyScript( currentScript );
        setupToc();
      }, 150 );
    } );
  }

  if ( document.readyState === 'loading' ) {
    document.addEventListener( 'DOMContentLoaded', init );
  } else {
    init();
  }

}() );   /* ← end of main IIFE */


// ── Inject "Help" and "About" links into the header ─────────────────
( function () {
  function wikiHref( title ) {
    if ( window.mw && mw.util && mw.util.getUrl ) return mw.util.getUrl( title );
    var ap = ( window.mw && mw.config && mw.config.get( 'wgArticlePath' ) ) || '/wiki/$1';
    return ap.replace( '$1', title );
  }

  var linkStyle = [
    'color:rgba(255,255,255,0.88)', 'font-size:0.88em',
    'font-family:system-ui,sans-serif', 'font-weight:500',
    'text-decoration:none', 'padding:4px 10px', 'border-radius:4px',
    'margin-right:4px', 'transition:color 0.15s,background 0.15s',
    'white-space:nowrap',
  ].join( ';' );

  function makeHeaderLink( id, href, label ) {
    var a = document.createElement( 'a' );
    a.id = id; a.href = href; a.textContent = label;
    a.style.cssText = linkStyle;
    a.addEventListener( 'mouseover', function () {
      this.style.color = '#fff'; this.style.background = 'rgba(255,255,255,0.12)';
    } );
    a.addEventListener( 'mouseout', function () {
      this.style.color = 'rgba(255,255,255,0.88)'; this.style.background = 'transparent';
    } );
    return a;
  }

  function injectHeaderLinks() {
    if ( document.getElementById( 'gr-about-link' ) ) return;

    var headerEnd = document.querySelector( '.vector-header-end' ) ||
                    document.querySelector( '#vector-user-links' ) ||
                    document.querySelector( '.mw-header' );
    if ( !headerEnd ) return;

    var helpLink  = makeHeaderLink( 'gr-help-link',  wikiHref( 'My_wiki:Help'  ), 'Help'  );
    var aboutLink = makeHeaderLink( 'gr-about-link', wikiHref( 'My_wiki:About' ), 'About' );

    var ul = document.querySelector( '.vector-user-links' ) ||
             document.querySelector( '#pt-userpage' );
    if ( ul && ul.parentNode === headerEnd ) {
      headerEnd.insertBefore( aboutLink, ul );
      headerEnd.insertBefore( helpLink,  aboutLink );
    } else {
      headerEnd.appendChild( helpLink );
      headerEnd.appendChild( aboutLink );
    }
  }

  if ( document.readyState === 'loading' ) document.addEventListener( 'DOMContentLoaded', injectHeaderLinks );
  else injectHeaderLinks();
}() );


// ── Main page: by-Grantha / by-Author toggle ──────────────────────
( function () {
  function grHomeView( v ) {
    var gView = document.getElementById( 'gr-view-grantha' );
    var aView = document.getElementById( 'gr-view-author' );
    var gBtn  = document.getElementById( 'gr-toggle-grantha' );
    var aBtn  = document.getElementById( 'gr-toggle-author' );
    if ( !gView || !aView || !gBtn || !aBtn ) return;
    gView.style.display = ( v === 'grantha' ) ? '' : 'none';
    aView.style.display = ( v === 'author'  ) ? '' : 'none';
    gBtn.className = 'gr-toggle-btn' + ( v === 'grantha' ? ' gr-toggle-active' : '' );
    aBtn.className = 'gr-toggle-btn' + ( v === 'author'  ? ' gr-toggle-active' : '' );
    try { localStorage.setItem( 'gr_home_view', v ); } catch ( e ) {}
  }

  function initHomeToggle() {
    var gBtn = document.getElementById( 'gr-toggle-grantha' );
    var aBtn = document.getElementById( 'gr-toggle-author' );
    if ( !gBtn || !aBtn ) return;
    gBtn.addEventListener( 'click', function () { grHomeView( 'grantha' ); } );
    aBtn.addEventListener( 'click', function () { grHomeView( 'author' );  } );
    [ gBtn, aBtn ].forEach( function ( btn ) {
      btn.addEventListener( 'keydown', function ( e ) {
        if ( e.key === 'Enter' || e.key === ' ' ) btn.click();
      } );
    } );
    var saved;
    try { saved = localStorage.getItem( 'gr_home_view' ); } catch ( e ) {}
    if ( saved === 'author' ) grHomeView( 'author' );
  }

  if ( document.readyState === 'loading' ) document.addEventListener( 'DOMContentLoaded', initHomeToggle );
  else initHomeToggle();
}() );


// ── Ullekha reference link handler ─────────────────────────────────
( function () {

  function highlightOnArrival() {
    var search = window.location.search;
    if ( !search ) return;
    var m = search.match( /[?&]hlUllekha=([^&]+)/ );
    if ( !m ) return;
    var needle;
    try { needle = decodeURIComponent( m[ 1 ] ); } catch ( e ) { return; }
    if ( !needle || needle.length < 4 ) return;

    var content = document.querySelector( '.mw-parser-output' );
    if ( !content ) return;

    var walker = document.createTreeWalker( content, NodeFilter.SHOW_TEXT );
    var found = false;
    while ( walker.nextNode() && !found ) {
      var node = walker.currentNode;
      var txt  = node.textContent || '';
      var snippet = needle.slice( 0, 30 );
      if ( txt.indexOf( snippet ) !== -1 ) {
        var span = document.createElement( 'mark' );
        span.className = 'gr-ullekha-highlight';
        span.style.cssText = 'background:#fff176;border-radius:2px;padding:0 2px;';
        var parent = node.parentNode;
        var idx = txt.indexOf( snippet );
        if ( idx >= 0 ) {
          var before = document.createTextNode( txt.slice( 0, idx ) );
          var after  = document.createTextNode( txt.slice( idx + snippet.length ) );
          span.textContent = txt.slice( idx, idx + needle.length > txt.length
            ? txt.length : needle.length );
          parent.insertBefore( before, node );
          parent.insertBefore( span,   node );
          parent.insertBefore( after,  node );
          parent.removeChild( node );
          setTimeout( function () {
            span.scrollIntoView( { behavior: 'smooth', block: 'center' } );
          }, 300 );
          found = true;
        }
      }
    }
  }

  function wireUllekhaLinks() {
    document.querySelectorAll( '.gr-ullekha-ref-link' ).forEach( function ( wrap ) {
      var anchor = wrap.getAttribute( 'data-anchor' ) || '';
      var hl     = wrap.getAttribute( 'data-hl' )     || '';
      var a = wrap.querySelector( 'a' );
      if ( !a ) return;

      var base = a.href.split( '#' )[ 0 ];
      var encoded = encodeURIComponent( hl );
      a.href = base + ( hl ? '?hlUllekha=' + encoded : '' )
                    + ( anchor ? '#' + anchor : '' );
    } );
  }

  if ( document.readyState === 'loading' ) {
    document.addEventListener( 'DOMContentLoaded', function () {
      highlightOnArrival();
      wireUllekhaLinks();
    } );
  } else {
    highlightOnArrival();
    wireUllekhaLinks();
  }
}() );