Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

MediaWiki:Common.js: Difference between revisions

MediaWiki interface page
No edit summary
No edit summary
Line 10: Line 10:
     let startX;
     let startX;
     let scrollStart;
     let scrollStart;
    let movedEnough = false;


     carousel.addEventListener("pointerdown", function (e) {
     carousel.addEventListener("pointerdown", function (e) {
       isDragging = true;
       isDragging = true;
      movedEnough = false;
       carousel.classList.add("dragging");
       carousel.classList.add("dragging");
       startX = e.pageX;
       startX = e.pageX;
Line 23: Line 25:
       if (!isDragging) return;
       if (!isDragging) return;
       const x = e.pageX;
       const x = e.pageX;
       const walk = (x - startX) * 1.5; // Adjust scroll speed if desired
       const walk = (x - startX) * 1;
      if (Math.abs(walk) > 5) movedEnough = true;
       carousel.scrollLeft = scrollStart - walk;
       carousel.scrollLeft = scrollStart - walk;
       e.preventDefault();
       e.preventDefault();
Line 37: Line 40:
       carousel.classList.remove("dragging");
       carousel.classList.remove("dragging");
     });
     });
    // Block link clicks if a drag occurred
    carousel.addEventListener("click", function (e) {
      if (movedEnough) {
        e.preventDefault();
        e.stopImmediatePropagation();
      }
    }, true); // capture phase
   });
   });
});
});

Revision as of 14:54, 30 May 2025

/* Any JavaScript here will be loaded for all users on every page load. */


mw.loader.using('jquery', function () {
  $(function () {
    const carousel = document.querySelector('.card-carousel');
    if (!carousel) return;

    let isDragging = false;
    let startX;
    let scrollStart;
    let movedEnough = false;

    carousel.addEventListener("pointerdown", function (e) {
      isDragging = true;
      movedEnough = false;
      carousel.classList.add("dragging");
      startX = e.pageX;
      scrollStart = carousel.scrollLeft;
      carousel.setPointerCapture(e.pointerId);
      e.preventDefault();
    });

    carousel.addEventListener("pointermove", function (e) {
      if (!isDragging) return;
      const x = e.pageX;
      const walk = (x - startX) * 1;
      if (Math.abs(walk) > 5) movedEnough = true;
      carousel.scrollLeft = scrollStart - walk;
      e.preventDefault();
    });

    carousel.addEventListener("pointerup", function () {
      isDragging = false;
      carousel.classList.remove("dragging");
    });

    carousel.addEventListener("pointerleave", function () {
      isDragging = false;
      carousel.classList.remove("dragging");
    });

    // Block link clicks if a drag occurred
    carousel.addEventListener("click", function (e) {
      if (movedEnough) {
        e.preventDefault();
        e.stopImmediatePropagation();
      }
    }, true); // capture phase
  });
});