중앙대 e-class 동영상 플레이어에 남은 시간 표시해주는 유저스크립트

cau_eclass_tweak.user.js

// ==UserScript==
// @name         CAU e-class tweak
// @namespace    https://litehell.info/
// @version      1.0
// @description  Creates a left-time indicator in e-class video player
// @author       LiteHell
// @match        https://ocs.cau.ac.kr/em/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=eclass3.cau.ac.kr
// @grant        none
// ==/UserScript==

setTimeout(() => {
    (function() {
        'use strict';

        const formatTime = (time) => {
            const hours = Math.floor(time / 3600), minutes = Math.floor(time / 60) % 60, seconds = Math.floor(time) % 60;

            if (hours > 0)
                return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
            else
                return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
        };

        const player = document.querySelector('#uni-player');
        if (player === null)
            return;

        const timeSpace = document.querySelector('.vc-pctrl-play-time-text-area');
        timeSpace.style.width = '300px';

        const separator = document.createElement('span');
        separator.className = 'vc-pctrl-time-separator';
        separator.innerHTML = '/';

        const leftTime = document.createElement('span');
        leftTime.className = 'vc-pctrl-total-duration left-time'

        setInterval(() => {
            const video = document.querySelector('video');
            if (video === null)
                return;
            const time = (video.duration - video.currentTime);
            const timeInPlaybackRate = time * (1 / video.playbackRate);

            if (video.playbackRate === 1)
                leftTime.textContent = ` -${formatTime(time)}`;
            else
                leftTime.textContent = ` -${formatTime(timeInPlaybackRate)} (${formatTime(time)})`
        }, 500);

    timeSpace.appendChild(separator);
    timeSpace.appendChild(leftTime);
})();
}, 100);