Greasy Fork

Greasy Fork is available in English.

BilibiliTimer

B站H5播放器全屏时实时显示当前系统时间

当前为 2017-06-09 提交的版本,查看 最新版本

// ==UserScript==
// @name         BilibiliTimer
// @version      1.2.4
// @description  B站H5播放器全屏时实时显示当前系统时间
// @author       AnnAngela
// @match        *://www.bilibili.com/video/*
// @match        *://www.bilibili.com/html/*layer.htm*
// @match        *://live.bilibili.com/*
// @compatible   chrome
// @run-at       document-start
// @grant        unsafeWindow
// @namespace    http://greasyfork.icu/users/129402
// ==/UserScript==

(function() {
    'use strict';
    /* 防止重复加载 */
    if (unsafeWindow.BilibiliTimer) return;
    unsafeWindow.BilibiliTimer = true;
    /*
     * 出于实现上的考虑,以下代码被保存为纯文本,并通过unsafeWindow.eval运行,以操作真实环境下的DOM节点
     */
    var code = [
        '"use strict";',
        "if (!String.prototype.includes) String.prototype.includes = function includes(s) {",
        "    return this.indexOf(s) !== -1;",
        "}",
        "function bilibiliPlayerDate() {",
        "    var _date = new Date();",
        "    ['getDate', 'getFullYear', 'getHours', 'getMilliseconds', 'getMinutes', 'getMonth', 'getSeconds', 'getTime', 'getUTCDate', 'getUTCFullYear', 'getUTCHours', 'getUTCMilliseconds', 'getUTCMinutes', 'getUTCMonth', 'getUTCSeconds', 'getYear'].forEach(function(key) {",
        "        _date[key] = function() {",
        "            var result = Date.prototype[key].apply(_date, arguments);",
        "            if (key.includes('Month')) result++;",
        "            if (typeof result === 'number' && (result + '').length === 1) return '0' + result;",
        "            else return result + '';",
        "        };",
        "    });",
        "    return _date;",
        "}",
        "var selector = location.host === 'live.bilibili.com' ? {",
        "    container: '.bilibili-live-player-video-area',",
        "    fullscreenButton: '.bilibili-live-player-video-controller-fullscreen-btn > i',",
        "    controller: '.bilibili-live-player-video-controller'",
        "} : {",
        "    container: '.bilibili-player-video-wrap',",
        "    fullscreenButton: '.bilibili-player-video-btn-fullscreen > i',",
        "    controller: '.bilibili-player-video-control'",
        "};",
        "var timer = $('<div/>');",
        "timer.attr('id', 'BilibiliTimer');",
        "var globallock = false;",
        "var onFullscreenMode = false;",
        "timer.css({",
        "    background: 'rgba(28,28,28,.8)',",
        "    'border-radius': '4px',",
        "    color: '#fff',",
        "    'font-family': \"'Noto Sans CJK SC DemiLight',Roboto,'Segoe UI',Tahoma,Arial,Helvetica,sans-serif\",",
        "    'font-size': '12px',",
        "    '-webkit-font-smoothing': 'antialiased',",
        "    position: 'absolute',",
        "    'z-index': '64',",
        "    padding: '15px 36px 15px 15px',",
        "    display: 'none',",
        "    cursor: 'move'",
        "});",
        "if (!localStorage.getItem('BilibiliTimerOffset')) {",
        "    timer.css({",
        "        right: '10px',",
        "        top: '10px'",
        "    }).css({",
        "        left: timer.offset().left + 'px',",
        "        right: 'auto'",
        "    });",
        "} else timer.css(JSON.parse(localStorage.getItem('BilibiliTimerOffset')));",
        "timer.on('mousedown', function(e) {",
        "    var baseX = e.clientX;",
        "    var baseY = e.clientY;",
        "    var baseOffsetX = timer.offset().left;",
        "    var baseOffsetY = timer.offset().top;",
        "    timer.data({",
        "        baseOffset: {",
        "            left: baseOffsetX - baseX,",
        "            top: baseOffsetY - baseY",
        "        },",
        "        onMousedown: true",
        "    });",
        "});",
        "$(window).on('resize', function() {",
        "    if (onFullscreenMode) {",
        "        var maxTop = $(selector.controller).offset().top - timer.outerHeight() - 10;",
        "        var maxLeft = $(window).width() - timer.outerWidth() - 10;",
        "        timer.css({",
        "            left: Math.max(Math.min(parseInt(timer.css('left')), maxLeft), 10),",
        "            top: Math.max(Math.min(parseInt(timer.css('top')), maxTop), 10)",
        "        });",
        "        localStorage.setItem('BilibiliTimerOffset', JSON.stringify({",
        "            top: timer.css('top'),",
        "            left: timer.css('left')",
        "        }));",
        "    }",
        "});",
        "$(document).on({",
        "    mousemove: function(e) {",
        "        if (timer.data('onMousedown')) {",
        "            var maxTop = $(selector.controller).offset().top - timer.outerHeight() - 10;",
        "            var maxLeft = $(window).width() - timer.outerWidth() - 10;",
        "            timer.css({",
        "                left: Math.max(Math.min(timer.data('baseOffset').left + e.clientX, maxLeft), 10),",
        "                top: Math.max(Math.min(timer.data('baseOffset').top + e.clientY, maxTop), 10)",
        "            });",
        "        }",
        "    },",
        "    mouseup: function() {",
        "        if (timer.data('onMousedown')) {",
        "            timer.data('onMousedown', false);",
        "            localStorage.setItem('BilibiliTimerOffset', JSON.stringify({",
        "                top: timer.css('top'),",
        "                left: timer.css('left')",
        "            }));",
        "        }",
        "    }",
        "});",
        "var button = $('<a/>');",
        "button.text('[x]');",
        "button.css({",
        "    position: 'absolute',",
        "    right: '10px',",
        "    top: '10px',",
        "    'z-index': '49',",
        "    color: '#ddd',",
        "    'font-size': '13px'",
        "});",
        "timer.append(button);",
        "button.on('click', function() {",
        "    globallock = true;",
        "    timer.fadeOut(370);",
        "});",
        "timer.append('<div>当前时间:<span></span></div>');",
        "setInterval(function() {",
        "    var globalmode = !!$(':-webkit-full-screen')[0];",
        "    if (globalmode) {",
        "        if (!globallock) timer.fadeIn();",
        "    } else {",
        "        onFullscreenMode = false;",
        "        globallock = false;",
        "        timer.fadeOut();",
        "    }",
        "    if (timer.is(':visible')) {",
        "        var date = bilibiliPlayerDate();",
        "        timer.find('span').text(date.getFullYear() + '-' + date.getMonth() + '-' + date.getDate() + ' ' + date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds());",
        "    }",
        "}, 137);",
        "(function loop(timer) {",
        "    if (!$(selector.container)[0]) {",
        "        setTimeout(loop, timer, 1370);",
        "    } else {",
        "        $(selector.container).append(timer);",
        "        $(selector.fullscreenButton).on('click', function() {",
        "            if (!$(':-webkit-full-screen')[0]) onFullscreenMode = false;",
        "            else onFullscreenMode = !onFullscreenMode;",
        "        });",
        "        $(document).on('keyup', function(e) {",
        "            if (e.which === 27) onFullscreenMode = false;",
        "        })",
        "        console.debug('BilibiliTimer', 'Yep', $('#BilibiliTimer'));",
        "    }",
        "})(timer);"
    ].join('\n');
    unsafeWindow.addEventListener('load', function() {
        unsafeWindow.eval(code);
    });
})();