☰

Youtube Live Clock

Show present time of the livestream!

当前为 2022-10-19 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         Youtube Live Clock
  3. // @namespace    https://greasyfork.org/scripts/453367
  4. // @version      1.0
  5. // @description  Show present time of the livestream!
  6. // @author       Derek
  7. // @match        https://www.youtube.com/*
  8. // @grant        none
  9. // @noframes
  10. // ==/UserScript==
  11.  
  12. (function() {
  13.   'use strict'
  14.  
  15.   let shortenToNum = {
  16.     'Jan': '01', 'Feb': '02', 'Mar': '03', 'Apr': '04', 'May': '05', 'Jun': '06',
  17.     'Jul': '07', 'Aug': '08', 'Sep': '09', 'Oct': '10', 'Nov': '11', 'Dec': '12'
  18.   }
  19.   let checkNode = () => {
  20.     if (document.querySelector('.present-time')) {
  21.       return document.querySelector('.present-time')
  22.     } else {
  23.       let timeDisplay = document.querySelector('.ytp-time-display').childNodes[1]
  24.       let liveClock = document.createElement('span')
  25.       liveClock.setAttribute('class', 'present-time')
  26.       timeDisplay.appendChild(liveClock)
  27.       return document.querySelector('.present-time')
  28.     }
  29.   }
  30.   let updateNewTime = () => {
  31.     let json = JSON.parse(document.querySelector('.ytd-player-microformat-renderer').textContent)
  32.     let startTime = Date.parse(json.publication[0].startDate)
  33.     let endTime = json.publication[0].endDate
  34.     let progressTime = document.querySelector('.ytp-progress-bar').getAttribute('aria-valuenow')
  35.  
  36.     if (endTime) {
  37.       let presentTime = startTime + progressTime*1000
  38.       let date = new Date(presentTime).toString().split(' ')
  39.       return ` (${date[3]}/${shortenToNum[date[1]]}/${date[2]} ${date[4]})  `
  40.     } else {
  41.       let presentTime = progressTime*1000+57600000
  42.       let date = new Date(presentTime).toString().split(' ')
  43.       return `${date[4]}  `
  44.     }
  45.   }
  46.  
  47.   let main = () => {
  48.     setTimeout(() => {
  49.       let liveClock = checkNode()
  50.       liveClock.textContent = updateNewTime()
  51.  
  52.       let progressBar = document.querySelector('.ytp-progress-bar')
  53.       let observer = new MutationObserver(() => { liveClock.textContent = updateNewTime() })
  54.       observer.observe(progressBar, {attributes: true})
  55.     }, 1000)
  56.   }
  57.  
  58.   document.addEventListener('yt-navigate-finish', main)
  59. })();
  60.