<script>
/* ---------------------------
フォーム内指定テキスト英語化 v1.0.0​​​​​
--------------------------- */
'use strict';

document.addEventListener('DOMContentLoaded', function () {
/* ---------------------------
フォームエラー文を変更
--------------------------- */
/* 動的な要素を監視して実行する */
const observer = new MutationObserver( () => {
let errorMessage = document.querySelectorAll('.en .alert-danger');/* エラー文のクラス */
for (let i = 0; i < errorMessage.length; i++) {
/* 左に変更したいテキスト・右に変更後のテキストを入れる */
errorMessage[i].textContent = errorMessage[i].innerHTML
.replace('は必須です。', ' is required field.')
.replace('は必須です', ' is required field.')
.replace('は、半角数字、プラス記号 (+)、ハイフン (-) のみを使用し、最大20桁までの長さで入力してください。', ' : Letters must be less than 20 characters. (only "+" and "-" are available for symbols)')
.replace('は、httpもしくはhttpsで始まる文字列を入力してください。', ' : Please make sure that your URL starts with "http" or "https".')
.replace('は、全角カタカナで入力してください。', ' : Please input using full-width katakana.')
.replace('は、半角数字とハイフンで入力してください。', ' : Please input using half-width numbers and hyphen.')
.replace('は、メールアドレス形式で入力してください。', ' : Please enter a valid email address.')
.replace('は、正の整数を入力してください。', ' : Please enter an integer.');
/* DOM変化の監視を一時停止 */
observer.disconnect();
}
/* 処理再開 */
setTimeout(() => {
observer.observe(target, {
childList: true,/* 監視対象の要素の子要素を指定 */
subtree: true,/* 孫以降のノードの変化も検出 */
characterData: true,/* 文字列の変化を監視 */
});
}, 100);
});


const target = document.querySelectorAll('.en .show-notice')[0];/* エラー文の一覧を囲っているクラス */
/* 監視対象のものを設定 */
observer.observe(target, {
childList: true,/* 監視対象の要素の子要素を指定 */
subtree: true,/* 孫以降のノードの変化も検出 */
characterData: true,/* 文字列の変化を監視 */
});


/* ---------------------------
確認画面モーダル内のテキストを変更
--------------------------- */
/* 動的な要素を監視して実行する */
const observer02 = new MutationObserver( () => {
const sendText = document.querySelectorAll('.ReactModal__Content span')[0];/* 確認モーダル内リード文 */
const cancelBtn = document.querySelectorAll(`[class^='styles_contact-submit-cancel']`)[0];/* 確認モーダル内キャンセルボタン */
const sendBtn = document.querySelectorAll(`[class^='styles_contact-submit-confirm']`)[0];/* 確認モーダル内送信ボタン */
/* キャンセルボタンかつ送信ボタンがあれば実行 */
if (cancelBtn || sendBtn) {
/* 左に変更したいテキスト・右に変更後のテキストを入れる */
/* sendText.textContent = sendText.innerHTML.replace('この内容で送信します。よろしいですか？', 'Send with this content. Is it OK?');*/
sendText.textContent = "Please check the contents, then click 'send' button.";
cancelBtn.textContent = 'cancel';
sendBtn.textContent = 'send';
} else {
return
}
});

const target02 = document.querySelectorAll('.ReactModalPortal')[0];/* 確認画面モーダルのクラス */
/* 監視対象のものを設定 */
observer02.observe(target02, {
childList: true/* 監視対象の要素の子要素を指定 */
});

/* ---------------------------
送信後テキストを変更
--------------------------- */
/* 動的な要素を監視して実行する */
const observer03 = new MutationObserver( () => {
const sendingText = document.querySelectorAll('.form-submiting-message, .form-submitting-message',)[0];/* 送信後テキストを取得 */
if (sendingText) {
/* 左に変更したいテキスト・右に変更後のテキストを入れる */
sendingText.textContent = 'Sending.';
} else {
return
}
});

const target03 = document.querySelectorAll('.group:last-child')[0];/* 送信後のテキストが含まれる親要素 */
/* 監視対象のものを設定 */
observer03.observe(target03, {
childList: true/* 監視対象の要素の子要素を指定 */
});

});
</script>
<style>
.theme-fo-base .component.form.en .form-label.require:not(:root:root:root):after {
content: "Required";/* 必須ボタン英語化 */
}
</style>
<!-- フォーム内指定テキスト英語化 END -->