Raw Source Toggle Dropdown

• Minified Source

akuma06 / Funimation Timer

// ==UserScript==
// @name         Funimation Timer
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Displays a timer synced with the video playing.
// @author       akuma06
// @license      MIT
// @match        https://www.funimation.com/*
// @grant        none
// ==/UserScript==

(function () {
  'use strict';
  const config = {
    color: '#FFFFFF', // Can be a color in RGB or a word like "white"
    background: 'rgba(0, 0, 0, 0)', // Background defined in RGB and an opacity value: rgba(red, green, blue, opacity) with opacity ranging from 0 to 1 and colors from 0 to 255
    fontSize: '40px', // Size for the displayed timer (00:00:00)
    top: undefined, // To position the timer relative to the top border of the player, it can't be defined if bottom is defined (in pixels)
    left: undefined, // To position the timer relative to the left border of the player, it can't be defined if right is defined (in pixels)
    bottom: '30px', // To position the timer relative to the bottom border of the player (in pixels)
    right: '20px', // To position the timer relative to the right border of the player (in pixels)
  };

  function setupCountDown(player, doc) {
    player.ready(() => {
      const div = doc.createElement("div");
      div.innerText = "00:00:00";
      div.style.position = "absolute";
      if (config.bottom !== undefined && config.bottom != '') {
        div.style.bottom = config.bottom;
      }
      else if (config.top !== undefined && config.top != '') {
        div.style.top = config.top;
      }
      if (config.right !== undefined && config.right != '') {
        div.style.right = config.right;
      }
      else if (config.left !== undefined && config.left != '') {
        div.style.left = config.left;
      }
      div.style.zIndex = 100004;
      div.style.fontSize = config.fontSize;
      div.style.color = config.color;
      div.style.background = config.background;
      doc.querySelector("#brightcove-player").appendChild(div);
      player.on("timeupdate", (e) => {
        const elapsed = player.currentTime().toFixed();
        const hours = Math.floor(elapsed / 3600).toFixed();
        const minutes = Math.floor((elapsed - hours * 3600) / 60);
        const seconds = elapsed % 60;
        div.innerText = `${(hours > 9) ? hours : "0" + hours}:${(minutes > 9) ? minutes : "0" + minutes}:${(seconds > 9) ? seconds : "0" + seconds}`;
      });
    }, true);
  }
  if (document.querySelector("#brightcove-player") !== null) {
    setupCountDown(window.videojs("brightcove-player"), document);
  }
  else if (document.querySelector("#player") !== null) {
    document.querySelector("#player").addEventListener("load", () => {
      setupCountDown(document.querySelector("#player").contentWindow.videojs("brightcove-player"), document.querySelector("#player").contentDocument);
    });
  }
})();