☰

CIJ subtitle show on pause (Dynamic)

Automatically shows subtitles when video pauses and hides them when it plays, handling dynamic video loading.

目前為 2025-07-11 提交的版本，檢視 最新版本。

// ==UserScript==
// @name          CIJ subtitle show on pause (Dynamic)
// @namespace     http://tampermonkey.net/
// @version       2025-07-11
// @description   Automatically shows subtitles when video pauses and hides them when it plays, handling dynamic video loading.
// @author        Sapjax
// @license MIT
// @match         https://cijapanese.com/*
// @icon          https://www.google.com/s2/favicons?sz=64&domain=cijapanese.com
// @grant         none
// ==/UserScript==

(function() {
    const videoSelector = 'video';
    const subtitleSelector = '.vds-captions';

    let currentVideo = null;
    let currentSubtitle = null;

    const handlePlay = () => {
        document.querySelector(subtitleSelector)?.setAttribute('aria-hidden', 'true');
        console.log('Video playing, subtitles hidden.');
    };

    const handlePause = () => {
        document.querySelector(subtitleSelector)?.setAttribute('aria-hidden','false');
        console.log('Video paused, subtitles shown.');
    };


    function attachListeners(videoElement) {
        if (currentVideo === videoElement) {
            return;
        }

        // Clean up old listeners if a different video was being observed
        if (currentVideo) {
            removeListeners(currentVideo);
        }

        console.log('Attaching listeners to video and subtitle.');
        videoElement.addEventListener('play', handlePlay);
        videoElement.addEventListener('pause', handlePause);

        currentVideo = videoElement;
    }


    function removeListeners(videoElement) {
        console.log('Removing listeners from video.');
        videoElement.removeEventListener('play', handlePlay);
        videoElement.removeEventListener('pause', handlePause);

        currentVideo = null;
        currentSubtitle = null;
    }

    // --- MutationObserver Setup ---
    const observer = new MutationObserver((mutationsList, obs) => {
        const video = document.querySelector(videoSelector);

        if (video) {
            if (video !== currentVideo) {
                console.log('Video found or changed. Attaching listeners.');
                attachListeners(video);
            }
        }
        // Scenario 2: Video are no longer present
        else if (!video && currentVideo) { // If video disappeared
            console.log('Video disappeared. Removing listeners.');
            removeListeners(currentVideo);
        }
    });

    observer.observe(document.body, { childList: true, subtree: true });

    // Initial check in case the video and subtitle are already present on page load
    const initialVideo = document.querySelector(videoSelector);
    if (initialVideo) {
        console.log('Initial video found on page load. Attaching listeners.');
        attachListeners(initialVideo);
    } else {
        console.log('Video not found on initial load. Waiting for DOM changes.');
    }
})();