Greasy Fork is available in English.
因为大多数视频全屏后就看不到时间了，要看时间还得退出全屏，看到有的播放器全屏播放时可以在右上角显示一个系统当前时间，这种方式很不错，所以决定给视频网站也做一个这样的增强。这个脚本的作用只有一个，就是在视频左上角显示一个系统时间，方便全屏看视频期间随时了解时间。
目前为
// ==UserScript==
// @name 视频全屏显示时间
// @namespace http://tampermonkey.net/
// @namespace https://www.medfav.com/webnav/
// @version 0.2.3
// @description 因为大多数视频全屏后就看不到时间了，要看时间还得退出全屏，看到有的播放器全屏播放时可以在右上角显示一个系统当前时间，这种方式很不错，所以决定给视频网站也做一个这样的增强。这个脚本的作用只有一个，就是在视频左上角显示一个系统时间，方便全屏看视频期间随时了解时间。
// @description 0.2.1 增加搜狐视频 0.2.2 增加mkv、mp4结尾的链接匹配，时间标签层级从3改为11 0.2.3增加YouTube支持
// @author medfav
// @match *://lpl.qq.com/*
// @match *://v.qq.com/*
// @match *://*.bilibili.com/*
// @match *://tv.cctv.com/*
// @match *://*.iqiyi.com/*
// @match *://*.youku.com/*
// @match *://*.le.com/*
// @match *://weibo.com/*
// @match *://*.sohu.com/*
// @match *://*.ixigua.com/*
// @match *://*.gfysys1.com/*
// @match *://*.buyaotou.xyz/*
// @match */*.mkv
// @match */*.mp4
// @match *://*.youtube.com/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=qq.com
// @run-at document-end
// @grant unsafeWindow
// @license GPLv3
// ==/UserScript==
(function() {
'use strict';
// Your code here...
// let timerInterval = 0;
// 创建时间标签,width：视频宽度，用于设置时间数字大小
function createTag(width){
let style = "z-index: 11;position: absolute;color: #e6e9f0;margin: 5px;padding: 5px;border-radius: 4px;line-height: 0.8em;background-color: #0000004d;/*opacity: 0.8;*/user-select: none;text-shadow: 1px 1px 2px black, -1px -1px 2px black;";
if(width >= 720){
style += "font-size: 20px;top: 10px;right: 10px;";
} else if(width <= 200){
style += "font-size: 13px;top: 5px;right: 5px;";
} else {
style += "font-size: 13px;top: 10px;right: 10px;";
}
let timeBar = document.createElement("div");
timeBar.className = "timer";
timeBar.style = style;
return timeBar;
}
// 改变时间标签样式
function changeTag(element){
if(element.offsetWidth > 200){
if(element.offsetWidth >= 720){
element.previousSibling.style.fontSize = "20px";
} else {
element.previousSibling.style.fontSize = "10px";
}
element.previousSibling.style.top = "10px";
element.previousSibling.style.right = "10px";
} else {
element.previousSibling.style.top = "5px";
element.previousSibling.style.right = "5px";
}
}
// 获取Video标签
function getVideoTag(){
setTimeout(()=>{
let videoTagList = Array.from(document.getElementsByTagName('video'));
if(videoTagList.length == 0){
getVideoTag();
} else {
insertTimeBar(videoTagList);
// setTimer();
getVideoTag();
}
},1000)
}
getVideoTag();
// 加入时间标签
function insertTimeBar(videoTagList){
videoTagList.forEach((element)=>{
if ((element.previousSibling == null || element.previousSibling.className != "timer") && element.parentElement.querySelector(".timer") == null ){
// 多个时间条不能用同一个对象
let timeBar = createTag(element.offsetWidth);
element.parentElement.insertBefore(timeBar,element);
} else {
changeTag(element);
}
})
}
// 设置计时器
function setTimer(){
// clearInterval(timerInterval);
// timerInterval =
setInterval(()=>{
var date = new Date();
var hour = date.getHours();
var min = date.getMinutes()>9?date.getMinutes():'0' + date.getMinutes();
var sec = date.getSeconds()>9?date.getSeconds():'0' + date.getSeconds();
let timer = document.getElementsByClassName("timer");
// 当没有时间条时，添加（懒加载会出现这种情况）
if(timer == undefined){
let videoTagList = Array.from(document.getElementsByTagName('video'));
insertTimeBar(videoTagList);
}
// 给每一个时间条设置时间
let timeBarList = Array.from(document.getElementsByClassName("timer"));
timeBarList.forEach((timeBar)=>{
timeBar.innerText = hour + ":" + min + ":" + sec;
})
},1000)
}
// 启动计时器
setTimer();
})();