https://www.1101.com/home/2025/js/_base.bb07fe2a.js

1document.addEventListener("DOMContentLoaded", () => {
2  initViewportObserver();
3});
4document.addEventListener("alpine:init", () => {
5  window.loadMore = loadMore;
6});
7const BREAKPOINT_SP = 600;
8const BREAKPOINT_TAB = 992;
9const BREAKPOINT_PC = 1200;
10function rem(px, base = 16) {
11  return `${px / base}rem`;
12}
13function shuffle(argArray) {
14  const array = argArray.slice();
15  for (let i = array.length - 1; i > 0; i--) {
16    let j = Math.floor(Math.random() * (i + 1));
17    [array[i], array[j]] = [array[j], array[i]];
18  }
19  return array;
20}
21window.shuffle = shuffle;
22function initViewportObserver(customClasses = []) {
23  if (typeof customClasses === "string") {
24    customClasses = [customClasses];
25  }
26  const targetClasses = ["observe-target", ...customClasses];
27  const selectors = targetClasses.map((className) => `.${className}`).join(", ");
28  const headings = document.querySelectorAll(selectors);
29  const options = {
30    threshold: 0.2
31  };
32  const observer = new IntersectionObserver(showElements, options);
33  headings.forEach((heading) => {
34    observer.observe(heading);
35  });
36  function showElements(entries) {
37    entries.forEach((entry) => {
38      if (entry.isIntersecting) {
39        entry.target.classList.add("active");
40      } else {
41        entry.target.classList.remove("active");
42      }
43    });
44  }
45}
46function debounce(fn, delay) {
47  let timer = null;
48  return function(...args) {
49    clearTimeout(timer);
50    timer = setTimeout(() => fn.apply(this, args), delay);
51  };
52}
53function loadMore({ initialSpCount = 3, initialTabCount = 4, totalCount = 12 } = {}) {
54  const windowStore = Alpine.store("window");
55  let initialVisibleCount = initialSpCount;
56  if (windowStore.isTAB) {
57    initialVisibleCount = initialTabCount;
58  }
59  if (windowStore.isPC) {
60    initialVisibleCount = totalCount;
61  }
62  return {
63    initialSpCount,
64    initialTabCount,
65    totalCount,
66    visibleCount: initialVisibleCount,
67    prevDevice: windowStore.device,

68    loadMoreItems() {
69      const increment = windowStore.isPC ? this.totalCount : windowStore.isTAB ? this.initialTabCount : this.initialSpCount;
70      this.visibleCount = Math.min(this.visibleCount + increment, this.totalCount);
71    }
72    // resetVisibleCount() {
73    //   // デバイスごとにvisibleCountをリセット
74    //   this.visibleCount = this.initialSpCount;
75    //   if (windowStore.isTAB) {
76    //     this.visibleCount = this.initialTabCount;
77    //   }
78    //   if (windowStore.isPC) {
79    //     this.visibleCount = this.totalCount;
80    //   }
81    // }
82  };
83}
84function initSplideArrows() {
85  return {
86    // カスタム矢印のSVGを設定
87    arrowPath: `
88      M20,2C10.1,2,2,10.1,2,20s8.1,18,18,18,18-8.1,18-18S29.9,2,20,2ZM20,36.6c-9.2,0-16.6-7.4-16.6-16.6S10.8,3.4,20,3.4s16.6,7.5,16.6,16.6-7.5,16.6-16.6,16.6Z
89      M16.6,10c-.3.3-.3.7,0,1l8.4,8.4h-11.8c-.4,0-.7.3-.7.7s.3.7.7.7h11.8l-8,8c-.3.3-.3.7,0,1s.3.2.5.2.4,0,.5-.2l9.7-9.7-10-10c-.3-.3-.7-.3-1,0v-.2Z
90    `
91  };
92}
93const SPLIDE_I18N_JA = {
94  prev: "前へ",
95  next: "次へ",
96  first: "最初のスライドへ",
97  last: "最後のスライドへ",
98  slideX: "%s枚目のスライド",
99  pageX: "%sページ目へ",
100  play: "自動再生を開始",
101  pause: "自動再生を停止"
102};
103function getSplideA11yOptions(label) {
104  return {
105    keyboard: "focused",
106    paginationKeyboard: true,
107    slideFocus: true,
108    label,
109    i18n: SPLIDE_I18N_JA,
110    reducedMotion: {
111      autoplay: "pause",
112      speed: 0
113    }
114  };
115}
116function resolveCarouselLabel({ element, fallback, titleText = "", index = 0, total = 1, appendIndex = false }) {
117  var _a;
118  const ariaLabel = ((_a = element == null ? void 0 : element.getAttribute("aria-label")) == null ? void 0 : _a.replace(/\s+/g, " ").trim()) || "";
119  const normalizedTitle = titleText.replace(/\s+/g, " ").trim();
120  const baseLabel = ariaLabel || (normalizedTitle ? `${normalizedTitle} 一覧` : fallback);
121  return appendIndex && total > 1 ? `${baseLabel} ${index + 1}` : baseLabel;
122}
123function bindActiveSlideAria(splide) {
124  const updateAriaCurrent = () => {
125    var _a, _b;
126    const slides = (_b = (_a = splide == null ? void 0 : splide.Components) == null ? void 0 : _a.Elements) == null ? void 0 : _b.slides;
127    if (!slides || !slides.length) return;
128    slides.forEach((slide) => {
129      slide.removeAttribute("aria-current");
130    });
131    const activeSlide = slides[splide.index];
132    if (activeSlide) {
133      activeSlide.setAttribute("aria-current", "true");
134    }
135  };
136  splide.on("mounted move moved updated", updateAriaCurrent);
137}
138function bindTrackPaddingOnMove(splide, getPadding, options = {}) {
139  const { disableTransition = false } = options;
140  splide.on("move", () => {
141    var _a, _b;
142    const track = (_b = (_a = splide == null ? void 0 : splide.Components) == null ? void 0 : _a.Elements) == null ? void 0 : _b.track;
143    if (!track) return;
144    const perPage = Number(splide.options.perPage) || 1;
145    const isLastPage = splide.index >= splide.length - perPage;
146    const padding = getPadding({ isLastPage, splide });
147    if (!padding) return;
148    if (disableTransition) {
149      track.style.transition = "none";
150    }
151    track.style.paddingLeft = padding.left;
152    track.style.paddingRight = padding.right;
153    if (disableTransition) {
154      requestAnimationFrame(() => {
155        track.style.transition = "";
156      });
157    }
158  });
159}
160function initPickupSplide() {
161  const arrowSettings = initSplideArrows();
162  const pickupElements = document.querySelectorAll(".pickup-carousel");
163  if (!pickupElements.length) {
164    return;
165  }
166  pickupElements.forEach((pickupElement, index) => {
167    const slideCount = pickupElement.querySelectorAll(".splide__slide").length;
168    const isSingle = slideCount <= 1;
169    const instanceLabel = resolveCarouselLabel({
170      element: pickupElement,
171      fallback: "ピックアップ一覧",
172      index,
173      total: pickupElements.length
174    });
175    pickupElement.setAttribute("aria-label", instanceLabel);
176    const pickup = new Splide(pickupElement, {
177      mediaQuery: "min",
178      type: isSingle ? "slide" : "loop",
179      drag: !isSingle,
180      ...getSplideA11yOptions(instanceLabel),
181      keyboard: !isSingle ? "focused" : false,
182      pagination: !isSingle,

183      arrows: false,
184      autoplay: !isSingle,
185      updateOnMove: true,
186      cloneStatus: false,
187      breakpoints: {
188        1280: {
189          ...arrowSettings,
190          // 矢印の設定を適用
191          arrows: !isSingle
192          // 矢印を有効化
193        }
194      }
195    });
196    bindActiveSlideAria(pickup);
197    pickup.mount();
198  });
199}
200export {
201  BREAKPOINT_PC,
202  BREAKPOINT_SP,
203  BREAKPOINT_TAB,
204  bindActiveSlideAria,
205  bindTrackPaddingOnMove,
206  debounce,
207  getSplideA11yOptions,
208  initPickupSplide,
209  initSplideArrows,
210  rem,
211  resolveCarouselLabel
212};