// ==UserScript==
// @name         Youtube: show true duration and time
// @namespace    lin.ce
// @version      0.1
// @description  Changes the video time based on playback speed.
// @author       yesnt
// @match        https://www.youtube.com/watch*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=youtube.com
// @grant        none
// @require https://code.jquery.com/jquery-3.6.0.min.js
// ==/UserScript==

(function() {
    'use strict';

    var htmlVideoPlayer = $(".html5-main-video")[0];
    var ytdVideoPlayer = $("ytd-player");
    var durationField = $(".ytp-time-duration")[0];
    var currentField = $(".ytp-time-current")[0];

    // TODO: There's got to be a better way to do this.
    // This tries to fix the current timestamp flickering like crazy.
    $("<span id=\"userscript-time\">0:00<\span>").insertAfter(currentField);
    currentField.style.display = "none";
    var customCurrentField = $("#userscript-time")[0];

    function recomputePlaybackSpeed() {
        var videoDuration = htmlVideoPlayer.duration;
        var videoSpeed = htmlVideoPlayer.playbackRate;
        var finalSpeed = videoDuration / videoSpeed;
        // https://stackoverflow.com/a/25279340
        var readableTime = finalSpeed < 3600 ? new Date(finalSpeed * 1000).toISOString().substring(14, 19) : new Date(finalSpeed * 1000).toISOString().substr(11, 8);
        durationField.textContent = readableTime[0] != "0" ? readableTime : readableTime.slice(1);
    }

    function recomputeCurrentTime() {
        var videoCurtime = htmlVideoPlayer.currentTime;
        var videoSpeed = htmlVideoPlayer.playbackRate;
        var finalCurtime = videoCurtime / videoSpeed;

        var readableTime = finalCurtime < 3600 ? new Date(finalCurtime * 1000).toISOString().substring(14, 19) : new Date(finalCurtime * 1000).toISOString().substr(11, 8);
        customCurrentField.textContent = readableTime[0] != "0" ? readableTime : readableTime.slice(1);
    }

    htmlVideoPlayer.onratechange = recomputePlaybackSpeed;
    htmlVideoPlayer.addEventListener("canplay", recomputePlaybackSpeed);
    htmlVideoPlayer.addEventListener("timeupdate", recomputeCurrentTime);
})();