Jump to content

MediaWiki:Common.js: Difference between revisions

From Grantha
No edit summary
No edit summary
Line 1: Line 1:
/* =========================
/* ── Verse Actions ─────────────────────────────────────────────────────── */
  GLOBAL CLICK HANDLER (SAFE)
( function () {
========================= */
     'use strict';
$(document).on('click', function (e) {
 
  var $target = $(e.target);
 
  /* =========================
    COMMENTARY CLICK
  ========================= */
  var $commentBtn = $target.closest('.verse-action-commentary');
  if ($commentBtn.length) {
    e.preventDefault();
 
     var verseId = $commentBtn.data('verse');
    if (!verseId) return;
 
    var $bodies = $('.commentary-body[data-verse="' + verseId + '"]');
 
    var isOpen = !$bodies.first().hasClass('open');
 
    // close others (optional UX)
    $('.commentary-body.open').removeClass('open');
    $('.verse-action-commentary.active').removeClass('active');
 
    // toggle
    $bodies.toggleClass('open', isOpen);
    $commentBtn.toggleClass('active', isOpen);
 
    return;
  }
 
 
  /* =========================
    COPY VERSE CLICK
  ========================= */
  var $copyBtn = $target.closest('.verse-action-copy');
  if ($copyBtn.length) {
    e.preventDefault();
 
    var line1 = $copyBtn.data('line1') || '';
    var line2 = $copyBtn.data('line2') || '';
    var text  = line2 ? line1 + '\n' + line2 : line1;
 
    if (!text) return;
 
    copyText(text, $copyBtn);
    return;
  }
 
 
  /* =========================
    COPY ID CLICK
  ========================= */
  var $idBtn = $target.closest('.copy-id-btn');
  if ($idBtn.length) {
    e.preventDefault();
 
    var id = $idBtn.data('copyid');
    if (!id) return;
 
    copyText(id, $idBtn);
    return;
  }
 
});
 


/* =========================
    /* =========================
   COPY FUNCTION + TOOLTIP
   COPY FUNCTION + TOOLTIP
========================= */
========================= */
function copyText(text, $btn) {
function copyText(text, $btn) {
  function showTooltip() {
    // Remove any existing tip on this button first
    $btn.find('.copy-tooltip').remove();


  function showTooltip() {
     var $tip = $('<span class="copy-tooltip">Copied ✓</span>');
     var $tip = $('<span class="copy-tooltip">Copied ✓</span>');
     $btn.append($tip);
     $btn.css('position', 'relative').append($tip);
 
    // Trigger animation on next frame so transition fires
    requestAnimationFrame(function () {
      requestAnimationFrame(function () {
        $tip.addClass('copy-tooltip-visible');
      });
    });


     setTimeout(function () {
     setTimeout(function () {
       $tip.fadeOut(200, function () { $(this).remove(); });
       $tip.removeClass('copy-tooltip-visible');
     }, 1200);
      // Remove after fade-out transition completes
      setTimeout(function () { $tip.remove(); }, 400);
     }, 1400);
   }
   }


Line 91: Line 38:
   }
   }
}
}
    // ── Commentary toggle handler ─────────────────────────────────────────
    function handleCommentary( btn ) {
        var verseId = btn.getAttribute( 'data-verse' );
        if ( !verseId ) return;
        var block = document.getElementById( verseId );
        if ( !block ) return;
        // Toggle visibility of all commentary panels inside this verse block
        var panels = block.querySelectorAll( '.commentary-block' );
        panels.forEach( function ( panel ) {
            var isHidden = panel.style.display === 'none' || !panel.style.display;
            panel.style.display = isHidden ? '' : 'none';
        } );
        btn.classList.toggle( 'verse-action-active' );
    }
    // ── Single delegated listener on the document ─────────────────────────
    document.addEventListener( 'click', function ( e ) {
        var btn = e.target.closest( '.verse-action-btn' );
        if ( !btn ) return;
        if ( btn.classList.contains( 'verse-action-copy' ) ) {
            handleCopy( btn );
        } else if ( btn.classList.contains( 'verse-action-commentary' ) ) {
            handleCommentary( btn );
        }
    } );
}() );

Revision as of 08:53, 26 March 2026

/* ── Verse Actions ─────────────────────────────────────────────────────── */
( function () {
    'use strict';

    /* =========================
   COPY FUNCTION + TOOLTIP
========================= */
function copyText(text, $btn) {
  function showTooltip() {
    // Remove any existing tip on this button first
    $btn.find('.copy-tooltip').remove();

    var $tip = $('<span class="copy-tooltip">Copied ✓</span>');
    $btn.css('position', 'relative').append($tip);

    // Trigger animation on next frame so transition fires
    requestAnimationFrame(function () {
      requestAnimationFrame(function () {
        $tip.addClass('copy-tooltip-visible');
      });
    });

    setTimeout(function () {
      $tip.removeClass('copy-tooltip-visible');
      // Remove after fade-out transition completes
      setTimeout(function () { $tip.remove(); }, 400);
    }, 1400);
  }

  if (navigator.clipboard && window.isSecureContext) {
    navigator.clipboard.writeText(text).then(showTooltip);
  } else {
    var $temp = $('<textarea>').val(text).appendTo('body');
    $temp[0].select();
    document.execCommand('copy');
    $temp.remove();
    showTooltip();
  }
}
    // ── Commentary toggle handler ─────────────────────────────────────────
    function handleCommentary( btn ) {
        var verseId = btn.getAttribute( 'data-verse' );
        if ( !verseId ) return;

        var block = document.getElementById( verseId );
        if ( !block ) return;

        // Toggle visibility of all commentary panels inside this verse block
        var panels = block.querySelectorAll( '.commentary-block' );
        panels.forEach( function ( panel ) {
            var isHidden = panel.style.display === 'none' || !panel.style.display;
            panel.style.display = isHidden ? '' : 'none';
        } );

        btn.classList.toggle( 'verse-action-active' );
    }

    // ── Single delegated listener on the document ─────────────────────────
    document.addEventListener( 'click', function ( e ) {
        var btn = e.target.closest( '.verse-action-btn' );
        if ( !btn ) return;

        if ( btn.classList.contains( 'verse-action-copy' ) ) {
            handleCopy( btn );
        } else if ( btn.classList.contains( 'verse-action-commentary' ) ) {
            handleCommentary( btn );
        }
    } );

}() );