document.addEventListener('DOMContentLoaded', function () {
    const scrollDownButton = document.getElementById('scrollDown');
    const sections = document.querySelectorAll('.section');
    const currentSectionNumberElement = document.getElementById('currentSectionNumber');
    const totalSectionsElement = document.getElementById('totalSections');

    // 初期化時にセクションの数を表示
    totalSectionsElement.textContent = sections.length;

    function updateButton() {
        const lastSection = sections[sections.length - 1];
        const lastSectionRect = lastSection.getBoundingClientRect();
        let currentSectionIndex = -1;

        sections.forEach((section, index) => {
            const rect = section.getBoundingClientRect();
            if (rect.top <= window.innerHeight / 2 && rect.bottom >= window.innerHeight / 2) {
                currentSectionIndex = index + 1; // インデックスを1から始めるために+1を追加
            }
        });

        if (currentSectionIndex === -1) {
            currentSectionIndex = 1; // ページ初期読み込み時のデフォルト
        }

        currentSectionNumberElement.textContent = currentSectionIndex;

        if (lastSectionRect.bottom <= window.innerHeight && currentSectionIndex === sections.length) {
            scrollDownButton.classList.remove('visible'); // スクロールダウンボタンを非表示にする
            scrollDownButton.innerHTML = '<span>Scroll Top</span><div class="arrow">↑</div>';
            scrollDownButton.dataset.action = 'up';
            scrollDownButton.addEventListener('click', function () {
                window.scrollTo({ top: 0, behavior: 'smooth' });
            });
            scrollDownButton.classList.add('visible'); // ページ末尾でのみスクロールトップボタンを表示する
        } else {
            scrollDownButton.classList.remove('visible'); // スクロールダウンボタンを非表示にする
            scrollDownButton.innerHTML = '<span>Scroll Down</span><div class="arrow">↓</div>';
            scrollDownButton.dataset.action = 'down';
            scrollDownButton.addEventListener('click', function () {
                let currentSectionIndex = -1;

                sections.forEach((section, index) => {
                    const rect = section.getBoundingClientRect();
                    if (rect.top <= window.innerHeight / 2 && rect.bottom >= window.innerHeight / 2) {
                        currentSectionIndex = index;
                    }
                });

                if (currentSectionIndex >= 0 && currentSectionIndex < sections.length - 1) {
                    const nextSection = sections[currentSectionIndex + 1];
                    const offset = nextSection.offsetTop;
                    window.scrollTo({ top: offset, behavior: 'smooth' });
                } else if (currentSectionIndex === sections.length - 1) {
                    const lastSection = sections[currentSectionIndex];
                    const offset = lastSection.offsetTop;
                    window.scrollTo({ top: offset, behavior: 'smooth' });
                }
            });
        }
    }

    document.addEventListener('scroll', function () {
        updateButton();
    });

    // 初期状態を設定
    updateButton();
});

//20240615 0242
//以下　改善点
//スマホサイズになった時にScrollDownが表示さないようにする
//スマホサイズになった時はページ末尾になった時にScrollTOPが表示されるようにする