https://i-shift.com/wp-content/themes/OriginalTheme/inc/front/js/fv-vanta.js

1jQuery(function ($) {
2
3  const waitFor = (testFn, cb, { interval = 50, timeout = 8000 } = {}) => {
4    const start = performance.now();
5    const t = setInterval(() => {
6      if (testFn()) {
7        clearInterval(t);
8        cb();
9        return;
10      }
11      if (performance.now() - start > timeout) clearInterval(t);
12    }, interval);
13  };
14
15  const mqlSP = window.matchMedia('(max-width: 768px)');
16  const mqlReduce = window.matchMedia('(prefers-reduced-motion: reduce)');
17
18  /* ---------- NET ---------- */
19  let vantaNet = null;
20
21  const mountNet = () => {
22    if (mqlReduce.matches) return;
23
24    const fv = document.querySelector('#FV');
25    const el = document.querySelector('#fv-vanta');
26    if (!fv || !el) return;
27
28    try { vantaNet?.destroy?.(); } catch (e) {}
29    vantaNet = window.VANTA.NET({
30      el,
31      mouseControls: true,
32      touchControls: true,
33      gyroControls: false,
34
35      // ★放置でも“ゆっくり動く”体感はこれ
36      // （0.2〜0.6あたりで調整）
37      speed: 0.6,
38
39      // 見た目（あなたの現状維持）
40      showDots: true,
41      points: mqlSP.matches ? 18.0 : 15.0,
42      maxDistance: mqlSP.matches ? 22.0 : 24.0,
43      spacing: mqlSP.matches ? 18.0 : 20.0,
44      color: 0xf06e00,
45      backgroundAlpha: 0.0,
46      backgroundColor: 0x000000,
47
48      minHeight: 200.0,
49      minWidth: 200.0,
50      scale: 1.0,
51      scaleMobile: 1.0
52    });
53  };
54
55  /* ---------- GLOBE ---------- */
56  let vantaGlobe = null;
57
58  const mountGlobe = () => {
59    if (mqlReduce.matches) return;
60
61    const el = document.querySelector('#globe-bg');
62    if (!el) return;
63
64    try { vantaGlobe?.destroy?.(); } catch (e) {}
65    vantaGlobe = window.VANTA.GLOBE({
66      el,
67      mouseControls: true,
68      touchControls: true,
69      gyroControls: false,
70      minHeight: 200.0,
71      minWidth: 200.0,
72
73      scale: 1.6,
74      scaleMobile: .0,
75
76      color: 0xf06e00,
77      color2: 0xb68f71,
78      backgroundAlpha: 0.0,
79      backgroundColor: 0x000000
80    });
81
82    requestAnimationFrame(() => {
83      const r = vantaGlobe?.renderer;
84      if (!r?.setPixelRatio) return;
85
86      const dpr = window.devicePixelRatio || 1;
87      const target = Math.min(dpr * 1.6, 3);
88      r.setPixelRatio(target);
89      if (r.setSize) r.setSize(el.clientWidth, el.clientHeight, false);
90    });
91  };
92
93  waitFor(() => !!window.THREE && !!window.VANTA?.NET, mountNet);
94  waitFor(() => !!window.THREE && !!window.VANTA?.GLOBE, mountGlobe);
95
96  if (mqlSP.addEventListener) {
97    mqlSP.addEventListener('change', () => {
98      mountNet();
99      mountGlobe();
100    });
101  }
102
103  window.addEventListener('beforeunload', () => {
104    try { vantaNet?.destroy?.(); } catch (e) {}
105    try { vantaGlobe?.destroy?.(); } catch (e) {}
106    vantaNet = null;
107    vantaGlobe = null;
108  });
109
110});