https://kuruma-news.jp/wp-content/themes/pc/common/js/zip-routing-modal.js?ver=20260924134028

1const zipRoutingModal = document.getElementById('zipRoutingModal');
2const closeZipRoutingModal = document.getElementById('closeZipRoutingModal');
3const zipRoutingSubmitButton = document.getElementById('zipRoutingSubmitButton');
4const zipRoutingZipcode = document.getElementById('zipRoutingZipcode');
5const zipRoutingErrorMessage = document.getElementById('zipRoutingErrorMessage');
6let zipRoutingScrollPosition = 0;
7
8// カーセブンLP URL
9const CARSEVEN_LP_URL = 'https://www.carseven.co.jp/satei/satei_mv';
10
11// fallback URL
12let zipRoutingFallbackUrl = '';
13
14
15/**
16 * モーダルを開く
17 */
18window.openZipRoutingModal = function (fallbackUrl) {
19    if (!zipRoutingModal) {
20        console.warn('zip routing modal not found');
21        return;
22    }
23
24    // fallback URL保持
25    zipRoutingFallbackUrl = fallbackUrl;
26
27    zipRoutingScrollPosition = window.scrollY;
28    zipRoutingModal.showModal();
29    document.documentElement.classList.add('zip-routing-modal-open');
30}
31
32/**
33 * 必須要素が存在しない場合は処理しない
34 */
35if (!zipRoutingModal || !closeZipRoutingModal || !zipRoutingSubmitButton || !zipRoutingZipcode || !zipRoutingErrorMessage) {
36
37    console.warn('zip routing modal element not found');
38
39} else {
40    /**
41     * モーダル初期化
42     */
43    function resetZipRoutingModal() {
44        zipRoutingZipcode.value = '';
45        zipRoutingErrorMessage.textContent = '';
46
47        zipRoutingSubmitButton.disabled = false;
48        zipRoutingSubmitButton.textContent = '査定サイトに進む';
49
50        zipRoutingSubmitButton.classList.remove('zip-routing-modal__button--active');
51        zipRoutingSubmitButton.classList.add('zip-routing-modal__button--gray');
52    }
53
54    /**
55     * モーダルを閉じる
56     */
57    function closeZipRoutingModalFunc() {
58        zipRoutingModal.close();
59        document.documentElement.classList.remove('zip-routing-modal-open');
60        window.scrollTo(0, zipRoutingScrollPosition);
61        resetZipRoutingModal();
62    }
63
64    /**
65     * 閉じるボタン
66     */
67    // 閉じるボタンクリック
68    closeZipRoutingModal.addEventListener('click', () => {
69        closeZipRoutingModalFunc();
70    });
71
72    // ESCキー押下
73    zipRoutingModal.addEventListener('cancel', (event) => {
74        event.preventDefault();
75        closeZipRoutingModalFunc();
76    });
77
78    /**
79     * 郵便番号入力チェック
80     */
81    zipRoutingZipcode.addEventListener('input', () => {
82
83        const zipValue = zipRoutingZipcode.value;
84
85        const hasNonNumbers = /[^0-9]/.test(zipValue);
86
87        // エラーメッセージ
88        if (zipValue !== '' && hasNonNumbers) {
89
90            zipRoutingErrorMessage.textContent =
91                '※半角数字のみ入力してください';
92        } else {
93            zipRoutingErrorMessage.textContent = '';
94        }
95
96        // ボタン状態変更
97        if (zipValue.length === 7 && !hasNonNumbers) {
98
99            zipRoutingSubmitButton.classList.remove(
100                'zip-routing-modal__button--gray'
101            );
102
103            zipRoutingSubmitButton.classList.add(
104                'zip-routing-modal__button--active'
105            );
106
107        } else {
108
109            zipRoutingSubmitButton.classList.remove(
110                'zip-routing-modal__button--active'
111            );
112
113            zipRoutingSubmitButton.classList.add(
114                'zip-routing-modal__button--gray'
115            );
116        }
117    });
118
119    /**
120     * ボタンクリック
121     */
122    zipRoutingSubmitButton.addEventListener('click', async () => {
123
124        const zipValue = zipRoutingZipcode.value;
125        const isComplete = zipValue.length === 7 && /^[0-9]+$/.test(zipValue);
126
127        // 7桁未満はfallback遷移
128        if (!isComplete) {
129            window.open(zipRoutingFallbackUrl, '_blank', 'noopener');
130            closeZipRoutingModalFunc();
131
132            return;
133        }
134
135        // 通信中UI
136        zipRoutingSubmitButton.disabled = true;
137        zipRoutingSubmitButton.textContent = '確認中...';
138
139        // fetchタイムアウト設定（5秒）
140        const controller = new AbortController();
141        const timeoutId = setTimeout(() => {
142            controller.abort();
143        }, 5000);
144
145        try {
146            // zip routing API 実行
147            const response = await fetch(
148                `/wp-json/kurumanews/v1/zip-routing?zipcode=${encodeURIComponent(zipValue)}`,
149                {
150                    method: 'GET',
151                    headers: {
152                        'Content-Type': 'application/json',
153                    },
154                    signal: controller.signal,
155                }
156            );
157
158            // JSON取得
159            const data = await response.json();
160
161            if (data.is_carseven) {
162                // カーセブンLP遷移
163                window.open(CARSEVEN_LP_URL, '_blank', 'noopener');
164            } else {
165                // fallback遷移
166                window.open(zipRoutingFallbackUrl, '_blank', 'noopener');
167            }
168
169        } catch (error) {
170
171            // AbortControllerによるタイムアウト
172            if (error.name === 'AbortError') {
173                console.warn('zip routing api timeout');
174            } else {
175                console.error(error);
176            }
177
178            // API失敗時はfallback遷移
179            window.open(zipRoutingFallbackUrl, '_blank', 'noopener');
180
181        } finally {
182
183            // タイマー解除
184            clearTimeout(timeoutId);
185
186            // モーダルを閉じる
187            closeZipRoutingModalFunc();
188        }
189    });
190}