const passwordForm = document.getElementById('passwordForm');
const passwordInput = document.getElementById('passwordInput');
const toggleButton = document.getElementById('toggleButton');
const passwordDisplay = document.getElementById('passwordDisplay');
const passwordDisplayNotice = document.getElementById('passwordDisplayNotice');
const browser = window.navigator.userAgent.toLowerCase();

// JavaScript 有効時、もし Edge でなければ、トグルボタンとパスワード表示エリアを提示する。
if (browser.indexOf("edg") === -1) {
toggleButton.removeAttribute("hidden");
passwordDisplay.removeAttribute("hidden");
}

// 
passwordInput.addEventListener('input', () => {
  const passwordValue = passwordInput.value;
  passwordDisplay.textContent = passwordValue;
});

toggleButton.addEventListener('click', () => {
    if (passwordDisplay.style.display === 'none') {
        passwordDisplay.style.display = 'block';
        toggleButton.textContent = '隠す';
        setTimeout(passwordDisplayNotice.textContent = 'パスワードの文字が、パスワード入力欄と「隠す」ボタンのすぐ下に、展開表示された状態です。', 2000);
    } else {
        passwordDisplay.style.display = 'none';
        toggleButton.textContent = '表示する';
        setTimeout(passwordDisplayNotice.textContent = 'パスワードの文字が、隠された状態です。', 2000);
    }
});

// フォームの送信時のダミー処理（送信した旨のアラートを表示）

passwordForm.addEventListener('submit', (event) => {
    event.preventDefault(); // フォームの実際の送信を防ぐ   
    alert('送信しました。');
});