youtube-watch-later-total-duration.user.js

// ==UserScript==
// @name         Youtube watch later total duration
// @namespace    http://vincent.billey.me
// @version      0.1
// @description  Displays the total duration of your watch later playlist on youtube
// @author       You
// @match        https://www.youtube.com/playlist?list=WL
// @grant        none
// ==/UserScript==

var getDuration = function() {
    var time = [].reduce.call(document.querySelectorAll(".timestamp span"), function(previous, current) {
        var timestamp = current.innerHTML.split(":").reverse();
        previous += parseInt(timestamp[0]);
        if (timestamp[1]) {
            previous += parseInt(timestamp[1]) * 60;
        }
        if (timestamp[2]) {
            previous += parseInt(timestamp[2]) * 3600;
        }
        return previous;
    }, 0);

    var hours = Math.floor(time / 3600);
    hours = hours < 10 ? "0" + hours : hours;
    var minutes = Math.floor( (time - hours * 3600) / 60 );
    minutes = minutes < 10 ? "0" + minutes : minutes;
    var seconds = time - hours * 3600 - minutes * 60;
    seconds = seconds < 10 ? "0" + seconds : seconds;
    var duration = hours + ":" + minutes + ":" + seconds;
    return duration;
};

var getOrCreateDurationDiv = function() {
  var id = "tamper-monkey-watch-later-total-duration";
  if (document.querySelector("#" + id)) {
    return document.querySelect("#" + id);
  } else {
    var div = document.createElement('div');
    div.id = "tamper-monkey-watch-later-total-duration";
    div.setAttribute('style', "position: fixed; bottom: 10px; right: 10px; background-color: white; padding: 10px; border-radius: 3px; border: 1px solid #e2e2e2; display: flex; align-items: center;");
    div.innerHTML = "<div id='tamper-monkey-watch-later-total-duration-content' style='padding-right: 10px;'></div>" +
        "<span title='Refresh' id='tamper-monkey-watch-later-total-duration-content-reload' style='background: no-repeat url(//s.ytimg.com/yts/imgbin/www-hitchhiker-vfltXXB8s.webp) 0 -540px red; background-size: auto; width: 20px; height: 20px; cursor: pointer;'></span>";
    document.body.appendChild(div);
    return div;
  }
};

var div = getOrCreateDurationDiv();
var refresh = function() {
   div.querySelector("#tamper-monkey-watch-later-total-duration-content").innerHTML = getDuration();
};
refresh();
div.querySelector("#tamper-monkey-watch-later-total-duration-content-reload").addEventListener("click", refresh);
document.querySelectorAll(".pl-video-edit-remove").addEventListener("click", refresh);