Show present time of the livestream!
目前為
// ==UserScript==
// @name Youtube Live Clock
// @namespace https://greasyfork.org/scripts/453367
// @version 1.3.1
// @description Show present time of the livestream!
// @author Derek
// @match https://www.youtube.com/*
// @grant none
// @noframes
// ==/UserScript==
(function() {
'use strict'
let twoDigit = (num) => {
if (String(num).length === 2) return num
else return '0' + String(num)
}
let formatTime = (time) => {
let second = time % 60
let minute = (time - second) % 3600 / 60
let hour = (time - minute * 60 - second) / 3600
let day = (time - hour * 3600 - minute * 60 - second) / 86400
if (time < 3600) return `${minute}:${twoDigit(second)} `
else if (3600 <= time < 86400) return `${hour}:${twoDigit(minute)}:${twoDigit(second)} `
else return `${day}:${twoDigit(hour)}:${twoDigit(minute)}:${twoDigit(second)} `
}
let getClock = () => {
let liveClock = document.querySelector('.present-time')
if (!liveClock) {
let timeDisplay = document.querySelector('.ytp-time-display').childNodes[1]
let clockElement = document.createElement('span')
clockElement.setAttribute('class', 'present-time')
timeDisplay.appendChild(clockElement)
liveClock = document.querySelector('.present-time')
}
return liveClock
}
let updateTime = () => {
let isLive = JSON.parse(document.querySelector('.ytd-player-microformat-renderer').textContent).publication
if (isLive) {
let progressTime = document.querySelector('.ytp-progress-bar').getAttribute('aria-valuenow')
if (isLive[0].endDate) {
let presentTime = new Date(Date.parse(isLive[0].startDate) + progressTime * 1000)
let date = (presentTime).toString().split(' ')
return ` (${date[3]}/${twoDigit(presentTime.getMonth() + 1)}/${date[2]} ${date[4]}) `
} else return formatTime(progressTime)
} else return ''
}
let main = () => {
setTimeout(() => {
let liveClock = getClock()
let progressBar = document.querySelector('.ytp-progress-bar')
let observer = new MutationObserver(() => { liveClock.textContent = updateTime() })
observer.observe(progressBar, {attributes: true})
}, 1000)
}
document.addEventListener('yt-navigate-finish', main)
})();