미디어위키:Common.js

/* 이 자바스크립트 설정은 모든 문서, 모든 사용자에게 적용됩니다. */

/**
 * Citizen search: open + focus immediately on user gesture (iOS-friendly)
 * - Intercepts tap on the <summary> so focus stays within the gesture stack
 * - Manually opens <details> and focuses #searchInput right away
 */
(function () {
  const DETAILS_ID = 'citizen-search-details';
  const TOGGLE_SEL = '#citizen-search-details > summary.citizen-dropdown-summary';
  const INPUT_ID = 'searchInput';

  function openAndFocus() {
    const details = document.getElementById(DETAILS_ID);
    const input = document.getElementById(INPUT_ID);

    if (!details || !input) return;

    // Open immediately (within the same user gesture)
    if (!details.open) details.open = true;

    // Force a tiny layout sync so iOS is less flaky about focus
    // (Reading offsetHeight triggers reflow; yes it's old-school, yes it works)
    void input.offsetHeight;

    input.focus({ preventScroll: true });
    input.click(); // helps some mobile engines trigger the keyboard
  }

  // Use the earliest possible gesture event
  document.addEventListener(
    'touchstart',
    function (e) {
      const toggle = e.target.closest(TOGGLE_SEL);
      if (!toggle) return;

      // Stop the default summary toggle so we control timing
      e.preventDefault();
      e.stopPropagation();

      openAndFocus();
    },
    { capture: true, passive: false } // passive:false is REQUIRED for preventDefault on iOS
  );

  // Fallback for non-touch / weird cases
  document.addEventListener(
    'click',
    function (e) {
      const toggle = e.target.closest(TOGGLE_SEL);
      if (!toggle) return;

      e.preventDefault();
      e.stopPropagation();

      openAndFocus();
    },
    true
  );
})();