Anandamakaranda

MediaWiki:Gadget-GrAnnotations.js: Difference between revisions

← Older edit
No edit summary
No edit summary
 
(One intermediate revision by the same user not shown)
Line 544: Line 544:
     Array.prototype.forEach.call(items, function (li) {
     Array.prototype.forEach.call(items, function (li) {
       var numEl = li.querySelector('.gra-qe-footnote-num');
       var numEl = li.querySelector('.gra-qe-footnote-num');
       var textEl = li.querySelector('span:last-child');
      var quoteEl = li.querySelector('.gra-qe-footnote-quote');
       var textEl = li.querySelector('.gra-qe-footnote-text');
       var num = numEl ? numEl.textContent.trim() : '';
       var num = numEl ? numEl.textContent.trim() : '';
       var text = textEl ? textEl.textContent : li.textContent;
      // CHANGED: was showing the NUMBER as the card's primary line and the
       html += '<div class="gra-footnote-card" data-gra-id="'+esc(li.id)+'">'
      // footnote's own note text as secondary — nowhere did it show WHICH
      // text in the document the footnote actually belongs to, which was
      // the whole point of being able to identify one footnote from
      // another. Now shows the referenced quote as primary (matching how
      // Notes/Bookmarks already identify themselves by quote, not by an
      // arbitrary id), with the number as a small prefix and the
      // footnote's own note text as secondary. Falls back to the note
      // text alone if a footnote predates this change and has no quote
      // span at all, rather than showing nothing.
      var quote = quoteEl ? quoteEl.textContent : '';
       var text = textEl ? textEl.textContent : (quoteEl ? '' : li.textContent);
      var primary = quote ? (num + ' ' + quote) : (num + ' ' + text);
      var id = li.getAttribute('data-gra-id') || '';
       html += '<div class="gra-bookmark-card gra-footnote-card" data-gra-id="'+esc(id)+'">'
             + '<span class="gra-icon gra-icon-footnote" aria-hidden="true"></span>'
             + '<span class="gra-icon gra-icon-footnote" aria-hidden="true"></span>'
             + '<div class="gra-footnote-info">'
             + '<div class="gra-bookmark-info">'
             + '<div class="gra-footnote-num">'+esc(num)+'</div>'
             + '<div class="gra-bookmark-name">'+esc(primary)+'</div>'
             + '<div class="gra-footnote-text">'+esc(text)+'</div>'
             + (quote ? '<div class="gra-bookmark-quote">'+esc(text)+'</div>' : '')
             + '</div>'
             + '</div>'
             + '</div>';
             + '</div>';
Line 758: Line 772:
       if (id) deleteBookmark(id);
       if (id) deleteBookmark(id);
     });
     });
     // NEW: Direction 1 — click a footnote card in the panel: scroll the
     // CHANGED: footnote highlights now carry data-gra-id (see quickedit.js's
     // MAIN TEXT to its marker (not another card — footnotes' source of
     // redesign — plain highlight span, no href/marker element anymore), so
     // truth is the page text, unlike Notes/Bookmarks).
     // this can reuse the EXACT same scrollToHighlight(id) helper Notes/
    // Bookmarks already use below, instead of custom href-parsing logic
    // that broke every time the marker format changed.
     $paneFootnotes.on('click', '.gra-footnote-card', function(){
     $paneFootnotes.on('click', '.gra-footnote-card', function(){
       var id = $(this).attr('data-gra-id');
       var id = $(this).attr('data-gra-id');
       if (!id) return;
       if (id) { closePanel(); scrollToHighlight(id); }
      var marker = document.querySelector('.gra-qe-footnote-ref a[href="#' + id + '"]');
      if (!marker) return;
      closePanel();
      marker.scrollIntoView({behavior:'smooth', block:'center'});
      marker.closest('.gra-qe-footnote-ref').classList.add('gra-hl-active');
      setTimeout(function(){
        marker.closest('.gra-qe-footnote-ref').classList.remove('gra-hl-active');
      }, 2000);
     });
     });


Line 794: Line 802:
       }, 100);
       }, 100);
     });
     });
     // NEW: Direction 2 — click a footnote MARKER in the text: open the
     // CHANGED: was .gra-qe-footnote-ref a with e.preventDefault() (it used
     // panel on the Footnotes tab, scroll/highlight the matching card.
     // to be a real link). Now a plain highlight span, same as notes/
     // Prevents the marker's native #fragment jump so the experience is
     // bookmarks — no href to prevent, id read directly via data-gra-id,
     // consistently panel-based, matching the two handlers just above.
     // and the handler is now identical in shape to the two right above it.
     $(CONTENT_SEL).on('click', '.gra-qe-footnote-ref a', function(e){
     $(CONTENT_SEL).on('click', '.gra-qe-footnote-highlight', function(){
      e.preventDefault();
       var id = $(this).attr('data-gra-id');
       var id = $(this).attr('href').slice(1);
       openPanel('footnotes');
       openPanel('footnotes');
       setTimeout(function(){
       setTimeout(function(){
Retrieved from "https://dev.anandamakaranda.in/MediaWiki:Gadget-GrAnnotations.js"