/* ==========================================================================
   Augusta Pediatric Associates — "More Services" as the tilt slider

   The individual service pages ended with a row of the other services. It was
   a static theme grid, then a linear marquee; it now runs the motion library's
   **C20 Tilt Slider** (a measured replica of the Framer Marketplace component),
   whose law is worth stating because the name misleads:

     the cards do NOT tilt on hover. They rotate about Y with the DRAG,
     the whole slab leaning together into the direction of travel, capped
     at about 18deg, relaxing to 0 when you let go.

   `tiltslider.js` and `tiltslider.css` are copied in verbatim and not edited.
   Everything here is the practice's content and the skin.

   Each page drops its own service from the list — there is no reason to offer
   someone the page they are already reading.
   ========================================================================== */

(function () {
  'use strict';

  var SERVICES = [
    { slug: 'sick-child',
      name: 'Sick Child Care',
      href: '/service/sick-child/',
      shot: '/wp-content/uploads/2020/10/GettyImages-1190214200-min-scaled.jpg',
      desc: 'Same day sick appointments, approximately 360 days a year.' },

    { slug: 'new-baby-checkup',
      name: 'Newborn Baby Checkup',
      href: '/service/new-baby-checkup/',
      shot: '/wp-content/uploads/2020/10/GettyImages-1152209563-min-scaled.jpg',
      desc: 'Your first visit with us, one to three days after you take your baby home.' },

    { slug: 'well-checks',
      name: 'Well Checks',
      href: '/service/well-checks/',
      shot: '/wp-content/uploads/2020/10/GettyImages-1159650216-min-scaled.jpg',
      desc: 'Checkups, immunizations, screenings, lab work and sports physicals.' },

    { slug: 'immunizations',
      name: 'Immunizations',
      href: '/service/immunizations/',
      shot: '/wp-content/uploads/2020/10/GettyImages-1205239076-min.jpg',
      desc: 'We follow the CDC and ACIP guidelines for childhood vaccines.' },

    { slug: 'lab-testing',
      name: 'Lab Testing',
      href: '/service/lab-testing/',
      shot: '/wp-content/uploads/2025/11/woman-preparing-tools-for-work-in-the-laboratory-2024-10-21-20-31-05-utc-scaled.jpg',
      desc: 'A CLIA waived certified lab in house, for most routine work.' },

    { slug: 'in-office-procedures',
      name: 'In-Office Procedures',
      href: '/service/in-office-procedures/',
      shot: '/wp-content/uploads/2025/11/baby4.jpg',
      desc: 'Many procedures done here, often sparing a trip to the Emergency Department.' },

    { slug: 'lactation-consultation-services',
      name: 'Lactation Consultation',
      href: '/service/lactation-consultation-services/',
      shot: '/wp-content/uploads/2020/10/GettyImages-1173180630-min-scaled.jpg',
      desc: 'A certified lactation counselor on staff, for whatever your journey looks like.' }
  ];

  function boot() {
    var root = document.getElementById('apa-service-tilt');
    if (!root || typeof TiltSlider === 'undefined') return;

    var skip = root.getAttribute('data-skip') || '';
    var cards = SERVICES.filter(function (s) { return s.slug !== skip; });

    var slider = new TiltSlider(root, {
      cards: cards.map(function (s) {
        return { shot: s.shot, role: 'Services', name: s.name, desc: s.desc };
      })
    });

    /* The component renders the cards twice so the loop has something to wrap
       into, so the links have to be applied by walking what it built rather
       than by index into the source list. */
    var els = root.querySelectorAll('.tilt__card');
    for (var i = 0; i < els.length; i++) {
      var s = cards[i % cards.length];
      var a = document.createElement('a');
      a.className = 'apa-tilt-link';
      a.href = s.href;
      a.setAttribute('aria-label', s.name);
      els[i].appendChild(a);
    }

    /* A drag ends with the pointer still over a card and the browser calls it
       a click — this slider throws, so that is even easier to trigger here
       than on the arc. Past a few pixels it is a spin, not a visit. */
    var dx = 0, dy = 0;
    root.addEventListener('pointerdown', function (e) { dx = e.clientX; dy = e.clientY; }, true);
    root.addEventListener('click', function (e) {
      if (Math.abs(e.clientX - dx) > 4 || Math.abs(e.clientY - dy) > 4) {
        e.preventDefault();
        e.stopPropagation();
      }
    }, true);

    root.classList.add('is-ready');
    return slider;
  }

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